/* ---------------- The Cool Roofing Company Main CSS Document ---------------- */
/* ---------- Copyright The Cool Roofing Company LLC All Rights Reserved ---------- */
/* ------------------------------------------------------------------- */

/*#####################################################################*/
/*## GLOBAL CSS CLASSES
/*#####################################################################*/
body
{
   background-image: url('background.jpg');
   padding: 0px;
   margin: 0px;
   border: 0px;
}

/*#####################################################################*/
/*## LAYOUT CSS CLASSES
/*#####################################################################*/
#bg{ width:100%; padding:0;margin:0}
.container
{
   width: 935px;
}

.header_unit
{
   width: 935px;
   height: 348px;
   float: left;
}

.header_unit_b
{
   width: 935px;
   height: 255px;
   float: left;
}

.white_divider
{
   background-color: #ffffff;
   height: 3px;
   width: 935px;
   float: left;
}

.content_area
{
   background-image: url('contentgradient.gif');
   background-repeat: repeat-x;   background-color: #535762;

   width: 935px;
   float: left;
}

.content_area_b
{
   background-image: url('contentgradient.gif');
   background-color: #535762;
   background-repeat: repeat-x;
   width: 935px;
   float: left;
}

.home-left
{
   width: 180px;
   float: left;
   text-align: right;
   padding-top: 22px;
   padding-right: 21px;
}

.home-center
{
   width: 270px;
   float: left;
   padding-top: 32px;
}

.home-right
{
   width: 314px;
   text-align: left;
   padding-left: 9px;
   padding-right:0px;
}
.home-right p
{color:#333333;}
#footer
{
   width: 897px;
   margin-left: 19px;
   margin-right: 19px;
   margin-bottom: 5px;
   background-color: #e2e9ee;
   border: 2px solid #9db0bc;
   float: left;
   margin-top: 15px;
   text-align: center;
   padding-bottom: 5px;
   padding-top: 2px;
   
}
#footer2
{
   width: 897px;

   background-color: #e2e9ee;
   border: 2px solid #9db0bc;
  margin:0 auto;padding:5px 0;
    
   text-align: center;
  
   
}

.content_left
{
	width: 196px;
	float: left;
	margin-left: 12px;
}

.content_body
{
	width: 695px;
	float: right;
	margin-right: 10px;
	text-align: left;
	border: 1px solid #9db0bc;
	background-color: #fff;
	padding: 3px;
}
.content_body_home
{
	width: 695px;
	float: right;
	margin-right: 10px;
	margin-top:20px;
margin-bottom:10px;
	text-align: left;
	border: 1px solid #9db0bc;
	background-color: #fff;
	padding: 3px;
}
.content_border{

	border: 1px solid #CCCCCC;
	
	padding: 12px;}

.submenu
{
	width: 196px;
	/*height: 183px;*/
	background-image: url('subnav-bg.jpg');
	background-repeat: repeat-x;
	background-color: #000000;
	border: 1px solid #000000;
}


/*#####################################################################*/
/*## TEXT CSS CLASSES
/*#####################################################################*/
h1
{
   font-family: Arial, Helvetica, sans-serif;
   font-size: 16px;
   color: #333333;
   margin: 0px;
   padding-top: 0px;
   padding-left: 0px;
   padding-right: 0px;
   padding-bottom: 8px;
}

h2
{
   font-family: Arial, Helvetica, sans-serif;
   font-size: 16px;
   color: #125687;
   margin: 0px;
   padding-top: 0px;
   padding-left: 0px;
   padding-right: 0px;
   padding-bottom: 8px;
}

h3
{
   font-family: Arial, Helvetica, sans-serif;
   font-size: 14px;
   color: #125687;
   margin: 0px;
   padding-top: 0px;
   padding-left: 0px;
   padding-right: 0px;
   padding-bottom: 8px;
}


.para2
{
	margin-top: 0px;
    padding-top: 0px;
	 font:normal 12px/16px Tahoma;
	color: #494949;
}

p
{
   margin-top: 0px;
   padding-top: 0px;
   font-family: tahoma, Arial, sana-serif;
   font-size: 11px;
   color: #d1d1d1;
}

#footer p
{
   font-family: Arial, Helvetica, sans-serif;
   font-size: 12px;
   color: #006699;
   margin-top: 5px;
   margin-bottom: 0px;
   padding: 0px;
}

#footer p a
{
 	color: #006699; text-decoration:none; margin:0 5px;
	
}

#footer p a:hover
{
   color: #0384c5;
}

#footer2 p
{
   font-family: Arial, Helvetica, sans-serif;
   font-size: 12px;
   color: #006699;
   margin-top: 5px;
   margin-bottom: 0px;
   padding: 0px;
}

#footer2 p a
{
 	color: #006699;
	
}

#footer2 p a:hover
{
   color: #0384c5;
}

/*#####################################################################*/
/*## LINK CSS CLASSES
/*#####################################################################*/


/*#####################################################################*/
/*## SWF OBJECT CLASSES (for alternate flash content)
/*#####################################################################*/
#leftNav {
	background-color: #131313;
	background-repeat: repeat-x;
	line-height: 20px;
	background-image: url(../styles/subnav-bg.jpg);
	padding-top: 10px;
	padding-right: 10px;
	padding-bottom: 3px;
	padding-left: 10px;
}

#leftNav2 {
	background-repeat: repeat-x;
	line-height: 20px;
	padding-top: 0px;
	padding-right: 10px;
	padding-bottom: 3px;
	padding-left:0px;
}

