@charset "UTF-8";

/*CSS Structure
 * Author: Charles Ryder
 * Company: Hanson Inc.
 * Project: Benchmark Doors
 * 
 * Sections:
 * Resets - Makes all broswers consistent
 * Core CSS/Strucural - Containers for different content
 * Text styling - Link, Text, paragraph styling, list styling
 * Page Specific
 * 	- Home Page Specific
 *  - Product Detail Specific
 *  - Patio Specific
 */


/* Resets */
	h1,h2,h3,h4,h5,h6,p,body,ul,ol,li{
		margin: 0;
		padding: 0;
	}
	a img { border: 0 }



/* Core CSS/Structural
 * ----------------------*/
	body{
		font: 400 10pt/1.2em Helvetica, Arial, sans-serif;
		color: #666666;

	}
	#container {
		margin: 0 auto;
		width: 960px;
		position: relative;
	}
	#content{
		border: 6px solid #0A1984;
		padding: 10px 5px 50px 5px;
		overflow: hidden;
	}
	#sub-full{
		padding: 20px 50px 0 50px;
		clear: both;
		overflow: hidden;
	}
	/*Narrow Column*/
	#sub-content{
		padding: 20px 0 0 50px;
		width: 460px;
	}
	#float-col{
		float: right;
		margin-top: 70px;
		margin-right: 50px;
		width: 350px;
		display: inline;
	}
	
	/* Styling for the footer content */
	#site-info{
		font: 400 .9em/27px Helvetica, Arial, sans-serif;
		color: #666666;
		padding: 10px 0 10px 18px;
		height: 32px;
	}
	#site-info .divider{
		border-left: 1px solid #CEC7BB;
		margin: 0 20px;
		padding: 10px 0;
		display: inline;
		height: 32px;
	}
	

/* Branding Styles (logo, navigation, minor navigation)

 1. h1 - Logo
 2. #nav - Main Navigation
    	#nav ul ul - Sub Navigation
 3. minor_nav ul - Minor Navigation
-----------------------------------------*/
#branding{
	height: 78px;
	position: relative;
}
	#branding h1{
		width: 245px;
		height: 53px;
		position: absolute;
		top: 19px;
	}
	#branding h1 a{
		display:block;
		width: 245px;
		height: 53px;
	}
	/*Main Nav*/
	#nav ul{
		position: absolute;
		bottom: 0;
		right: 0;
		background-color: #000;
	}
	#nav li{
		list-style: none;
		display: inline;
		margin: 0;
		float: left;
		color: #fff;
	}
	#nav li a{
		text-decoration: none;
		color: #fff;
		padding: 8px 16px;
		font: 400 1.2em/32px Helvetica, Arial, sans-serif;
	}
	#nav li a:hover{
		background-color: #0A1984;
	}
	#nav .selected a{
		color: #565656;
	}
	#nav ul .selected{
		display: block;
	}
	#nav ul li.selected {
		background: #0A1984;
	}
	#nav ul li.selected a{
		color: #ffffff;
	}
		/*Main Sub Nav*/
		#nav ul ul{
			position: absolute;
			bottom: -32px;
			left: 10px;
			background: none;
			color: #666666;
			font-weight: bold;
			display: none;
		}
			/* Shift for Patio Sub Nav */
			#nav ul #patio{
				left: 156px;
			}
		#nav ul ul.selected li{
			background: #ffffff;
		}
		#nav ul ul.selected a{
			border: 0 !important;
			text-transform: none !important;
			color: #0A1984;
		}
		#nav ul ul a{
			text-decoration: none;
			font: 900 .85em/18px Helvetica, Arial, sans-serif;
		}
		#nav ul ul a:hover{
			text-decoration: underline;
			border: 0;
		}
		#nav ul ul li.selected a{
			text-decoration: underline;
		}
		#nav ul ul li{
			padding: 3px 5px;
			margin: 0;
			border-right: 1px solid #999999;
		}
		#nav ul ul .last{ border-right: 0; }
	/*Sub Nav*/
	#minor_nav ul{
		font-size: .8em;
		position: absolute;
		top: 0;
		right: 0;
		background: none;
		padding-top: 5px;
	}
	#minor_nav ul li{
		list-style: none;
		float: left;
		padding: 0 8px;
		border-right: 1px solid #666666;
	}
	#minor_nav li a{
		text-decoration: none;
	}
	#minor_nav li.selected a{
		text-decoration: none;
		font-weight: bold;
	}
	#minor_nav li a:hover{
		text-decoration: underline;
	}
	#minor_nav ul li#contact {
		border-right: 0;
	}
	
	
