/*******************************************************
		PROJECT: ET Simonds

		DESCRIPTION:
		This CSS file comprises basic layout elements
		applicable to all pages of the site.
		Recurring elements like navigation, headers,
		and pull quotes.
		
		CREATED: 5-29-07

*******************************************************/



/*******************************************************
	BASIC LAYOUT ELEMENTS
*******************************************************/

* {margin: 0; padding: 0;}

body {
	color: #000;
	font-family: Helvetica, Arial, sans-serif;
	background-color: #363636;
	margin: 0; padding: 0;
}

p {
	font-size: .7em;
	line-height: 1.5em;
	margin: 0 0 1.2em 0;
}

h2 {
	color: #2D6202;
	font-size: 1.2em;
	margin: 0 0 .8em 0;
	text-transform: uppercase;
}

h3 {
	color: #2D6202;
	font-size: 1em;
	margin: 0 0 .8em 0;
}

h4 {
	color: #000;
	font-size: .9em;
	margin: 0 0 .2em 0;
}



/* ANCHOR TAGS */

a:link {
	color: #3F7118;
	text-decoration: underline;
}

a:visited {
	color: #B2901E;
	text-decoration: underline;
}

a:hover {
	color: #7BD436;
	text-decoration: none;
}

a:active {
	color: #B2901E;
	text-decoration: none;
}




img {
	display: block;
	border: 0;
}




ul, ol {
	margin: 0 0 1.6em 2em;
	padding: 0;
}

li {
	font-size: .7em;
	margin: 0 0 6px 0;
	line-height: 1.5em;
}







/*******************************************************
	FORM
*******************************************************/
div.formCol1, div.formCol2 {
	float: left;
	display: inline;
}

div.formCol1 {
	margin-right: 12px;
	text-align: right;
	width: 160px;
}

div.formCol2 {
	width: 240px;
}

form {
	margin: 18px 0 24px 0;
	padding: 0;
}

form div.clear {
	height: 16px;
	background: url(../m/dotted-form.gif) repeat-x center left;
}

/* "clear" that doesn't use dotted line */
form div.clearLast {clear: both; font-size: 0px; line-height: 0px; height: 0px;}


div.formCol1 h3, div.formCol2 h3 {
	margin: 0;
	padding: 3px 0 0 0;
	font-size: .7em;
}

div.formColWide h3{
	margin: 0 0 6px 0;
	padding: 3px 0 0 0;
	font-size: .7em;
}

fieldset {
	background-color: #DCE6D5;
	border: 1px solid #678452;
	padding: 6px 16px 16px 16px;
	margin: 0 0 24px 0;
}

h3.fieldsetSec {
	color: #000;
	font-size: .7em;
	margin: 0 0 8px 0;
	text-align: center;
	padding: 3px 0;
	background-color: #B9CFA9;
}

legend {
	background-color: #678452;
	color: #FFF;
	font-size: .7em;
	font-weight: bold;
	padding: 4px;
	margin: 0 0 12px 0;
}

.reqStar {font-size: 125%;color: #F00;font-weight: bold;}
.req {color: #F00;}

h3.perComplete {
	font-size: .7em;
	font-weight: normal;
	margin: 0 0 3px 0;
}

div.perBar {
	width: 536px;
	border: 1px solid #98AB8A;
	height: 8px;
	font-size: 1px;
	line-height: 1px;
	background: #FFF url(../m/per-off.jpg) repeat-x top left;
	margin: 0 0 24px 0;
}

div.part-on, div.part-off {
	float: left;
	width: 134px;
	height: 8px;
	font-size: 1px;
	line-height: 1px;
}

div.part-on {
	background: url(../m/per-on.jpg) repeat-x top left;
}

input.submitBtn {
	background-color: #FFD33F;
	font-size: .7em;
/*	text-transform: lowercase;*/
	font-weight: bold;
}

div.formSection {
	padding: 0 0 36px 0;
}





/*******************************************************
	MAIN CONTAINERS
*******************************************************/

div#global {
	background: #DFDFDF url(../m/bg-global.jpg) repeat-x top left;
	border-bottom: 13px solid #ffd442;
}

div#main {
	width: 760px;
	background: #FFF url(../m/bg-main.jpg) repeat-y top left;	
}


div#mainContentCon {
	float: left;
	width: 585px;
}

div#mainContent {
	width: 540px;
	margin: 25px 0 0 28px;
}






