@charset "utf-8";

* {	margin:0; padding:0;}
html, body {height:100%;}
body { font: 100%/1.4  Arial, Helvetica, sans-serif; background:#999; margin: 0; padding: 0; color:#4d4d4d; text-align:center; /* horizontal centering for IE Win quirks */ background-image:url(../_images/med_carbon_texture_orange.jpg); background-repeat:repeat; }
img, p, ul, ol, dl, li, h1, h2, h3, h4, h5, h6, blockquote, table { border:0; margin:0; padding:0;}
a img { border: none;}

h1, h2 { font-family:Georgia, Times, serif; font-weight:normal; }
h1 { font-size:1.4em; color:#F16522; padding-bottom:0.2em;}
h2 { font-size:1.1em; color:#F16522; padding-bottom:0.2em;}
h3 { font-size:0.9em; color:#F16522; font-weight:bold;}
p { font-size:0.9em; padding-bottom:0.8em; line-height:1.5em;}
blockquote {padding:0 30px; font-style:italic; color:#F16522; }

ul.list { font-size:0.9em; padding-left: 1em; padding-bottom: 1em; }

a:link { color:#666; text-decoration: underline; }
a:visited {	color:#666; text-decoration: underline;}
a:hover, a:active, a:focus { text-decoration: none;}

.hidden { display: none; }

/* ~~ this container surrounds all other divs giving them their percentage-based width ~~ */
#container { width:100%; margin:0 auto; text-align:left; background:url(../_images/background-top.jpg); background-repeat:repeat-x; background-position:top center;}
#main { width:80%; max-width:960px; clear:both; z-index:1; margin:0 auto; }

#header { width:100%; clear:both; text-align:center; height:290px; padding-top:10px; font-family:Georgia, Times, serif; line-height:2.2em;}
#nav { width:100%; background-color:#F16522; position:relative; z-index:3; color:#FFF; font-size:1em; font-family:Arial, Helvetica, sans-serif; font-weight:normal;}

#mainBackWhite {width:100%; background-color:#FFF; float:left; padding-bottom:5%;}
.contentLeft {width:65%; float:left; padding:4% 5% 1%;}
.imageColumn {width:20%; float:right; padding:5% 5% 0 0;}
.imageColumn img {width:100%;}
.imageFull img {width:100%; padding-bottom: 1em;}

#footer { width:100%; background-color:#471B5F; margin:0; clear:both;}
.footer2 {width:80%; max-width:1100px; text-align:center; margin:0 auto; padding:25px 0; color:#FFF; font-size:1em;}
.footer2 a {color:#FFF;}

.small {font-size:0.9em;}

h3.button  {margin-bottom:10px;}
.button a:link, .button a:visited {background-color:#F16522; color:#FFF; text-decoration:none; padding:6px 12px; border-radius:10px;}
.button a:hover, .button a:focus {background-color:#F6921E; color:#FFF; text-decoration:none;}

/* ~~ nav ~~ */
#nav ul { list-style:none; border-bottom:5px solid #471B5F;}
#nav li { display:inline-block; border-right:1px solid #FFF; text-align:center; line-height:2.2em; margin:0; padding:0;}
#nav li.last {border-right:0;}
#nav li.active { background-color:#F6921E; color:#FFF; padding:0 20px;}
#nav li a { display:inline-block; color:#FFF; text-decoration:none; padding:0 20px;}
#nav li a:hover {background-color:#F6921E; color:#FFF; }

/* ~~ tables ~~ */
table { padding-bottom:0.8em;}

table.grades {width: 100%; }
tr:nth-child(even) { background-color: #F0F0F0; }
th, td {font-size:0.9em; padding: 0.2em 0.5em;}


/* ~~ forms ~~ */
input {margin-bottom:10px; vertical-align:middle; width:98%;}
input.radiobtn {width:10%;}
label input {border:0px; margin:0px;}
textarea {margin-bottom:10px; width:98%;}
select {margin-bottom:10px; width:98%;}

.jafa { font-style: italic; color:#F16522; }

.sponsors { clear: both; margin: 5% 5% 0 ; }
.sponsors img { padding: 2% 5% 2% 0; width: 25%; }
.sponsors .wide { width: 50%; }
.sponsors .narrow { width: 20%; }

.spot img { padding: 2% 5% 2% 0; width: 50%; }

/****************************************************
MEDIA QUERIES
*****************************************************/

/* for 1000px or less */
@media screen and (max-width: 1000px) {
	#nav {font-size:0.9em;}
	#main, .footer2 { width:90%;}
}
/* for 750px or less */
@media screen and (max-width: 750px) {
	.imageColumn {width:50%; clear:both; float:left; padding:5%; }
	.contentLeft {width:90%;}
	.navbar-header{float:none;}
	#nav {width:101.5%; float:left; position:relative; font-size:17px; float:none; line-height:17px; clear:both; margin-bottom:0px; background-color:inherit;}
	#nav ul {padding:0; margin:0 0 3px; width:98%; float:none; display:none; background-color:#F16522; }
	#nav ul li {display:block; border-bottom: 1px solid #fff; width:100%; padding:0;}
	#nav ul li a { width:100%; padding:6px 0;}
	#nav ul li a:hover {background-color:#F6921E; color:#FFF; }
	#nav ul li.active {width:100%; padding:6px 0; left:0; clear:left; background-color:#F6921E; color:#FFF;}

}
/* for 380px or less */
@media screen and (max-width: 380px) {
	.imageColumn {width:90%;}
    .sponsors img { padding-right: 0%; width: 100%; }
    .sponsors .wide { width: 100%; }
    .sponsors .narrow { width: 100%; }
    .spot img { width: 100%; }
}