/* -- NOTE: reset.css clears all browser differences and starts from scratch --  */
@import 'reset.css';

body {
	font-family: "Lucida Grande", Arial, Helvetica, san serif; 
	font-size:12px; line-height: 16px; font-style: normal; font-weight: normal; color: #6c88a4;
	background-color:#6c88a4;
	/*position:relative;*/
	margin: 0 auto; padding:0;
	} 
	
/* ==========================MAIN BODY CONTAINING ELEMENT ========================*/

#top {width:100%; height:110px; background-color:#ffffff; margin: 0 auto;}

#top-contain {width:990px; height:110px; position: relative; margin: 0 auto; padding:0;}

#logo{width:404px; height:110px; float:left;}

#middle {width:100%; height:auto; background:url(images/banner-tile.jpg) #ffffff repeat-x top center; padding:0; margin: 0 auto; /*overflow:auto;*/}

#middle-contain{width:990px; height:auto; margin: 0 auto;}

#mid-banner{width:990px; height:273px;}

#nav {width:955px; height:54px; background:url(images/nav-bckgrd.jpg) no-repeat; align: top; padding-left: 35px;}

#left {width:565px; height:auto; float:left; padding: 20px 20px 30px 40px; float:left; display: inline;}

#left p{padding-bottom:4px;}

#left li {padding-bottom:9px; list-style-type:disc; margin-left: 20px;}

#right {width:300px; height:auto; float:right; padding:20px 0 25px 0; color:#686868; display:inline;}

#right td img {border: solid 5px #c1c7cd; margin-bottom:5px;}

#footer {width:100%; height:auto /*100px w padding*/; color: #ffffff; border-top: 10px solid #91a6bb; padding: 0; margin: 0 auto; clear:both;}

#footer-contain {width: 910px; height:auto; padding: 50px 10px 30px 70px; margin: 0 auto; background:url(images/footer-logo.jpg) no-repeat;margin-top:10px;}

.clearer{clear:both; margin:0px; padding:0;}

/*======================================================== Banner Reference ======================================================== */

#home #mid-banner {background:url(banners/home-bnr.jpg) no-repeat;}

#residential #mid-banner {background:url(banners/residential-bnr.jpg) no-repeat;}

#resoakbrook #mid-banner {background:url(banners/oakbrook-bnr.jpg) no-repeat;}

#residential2 #mid-banner {background:url(banners/residential2-bnr.jpg) no-repeat;}

#commercial #mid-banner {background:url(banners/commercial-bnr.jpg) no-repeat;}

#contact-us #mid-banner {background:url(banners/place-holder.jpg) no-repeat;}



#container {width:907px; height:auto; position: relative; margin: 0 auto; padding:0; background-color:#ffffff; clear:both;}




/*======================================================== LINK STYLES ======================================================== */

/* ------------- Basic links  ------------- */
a:link, a:visited {color: #54697f; text-decoration: underline; }

a:active, a:hover {color:#ff6600; text-decoration: underline;}





/* ------------- Footer  ------------- */
#footer a:link, #footer a:visited {color: #ffffff; text-decoration: none;}

#footer a:hover, #footer a:active {color: #cccccc; text-decoration: underline;}


/*======================================================== TEXT STYLES/ CLASSES ======================================================== */

h1 {font-family:"Lucida Grande"; font-size: 24px; font-weight:200; font-style: normal; color: #54697f; margin-bottom: 18px; line-height:24px;}

h2, h3 , h4, h5 {font-size: 14px; font-family: "Lucida Grande", Arial, san-serif; font-style: normal; font-weight: bold; color:#666666;margin-bottom:7px;}

.basic-bold {font-weight: bold;}

.basic-italic {font-style:italic;}

.red {color: #FF0000;}

.lightblue {color:#91a6bb;}

.darkblue {color:#6c88a4;}

.mission {font-weight:bold; color:#563316;}

#left iframe {border: solid 1px #666666;}

#map-contain {width: 355px; height:360px; margin-right:10px;float:left; clear:left;}

/*======================================================== FORM STYLES ======================================================== */

#typein { }

#typein input, #typein textarea, #typein select {color: #563316; background-color: #e0c082;  padding: 2px; border: solid 1px #c37535;}


/*================== DROP DOWN MENU =========================== */

#dropmenudiv{ position:absolute; background-color: #000000; border:none; border-bottom-width: 0; line-height:18px; z-index:100;}
 
#dropmenudiv a{ width: 100%; display: block; text-indent: 4px; border-bottom: none; padding: 2px 0; color:#FFFFFF; text-decoration: none;}
 
#dropmenudiv a:hover{ /*hover background color*/background-color: #666666; color:#FFFFFF;}






/*====== BASIC STYLING CSS DROPDOWNS======*/

/* #navi, #navi ul {padding:0; margin: 0; list-style: none;font-size:14px; color:#6c88a4; font-weight:400;}

#navi {padding: 10px 0 0 40px;}

#navi a {display: block; width: 10em; font-size:14px; color:#6c88a4; font-weight:400; text-decoration:none; padding-bottom:5px;}

#navi li ul {border:1px solid #cccccc;}

#navi li ul a {padding-bottom:8px; padding-left:4px; background-color:#ffffff; border-bottom:1px solid #cccccc;}

#nav li ul li {width: auto; clear:left;}

#navi li {float: left; width: 9em;}


/*====== Put Dropdown List out of view, Left Auto brings it back!!!! 
#navi li ul {position: absolute; width: 10em; left: -999em;}

#navi li:hover ul {left: auto;}


 Suckerfish pumping out new classes? WHAT? 
#navi li:hover ul, #navi li.sfhover ul {left: auto;}

 MY Link Styling 
#nav a:link, #nav a:visited {text-decoration: none;}

#nav a:hover, #nav a:active {color: #333333; text-decoration: none;} 

 MY STYLING Navigation  
/*#nav a {font-size:14px; color:#6c88a4; font-weight:400;}

#nav ul {display:block;}

#nav li {display:inline; margin-right:30px;}

#nav a:link, #nav a:visited {text-decoration: none;}

#nav a:hover, #nav a:active {color: #333333; text-decoration: none;}*/