html{
height:100%;	
}

body{
height:100%;
padding:0;
margin:0;
background:url(../images/background.jpg) repeat-y #dcd0b8 top center;
font-family:Arial, Helvetica, sans-serif;
_text-align:center;
}



@font-face {
    font-family: 'Tex';
    src: url('fonts/texgyreadventor-bold-webfont.eot');
    src: url('fonts/texgyreadventor-bold-webfont.eot?iefix') format('eot'),
         url('fonts/texgyreadventor-bold-webfont.woff') format('woff'),
         url('fonts/texgyreadventor-bold-webfont.ttf') format('truetype'),
         url('fonts/texgyreadventor-bold-webfont.svg#webfont5xaUGbMa') format('svg');
    font-weight: normal;
	font-weight: bold;
    font-style: normal;

}


.alpha {
behavior: url("/library/backend/iepngfix.htc");
}

#page{
margin:auto;
width:966px;
_text-align:left;
padding-top:20px;
}

#header{
height:252px;
background:url(../images/header-bg.png) no-repeat bottom center;
position:relative;
z-index:50;
font-family:Tex, Arial, Helvetica, sans-serif;
}

	#logo{
position:absolute;
top:3px;
left:72px;
border:0;
	}

	#porch-patio{
position:absolute;
font-family:Tex, Arial, Helvetica, sans-serif;
color:black;
text-align:center;
top:90px;
left:753px;
width:163px;
font-size:12px;
text-transform:uppercase;
	}
	

	#tagline{
	position:absolute;
	color:black;
	font-size:18px;
	left: 306px;
	top: 108px;
	}



#main-nav{
padding:0;
margin:0;
position:absolute;
top:212px;
font-size:13px;
text-transform:uppercase;
z-index:50;
right: 230px;
}

	#main-nav li{
	list-style-type:none;
	float:left;
	margin:0;
	padding:0 0 14px 0;
	background:url(../images/nav-hilight.png) repeat-x 0px 30px;
	_background:none;
	position:relative;
	}
	

	
		#main-nav a{
		color:white;
		text-decoration:none;
		display:block;
		padding:2px 10px;
		border-left:1px solid black;
		}

		#main-nav li:first-child a{
		border-left:none;
		}

	#main-nav li.active,
	#products:hover,
	#quality:hover{
	background:url(../images/active-nav.png) no-repeat center bottom;
	}
	

	#main-nav li.hide-active{
	background:none !important;
	}

.subnav{
display:block;
margin:0;
padding:0;
position:absolute;
top:37px;
left:-70px;
background:#E17122;
width:250px;
display:none;	
border-top:3px solid white;
padding:10px 0;

-webkit-box-shadow:0px 7px 15px #333;
-moz-box-shadow:0px 7px 15px #333;
box-shadow:0px 7px 15px #333;

}

.subnav *{
filter:inherit;	
}

#quality-menu{
width:280px;
}

#product-menu{
width:250px;
}

	#main-nav .subnav li{
	background:#E17122;
	text-align:left;
	padding:0;
	display:block;
	display:block;
	width:100%;
	
	}

	
		#main-nav .subnav a{
		color:black;
		border:0;
		display:block;
		padding:10px 100px 10px 10px;
		border-top:10px solid #E17122;
		border-bottom:10px solid #E17122;
		text-align:right;
		}
		
		#main-nav .subnav a:hover{
		background:#434D3E;	
		color:white!important;
		}
		
		.subnav span{
		display:block;	
		}

			.subnav .title{
			color:white;
			text-transform:uppercase;
			}
			
			.subnav .description{
			color:#000;
			text-transform:none;
			font-family:Arial, Helvetica, sans-serif;
			}
			
			.subnav a:hover .description{
			color:#C8CFC5;	
			}
			
			.subnav .icon{
			position:absolute;
			top:2px;
			right:14px;
			border:0;
			}



