/* Global styles */
body { overflow: -moz-scrollbars-vertical; behavior: url(../js/csshover.htc); background:#0067ac url(../images/bg-slice.jpg) repeat-x; font-family:Verdana, Arial, Helvetica, sans-serif; color:#666;}
* {margin: 0 auto; padding: 0;}		/*<------<--------<-----| This assumes we're centering!!! */
a img {border: none;}
a { color:#005fa1; text-decoration:underline;}
	a:hover, a.current {text-decoration: none;}
p {  color:#666; line-height:19px; font-size:12px; padding:0 0 12px 0}
ul, ol {padding:4px 0 0 0;}
li {}
td, th, tr {font-size:11px;}
strong { color:#666;}

h1{color:#005fa1; font-size:16px; background:url(../images/triangle.gif) no-repeat left; padding:4px 0 0 26px}
h2{color:#005fa1; font-size:14px; padding:0 0 10px 26px;}
h3{color:#81a5bf; font-size:12px; padding:0 0 10px 26px;}
h4{color:#81a5bf; font-size:14px; padding:0 0 10px 26px;}
h5{color:#81a5bf; font-size:12px; padding:0 0 10px 26px;}
h6{color:#81a5bf; font-size:10px; padding:0 0 10px 26px;}

hr{border:#81a5bf solid 1px; border-width:1px 0 0 0; background-color:#fff; color:#fff; margin-bottom:10px; margin-left:26px;}
/* reusable classes */
.right{float:right;}
.left{float:left;}

.full{position:relative; width:99%;}	/*<------<--------<-----| This works better w/ px based widths */
.split50{position:relative; width:50%;float:left;}
.split30{position:relative; width:33%;float:left;}

.formpadding td{padding: 0 0 10px 0;}
.greyLine{border:1px solid #ccc; border-width:0 0 1px 0; margin-bottom:10px; clear:both}

/* Wrappers */				/*<------<--------<-----| Start building out your divs here... */
#ConceptWrapper {width:500px; padding:20px; border:1px solid #000; margin-top:22px; background-color:#fff;}
#HpWrapper{width:931px; margin-top:30px; background:url(../images/hp-slice.gif) repeat-y;}
#SubWrapper{width:931px; margin-top:30px; background:url(../images/sub-slice.gif) repeat-y;}
#Top{background:url(../images/top.gif) no-repeat; width:931px; height:90px;}
#Number{ text-align:right; color:#81a5bf; font-size:14px; padding:0 8px 10px 0; font-weight:bold}


#BannerHp{background:url(../images/banner-hp.jpg) no-repeat; width:931px; height:237px;}
#BannerAbout{background:url(../images/banner-sub01.jpg) no-repeat; width:931px; height:185px;}
#BannerSearch{background:url(../images/banner-sub06.jpg) no-repeat; width:931px; height:185px;}
#BannerRes{background:url(../images/banner-sub03.jpg) no-repeat; width:931px; height:185px;}
#BannerContact{background:url(../images/banner-sub05.jpg) no-repeat; width:931px; height:185px;}
#BannerEmp{background:url(../images/banner-sub04.jpg) no-repeat; width:931px; height:185px;}
#BannerJs{background:url(../images/banner-sub02.jpg) no-repeat; width:931px; height:185px;}

#HpCopy{width:919px; padding:0 6px;}
#HpCopy h1{color:#005fa1; font-size:15px; background:url(../images/triangle.gif) no-repeat left; padding:4px 0 0 26px; height:20px}
#HpCopy h2{font-size:12px; background:url(../images/triangle.gif) no-repeat left; padding:0 0 0 26px}
#HpCopy p{ font-size:11px; line-height:17px;}
#HpSec01{width:266px; padding:10px 18px; float:left; margin-right:6px}
#HpSec02{width:266px; padding:10px 18px; float:left; margin-right:6px}
#HpSec03{width:266px; padding:10px 18px; float:left}
#JobsBox{width:260px; border:1px solid #005fa1;}
#JobsBox h3{font-size:13px; padding:0 0 10px 0;}

#HpBtns{background:url(../images/btns-hp.gif) no-repeat; width:887px; padding:0 16px; height:25px; margin-bottom:10px; clear:both}

#SubCopy{ padding:0 0 18px 0; clear:both;}
#SubCopy ul{color:#666; line-height:19px; font-size:12px; padding:0 0 12px 60px; margin:0;}
#SubCopy ol{color:#666; line-height:19px; font-size:12px; padding:0 0 12px 60px; margin:0;}
#SubCopy li{ padding:0 0 4px 0; margin:0}
#SubCopyArea{ width:568px; float:left; padding:0 30px 0 20px; border:1px solid #ccc; border-width:0 1px 0 0; margin:20px 0;}
#SubCopyArea p{ padding:0 0 12px 26px;}
#SubCopyArea2{ width:828px; float:left; padding:0 30px 0 20px; margin:20px 0;}
#SubCopyArea2 p{ padding:0 0 12px 26px;}
#SubSide{ width:260px; float:left; margin:20px 0; padding:0 0 10px 24px}

#Bottom{background:#0067ac url(../images/bottom.gif) no-repeat; width:931px; padding:6px 0 10px 0; height:50px}
#Bottom ul{list-style:none; font-size:11px; color:#fff;}
#Bottom li{float:left; padding:0 3px;}
#Bottom li a{color:#fff; text-decoration:none}
#Bottom span{float:right; font-size:11px; color:#fff; padding:0 3px 4px 0;}


/* nav */
#Logo{float:left; width:683px;}
#NavHolder{width:240px; float:left; padding:55px 0 0 0}
#NavHolderHp{width:240px; float:left; padding:28px 0 0 0}
#SmNav {width:231px; height: 25px; list-style: none; position:relative; clear:both; display:block;}
#SmNav ul {margin:0; padding:0; list-style:none}
#SmNav li {float:left;}				
#SmNav li a span {display:none;}				
#SmNav li a {height:25px; display:block; float:left; padding:0;}				
#SmNav li a.about{width:70px; background:url(../images/sm-nav_01.gif) no-repeat top;}
#SmNav li a.res{width:84px; background:url(../images/sm-nav_02.gif) no-repeat top;}		
#SmNav li a.contact{width:77px; background:url(../images/sm-nav_03.gif) no-repeat top;}
#SmNav li a:hover{background-position:bottom;}
#SmNav li a.current{background-position:bottom;}

#BigNav{width:920px; height:49px; list-style:none; padding:0 5px 0 6px; position:relative; clear:both; display:block;}
#BigNav ul{margin:0; padding:0;list-style:none}
#BigNav li{float:left;}				
#BigNav li a span{display:none;}				
#BigNav li a{height: 49px; display: block; float: left; padding: 0;}				
#BigNav li a.employers{width:305px; background: url(../images/big-nav_01.gif) no-repeat top;}
#BigNav li a.js{width:308px; background: url(../images/big-nav_02.gif) no-repeat top;}		
#BigNav li a.search{width:307px; background: url(../images/big-nav_03.gif) no-repeat top;}
#BigNav li a:hover{background-position:bottom; }
#BigNav li a.current{background-position:bottom; }

#BlackNav{ width:905px; height:24px; float:left; margin-left:6px; _margin-left:3px; background-color:#000; padding:4px 2px 0 12px; font-size:13px; color:#005fa1;}
#BlackNav a{ color:#fff; text-decoration:none; font-weight:normal}
#BlackNav a:hover{ color:#fff; text-decoration:underline; font-weight:normal}
#BlackNav a.activeSubMenuItem{ color:#fff; text-decoration:underline; font-weight:normal}

/******************JQuery Styles***************/
div.answer{display:none;}
	.answer{padding:10px; margin-bottom:5px;}
	div.question{ margin:8px 0 4px 26px; background:#ededed; padding:0; cursor:pointer}
	div.question h4{padding:4px; color:#005fa1; font-size:12px; cursor:pointer}
	div.question:hover {background:#dbdbdb; cursor:pointer}
	div.question.active{background:#dbdbdb; cursor:pointer}
	
/***********Form Styles**************/
/* Define your base widths here as well as any fancy button formatting. Just remember that only real browsers will see image-based buttons. */	
	#myForm{ padding:0 0 0 26px;}
	#myForm p{ padding:0 0 12px 0;}
	#myForm hr{border:#81a5bf solid 1px; border-width:1px 0 0 0; background-color:#fff; color:#fff; margin-bottom:10px; margin-left:0;}
	input[type="text"]{width:150px;}
	textarea{width:150px;}
	select{width:150px;}
	input[type="button"]{}
	input[type="submit"]{}
/* Define the various event states */	
	input.disabled, select.disabled {border: 1px solid #F2F2F2;background-color: #F2F2F2;}
	input.required, textarea.required, select.required {border: 1px solid #00A8E6;}
	input.validation-failed, textarea.validation-failed, select.validation-failed {border: 1px solid #FF3300;color: #FF3300;}
	input.validation-passed, textarea.validation-passed, select.validation-passed {border: 1px solid #00CC00;color: #000;}
	.validation-advice {margin: 5px 0;padding: 5px;background-color: #FF3300;color: #FFF;font-weight: bold;}
	.custom-advice {margin: 5px 0;padding: 5px;background-color: #C8AA00;color : #FFF;font-weight: bold;}
/* Define the basic form layout */
	fieldset {padding: 1em;margin-bottom: 0.5em;}
	label {font-weight: bold;}
	.form-row {clear: both; font-size:11px; margin:0 0 10px 0;}
	.field-label { float:left; width:220px; margin-bottom:10px;}
	.field-widget { float:left; width:200px; margin-bottom:10px;}
	/* Anything extra... */	
	.red{color:#990000;}

/***********s2k styles**************/	
.s2k_text_2006 {font-family:Verdana, Arial, Helvetica, sans-serif; font-size:11px; line-height:normal; color:#666;}
.s2k_heading_2006 {font-weight:bold;font-size:16px;color:#005fa1;}
.s2k_subheading_2006 {font-weight:bold;font-size:13px;color:#81a5bf;}
.s2k_bold_2006 {font-weight:bold;color:#666;}
.s2k_byline_2006 {font-size:10px;font-style:italic;color:#666;}
.s2k_footer_2006 {font-size:10px;color:#000;}
.s2k_image_2006 {border:1px solid #005fa1;}
td.hbbodysml ul li{ font-size:10px !important;}
.hbbodysml ul{ font-size:10px;}

/***********Min-Height Hack**************/
.prop {float:left;width:1px;}
.clear {clear:both;height:1px;overflow:hidden;}	/* I don't currently rely on .clear */
.min431px {height:431px;}
/***************************************/	

/* -- Alsett Clearing Method*/
.clearfix:after {content: "."; display:block; height:0; clear:both; visibility:hidden;}
* html .clearfix {height: 1%;}
.clearfix {display: block;}

.clearfix {display:inline-block;}
/* Hide from IE Mac \*/
.clearfix {display:block;} 