/* Global styles */
body { overflow: -moz-scrollbars-vertical; behavior: url(js/csshover.htc); background:#fff url(images/bg-graph.gif) repeat; font-family:Verdana, Arial, Helvetica, sans-serif; color:#7f7f7f;}
* {margin: 0 auto; padding: 0;}		/*<------<--------<-----| This assumes we're centering!!! */
a img {border: none;}
a { color:#000;}
	a:hover, a.current {text-decoration: underline;}
p { font-size:12px; padding:0 0 12px 0; line-height:18px;}
ul, ol {padding:4px 0 0 0;}
li {}
td, th, tr {font-size:11px;}
strong { color:#7f7f7f;}

h1{ font-family:Tahoma, Verdana, Arial, Helvetica, sans-serif; color:#000; font-size:20px; padding:0 0 12px 0;}
h2{ font-family:Tahoma, Verdana, Arial, Helvetica, sans-serif; color:#000; font-size:18px; padding:0 0 12px 0;}
h3{ font-family:Tahoma, Verdana, Arial, Helvetica, sans-serif; color:#000; font-size:16px; padding:0 0 12px 0;}
h4{ font-family:Tahoma, Verdana, Arial, Helvetica, sans-serif; color:#000; font-size:14px; padding:0 0 12px 0;}
h5{ font-family:Tahoma, Verdana, Arial, Helvetica, sans-serif; color:#000; font-size:12px; padding:0 0 12px 0;}
h6{ font-family:Tahoma, Verdana, Arial, Helvetica, sans-serif; color:#000; font-size:10px; padding:0 0 12px 0;}

/* reusable classes */
.right{float:right;}
.left{float:left;}

.full{position:relative; width:99%;}	/*<------<--------<-----| This works better w/ px based widths */
.split50{position:relative; width:49%;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}
.box{ width:176px; float:left; padding:4px 0 0 10px; height:170px;}
.click{ cursor:pointer}
.padd{ padding:20px 25px}
.paddsm{ padding:0 0 4px 10px;}

#GreyBar{ background-color:#dcdcdc; width:913px; height:8px; border:5px #fff solid; border-width:5px 0 0 0;}
#BtnMore{ background:url(images/btn-more.gif) no-repeat top; width:89px; height:16px; cursor:pointer; float:right; }
#BtnMore:hover{ background-position:bottom;}
#BtnSearch{ background:url(images/btn-search.gif) no-repeat top; width:89px; height:16px; cursor:pointer; float:right; }
#BtnSearch:hover{ background-position:bottom;}

/******************WRAPPERS***************/
#ConceptWrapper { width:500px; padding:20px; border:1px solid #000; margin-top:20px; background-color:#fff;}
#PageWrapper{ background:url(images/bg-graph-slice.gif) repeat-x; padding:20px 0 0 0;}
#SliceWrapper{ background:url(images/bg-slice.gif) repeat-y; width:965px; margin-top:40px;}
#Wrapper{ width:913px; padding:121px 26px 0 26px; background:url(images/top.gif) no-repeat; position:relative}

#Flood{ position:absolute; top:20px; right:20px; float:right; width:200px;}
/******************NAV***************/
#Nav {width: 651px; height: 25px; list-style: none; padding: 0 0 5px 262px; position:relative; clear:both; display:block; }
	#Nav ul {margin:0; padding:0; list-style:none}
	#Nav li {float: left;}					
	#Nav li a span {display: none; }				
	#Nav li a {height: 25px; display: block; float: left; padding: 0;}					
	#Nav li a.home {width:101px; background: url(images/nav-01.gif) no-repeat top;}
	#Nav li a.employers {width:115px; background: url(images/nav-02.gif) no-repeat top;}		
	#Nav li a.jobseekers {width:108px; background: url(images/nav-03.gif) no-repeat top;}					
	#Nav li a.search {width:108px; background: url(images/nav-05.gif) no-repeat top;}				
	#Nav li a.about {width:105px; background: url(images/nav-04.gif) no-repeat top;}	
	#Nav li a.contact {width:114px; background: url(images/nav-06.gif) no-repeat top;}										
	/*hover*/
	#Nav li a:hover {background-position: bottom; }
	#Nav li a.current {background-position: bottom; }
	
/***********SUBNAV****************************/
#SubNav{}
#SubNav ul{ list-style:url(images/bullet.gif); padding:0 0 14px 30px; margin:0; font-size:12px;}
#SubNav li{ padding:0 0 8px 0; margin:0;}
#SubNav li a{ text-decoration:underline; color:#000; font-weight:bold;}
#SubNav li a:hover{ text-decoration:none; color:#000;}
#SubNav li a.current{ text-decoration:none; color:#000;}

/***********SUBNAV****************************/
#SubNav2{}
#SubNav2 ul{ list-style:url(images/bullet.gif); padding:0 0 14px 30px; margin:0; font-size:12px;}
#SubNav2 li{ padding:0 0 8px 0; margin:0;}
#SubNav2 li a{ text-decoration:underline; color:#000; font-weight:bold;}
#SubNav2 li a:hover{ text-decoration:none; color:#000;}
#SubNav2 li a.current{ text-decoration:none; color:#000;}
	
/******************HP***************/
#HpBanner{ color:#fff;}
#HpBanner h2{ font-size:15px; text-transform:uppercase; color:#fff;}
#HpBanner p{ font-size:11px;}
#HpBanner ul{ font-size:11px; margin:0; padding:0 0 12px 20px}
#HpBanner li{ margin:0; padding:0 0 3px 0; _padding:0px; *padding:0px;}
#Flash{ float:left; background:url(images/hp-flash.jpg) no-repeat; width:534px; height:180px; padding:0 5px 0 0;}
#HpInfo{ float:left; background:url(images/hp-info.gif) no-repeat; width:374px; height:180px;}

/************ALL****************************/
#Content{}
#Sidebar{ width:186px; float:left; padding:10px 20px 10px 0;}
#Sidebar p{ font-size:11px; padding:0 0 12px 6px}
#Sidebar h2{ color:#fff; font-size:14px; display:block; padding:4px 6px; background-color:#000; text-transform:uppercase; margin-bottom:8px}
#Copy{ width:470px; float:left; padding:10px;}
#Copy p{ padding:0 0 14px 24px;}
#Copy ol{ padding:0 0 12px 50px; margin:0; font-size:12px; line-height:18px;}
#Copy ul{ padding:0 0 12px 50px; margin:0; font-size:12px; line-height:18px;}
#Copy li{ padding:0 0 4px 0;}
#Copy h4{ padding:4px 0 12px 4px}
#Copy2{ width:666px; float:left; padding:10px;}
#Copy2 p{ padding:0 0 14px 24px;}
#Copy2 ol{ padding:0 0 12px 50px; margin:0; font-size:12px; line-height:18px;}
#Copy2 ul{ padding:0 0 12px 50px; margin:0; font-size:12px; line-height:18px;}
#Copy2 li{ padding:0 0 4px 0;}
#Copy2 h4{ padding:4px 0 12px 4px}
#Tool1{ position:absolute; background:url(images/tool-hammer.png) no-repeat; width:260px; height:306px; right:20px; top:338px; _top:340px}
#Tool2{ position:absolute; background:url(images/tool-wrench.png) no-repeat; width:260px; height:306px; right:20px; top:290px; _top:290px}
#Tool3{ position:absolute; background:url(images/tool-measure.png) no-repeat; width:260px; height:306px; right:20px; top:290px; _top:290px}
#Tool4{ position:absolute; background:url(images/tool-sander.png) no-repeat; width:260px; height:306px; right:20px; top:290px; _top:290px}
#Tool5{ position:absolute; background:url(images/tool-screw.png) no-repeat; width:260px; height:306px; right:20px; top:260px; _top:260px}

#OtherSide{ float:right; padding:14px 8px 10px 0px; width:200px;}
#OtherSide img{ border:1px solid #f78f1e;}

#AboutBanner{ background:url(images/banner-about.gif) no-repeat; width:913px; height:90px}
#ContactBanner{ background:url(images/banner-contact.gif) no-repeat; width:913px; height:90px}
#SearchBanner{ background:url(images/banner-search.gif) no-repeat; width:913px; height:90px}
#JsBanner{ background:url(images/banner-js.gif) no-repeat; width:913px; height:90px}
#EmployersBanner{ background:url(images/banner-emp.gif) no-repeat; width:913px; height:90px}
#EmployersBannerSafe{ background:url(images/banner-emp-safe.gif) no-repeat; width:913px; height:90px}
#EmployersBannerProf{ background:url(images/banner-emp-prof.gif) no-repeat; width:913px; height:90px}
#EmployersBannerNat{ background:url(images/banner-emp-nat.gif) no-repeat; width:913px; height:90px}
#EmployersBannerMar{ background:url(images/banner-emp-mar.gif) no-repeat; width:913px; height:90px}

#MapLinks{}
#MapLinks h4{ padding:4px; background-color:#000; color:#fff; margin-bottom:6px}
#MapLinks h4 a{ padding:4px; background-color:#000; color:#fff; margin-bottom:6px}
#MapLinks h4 a:hover{ padding:4px; background-color:#000; color:#fff; margin-bottom:6px}

/******************HP***************/
#Bottom{ background:url(images/bottom.gif) no-repeat; width:965px; height:42px; margin-bottom:20px; font-size:11px;}
#Bottom ul{ float:right; margin:0; padding:0; list-style:none}
#Bottom li{ float:left; padding:0 4px; margin:0}
#Bottom li a{ color:#7f7f7f; text-decoration:none;}
#Bottom li a:hover{ color:#7f7f7f; text-decoration:underline;}

/******************JQuery Styles***************/
div.answer{display: none;}
	.answer{padding:10px; margin-bottom:5px;}
	div.question{ margin:8px 0 4px 0; background:#ededed; padding:0;}
	div.question h4{padding:4px; color:#000; font-size:12px}
	div.question:hover {background:#dbdbdb; cursor:pointer}
	div.question.active{background:#dbdbdb;}
	
/***********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 24px;}
	#myForm p{ padding:0 0 14px 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}
	.field-label { float:left; width:180px; 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:#000;}
.s2k_heading_2006 {font-weight:bold;font-size:16px;color:#000;}
.s2k_subheading_2006 {font-weight:bold;font-size:13px;color:#000;}
.s2k_bold_2006 {font-weight:bold;color:#000;}
.s2k_byline_2006 {font-size:10px;font-style:italic;color:#000;}
.s2k_footer_2006 {font-size:10px;color:#000;}
.s2k_image_2006 {border:1px solid #000;}

/***********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;}