/************************************************************************
	Serbaco Stylesheet
	Author: James Hall (eROI.com)
	Client: Serbaco Inc.
	Site: www.serbaco.com

	Listing Order:
	==============
	1 - Global
	2 - Structure
	3 - Left Col
	4 - Right Col
	5 - Home Page
	6 - Sub Pages
	7 - Footer

***********************************************************************
	1 - GLOBAL STYLES
************************************************************************/
/* These styles reset default styles so they don't mess with your css.  Taken from Eric Meyer http://meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded/ */
/* If you want default styles for an element, just remove the element from the list below.*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, sub, sup, tt, var, dl, dt, dd, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
}

ol, ul {
	
}
/* remember to define focus styles! */
:focus {
	outline: 0;
}

/*add more*/
body {
	line-height: 130%;
	font-size: small;
	background:url(../img/stripedBG.gif) top left repeat-x #68a739;
	font-family:Arial, Helvetica, sans-serif;
}

h1{
	font-size:150%;
}

h2{
	font-size:130%;
	color:#4d7a2b;
}

h1, h2{
	padding-bottom:10px;
	color:#408809;
}

h3{
	font-size:120%;
}

a{
	color:#747474;
}

a:hover{
	color:#408809;
}

/* Class for making text invisible, will appear if styles are turned off. */
span.invisitext{
	display: none;
}

/* Class for clearing divs, but I would suggest trying not to use it. */
div.clear{
	clear: both;
}

/***********************************************************************
	2 - STRUCTURE
************************************************************************/
div#container{
	width:805px;
	margin-right:auto;
	margin-left:auto;
}

/*HEADER SIGNUP*/
div#headSignup{
	float:left;
	width:805px;
	height:72px;
	vertical-align:top;
}

div#topSignup{
	position:relative;
	float:right;
	width:280px;
	height:52px;
	padding-top:20px;
	font-size:120%;
	color:#FFFFFF;
	font-weight:bold;
	z-index:5;
}

div#topSignup p{
	padding-bottom:5px;
}

div#topSignup input.textInputs{
	width:94px;
	border:none;
	color:#97b7c9;
	padding:2px;
	margin-left:2px;
	margin-right:2px;
	margin-top:2px;
	float:left;
}

div#topSignup input.submit{
	padding-top:3px;
	display:block;
	float:left;
}

div#contentHolder{
	float:left;
	background:url(../img/contentHolderBG.png) top left repeat;
	width:780px;
	padding:0px 13px 12px 12px;
	display:inline; /* So IE plays nice */
	vertical-align:bottom;
}

/***********************************************************************
	3 - LEFT COL
************************************************************************/

div#leftCol{
	position:relative;
	float:left;
	background-color:#ffffff;
	width:202px;
}

div#leftCol img{
	/*border-bottom:1px solid #b3d29b;*/
}

div#leftCol ul{
	list-style: none;
}

div#leftCol ul li{
	display:block;
	float:left;
	width:100%;
}

/*nav*/

div#leftCol ul li a{
	width:202px;
	display:block;
}

a#navHome{background:url(../img/homeOff.jpg) top left no-repeat;height:36px;}
a#navHome:hover{background:url(../img/homeOn.jpg) top left no-repeat;height:36px;}
a#navServices{background:url(../img/servicesOff.jpg) top left no-repeat;height:36px;}
a#navServices:hover{background:url(../img/servicesOn.jpg) top left no-repeat;height:36px;}
a#navNewSystems{background:url(../img/newSystemsDesignOff.jpg) top left no-repeat;height:37px;}
a#navNewSystems:hover{background:url(../img/newSystemsDesignOn.jpg) top left no-repeat;height:37px;}
a#navEngineering{background:url(../img/engineeringOff.jpg) top left no-repeat;height:36px;}
a#navEngineering:hover{background:url(../img/engineeringOn.jpg) top left no-repeat;height:36px;}
a#navProducts{background:url(../img/productsOff.jpg) top left no-repeat;height:35px;}
a#navProducts:hover{background:url(../img/productsOn.jpg) top left no-repeat;height:35px;}
a#navResources{background:url(../img/resourcesOff.gif) top left no-repeat;height:35px;}
a#navResources:hover{background:url(../img/resourcesOn.gif) top left no-repeat;height:35px;}
a#navHelp{background:url(../img/helpOff.gif) top left no-repeat;height:35px;}
a#navHelp:hover{background:url(../img/helpOn.gif) top left no-repeat;height:35px;}
a#navContactUs{background:url(../img/contactOff.jpg) top left no-repeat;height:38px;}
a#navContactUs:hover{background:url(../img/contactOn.gif) top left no-repeat;height:38px;}

/*end nav*/

div#leftAddress{ /* this is actually in footer, but appears at bottom of left col*/
	width:162px;
	color:#747474;
	padding-bottom:10px;
	position:relative;
	left:0px;
	bottom:30px;
}

div#leftAddress h3{font-weight:bold;}
div#leftAddress hr{height:1px;background-color:#e2e2e2;border:none}

