@charset "utf-8";

* {	margin:0; padding:0;}
html, body {height:100%;}
body { font: 100%/1.4  Arial, Helvetica, sans-serif; background:#001133; margin: 0; padding: 0; color:#444; text-align:center; /* horizontal centering for IE Win quirks */ }
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:#2B87CB; padding-bottom:0.2em;}
h2 { font-size:1.1em; color:#2B87CB; padding-bottom:0.2em;}
h3 { font-size:0.9em; color:#2B87CB; font-weight:bold;}
p { font-size:0.9em; padding-bottom:0.8em; line-height:1.5em;}
blockquote {padding:0 30px; font-style:italic; color:#2B87CB; }

a:link { color:#666; text-decoration: underline; }
a:visited {	color:#666; text-decoration: underline;}
a:hover, a:active, a:focus { text-decoration: 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/back-top.jpg); background-repeat:repeat-x; background-position:top center;}
#main { width:80%; max-width:1000px; clear:both; z-index:1; margin:0 auto; }

#header { width:100%; clear:both; padding:25px 0; font-family:Georgia, Times, serif; line-height:2.2em;}
#nav { width:100%; background-color:#2B87CB; 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% 5% 0;}
.imageColumn img {width:100%;}

#footer { width:100%; background:url(../_images/back-footer.jpg); background-repeat:repeat-x; 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:#2B87CB; 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;}

/* ~~ 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%;}
td {font-size:0.9em;}

/****************************************************
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:#2B87CB; }
	#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%;}
}