/*************GLOBAL STYLES******************/
body { overflow: -moz-scrollbars-vertical; behavior: url(/js/csshover.htc); background:#fff; font-family:Arial, Helvetica, sans-serif; color:#808285; font-size:14px; }
* { margin: 0 auto; padding: 0; }		/*<------<--------<-----| This assumes we're centering!!! */
a img { border: none; }
a { color:#6b494e;}
a:hover, a.current { text-decoration: underline; }
p { padding:0 0 12px 0; line-height:23px; }
ul, ol { margin:0; padding:0 0 12px 30px;}
li { margin:0; padding:0; line-height:23px;}
td, th, tr { }
strong {color:#6e833f}
hr{ color:#ccc; border:1px solid #ccc; border-width:1px 0 0 0; margin:10px 0;}

h1 { color:#6e833f; font-size:15px; padding:0 0 10px 0; display:none }
h2 { color:#6e833f; font-size:16px; padding:0 0 10px 0; }
h3 { color:#6e833f; font-size:16px; padding:0 0 10px 0; }
h4 { color:#6e833f; font-size:14px; padding:0 0 4px 0; text-transform:uppercase }
h5 { color:#6e833f; font-size:12px; padding:0 0 10px 0; }
h6 { color:#6e833f; 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:33%; float:left; }
.bioimg{ float:left; padding:4px 0 0 0;}

/*************WRAPPERS**************/
#PageWrapperGreen { background:url(../images/bgslice-green.jpg) repeat-x top; }
#PageWrapperBlue { background:url(../images/bgslice-blue.jpg) repeat-x top; }
#PageWrapperRed { background:url(../images/bgslice-red.jpg) repeat-x top; }

#Wrapper { width:834px; }

#LogoWorkbox{ width:834px; height:216px; background:url(../images/logo-workbox.gif) no-repeat top right;}
#LogoWorkboxStaffing{ width:834px; height:216px; background:url(../images/logo-workbox-staffing.gif) no-repeat top right;}
#LogoWorkboxDirect{ width:834px; height:216px; background:url(../images/lobo-workbox-direct.gif) no-repeat top right;}

#Banner{ width:834px; height:109px;}
#Banner.home{ background:url(../images/banner-home.gif) no-repeat top left;}
#Banner.employers{ background:url(../images/banner-emp.gif) no-repeat top left;}
#Banner.staffing{ background:url(../images/banner-workboxstaffing.gif) no-repeat top left;}
#Banner.direct{ background:url(../images/banner-workboxdirect.gif) no-repeat top left;}
#Banner.jobseekers{ background:url(../images/banner-js.gif) no-repeat top left;}
#Banner.hiring{ background:url(../images/banner-js-hiring.gif) no-repeat top left;}
#Banner.search{ background:url(../images/banner-search.gif) no-repeat top left;}
#Banner.about{ background:url(../images/banner-about.gif) no-repeat top left;}
#Banner.contact{ background:url(../images/banner-contact.gif) no-repeat top left;}

#Nav{width:834px; height:30px; list-style:none; padding:0; position:relative; display:block;}
#Nav ul{ width:627px; float:left; margin:0; padding:0;list-style:none}
#Nav li{float:left;}				
#Nav li a span{display:none;}				
#Nav li a{height: 30px; display: block; float: left; padding: 0;}
#Nav li a.home{width:67px; background: url(../images/nav_01.gif) no-repeat top;}				
#Nav li a.employers{width:114px; background: url(../images/nav_02.gif) no-repeat top;}
#Nav li a.jobseekers{width:124px; background: url(../images/nav_03.gif) no-repeat top;}		
#Nav li a.search{width:125px; background: url(../images/nav_04.gif) no-repeat top;}
#Nav li a.about{width:105px; background: url(../images/nav_05.gif) no-repeat top;}		
#Nav li a.contact{width:92px; background: url(../images/nav_06.gif) no-repeat top;}
#Nav li a:hover{background-position:bottom; }
#Nav li a.current{background-position:bottom; }

#Middle{ width:826px; clear:both; padding:40px 4px 10px 4px;}
#Left{ float:left; width:524px;}
#Left h2 { background:#6c494f; padding:4px; margin:0 14px 6px 0; color:#fff; font-size:14px; text-transform:uppercase }
#Left h2.bluebg { background:#005373; padding:4px; margin:0 14px 6px 0; color:#fff; font-size:14px; text-transform:uppercase }
#Right{ float:right; width:220px;}
#Right h2{ color:#004f6f; text-transform:uppercase; padding:0 0 0 0; font-size:14px;}
#Right h3{ color:#6e833f; text-transform:uppercase; padding:0 0 10px 0; font-size:16px;}
#Right h4{ color:#6e833f; text-transform:none; padding:0 0 10px 0; font-size:14px;}
#Full{ float:left; width:744px; }

#SubNav{ margin:4px 0 20px 0}
#SubNav h2{ color:#004f6f; text-transform:uppercase; padding:0 0 6px 0; font-size:15px;}
#SubNav ul{ color:#004f6f; list-style:square; text-transform:uppercase; font-weight:bold; padding:0 0 10px 20px}
#SubNav a{ color:#6e833f; text-decoration:none}
#SubNav a:hover{ color:#004f6f; text-decoration:underline}
#SubNav a.activeSubMenuItem{ color:#004f6f; text-decoration:none}

#Bottom{ width:834px;}
#SocialMedia{ width:834px; height:45px; background:url(../images/logo-sm.gif) no-repeat right}
#Footer{ width:834px; border-top:1px solid #e3e3e5; color:#909194; font-size:10px; padding:6px 0}
#Footer a{ color:#909194; text-decoration:none;}

#site_credits { cursor:pointer }

/*************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. */	
input[type="text"] { width:250px; }
textarea { width:250px; }
select { width:250px; }
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: #990000; color: #fff; font-weight: bold; }
.custom-advice { margin: 5px 0; padding: 5px; background-color: #990000; color : #fff; font-weight: bold; }
/* Define the basic form layout */
fieldset { padding: 1em; margin-bottom: 0.5em; }
label { font-weight: bold; }
.form-row { font-size:12px; margin:0 0 8px 0 }
.field-label { float:left; width:230px; }
.field-widget { float:left; width:250px; }
/* Anything extra... */	
.red { color:#990000; }

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