/* Global styles */
body { overflow: -moz-scrollbars-vertical; behavior: url(../js/csshover.htc); background:#662d91 url(images/bg_square.gif) repeat; font-family:Tahoma, Arial, Helvetica, sans-serif; color:#333; text-align:center}
* {margin: 0 auto; padding: 0;}		/*<------<--------<-----| This assumes we're centering!!! */
a img {border: none;}
a { color:#c44149; text-decoration:none}
	a:hover, a.current {text-decoration: underline;}
p { font-size:11px; padding:0 0 10px 0; line-height:15px;}
ul, ol {padding:4px 0 0 0;}
li {}
td, th, tr {font-size:11px;}
strong { color:#336fa4;}

h1{color:#662d91; font-size:20px; padding:0 0 10px 0;}
h2{color:#662d91; font-size:18px; padding:0 0 10px 0;}
h3{color:#662d91; font-size:16px; padding:0 0 10px 0;}
h4{color:#662d91; font-size:13px; padding:0 0 10px 0;}
h5{color:#662d91; font-size:12px; padding:0 0 10px 0;}
h6{color:#662d91; font-size:10px; padding:0 0 10px 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:50%;float:left;}
.split30{position:relative; width:40%;float:left;}
.formpadding td {padding: 0 0 10px 0;}
.padd{ padding:70px 10px 0 18px}
.padd2{ padding:18px 10px 0 12px;}
.padd3{ padding:8px;}
.purpleLine { border:1px solid #d1c0de; border-width:0 0 1px 0; margin-bottom:10px; clear:both}

/******************s2k styles***************/
.s2k_text_2006 {font-family:Tahoma, Arial, Helvetica, sans-serif; font-size:11px; line-height:normal; color:#333;}
.s2k_heading_2006 {font-weight:bold; font-size:16px;color:#662d91;}
.s2k_subheading_2006 {font-weight:bold; font-size:13px;color:#662d91;}
.s2k_bold_2006 {font-weight:bold; color:#336fa4;}
.s2k_byline_2006 {font-size:10px; font-style:italic;color:#333;}
.s2k_footer_2006 {font-size:10px; color:#333;}
.s2k_image_2006 {border:1px solid #662d91;}

/******************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:#662d91; font-size:12px}
	div.question:hover {background:#dbdbdb; cursor:pointer}
	div.question.active{background:#dbdbdb;}

/******************Form Styles***************/	
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: 3px;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; padding: 5px 5px 10px 5px;}
	.field-label { font-size:12px; float:left; width:220px; color:#424242}
	.field-widget { font-size:12px; float:left; width:300px; margin-bottom:2px}
	.chart-label {float:left; width:70%;}
	.chart-widget {float:left; width:30%; text-align:center;}
	.formWrap{border:1px solid #999; padding:2px; clear:both; background:#f7f7f7; font-size:11px}
		.formWrap h5{background:#666;text-align:center; color:#fff; font-size:14px; padding:3px; margin:2px 0;}
	.tri{width:30%; display:block; float:left; text-align:center;}
	.borders{border:1px solid #999;}
	.rowColor{background:#dedede;}
	/* Anything extra... */	
	.red{color:#990000;}

/***************WRAPPERS*********************/
#ConceptWrapper{width:500px; padding:20px; border:1px solid #000; margin-top:20px; background-color:#fff;}
#PageWrapper{background:url(images/bg_slice.jpg) repeat-x;}
#Wrapper{width:880px; padding:20px 0 10px 0; text-align:left}
#HpBodyWrapper{background:url(images/body_slice.jpg) repeat-y; width:880px;}
#SubBodyWrapper{background:url(images/sub_body_slice.jpg) repeat-y; width:880px;}
#HpBottom{background:url(images/hp_bottom.jpg) no-repeat; padding:58px 0 0 0; margin-bottom:10px}
#SubBottom{background:url(images/sub_bottom.jpg) no-repeat; padding:58px 0 0 0; margin-bottom:10px}

/***************TOP*********************/
#Top_hp{ background:url(images/top_hp.jpg) no-repeat; width:880px; height:220px; overflow:hidden}
#Top_about{ background:url(images/top_sub_1.jpg) no-repeat; width:880px; height:220px; overflow:hidden}
#Top_emp{ background:url(images/top_sub_2.jpg) no-repeat; width:880px; height:220px; overflow:hidden}
#Top_js{ background:url(images/top_sub_3.jpg) no-repeat; width:880px; height:220px; overflow:hidden}
#Top_resources{ background:url(images/top_sub_4.jpg) no-repeat; width:880px; height:220px; overflow:hidden}
#Top_search{ background:url(images/top_sub_5.jpg) no-repeat; width:880px; height:220px; overflow:hidden}
#Top_contact{ background:url(images/top_sub_6.jpg) no-repeat; width:880px; height:220px; overflow:hidden}

/***************NAV*********************/
#Nav {width: 606px; height: 23px; list-style: none; padding: 62px 0 0 285px; position:relative; clear:both; display:block;}
	#Nav ul {margin:0; padding:0; list-style:none; width: 606px;}
	#Nav li {float: left; padding:0 10px 0 0; margin:0 0 0 0;}
	#Nav li img{ float:left; padding:0 3px 0 0;}	
	#Nav li.home { width:58px; float: left; }
	#Nav li.aboutus { width:74px; float: left;}		
	#Nav li.employers { width:80px; float: left;}					
	#Nav li.jobseekers { width:84px; float: left;}	
	#Nav li.resources { width:76px; float: left;}
	#Nav li.search { width:82px; float: left;}
	#Nav li.contactus { width:78px; float: left;}						
	#Nav li a {height: 23px; display: block; float: left; padding: 0; color:#662d91; font-size:11px; text-decoration:none}
	#Nav li a:hover {height: 23px; display: block; float: left; padding: 0; color:#333; font-size:11px; text-decoration:underline}
	#Nav li a.current {height: 23px; display: block; float: left; padding: 0; color:#333; font-size:11px; text-decoration:underline}
	
/***************NAV*********************/
#JbNav {width: 606px; height: 23px; list-style: none; padding: 62px 0 0 285px; position:relative; clear:both; display:block;}
	#JbNav ul {margin:0; padding:0; list-style:none; width: 606px;}
	#JbNav li {float: left; padding:0 10px 0 0; margin:0 0 0 0;}
	#JbNav li img{ float:left; padding:0 3px 0 0;}	
	#JbNav li.home { width:58px; *width:68px; }
	#JbNav li.aboutus { width:74px; *width:84px;}		
	#JbNav li.employers { width:80px; *width:86px;}					
	#JbNav li.jobseekers { width:84px; *width:94px;}	
	#JbNav li.resources { width:76px; *width:86px;}
	#JbNav li.search { width:82px; *width:92px;}
	#JbNav li.contactus { width:78px; *width:88px;}						
	#JbNav li a {height: 23px; display: block; float: left; padding: 0; color:#662d91; font-size:11px; text-decoration:none}
	#JbNav li a:hover {height: 23px; display: block; float: left; padding: 0; color:#333; font-size:11px; text-decoration:underline}
	#JbNav li a.current {height: 23px; display: block; float: left; padding: 0; color:#333; font-size:11px; text-decoration:underline}

/**************HP**************************/
#HpLeftCol{ float:left; width:240px; padding:18px 24px 18px 20px;}
	#HpLeftCol img{ float:left; padding:0 10px 6px 0;}
	#HpLeftCol span{ float:right; font-size:11px; color:#336fa4; padding:0 0 10px 0; text-align:right; line-height:15px}
#HpCopy{ background:url(images/hp_welcomepics.jpg) no-repeat; width:583px; float:left}
	#HpCopy ul{font-size:11px; color:#662d91; margin:0; padding:8px 0 8px 40px}
	#HpCopy li{ padding:0 0 3px 0; margin:0}
#HpCopyMain{ float:left; width:370px; padding:0 0 0 0;}
#HpCopySide{ float:left; width:203px; padding:290px 0 0 10px;}
#QlTop{ background:url(images/ql_top.gif) no-repeat; height:31px; overflow:hidden; width:203px;} 
#QlMid{ background:url(images/ql_middle.gif) repeat-y; width:203px;} 
#QlBot{ background:url(images/ql_bottom.gif) no-repeat; height:8px; width:203px;} 

/**************SUB**************************/
#SubNav{}
	#SubNav ul{ margin:0; padding:0 0 10px 20px}
	#SubNav li{ list-style:none; padding:0 0 4px 10px; text-indent:20px; color:#333; font-size:12px;}
	#SubNav li a{ background:url(images/subnav_up.gif) no-repeat; padding:0 0 0 20px; color:#333; font-weight:normal; text-decoration:none}
	#SubNav li a:hover{ background:url(images/subnav_over.gif) no-repeat; padding:0 0 0 20px; color:#662d91; font-weight:bold; text-decoration:none;}
	#SubNav li a.current{ background:url(images/subnav_over.gif) no-repeat; padding:0 0 0 20px; color:#662d91; font-weight:bold; text-decoration:none;}
#SubNav2{}
	#SubNav2 ul{ margin:0; padding:0 0 10px 20px}
	#SubNav2 li{ list-style:none; padding:0 0 4px 10px; text-indent:20px; color:#333; font-size:12px;}
	#SubNav2 li a{ background:url(images/subnav_up.gif) no-repeat; padding:0 0 0 20px; color:#333; font-weight:normal; text-decoration:none}
	#SubNav2 li a:hover{ background:url(images/subnav_over.gif) no-repeat; padding:0 0 0 20px; color:#662d91; font-weight:bold; text-decoration:none;}
	#SubNav2 li a.current{ background:url(images/subnav_over.gif) no-repeat; padding:0 0 0 20px; color:#662d91; font-weight:bold; text-decoration:none;}
#SubLeftCol{ float:left; width:222px; padding:18px 24px 18px 20px;}
	#SubLeftCol img{ margin-bottom:10px}
	#SubLeftCol span{ float:right; font-size:11px; color:#336fa4; padding:0 0 10px 0; text-align:right; line-height:15px}
#SubCopy{ width:612px; float:left}
	#SubCopy ul{font-size:11px; color:#333; margin:0; padding:0 0 8px 40px}
	#SubCopy ol{font-size:11px; color:#333; margin:0; padding:0 0 8px 20px}
	#SubCopy li{ padding:0 0 5px 0; margin:0}
	#SubCopy span{ float:right; font-size:11px; color:#336fa4; padding:0 0 10px 0; text-align:right; line-height:15px; clear:both}
#SubCopy2{ width:612px; float:left}
	#SubCopy2 ul{font-size:11px; color:#333; margin:0; padding:0 0 8px 40px}
	#SubCopy2 li{ padding:0 0 5px 0; margin:0}
#SubCopyMain{ float:left; width:390px; padding:0 0 0 0;}
#SubCopySide{ float:left; width:210px; padding:10px 0 0 2px; margin-top:8px}
#SubCopyMain2{ float:left; width:600px; padding:0 0 0 0; text-align:left}

#SideBar{ margin-top:16px; background-color:#efeaf4; width:210px; float:left;}
#SideBar p{ font-weight:bold}
#SideBar span{ float:right; font-size:11px; color:#336fa4; padding:0 0 10px 0; text-align:right; line-height:15px}

/***************FOOT-NAV*********************/
#FootNav { width:880px; list-style: none;}
	#FootNav ul {margin:0; padding:0; list-style:none;}
	#FootNav li {float: left; padding:0 3px 0 3px; margin:0; font-size:10px;color:#fff; text-transform:lowercase; }					
	#FootNav li a {color:#fff; text-decoration:none}
	#FootNav li a:hover {color:#fff; text-decoration:underline}
	#FootNav li a.current {color:#fff; text-decoration:underline}
	#FootNav span { float:right; color:#fff; font-size:10px; padding:0 4px 0 0;}


/***********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;} 