/* ================================================================ 
This copyright notice must be untouched at all times.

The original version of this stylesheet and the associated (x)html
is available at http://www.cssplay.co.uk/menu/cssplay-radio-tabs.html
Copyright (c) Stu Nicholls. All rights reserved.
This stylesheet and the associated (x)html may be modified in any 
way to fit your requirements.
=================================================================== */
.radiotabs {width:75%; margin:20px 10px;}
input.tabs {position:absolute;; left:-9999px;}
input.tabs + label {float:left; display:block; font:normal 12px/30px arial, sans-serif; border:1px solid #aaa; border-radius:5px 5px 0 0; background:#da1616; padding:0 20px; margin-right:2px; text-decoration:none; color:#fff; position:relative;
background-image:-webkit-gradient(linear, 0 0, 0 100%, color-stop(0, rgba(255, 255, 255, 0.7)), color-stop(0.5, rgba(255, 255, 255, 0.2)), color-stop(0.5, transparent), to(rgba(255, 255, 255, 0.3)));
background-image:-moz-linear-gradient(top, rgba(255, 255, 255, 0.7) 0, rgba(255, 255, 255, 0.2) 50%, transparent 50%, rgba(255, 255, 255, 0.3) 100%);
background-image:-ms-linear-gradient(top, rgba(255, 255, 255, 0.7) 0, rgba(255, 255, 255, 0.2) 50%, transparent 50%, rgba(255, 255, 255, 0.3) 100%);
background-image:-o-linear-gradient(top, rgba(255, 255, 255, 0.7) 0, rgba(255, 255, 255, 0.2) 50%, transparent 50%, rgba(255, 255, 255, 0.3) 100%);
background-image:linear-gradient(rgba(255, 255, 255, 0.7) 0, rgba(255, 255, 255, 0.2) 50%, transparent 50%, rgba(255, 255, 255, 0.3) 100%);
}
input.tabs + label img {position:absolute; left:0; top:0; width:100%; height:100%; cursor:pointer;}

.tabcontent {width:125%; padding:20px; border:1px solid #aaa; border-radius:0 5px 5px 5px; background:#f0f8ff; position:relative; z-index:10; display:none; clear:left; top:-1px;
 box-shadow:0 15px 10px -15px rgba(0,0,0,0.4);
}
.tabcontent p {padding:0 0 5px 0; margin:0; font:normal 110% arial, sans-serif; color:#222;}
.tabcontent h3 {padding:0 0 10px 0; margin:0; font: 145% arial, sans-serif; color:#000; text-align: center; font-weight:800;}
.tabcontent .date{padding:0 0 5px 0; margin:0; font: 110% arial, sans-serif; color:#222; font-weight:700;}
.tabcontent {display:none;}
input.tabs:checked + label {background-color:#f0f8ff; border-bottom:1px solid #fff; color:#000; z-index:20;}

input#tab1:checked ~ div#view1 {display:block;}
input#tab2:checked ~ div#view2 {display:block;}
input#tab3:checked ~ div#view3 {display:block;}
input#tab4:checked ~ div#view4 {display:block;}
input#tab5:checked ~ div#view5 {display:block;}
input#tab6:checked ~ div#view6 {display:block;}

/* form */
div#view4 form {padding:20px 0 0 150px; margin:0; width:300px;}
div#view4 form label {display:block; width:70px; float:left; font:normal 12px/20px arial, sans-serif; color:#888;}
div#view4 form input.ipt {display:block; width:150px; float:left; border:1px solid #888; border-radius:3px;}
div#view4 form input#submit {margin-left:70px;}

/* gallery */
.radiogallery {position:relative; padding:0; margin:10px auto; width:320px; height:30px; padding:340px 10px 10px 10px; border:1px solid #ccc;}
.radiogallery input {position:absolute; left:-9999px;}
.radiogallery label {display:block; width:26px; height:26px; border:1px solid #bbb; margin:2px; float:left; background:#eee; text-align:center; cursor:pointer; font:11px/26px arial, sans-serif; position:relative;}
.radiogallery label img {position:absolute; left:0; top:0; width:100%; height:100%; cursor:pointer;}

.radiogallery div {position:absolute; left:10px; top:10px; width:320px; height:320px; text-align:center; opacity:0.0; /*filter: alpha(opacity=0);*/
-webkit-transition:1s;
-moz-transition:1s;
-ms-transition:1s;
-o-transition:1s;
transition:1s;
}
.radiogallery input:checked + label {background-color:#ccc;}
.radiogallery label:hover {background:#ddd;}

.radiogallery input#pic1:checked ~ div.pic1,
.radiogallery input#pic2:checked ~ div.pic2,
.radiogallery input#pic3:checked ~ div.pic3,
.radiogallery input#pic4:checked ~ div.pic4,
.radiogallery input#pic5:checked ~ div.pic5,
.radiogallery input#pic6:checked ~ div.pic6,
.radiogallery input#pic7:checked ~ div.pic7,
.radiogallery input#pic8:checked ~ div.pic8,
.radiogallery input#pic9:checked ~ div.pic9,
.radiogallery input#pic0:checked ~ div.pic0 {opacity:1.0; /*filter: alpha(opacity=100);*/}