/*******************************************************
	TOP
*******************************************************/

h1#topLogo { /* Levin technique */
 	width: 760px;
	height: 172px;
	position: relative;
	margin: 0;
	padding: 0;
	font-size: 1em;
}

h1#topLogo span {
	top: 0px;
	left: 0px;
 	width: 760px;
	height: 172px;
	background: url(../m/top.jpg) no-repeat;
	position: absolute;
	z-index:1;
}

h1#topLogo a {
 	width: 760px;
	height: 172px;
	display: block;
	cursor:pointer;
}



div#left {
	float: left;
	width: 175px;
	margin: 0 0 0 0;
}








/*******************************************************
	NAV
*******************************************************/
div#mainNav ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
}

div#mainNav li { /* Levin technique */
 	width: 175px;
	height: 29px;
	position: relative;
	margin: 0;
	padding: 0;
	font-size: .7em;
	line-height: 29px;
}

div#mainNav li span {
	top: 0px;
	left: 0px;
 	width: 175px;
	height: 29px;
	position: absolute;
	z-index:1;
	background-repeat: no-repeat;
	background-position: top left;
}

div#mainNav li a.mainBtn {
 	width: 175px;
	height: 29px;
	color: #333;
	display: block;
	cursor:pointer;
}

li#nav-home span {background-image: url(../m/nav/nav-home.jpg);}
li#nav-about span {background-image: url(../m/nav/nav-about.jpg);}
li#nav-careers span {background-image: url(../m/nav/nav-careers.jpg);}
li#nav-contact span {background-image: url(../m/nav/nav-contact.jpg);}
li#nav-equipment span {background-image: url(../m/nav/nav-equipment.jpg);}
li#nav-links span {background-image: url(../m/nav/nav-links.jpg);}
li#nav-safety span {background-image: url(../m/nav/nav-safety.jpg);}
li#nav-what-we-do span {background-image: url(../m/nav/nav-what-we-do.jpg);}

body#pageHome li#nav-home span {background-image: url(../m/nav/nav-home-over.jpg);}
body#pageAbout li#nav-about span {background-image: url(../m/nav/nav-about-over.jpg);}
body#pageCareers li#nav-careers span {background-image: url(../m/nav/nav-careers-over.jpg);}
body#pageContact li#nav-contact span {background-image: url(../m/nav/nav-contact-over.jpg);}
body#pageEquipment li#nav-equipment span {background-image: url(../m/nav/nav-equipment-over.jpg);}
body#pageLinks li#nav-links span {background-image: url(../m/nav/nav-links-over.jpg);}
body#pageSafety li#nav-safety span {background-image: url(../m/nav/nav-safety-over.jpg);}
body#pageWhatWeDo li#nav-what-we-do span {background-image: url(../m/nav/nav-what-we-do-over.jpg);}




/* Sub navs */
div#mainNav li ul {
	background-color: #3C7127;
	display: none;
	padding: 6px 0;
}

div#mainNav li ul li {
	font-size: 1em;
	line-height: 2.3em;
	font-weight: bold;
	text-align: right;
	width: 155px;
	height: auto;
	padding: 0 20px 0 0;
}

div#mainNav li ul li a {
	color: #FFF;
}

div#mainNav li ul li a:hover {
	color: #A0EC82;
}

body#pageAbout li#nav-about
{height: auto;}

body#pageAbout li#nav-about ul
{display: block;}





/*******************************************************
	LEFT CONTACT INFO
*******************************************************/
div#left-contact {
	margin: 24px 0;
	background: url(../m/bg-contact-left.jpg) repeat-y top left;
}

div#left-contact h3 {
 	width: 12px;
	height: 61px;
	position: relative;
	margin: 40px 0 0 4px;
	padding: 0;
	font-size: .1em;
	line-height: 1px;
	float: left;
	display: inline;
}

div#left-contact h3 span {
	top: 0px;
	left: 0px;
 	width: 12px;
	height: 61px;
	position: absolute;
	z-index:1;
	background: url(../m/left-contact.gif) no-repeat top left;
}



div#left-contact p {
	width: 130px;
	margin: 0 0 0 36px; 
	padding: 24px 0;

}

div#left-contact div.btm {
	height: 10px;
	background: url(../m/contact-btm.jpg) no-repeat top left;
	line-height: 1px;
	font-size: 1px;
}
	