#secondary-nav .label{
position:absolute;
background:url(../images/tooltip.png) top center no-repeat;
padding:10px 4px 4px;
text-align:center;
text-decoration:none;
width:74px;
font-size:11px;
font-weight:bold;
left:-5px;
top:75px;
display:none;
}

.menu{
display:none;
background:white;
position:absolute;
padding:0;
margin-top:14px;
margin-left:0;
padding-bottom:8px;
padding-top:8px;
z-index:60;
}

#main-nav .menu a{
border:0;
padding:8px 16px;
color:black;
position:relative;
white-space:nowrap;
}

#main-nav .menu a:hover{
color:white;
_background-color:#E36F1E;
}

#main-nav .menu li{
display:block;
float:none;
padding:0;
zoom:1;
}

#main-nav .menu li:hover{
background-color:#E36F1E;	
}



#main-viewport{
background:url(../images/main-bg.gif) repeat-y #b3aa7e top center;
}

#main{
background:url(../images/topcap-bg-sidebar.gif) no-repeat top center;	
min-height:626px;
_height:626px;
position:relative;
border:3px solid black;
border-top:0;
}

#warranty{
position:absolute;
top:-22px;
left:-42px;
z-index:100;
}

#sidebar{
width:220px;
height:207px;
top:0;
left:0;
position:absolute;
}

#content{
position:absolute;
top:0px;
left:220px;
width:740px;	
}

#build-your-awning{
display:block;
color:#E17122;
text-transform:uppercase;
width:259px;
height:112px;
background:url(../images/build-your-awning.png) no-repeat;
position:absolute;
left:722px;
top:480px;
text-decoration:none;
z-index:100;
}

/*#build-your-awning:hover{
color:#54534A;
}*/

#build-your-awning span{
display:block;
margin-left:108px;	
width:145px;
text-align:center;
font-size:14px;
font-family:Tex, Arial, Helvetica, sans-serif;
cursor:pointer;
}

#build-your-awning .build{
font-size:16px;
margin-top:18px;
}

#build-your-awning .custom,
#build-your-awning .awning{
font-size:24px;
line-height:24px;
}


/*::::::Formatting::::::*/


h1{
font-family:Tex, Arial, Helvetica, sans-serif;
font-weight:normal;
margin:0;
text-transform:uppercase;
color:white;
font-size:2em;
*line-height:2em;
line-height:100%;
margin-bottom:0.25em;
}

h2{
font-family:Tex, Arial, Helvetica, sans-serif;
font-weight:normal;
margin:0;
font-size:1.1em;
color:white;
text-transform:uppercase;
margin-bottom:10px;
line-height:100%;
}

p{
margin-top:0;	
}

/*::::::Links::::::*/
a{
color:white;
text-decoration:none;	
}

.content-link{
background:#B3AA7E;
padding:3px 4px;
position:relative;
-moz-border-radius:4px;
-webkit-border-radius:4px;
border-radius:4px;
}



.button{
background:#E4701E; 
padding:6px 12px; 
color:white; 
border:0; 
font-family:Tex, Arial, Helvetica, sans-serif;
font-size:17px; 
cursor:pointer;	
}

.dialog{
background: url(../images/watermark.gif) no-repeat bottom left white;
border:3px solid #434D3E;
border-radius:10px;
-moz-border-radius:10px;
-webkit-border-radius:10px;
-moz-box-shadow: 0px 4px 8px #82784D;
-webkit-box-shadow: 0px 4px 8px #82784D;
box-shadow: 0px 4px 8px #82784D;
}


.dialog h2{
color:#F17225;
}

.dialog a{
color:#B3AA7E;
}

.shadow{
-moz-box-shadow: 0px 2px 10px #333;
-webkit-box-shadow: 0px 2px 10px #333;
box-shadow: 0px 2px 10px #333;
}

h1 .trademark{
font-size:12px;
height: 0;
line-height: 1;
vertical-align: baseline;
_vertical-align: bottom;
bottom:1em;
position: relative;
}