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

body {
	font-family: Arial, Helvetica, san serif;
	font-size:62.5%;
	line-height: 15px;
	font-style: normal;
	font-weight: normal;
	color: #000000;
	background:url(/images/bckgrd-img.jpg) repeat-x #ffffff;
	position: relative;
	margin: 0 auto;
	} 
	
/* ============================================ MAIN BODY CONTAINING ELEMENT ======================================*/

#wrap {width:940px; height:auto; margin: 0 auto; margin-top:31px; padding-top:20px;position: relative; background-color:#ffffff;font-size:1.1em;}

#header {width:900px; height:175px; margin: 0 auto;}

#logo {width:266px; height:175px; float: left;}

/*#banner {width:900px; height:175px;}*/

#banner-pic {width:900px; height:175px; background:url(/banners/bnr-home.jpg) no-repeat;}

/*#nav-contain {width:900px; height:40px; background-color:#e6e5d0; padding:7px 12px; margin:7px 0 7px 0;}*/

#nav {width:900px; height:32px; margin:0 auto;}

#content {width:900px; height:auto; margin: 0 auto; background-color:#f8f8f8;}

#left {float:left; width:597px; height:auto; padding:38px 0px 12px 50px; }

#text {width:570px; height:auto; border-right:#b1b1b1 1px solid; padding-right:20px;}

#text p {margin-bottom:14px;}

#text li {margin-left:18px;}

#testimonial {width:440px; height:auto; padding: 6px; background-color:#a7c7e2; margin-top:12px;}

#right {float:right; width:248px; height:auto; padding:50px 0px 0px 0; text-align:center;}

#right p {margin-bottom:14px;}
	
.clearer{clear:both; margin:0px;}

#footer {width:876px; height:27px; clear:both; margin:0 auto; color:#fff; background-color:#649ccc; text-align:right; border-top: 11px solid #fff; padding:7px 12px;}

#additional-photos {display:none;}


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

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

a:hover, a:active {color: #0ba163; text-decoration: none;}


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

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


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

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

#services #banner-pic {background:url(/banners/NAME.jpg) no-repeat;}*/

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

h1 { font-family:"Times New Roman", Times, serif; font-size: 2.2em; color: #2f568c; font-style: normal; font-weight:400; margin-bottom: 15px; line-height:25px;}

h2  {font-family:"Trebuchet MS", Arial, san serif; color: #2f568c; font-size: 1.3em; margin-bottom: .75em;}

h3, h4, h5 {font-size: 1.2empx; font-style: normal; font-weight: bold; color: #000000; margin-bottom:1em;}

.basic-bold {font-weight: bold; color:#401908;}

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

.red {color: #FF0000;}

.photo-border {border: solid 5px #e0e0e0}

.img-border {border: solid 5px #e0e0e0;}

.img-caption {color:#999999; font-style:italic;}

.td-right {float:right; margin: 0 0 3px 10px;}

.img-left {border: solid 5px #e0e0e0; margin: 0 10px 3px 0; float:left;}

.img-right {border: solid 5px #e0e0e0; margin: 0 0 3px 10px; float:right;}

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

#typein { }

#typein input, #typein textarea, #typein select{width:300px; color:#000000; background-color:#CCCCCC; padding: 2px; border: solid 1px #666666;}

#typein #button {width:100px;}

#typein textarea {height:210px;}


/* ----------- CSS Navigation ---------------- */
ul#nav {float:left;width:900px;height:32px;background-color:#fff; list-style:none; /*padding-left:22px;*/}
ul#nav li{list-style:none;}

#nav a#nav_home {width:129px;height:32px;background:url(/images/nav/home.jpg) no-repeat;display:block;text-indent:-999em;}
#nav a#nav_metal {width:180px;height:32px;background:url(/images/nav/metal.jpg) no-repeat;display:block;text-indent:-999em;}
#nav a#nav_tile {width:162px;height:32px;background:url(/images/nav/tile.jpg) no-repeat;display:block;text-indent:-999em;}
#nav a#nav_shingle {width:196px;height:32px;background:url(/images/nav/shingle.jpg) no-repeat;display:block;text-indent:-999em;}
#nav a#nav_request {width:233px;height:32px;background:url(/images/nav/request.jpg) no-repeat;display:block;text-indent:-999em;}


#nav a:hover#nav_home,  #nav a:hover#nav_metal, #nav a:hover#nav_tile, #nav a:hover#nav_shingle, #nav a:hover#nav_request {background-position:0px -32px;}
#inde a#nav_home,  #meta a#nav_metal, #tile a#nav_tile, #shin a#nav_shingle, #requ a#nav_request{background-position:0px -32px;}
#nav li {float:left;width:auto;}

/* DROP DOWN MENU controls */
#nav li ul {margin:0; padding:0;position:absolute;width:170px;left:-999em;height:auto;background:#fcfaed; color:#716f5a;z-index:999;margin-left:20px;}
#nav li ul li {margin:0; padding:0;display:inline;}

#nav li ul li a {float:left;clear:left;color:#000/*fcfaed*/;text-decoration:none;font-size:11px; display:block;padding:3px;width:164px;}
#nav li ul li a:hover {text-decoration:none; background-color:#716f5a; color:#fcfaed;}

#nav li:hover ul, #nav li.sfhover ul {left: auto;}
#nav li:hover, #nav li.sfhover {position: static;}