div#left-contact div.top {
	height: 10px;
	background: url(../m/contact-top.jpg) no-repeat top left;	
	line-height: 1px;
	font-size: 1px;
}







/*******************************************************
	HOME PAGE
*******************************************************/
div#flashHome {
	height: 213px;
}

div#flashHome a {border: 0;text-decoration: none;}

div.homeCallouts {
	width: 251px;
	float: right;
	margin: 0 0 12px 16px;
}




/*******************************************************
	LINKS
*******************************************************/
ul.linksList {
	margin: 0;
	padding: 0;
}

ul.linksList li {
	width: 150px;
	height: 195px;
	margin: 0 24px 18px 0;
	float: left;
	text-align: center;
	font-weight:bold;
	list-style-type:none;
}




/*******************************************************
	PRODUCTS (table-based)
*******************************************************/
table#productCon {
	padding: 12px 0 0 0;
}

table#productCon td {
	width: 162px;
	padding: 0 0 16px 0;
	font-size: .8em;
}


table#productCon td img {
	text-align: center;
	margin: 0 0 4px 0;
	border: 1px solid #333;
}


table#productCon h3 {
	color: #000;
	text-align: center;
}

table#productCon a {
display: block;
	padding: 4px 0 4px 0;
	text-align: center;

}






/*******************************************************
	PRODUCTS
*******************************************************/
p.orderMsg {
	padding: 6px;
	border: 1px solid #B9CDAB;
	background-color: #E7EDE3;
}

div#productCon {
	padding: 12px 0 0 0;
}

div.product {
	width: 152px;
	float: left;
	display: inline;
	padding: 0 0 16px 0;
	margin: 0 10px 0 0;
}

div.prodThumb {
	margin-right: 16px;
	text-align: center;
	padding: 0 0 8px 0;
}

div.prodThumb img {
	border: 1px solid #333;
}

div.prodDesc h3 {
	font-size: .8em;
	color: #000;
	text-align: center;
}

div.product .viewLg {
	font-size: .7em;
	padding: 4px 0 0 0;
}

.productLg {
	padding: 0 0 16px 0;
}

.productLg img {
	border: 1px solid #333;
}







/*******************************************************
	FOOTER
*******************************************************/
div#footer {
	padding: 36px 0 12px 0;
}

div#footerNav {
	padding: 0 0 12px 0;
}

div#footerNav ul {
	margin: 0;
	padding: 0;
}


div#footerNav ul li{
	font-size: .7em;
	display: inline;
	list-style-type:none;
	background-image: none;
	padding: 0 6px 0 0;
	margin: 0 6px 0 0;
}

div#footerLegal {
	
}











/*******************************************************
	MISC
*******************************************************/

div.insetRt {
	float: right;
	display: inline;
	margin: 0 0 12px 12px;
}

/* Legacy browser message */
div.legacyMsg {display: none;}

/* No JavaScript messge */
div.noScriptMsg {background-color: #333333;padding: 12px;}
div.noScriptMsg p {margin: 0;}


div.section {
	padding: 12px 0;
}

.clear { clear: both; font-size: 0px; line-height: 0px; height: 0px;}

div.hide {display: none;}


.downloadLink {
	background: url(../m/i-arw-green.gif) no-repeat 0px 4px;
	padding: 0 0 0 13px;
	min-height: 7px;
}





/*******************************************************
	SIFR
*******************************************************/

/* These are standard sIFR styles... do not modify */

.sIFR-flash {
	visibility: visible !important;
	margin: 0;
}

.sIFR-replaced {
	visibility: visible !important;
}

span.sIFR-alternate {
	position: absolute;
	left: 0;
	top: 0;
	width: 0;
	height: 0;
	display: block;
	overflow: hidden;
}

/* Hide Adblock Object tab: the text should show up just fine, not poorly with a tab laid over it. */
.sIFR-flash + div[adblocktab=true] {
  display: none !important;
}

/* These "decoy" styles are used to hide the browser text before it is replaced... the negative-letter spacing in this case is used to make the browser text metrics match up with the sIFR text metrics since the sIFR text in this example is so much narrower... your own settings may vary... any weird sizing issues you may run into are usually fixed by tweaking these decoy styles */

.sIFR-hasFlash h2#pageHead {
	visibility: hidden;
	letter-spacing: -9px;
	font-size: 32px;
	margin: 0 0 .2em 0;
	text-transform: uppercase;
}