/***********************************************************************
	4 - RIGHT COL
************************************************************************/

div#rightCol{
	float:left;
	width:567px;
	padding-left:10px;
	border-left:202px solid white;
	margin-left:-202px;
}

div#rightCol p{
	margin-bottom:20px;
}

div#rightCol div#topInfoBox{
	float:left;
	background-color:#ffffff;
	width:567px;
	margin-bottom:12px !important;
}

div#rightCol div#topInfoBox div{
	float:left;
	width:534px;
	padding:20px 13px 13px 20px;
	z-index:200;
}

div#rightCol div#topInfoBox div li{
	padding-bottom:10px;
}

div#rightCol div#bottomInfoBox{
	float:left;
	background-color:#ffffff;
	width:554px;
	padding:17px 0px 11px 13px;
}

/***********************************************************************
	5 - HOME PAGE
************************************************************************/

/* FOR HOME IMAGE FOLD*/
div#homeImgFlap1{
	position:relative;
	float:left;
	top:36px;
	left:443px;
	background:url(../img/homeImgFlap1.png) bottom left no-repeat;
	width:77px;
	/*height:72px;*/
	height:36px;
	z-index:4;
}

div#homeImgFlap2{
	position:relative;
	top:0px;
	left:423px;
	background:url(../img/homeImgFlap2.png) top left no-repeat;
	width:95px;
	height:13px;
	z-index:3;
}

/*body#home div#leftAddress{
	float:left;
	margin-left:-746px;
}*/

div.serviceBox{
	display:inline;
	float:left;
	background-color:#e2e2e2;
	width:128px;
	height:132px;
	margin:0px 11px 11px 0px;
}

div#servicesBoxPredictive{margin-right:0px !important;}
div#servicesBoxTrouble{margin-right:0px !important;}
div.serviceBox a{display:block;width:100%;height:100%; position:relative;}

div#servicesBoxRepairs a{background:url(../img/boxRepairsOff.jpg) top left no-repeat;}
div#servicesBoxRepairs a:hover{background:url(../img/boxRepairsOn.jpg) top left no-repeat;}
div#servicesBoxEmergency a{background:url(../img/boxEmergencyOff.jpg) top left no-repeat;}
div#servicesBoxEmergency a:hover{background:url(../img/boxEmergencyOn.jpg) top left no-repeat;}
div#servicesBoxRebaging a{background:url(../img/boxRebagingOff.jpg) top left no-repeat;}
div#servicesBoxRebaging a:hover{background:url(../img/boxRebagingOn.jpg) top left no-repeat;}
div#servicesBoxPredictive a{background:url(../img/boxPredictiveOff.jpg) top left no-repeat;}
div#servicesBoxPredictive a:hover{background:url(../img/boxPredictiveOn.jpg) top left no-repeat;}
div#servicesBoxSystems a{background:url(../img/boxSystemsOff.jpg) top left no-repeat;}
div#servicesBoxSystems a:hover{background:url(../img/boxSystemsOn.jpg) top left no-repeat;}
div#servicesBoxHazmat a{background:url(../img/boxHazmatOff.jpg) top left no-repeat;}
div#servicesBoxHazmat a:hover{background:url(../img/boxHazmatOn.jpg) top left no-repeat;}
div#servicesBoxEngineering a{background:url(../img/boxEngineeringOff.jpg) top left no-repeat;}
div#servicesBoxEngineering a:hover{background:url(../img/boxEngineeringOn.jpg) top left no-repeat;}
div#servicesBoxTrouble a{background:url(../img/boxHelpOff.jpg) top left no-repeat;}
div#servicesBoxTrouble a:hover{background:url(../img/boxHelpOn.jpg) top left no-repeat;}

/***********************************************************************
	6 - SUB PAGES
************************************************************************/

body#sub div#contentHolder{
	padding-top:13px;
}

body#sub div#rightCol div#topInfoBox{
	margin-bottom:0px !important;
}

body#sub div#rightCol div#topInfoBox input, body#sub div#rightCol div#topInfoBox textarea{
	border:1px solid gray;
	padding:2px;
}

body#sub div#rightCol div#topInfoBox ul{
	margin-left:20px;
	padding-bottom:20px;
}

body#sub div#rightCol div#topInfoBox ul li a{
	z-index:1000;
}

body#sub div#rightCol div#topInfoBox p img, body#sub div#rightCol div#topInfoBox li img{
	padding:5px;
	margin-right:8px;
	margin-top:3px;
	border:1px solid #e2e2e2;
}

/***********************************************************************
	7 - FOOTER
************************************************************************/
div#footer{
	width:805px;
	float:left;
	margin-top:-120px;
	padding-left:10px;
	color:#FFFFFF;
	padding-bottom:50px;
}

div#leftAddress{/*appears at bottom of left col*/
	padding-left:20px;
}

div#footer ul{
	padding-left:20px;
	list-style: none;
	z-index:auto;
}

div#footer ul li{
	display:inline;
}

div#footer ul li a{
	color:#FFFFFF;
	text-decoration:none;
	font-size:75%;
	font-weight:bold;
}