/* Text Styling (Headings, fonts, text, paragraphs, etc.)
----------------------------*/
	a{ 
		color: #005599; 
		}
	strong{ color:#005599; }
	a:hover{ text-decoration: none;}
	#branding a, #site-info a{ color: #666666;}
	h2{
		text-align: center;
		padding: 0 0 1em 0;
		font: 400 1.8em/1em Helvetica, Arial, sans-serif;
	}
	h3{
		padding-bottom: 1em;
		color: #005599;
		font: 400 1.8em/1em Helvetica, Arial, sans-serif;
	}
	h4{
		color: #005599;
		padding: 1.4em 0 1em 0;
		margin: 0;
		font-weight: normal;
		font-size: 1.3em;
	}
	h5{
		font-size: 1.1em;
		color: #005599;
		font-weight: normal;
	}
	p{
		padding-bottom: 1em;
		overflow: hidden;
	}
	div.hr{ border-bottom: 1px solid #B7AC9C; margin: 10px 0; }
	hr{ display: none;}
	.highlight{
		border: 1px solid #005599 !important;	
	}
	.error{
		color: #66CC00 !important;
		font-weight: bold;
		font-size: .9em;
		font-style: italic;
	}
	ol { padding-left: 0px;}
	ol li{ margin-left: 25px; padding-bottom:10px;}
	ol li strong{
		color: #005599;
	}
	.fine-print{
		font-size: .8em;
	}
	.pad-right{
		padding-right: 5px;
	}
	#pdf { padding-left: 25px; margin-bottom: 10px; }
	#pdf li { 
		list-style: square;
		padding: 6px 0 4px 0;
		margin-left: 14px;
	}
	.pdf { list-style: none; padding-left: 0px; margin-bottom: 10px; }
	.pdf li { 
		background: url(/i/pdf_icon.jpg) left center no-repeat;
		padding: 8px 0px 8px 30px; 
		list-style: none;
		margin: 0px;
	}
	.pretty-link{
		text-decoration: none;
		font: 400 1em/18px Helvetica, Arial, sans-serif;
		color: #005599;
	}
	.pretty-link:hover{
		color: #666666;
	}
	/* Float holder */
	.float-holder{ 
		overflow:hidden;
		margin: 20px 0;
	}
	.float-holder div{ 
		float:left; 
		padding: 8px 12px;
	}
	.build-entry{ 
		padding: 10px 20px 10px;
		background: #eee;
		margin: 20px auto;
		width: 798px;
	}
		.build-entry h3{ font-weight: bold; padding: 0 0 4px 0; border-bottom: 2px solid #BBB3A6;margin: 10px 0 0; font-size: 1.3em }
		.build-entry .steps{ 
			overflow:hidden;
			color: #005599; 
			border-left: 0;
			border-right:0;
			font-size: 1.1em;
			position: relative;
		}
		.build-entry .steps div{ 
			float:left; 
			padding: 28px 12px 8px 12px;
			text-align: center;
		}
		.build-entry .steps div.selected{ 
			background: url(/i/down-arrow.gif) no-repeat center top;
			font-weight: bold;
		}
		.build-entry .steps img {
			vertical-align: middle;
		}
		.build-entry .steps a{
			text-decoration: none;
		}
		.build-entry .steps a:hover{
			text-decoration: underline;
		}
	
	/* Clearfix */
	
	.clearfix:after {
		visibility: hidden;
		display: block;
		font-size: 0;
		content: " ";
		clear: both;
		height: 0;
	}
	.clearfix { display: inline-block; }
	
	/* start commented backslash hack \*/
	* html .clearfix { height: 1%; }
	.clearfix { display: block; }
	/* stop commented backslash hack */
	
	
/* Form Styling
 * --------------------
 */
	input{ width: 170px; margin: 5px; vertical-align: middle; }
	select{ width: 174px; margin: 5px; vertical-align: middle; }
	textarea { vertical-align:top; }
	.submit { width:100px; }

/* Page Specific Sections
 * --------------------------
 *  - Homepage specific
 *  - Product detail specific
 *  - Patio page specific
 */

	/* Homepage Specific */
	#glass-container{
		width: 902px;
		padding: 10px 18px;
		position: relative;
	}
	#glass-container #logoPrev {
		background-image:url(../i/left-nav-arrow.gif);
		width:18px;
		height: 92px;
		top:20px;
		position:absolute;
		left:0px;
		z-index:20;
	}
	#glass-container #logoNext {
		background-image:url(../i/right-nav-arrow.gif);
		width:18px;
		height: 92px;
		position: absolute;
		right:0px;
		top:20px;
		z-index:20;
	}


	/* Product Detail Page styling */
	#product-detail{
		position: relative;
		width: 939px;
	}
		#product-detail p{ padding:  1em 0 0 1em; color: #005599 }
		#product-detail h2{
			font:  900 1.1em/1.8em Helvetica,Arial,sans-serif;
			text-align: left;
			margin: 20px 0 5px;
			padding: 0 5px 0 12px;
			border-top: 3px solid #B7AC9C;
			background-color: #E8E5DF;
			color: #004990;
			clear: both;
		}
		#product-detail .light{
			font-size: .8em;
			color: #918673;
			font-weight: normal;
		}
		#product-detail .option{
			float:left;
			color: #000000;
			font-size: .85em;
			padding: 5px;
			margin: 5px 3px 0px 3px;
			text-align: center;
			line-height: 1em;	
			border: 1px solid #ffffff;
		}
		#product-detail #doors .option {
			height: 165px;
		}
		#product-detail .option:hover{
			border: 1px solid #B7AC9C;
		}
			#product-detail .layout .option { height: 120px; }
			#product-detail #stains, #product-detail #paint { padding-top: 10px; }
			#product-detail .option img{
				padding-bottom: 10px;
			}

		#product-detail .aligner { padding: 0 0 19px 0 !important;}
		#product-detail .set{
			overflow: hidden;
			position: relative;
		}
		#product-detail .set div{
			bottom: 0;
		}
		#print-info{
			display: none;
		}
		.hotlink{ float: right; font-size: .8em; line-height: 1em; font-weight: normal; padding: 5px 0 }
		.hotlink a{ color: #333333; cursor: pointer;}

		/* Product Detail Table Formatting */
		#product-detail table{
			font: 400 .9em/1em Helvetica,Arial,sans-serif;
			color: #000000;
			text-align: center;
			margin: 0 auto;
		}
			#product-detail td,#product-detail th{
				padding: 8px;
			}
			#product-detail tr{
				background-color:#E6DED5;
			}
			#product-detail .alt{
				background-color: #F1EFE7;
			}
			#product-detail .first{
				background-color: #D6CEC5;
			}
			#product-detail th{
				font-weight: normal;
				color: #005599;
				background-color: #F1EFE7;
				border-bottom: 2px solid #B7AC9C;
			}
	
	.coverimgtype{ position: absolute; top: 100px; left: 220px; width: 250px; height: 90px; background: #fff}
	
	.detailnote{ background-color:#E6DED5; margin: 1em; padding: 15px; float:right; width: 250px }
	
	#product-detail .tabs ul { padding: 1em 0 0 1em; }
	#product-detail .tabs ul li { display: inline; }
	#product-detail .tabs ul li a.selected { font-weight: bold; text-decoration: none; }
	
	#product-detail a.lightbox { display: block; background: transparent url(/i/btn_zoom.gif) no-repeat 50% 0; text-indent: -100em; overflow: hidden; width: 74px; height: 15px; text-align: center; }
	#product-detail a.lightbox:hover { background-position: 50% -15px; }
	#product-detail a.zoom { margin-top: 11px; }
	#product-detail a.transom { margin: 0 9px 10px 9px; }
	
	#product-detail table.swatches { float: left; text-align: left; font-size: .84em; padding: 1em; }
	#product-detail table.swatches th {	font-weight: normal; color: #005599; background-color: transparent; border: 0; font-size: 1.1em; }
	#product-detail table.swatches td { padding: 2px 8px 4px; width: 100px; text-align: center;  }
	#product-detail table.swatches img { margin-bottom: 3px; }

	.print2{ cursor: pointer; }

	/*Specific to Patio Page */
	.patio-design{
			float:left;
			overflow: hidden;
			text-align: left;
			padding:0 45px 10px 0;
			width:370px;
		}
		.patio-design #door {
			float:left;
			padding-bottom:10px;
			width:170px;
			text-align: center;
		}
		.patio-design h5{ clear: both; padding-bottom: 10px;padding-top: 20px; text-align:left; }
		.patio-design h4{ text-align:left; border-bottom: 2px solid #B7AC9C; padding: 0; margin-bottom: 15px }
	
	/*Specific to Glass Design Page */
	.glass-design{
		float:left;
		width:390px;
		padding:10px;
		overflow: hidden;
		text-align: center;
	}
		.glass-design #door{ float: left; text-align: center; width: 195px; padding-bottom: 10px;}
		.glass-design #door em{ font-size: .8em; font-style: normal;}
		.glass-design h4{ border-bottom: 2px solid #B7AC9C; padding: 0; margin-bottom: 15px}
		.glass-design h5{ clear: both; padding-bottom: 10px;padding-top: 10px;}
	
	#pageheader { position: relative; }
	.clearobscure { font-size: .84em; }
	#pageheader p{ padding: 0; }
	#pageheader p.privacy{ padding: 0 14px 3px 0; background:#ffffff; top: 173px; left: 239px; position: absolute; }