#leftNav2  a:link{
	color: #fff;
	font-weight: bold;
	text-decoration: none;
	vertical-align: middle;font-size:0.750em;
	font-family: Arial, Helvetica, sans-serif;
	}
	
	#leftNav2  a:visited {
	color: #fff;
	font-weight: bold;
	text-decoration: none;font-size:0.750em;
	font-family: Arial, Helvetica, sans-serif;
	}
	
	#leftNav2  a:hover {
	color: #fff;
	font-weight: bold;
	text-decoration: underline;font-size:0.750em;
	font-family: Arial, Helvetica, sans-serif;
	}
	
	#leftNav2  a:active {
	color: #fff;
	font-weight: bold;
	text-decoration: none;font-size:0.750em;
	font-family: Arial, Helvetica, sans-serif;
	}
	
.leftNavDiv {
	display: block;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 8px;
	margin-left: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 4px;background-color:#ec8a00;
	}
	
	.leftNavDiv2 {
	display: block;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 2px;
	margin-left: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 4px;background-color:#ec8a00;
	}
#leftNav  a:link{
	color: #fff;
	font-weight: bold;
	text-decoration: none;
	vertical-align: middle;font-size:0.750em;
	font-family: Arial, Helvetica, sans-serif;
	}
	
	#leftNav  a:visited {
	color: #fff;
	font-weight: bold;
	text-decoration: none;font-size:0.750em;
	font-family: Arial, Helvetica, sans-serif;
	}
	
	#leftNav  a:hover {
	color: #fff;
	font-weight: bold;
	text-decoration: underline;font-size:0.750em;
	font-family: Arial, Helvetica, sans-serif;
	}
	
	#leftNav  a:active {
	color: #fff;
	font-weight: bold;
	text-decoration: none;font-size:0.750em;
	font-family: Arial, Helvetica, sans-serif;
	}
	
	.grad_box {
	background-color: #FFFFFF;
	 border: 1px solid #cccccc;
	background-image: url(../images/grad_bar.jpg);
	background-repeat: repeat-x;
	padding-top: 4px;
	padding-right: 6px;
	padding-bottom: 4px;
	padding-left: 6px;
}
.copyright {
	color: #333333;
	font-size: 11px; font-family: Arial, Helvetica, sans-serif; padding-top:5px;
	}
a.link1{color:#15588c; text-decoration:underline; font:bold 12px/14px Arial, Helvetica, sans-serif}
a.link2{color:#125687; text-decoration:underline; font:normal 12px/14px Arial, Helvetica, sans-serif}
.col_left{ padding:10px; width:150px;  float:left; margin:0 10px 10px 0}
.col_left_img{border: 1px solid #CCCCCC; padding:10px}


/*###################commercial######################################*/

.leftNavDiv_com {
	display: block;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 8px;
	margin-left: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 4px;background-color:#276db3;
	}
	
	.leftNavDiv_com2 {
	display: block;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 2px;
	margin-left: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 4px;background-color:#276db3;
	}

	
	/*##################industrial######################################*/

.leftNavDiv_ind {
	display: block;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 8px;
	margin-left: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 4px;background-color:#bab075;
	}
	.leftNavDiv_ind2 {
	display: block;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 2px;
	margin-left: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 4px;background-color:#bab075;
	}
/*##################green######################################*/

.leftNavDiv_green {
	display: block;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 8px;
	margin-left: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 4px;background-color:#849811;
	}
	
	.leftNavDiv_green2 {
	display: block;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 2px;
	margin-left: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 4px;background-color:#849811;
	}

/*##################products######################################*/

.leftNavDiv_prod {
	display: block;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 8px;
	margin-left: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 4px;background-color:#4c1e69;
	}
	
	.leftNavDiv_prod2 {
	display: block;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 2px;
	margin-left: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 4px;background-color:#4c1e69;
	}

	
	/*#################contact######################################*/

.leftNavDiv_ctc {
	display: block;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 8px;
	margin-left: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 4px;background-color:#555555;
	}
	.leftNavDiv_ctc2 {
	display: block;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 2px;
	margin-left: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 4px;background-color:#555555;
	}

.forms input {border:1px solid #cccccc}
.send_but{background:url(../images/send.jpg) no-repeat; width:132px; height:30px;}


#footer_new{
	width:935px;
	height:100px; float:left;
	background-color:#000000;
}
#footer_new ul.left{
	float:left;
	padding:0 8px 0 0;
}
#footer_new ul.left li{
	float:left;
	font:normal 11px/11px Arial, Helvetica, sans-serif;
	color:#fff;
	display:block;
}
#footer_new ul.left li a{
	color:#fff;
	text-decoration:none;
	float:left;
	margin:0 7px;
}
#footer_new ul.left li a:hover{
	color:#E9E617;
}



#footer_new ul.right{
	float:right;
	padding:0 8px 0 0;
}
#footer_new ul.right li{
	float:left;
	font:normal 11px/11px Arial, Helvetica, sans-serif;
	color:#fff;
	display:block;
}
#footer_new ul.right li a{
	color:#fff;
	text-decoration:none;
	float:left;
	margin:0 7px;
}
#footer_new ul.right li a:hover{
	color:#E9E617;
}

 
 #footer_new p.design2{
	float:right;
	width:90px;
	font:bold 11px/11px Arial, Helvetica, sans-serif;
	color:#fff;
}
#footer_new p.design2 a{
	font:bold 11px/11px Arial, Helvetica, sans-serif;
	color:#fff;
	text-decoration:none;
	
}
#footer_new p.design2 a:hover{
	color:#fff;
}


 
 
#footer_new p.design{
	float:left;text-align:left;margin-left:8px;
	width:450px;
	font:normal 10px/11px Arial, Helvetica, sans-serif;
	color:#fff;
}
#footer_new p.design a{
	font:normal 10px/11px Arial, Helvetica, sans-serif;
	color:#fff;
	text-decoration:none;
	
}
#footer_new p.design a:hover{
	color:#fff;
}