/*
CSS for the Kagnew Roster Registration Form
Utilizes CSS3 and backward compatibility for previous browsers
Tested in IE8+, Firefox 10+
March 2012
*/

/* settings for textarea comments */
.comments {
width: 100%;
max-width: 570px;
min-width: 350px;
max-height: 250px;
}

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td{ margin:0; padding:0;}
table{ border-collapse:collapse; border-spacing:0;}
fieldset,img{ border:0;}
address,caption,cite,code,dfn,th,var{ font-style:normal; font-weight:normal;}
ol,ul{ list-style:none;}
caption,th{ text-align:left;}
h1,h2,h3,h4,h5,h6{ font-size:100%; font-weight:normal;}
q:before,q:after{ content:'';}
abbr,acronym{ border:0;}
p{font-size:12px;}

html {
	overflow:-moz-scrollbars-vertical;
}
body{
	background:#333;
	color:#333;
	font-family:Tahoma,Arial,sans-serif;
	font-size:16px;
	line-height:8px;
	text-shadow:0 1px 0 #fff;
}
a{
	color:#333;
	text-decoration:underline;
}
p.description{
	color:#eee;
	font-family:Arial, sans-serif;
	font-size:16px;
	line-height:20px;
	padding:10px;
	margin:10px auto 20px;
	width:600px;
	border:1px solid #aaa;
	-moz-border-radius:15px;
	-webkit-border-radius:15px;
}
p.tech{
	color:#eee;
	font-family:sans-serif;
	font-size:12px;
	line-height:16px;
	padding:8px;
	margin:20px auto 20px;
	width:600px;
	border:1px solid #aaa;
	-moz-border-radius:15px;
	-webkit-border-radius:15px;
}
form{
	background:#f7f7f7;
	background:-moz-linear-gradient(90deg, #ccc, #fff); /* Firefox */
	background:-webkit-gradient(linear, left top, left bottom, from(#fff), to(#ccc)); /* Webkit */
	border:1px solid #aaa;
	-moz-border-radius:15px;
	-webkit-border-radius:15px;
	border-radius:15px;
	-moz-box-shadow:0 0 15px #aaa;
	-webkit-box-shadow:0 0 15px #aaa;
	shadow:0 0 15px #aaa;
	margin:20px auto 50px;
	padding:20px;
	width:580px;
}
h1{
	border-bottom:1px solid #ccc;
	font-size:14px;
	font-weight:bold;
	letter-spacing:2px;
	margin-bottom:20px;
	text-transform:uppercase;
	padding:15px;
}

form p{
	margin-bottom:20px;
}
form p:last-child{ /* Advanced selector to select the final paragraph of the form */
	margin-bottom:0;
}
label{
	cursor:pointer;
	display:inline;
	float:left;
	font-size:13px;
	font-weight:bold;
	line-height:18px;
	margin-bottom:5px;
	width:130px;
}
form p:hover label{
	color:#0459b7;
}
form p:hover label:after{
	content:" »";
}
input[type=radio]{
	display: inline-block;
	font-size: 10px;
	line-height: 8px;
	margin: 0 0.5em 0 0;
	padding: 0;
	width: 3.25em;
	-moz-border-radius:0.25px;
	-webkit-border-radius: 0.25em;
	border-radius: 3.5em;
}
.radiolabel{
	line-height:28px;
}
input[type=checkbox] {
  display: inline-block;
  font-size: 12px;
  position: relative;
  line-height: 8px;
  margin: 0;
  padding: 0;
  width: 2em;
  height: 2em;
  vertical-align: text-top;
  background: -webkit-linear-gradient(
    top, rgba(255,255,255,0.4), rgba(255,255,255,0.1)
  );
  -webkit-appearance: none;
  -webkit-box-shadow: 0 1px 0 rgba(255,255,255, 0.1),
                      inset 0 0 1px rgba(255,255,255, 0.4);
  -webkit-border-radius: 3px;
  border-radius: 3px;
}
input[type=checkbox]:active {
  background: -webkit-linear-gradient(
    top, rgba(255,255,255,0.05), rgba(255,255,255,0.2)
  );
}
input[type=checkbox]:checked::after {
  position: absolute;
  content: '';
  left: 15%;
  top: -10%;
  height: 40%;
  width: 90%;
  border-bottom: 2px solid #fff;
  border-left: 2px solid #fff;
  -webkit-box-shadow: -1px 1px 0 rgba(0,0,0,0.8);
  -webkit-transform: rotate(-45deg);
}
.chkboxlabel{
	line-height:40px;
}
textarea,
input[type=textarea],
input[type=text]{
	background: rgba(255, 255, 255, 0.9);
	background:-moz-linear-gradient(90deg, #fff, #eee); /* Firefox */
	background:-webkit-gradient(linear, left top, left bottom, from(#eee), to(#fff), color-stop(0.2, #fff)); /* Webkit */
	border:1px solid #aaa;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	border-radius:3px;
	-moz-box-shadow:0 0 3px #aaa;
	-webkit-box-shadow:0 0 3px #aaa;
	box-shadow:0 0 3px #aaa;
	padding:2px;
}
textarea:focus,
input[type=textarea]:focus,
input[type=text]:focus{
	border-color:#093c75;
	-moz-box-shadow:0 0 3px #0459b7;
	-webkit-box-shadow:0 0 3px #0459b7;
	box-shadow:0 0 3px #0459b7;
	outline:none; /* To remove the yellow outline when selecting an input in Chrome */
}
textarea{
	overflow: auto;
	color:#333;
	font-family:Arial,Tahoma,sans-serif;
	font-size:14px;
}
select{
	cursor:pointer;
	padding:2px;
	-moz-box-shadow:0 0 3px #aaa;
	-webkit-box-shadow:0 0 3px #aaa;
	box-shadow:0 0 3px #aaa;
}
select:active,
select:focus{
	border:1px solid #093c75;
	-moz-box-shadow:0 0 3px #0459b7;
	-webkit-box-shadow:0 0 3px #0459b7;
	outline:none;
}
input[type=submit],
input[type=reset],
a.submit,
a.reset{
	display: inline;
	background:#506af8;
	background:-moz-linear-gradient(90deg, #0459b7, #08adff); /* Firefox */
	background:-webkit-gradient(linear, left top, left bottom, from(#08adff), to(#0459b7)); /* Webkit */
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#08adff', endColorstr='#0459b7');	
	border:1px solid #093c75;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	border-radius:3px;
	-moz-box-shadow:0 1px 0 #fff;
	-webkit-box-shadow:0 1px 0 #fff;
	box-shadow:0 1px 0 #fff;
	color:#fff;
	cursor:pointer;
	font-family:Arial,sans-serif;
	font-size:12px;
	font-weight:bold;
	margin-left:250px;
	padding:2px 6px;
	text-decoration:none;
	text-shadow:0 1px 1px #333;
	text-transform:uppercase;
	width:80px;
}
input[type=reset]{
	margin-left:10px;
}
input[type=submit]:hover,
input[type=reset]:hover,
a.submit:hover,
a.reset:hover{
	background:#0459b7;
	background:-moz-linear-gradient(90deg, #067cd3, #0bcdff);
	background:-webkit-gradient(linear, left top, left bottom, from(#0bcdff), to(#067cd3));
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#0bcdff', endColorstr='#067cd3');	
	border-color:#093c75;
	text-decoration:none;
}
input[type=submit]:active,
input[type=reset]:active,
input[type=submit]:focus,
input[type=reset]:focus,
a.submit:active,
a.reset:active,
a.submit:focus,
a.reset:focus{
	background:#067cd3;
	background:-moz-linear-gradient(90deg, #0bcdff, #067cd3);
	background:-webkit-gradient(linear, left top, left bottom, from(#067cd3), to(#0bcdff));
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#0bcdff', endColorstr='#067cd3');	
	border-color:#093c75;
	outline:none;
}