
/* FONTS */
/* ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */

	/* BLUE 24PX */
	/* =========================================================================== */
		
		h1 		{ font: bold 24px georgia, garamond, serif; color: #1763aa; margin: 0; padding: 0; }
		h1 a		{ text-decoration: underline; color: #1763aa; }
		h1 a:hover 	{ text-decoration: none; }

	/* ORANGE 18PX */
	/* =========================================================================== */
		
		h2 		{ font: bold 18px georgia, garamond, serif; color: #cc6600; margin: 0; padding: 0; }
		h2 a		{ text-decoration: underline; color: #cc6600; }
		h2 a:hover 	{ text-decoration: none; }

	/* BLUE 18PX */
	/* =========================================================================== */
		
		h3 		{ font: bold 18px georgia, garamond, serif; color: #1763aa; margin: 0; padding: 0; }
		h3 a		{ text-decoration: underline; color: #1763aa; }
		h3 a:hover	{ text-decoration: none; }

	/* ORANGE 14PX */
	/* =========================================================================== */
		
		h4 		{ font: bold 14px georgia, garamond, serif; color: #cc6600; margin: 0; padding: 0; }
		h4 a		{ text-decoration: underline; color: #cc6600; }
		h4 a:hover	{ text-decoration: none; }

	/* BLUE 12PX */
	/* =========================================================================== */
		
		h5 		{ font: bold 12px georgia, garamond, serif; color: #1763aa; margin: 0; padding: 0; }
		h5 a		{ text-decoration: underline; color: #1763aa; }
		h5 a:hover	{ text-decoration: none; }

	/* BROWN 11PX */
	/* =========================================================================== */
		
		h6 		{ font: bold 11px georgia, garamond, serif; color: #663300; margin: 0; padding: 0; }
		h6 a		{ text-decoration: underline; color: #663300; }
		h6 a:hover	{ text-decoration: none; }


	/* PARAGRAPH */
	/* =========================================================================== */
		
		p 		{ font: normal 11px georgia, garamond, serif; color: #666; margin: 0; padding: 0; }
		p a		{ text-decoration: underline; color: #666; }
		p a:hover 	{ text-decoration: none; }


/* BODY BACKGROUNDS */
/* ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */
	
	html,body 		{ margin: 0; padding: 0; height: 100%; text-align:center; }

	body#blank 		{ background: url(../graphix/backgrounds/bgBlank.gif) repeat-y center #cccc99; }
	body#home 		{ background: url(../graphix/backgrounds/bgHome.gif) repeat-y center #cccc99; }
	body#columns 	{ background: url(../graphix/backgrounds/bgColumns.gif) repeat-y center #cccc99; }
	body#sub	 	{ background: url(../graphix/backgrounds/bgSub.gif) repeat-y center #cccc99; }
	body#sub2	 	{ background: url(../graphix/backgrounds/bgSub2.gif) repeat-y center #cccc99; }
	body#full 		{ background: url(../graphix/backgrounds/bgFull.gif) repeat-y center #cccc99; }


/* MAIN CONTAINER */
/* ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */

	#container { width: 718px; height: 100%; margin: 0 auto; padding: 0 6px 0 6px; text-align:left; }

/* HEADER */
/* ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */

	#header 	{ width: 718px; height: 131px; background-color: #fff; }
	#logo 	{ width: 204px; float: left; }
	#logo img	{ margin: 17px 0 0 46px; }
	#photo 	{ width: 514px; float: right; }

/* MAIN NAVIGATION */
/* ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */

	body.home #navigation ul li.home a 			{ background:   url(../graphix/navigation/home_on.gif) no-repeat; }
	body.windows #navigation ul li.windows a 		{ background:   url(../graphix/navigation/windows_on.gif) no-repeat; }
	body.doors #navigation ul li.doors a 		{ background:   url(../graphix/navigation/doors_on.gif) no-repeat; }
	body.patios #navigation ul li.patios a 		{ background:   url(../graphix/navigation/patio_on.gif) no-repeat; }
	body.estimates #navigation ul li.estimates a 	{ background:   url(../graphix/navigation/estimate_on.gif) no-repeat; }
	body.company #navigation ul li.company a 		{ background:   url(../graphix/navigation/company_on.gif) no-repeat; }
	body.contact #navigation ul li.contact a 		{ background:   url(../graphix/navigation/contact_on.gif) no-repeat; }

	#navigation 		{ width: 718px; height: 55px; background: url(../graphix/navigation/bgNav.gif) no-repeat; }
	#navigation ul 		{ height: 39px; margin: 0; padding: 10px 0 0 0; list-style-type: none; }
	#navigation ul li 	{ height: 39px; float: left; }
	#navigation ul li a 	{ height: 39px; float: left; }
	
	#navigation ul li.home 			{ width: 85px; background:   url(../graphix/navigation/home_on.gif) top; }
	#navigation ul li.home a 		{ width: 85px; background:   url(../graphix/navigation/home_off.gif) top; }
	#navigation ul li.home a:hover 	{ background:  url(graphix/navigation/home_on.gif) top; }

	#navigation ul li.windows 		{ width: 109px; background:   url(../graphix/navigation/windows_on.gif); }
	#navigation ul li.windows a 		{ width: 109px; background:   url(../graphix/navigation/windows_off.gif); }
	#navigation ul li.windows a:hover 	{ background:  url(graphix/navigation/windows_on.gif); }

	#navigation ul li.doors 		{ width: 80px; background:   url(../graphix/navigation/doors_on.gif); }
	#navigation ul li.doors a 		{ width: 80px; background:   url(../graphix/navigation/doors_off.gif); }
	#navigation ul li.doors a:hover 	{ background:  url(graphix/navigation/doors_on.gif); }
	
	#navigation ul li.patios 		{ width: 137px; background:   url(../graphix/navigation/patio_on.gif); }
	#navigation ul li.patios a 		{ width: 137px; background:   url(../graphix/navigation/patio_off.gif); }
	#navigation ul li.patios a:hover 	{ background:  url(graphix/navigation/patio_on.gif); }

	#navigation ul li.estimates 		{ width: 106px; background:   url(../graphix/navigation/estimate_on.gif); }
	#navigation ul li.estimates a 	{ width: 106px; background:   url(../graphix/navigation/estimate_off.gif); }
	#navigation ul li.estimates a:hover { background:  url(graphix/navigation/estimate_on.gif); }

	#navigation ul li.company 		{ width: 109px; background:   url(../graphix/navigation/company_on.gif); }
	#navigation ul li.company a 		{ width: 109px; background:   url(../graphix/navigation/company_off.gif); }
	#navigation ul li.company a:hover 	{ background:  url(graphix/navigation/company_on.gif); }

	#navigation ul li.contact 		{ width: 92px; background:   url(../graphix/navigation/contact_on.gif); }
	#navigation ul li.contact a 		{ width: 92px; background:   url(../graphix/navigation/contact_off.gif); }
	#navigation ul li.contact a:hover 	{ background:  url(graphix/navigation/contact_on.gif); }

/* SUB NAVIGATION */
/* ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */

	#page.sub ul 		{ margin: 0; padding: 8px 6px 0 8px; list-style-type: none; text-align: right; }
	#page.sub ul li 		{ margin: 0; padding: 0; }
	#page.sub ul li a 	{ height: 28px; display: block; }

	#page.sub ul li a:hover {
			background: url(../graphix/icons/arrowGreen.gif) no-repeat;
			background-position: right top; padding: 0 22px 0 0;
			text-decoration: underline; display: block; }

	/* WINDOWS SUB NAV */
	/* =========================================================================== */
		#page.sub #left.estimate ul li.estimate a {
				background: url(../graphix/icons/arrowGreen.gif) no-repeat;
				background-position: right top; padding: 0 22px 0 0;
				text-decoration: underline; display: block; }
	
		#page.sub #left.singleHung ul li.singleHung a {
				background: url(../graphix/icons/arrowGreen.gif) no-repeat;
				background-position: right top; padding: 0 22px 0 0;
				text-decoration: underline; display: block; }
	
		#page.sub #left.doubleHung ul li.doubleHung a {
				background: url(../graphix/icons/arrowGreen.gif) no-repeat;
				background-position: right top; padding: 0 22px 0 0;
				text-decoration: underline; display: block; }
	
		#page.sub #left.picture ul li.picture a {
				background: url(../graphix/icons/arrowGreen.gif) no-repeat;
				background-position: right top; padding: 0 22px 0 0;
				text-decoration: underline; display: block; }
	
		#page.sub #left.garden ul li.garden a {
				background: url(../graphix/icons/arrowGreen.gif) no-repeat;
				background-position: right top; padding: 0 22px 0 0;
				text-decoration: underline; display: block; }
	
		#page.sub #left.bayBow ul li.bayBow a {
				background: url(../graphix/icons/arrowGreen.gif) no-repeat;
				background-position: right top; padding: 0 22px 0 0;
				text-decoration: underline; display: block; }
	
		#page.sub #left.casement ul li.casement a {
				background: url(../graphix/icons/arrowGreen.gif) no-repeat;
				background-position: right top; padding: 0 22px 0 0;
				text-decoration: underline; display: block; }
	
		#page.sub #left.sliding ul li.sliding a {
				background: url(../graphix/icons/arrowGreen.gif) no-repeat;
				background-position: right top; padding: 0 22px 0 0;
				text-decoration: underline; display: block; }
	
		#page.sub #left.awning ul li.awning a {
				background: url(../graphix/icons/arrowGreen.gif) no-repeat;
				background-position: right top; padding: 0 22px 0 0;
				text-decoration: underline; display: block; }
	
		#page.sub #left.special ul li.special a {
				background: url(../graphix/icons/arrowGreen.gif) no-repeat;
				background-position: right top; padding: 0 22px 0 0;
				text-decoration: underline; display: block; }

	/* DOORS SUB NAV */
	/* =========================================================================== */

		#page.sub #left.sliding ul li.sliding a {
					background: url(../graphix/icons/arrowGreen.gif) no-repeat;
					background-position: right top; padding: 0 22px 0 0;
					text-decoration: underline; display: block; }
	
		#page.sub #left.french ul li.french a {
					background: url(../graphix/icons/arrowGreen.gif) no-repeat;
					background-position: right top; padding: 0 22px 0 0;
					text-decoration: underline; display: block; }

		#page.sub #left.storm ul li.storm a {
					background: url(../graphix/icons/arrowGreen.gif) no-repeat;
					background-position: right top; padding: 0 22px 0 0;
					text-decoration: underline; display: block; }

	/* PATIO COVERS SUB NAV */
	/* =========================================================================== */

		#page.sub #left.insulated ul li.insulated a {
					background: url(../graphix/icons/arrowGreen.gif) no-repeat;
					background-position: right top; padding: 0 22px 0 0;
					text-decoration: underline; display: block; }
	
		#page.sub #left.nonInsulated ul li.nonInsulated a {
					background: url(../graphix/icons/arrowGreen.gif) no-repeat;
					background-position: right top; padding: 0 22px 0 0;
					text-decoration: underline; display: block; }

		#page.sub #left.pergola ul li.pergola a {
					background: url(../graphix/icons/arrowGreen.gif) no-repeat;
					background-position: right top; padding: 0 22px 0 0;
					text-decoration: underline; display: block; }

		#page.sub #left.ultra ul li.ultra a {
					background: url(../graphix/icons/arrowGreen.gif) no-repeat;
					background-position: right top; padding: 0 22px 0 0;
					text-decoration: underline; display: block; }

	/* COMPANY SUB NAV */
	/* =========================================================================== */

		#page.sub #left.mission ul li.mission a {
					background: url(../graphix/icons/arrowGreen.gif) no-repeat;
					background-position: right top; padding: 0 22px 0 0;
					text-decoration: underline; display: block; }
	
		#page.sub #left.interest ul li.interest a {
					background: url(../graphix/icons/arrowGreen.gif) no-repeat;
					background-position: right top; padding: 0 22px 0 0;
					text-decoration: underline; display: block; }
	
		#page.sub #left.price ul li.price a {
					background: url(../graphix/icons/arrowGreen.gif) no-repeat;
					background-position: right top; padding: 0 22px 0 0;
					text-decoration: underline; display: block; }

	
/* TITLE */
/* ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */

	h1#title { padding: 6px 0 0 18px; display: block; background-color: #fff; }

/* CRUMBS */
/* ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */

	#crumbs { font: normal 11px georgia, garamond, serif; padding: 10px 0 16px 20px; background-color: #fff; color: #666; }
	#crumbs a		{ text-decoration: underline; color: #666; }
	#crumbs a:hover	{ text-decoration: none; }

/* SUB TITLE */
/* ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */

	.subTitle { 	padding: 0 0 6px 0; background-color: #fff; }

	.subTitle h2 {	background: #f4f3ea;
				background-position: left; padding: 6px 0 6px 18px;
				display: block; border-bottom: 1px solid #e6e4d1; }

/* SUB TITLE */
/* ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */

	.stepTitle { 	padding: 0 0 6px 0; background-color: #fff; }
	.stepTitle h3 { 	padding: 6px 0 6px 18px; display: block; background-color: #f4f3ea; border-bottom: 1px solid #e6e4d1; }

/* CONTENT */
/* ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */

	#page 	{ height: auto; }
	.content 	{ height: auto; padding: 6px 6px 0 6px; }
	.clear 	{ clear: both; height: 0; }
	
	/* HOME PAGE */
	/* =========================================================================== */

		#page.home #left 		{ width: 260px; float: left; }
		#page.home #right		{ width: 452px; float: right; }
		#page.home #blurb 		{ padding: 12px 12px 18px 14px; background-color: white; }
		#page.home .product 		{ width: 440px; height: 103px; margin: 6px 0 0 0; background-color: #fff; }
		#page.home .product .photo 	{ width: 137px; padding: 6px; float: left; }
		#page.home .product .info 	{ width: 275px; padding: 6px; float: right; }
		#page.home .product p		{ margin: 6px 0 6px 0; }
		#page.home .product h5 a	{
					background: url(../graphix/icons/arrowGreen.gif) no-repeat #f4f3ea;
					background-position: left; margin: 0 0 6px 0; padding: 6px 0 6px 26px; display: block;
					border-bottom: 1px solid #e6e4d1; }

	/* WINDOWS MAIN PAGE */
	/* =========================================================================== */
		
		#page.window .row			{  }
		#page.window .left 		{ width: 231px; margin: 0 6px 6px 0; float: left; background-color: #fff; }
		#page.window .center 		{ width: 232px; margin: 0 6px 6px 0; float: left; background-color: #fff; }
		#page.window .right 		{ width: 231px; margin: 0 0 6px 0; float: left; background-color: #fff; }
		#page.window .product		{ height: 320px; padding: 6px 0 0 6px; background-color: #fff; }
		#page.window .product img	{ display: block; }
		#page.window .product p 	{ margin: 6px;}
		#page.window .product h2	{
					background: url(../graphix/icons/arrowGreen.gif) no-repeat #f4f3ea;
					background-position: left; padding: 6px 0 6px 30px; margin: 6px 0 0 0;
					display: block; border-bottom: 1px solid #e6e4d1; }
	
	/* PATIOS MAIN PAGE */
	/* =========================================================================== */

		#page.patios .left 		{ width: 350px;  float: left; background-color: #fff; }
		#page.patios .right 		{ width: 350px;  float: right; background-color: #fff; }
		#page.patios .product		{ height: 330px; padding: 6px; background-color: #fff; }
		#page.patios .product img	{ display: block; }
		#page.patios .product p 	{ margin: 6px;}
		#page.patios .product h2	{
					background: url(../graphix/icons/arrowGreen.gif) no-repeat #f4f3ea;
					background-position: left; padding: 6px 0 6px 30px; margin: 6px 0 0 0;
					display: block; border-bottom: 1px solid #e6e4d1; }

	/* DOORS MAIN PAGE */
	/* =========================================================================== */
		
		#page.doors .row			{  }
		#page.doors .left 		{ width: 231px; margin: 0 6px 6px 0; float: left; background-color: #fff; }
		#page.doors .center 		{ width: 232px; margin: 0 6px 6px 0; float: left; background-color: #fff; }
		#page.doors .right 		{ width: 231px; margin: 0 0 6px 0; float: left; background-color: #fff; }
		#page.doors .product		{ padding: 6px; background-color: #fff; }
		#page.doors .product img	{ display: block; }
		#page.doors .product p 	{ margin: 6px;}
		#page.doors .product h2	{
					background: url(../graphix/icons/arrowGreen.gif) no-repeat #f4f3ea;
					background-position: left; padding: 6px 0 6px 30px; margin: 6px 0 0 0;
					display: block; border-bottom: 1px solid #e6e4d1; }


	/* SUB PAGES */
	/* =========================================================================== */

		#page.sub #left 		{ width: 144px; float: left; }
		#page.sub #right		{ width: 562px; float: right; }

		#page.sub #blurb 		{ padding: 12px 12px 18px 14px; background-color: #fff; }
		
		#page.sub .window 		{ width: 556px; height: 212px; margin: 0 0 6px 0; background-color: #fff; }
		#page.sub .window img		{ display: block; }
		#page.sub .window table		{ font: normal 11px georgia, garamond, serif; color: #666; }
		#page.sub .window .photo 	{ width: 231px; padding: 6px; float: left; }
		#page.sub .window .info 	{ width: 300px; padding: 6px; float: right; }
		#page.sub .window .info h2 	{ padding: 12px 0 0 0; }
		#page.sub .window .info p 	{ padding: 8px 0 0 0; }

		#page.sub .window ol	{ margin:0; padding:10px 10px 10px 26px; font: bold 11px georgia, garamond, serif; color: #663300; }
		#page.sub .window ol p	{ margin:0; padding:0; }
		#page.sub .window ol li { padding:8px 0 0 0; }

		#page.sub .window ul { margin:0; padding:6px 0 0 18px; font: bold 11px georgia, garamond, serif; color: #663300; list-style-type:circle; }
		#page.sub .window ul li { padding:8px 0 0 0; text-align: left; }

	/* DOOR SUB PAGE */
	/* =========================================================================== 		
		#page.sub .storm { padding:0 6px 6px 6px; }*/

		#page.sub ul.stormlist 	{ padding:0 0 0 18px; margin:0; font: normal 11px georgia, garamond, serif; color: #666; }
		#page.sub ol.stormlist 	{ padding:0 0 0 18px; margin:0; font: normal 11px georgia, garamond, serif; color: #666; }
		#page.sub li.stormlist	{ padding:0; margin:0; }

	/* PATIO SUB PAGE */
	/* =========================================================================== */

		#page.sub .patios #left 	{ width: 260px; padding: 6px; float: left; }
		#page.sub .patios #right 	{ width: 260px; padding: 6px; float: right; }
		#page.sub .patios h6		{ margin: 0 0 8px 0; }
		#page.sub .patios p		{ margin: 0 0 8px 0; }

	/* ESTIMATE PAGES */
	/* =========================================================================== */

		#page.sub #right.estimate		{ width: 568px; float: right; font: normal 11px georgia, garamond, serif; color: #666; }
		#page.sub #right.estimate .content	{ padding: 6px; }
		#page.sub #right.estimate .subTitle { padding: 0; background-color: #fff; }
		#page.sub #right.estimate .stepTitle { padding: 6px 0 6px 0; background-color: #fff; }
		#page.sub #right.estimate .layout 	{ width: 556px; background-color: #fff; }
		#page.sub #right.estimate .windowTitle { padding: 6px; background-color: #fff; }
		#page.sub #right.estimate .windowTitle h4	{
					background-color: #f4f3ea; padding: 6px 0 6px 6px; 
					display: block; border-bottom: 1px solid #e6e4d1; }

		#page.sub #right.estimate .style 	{ width: 556px; background-color: #fff; }

		#page.sub #right.estimate .modelTitle { padding: 6px; background-color: #fff; }
		#page.sub #right.estimate .modelTitle h6 {
					background-color: #f4f3ea; padding: 4px 0 4px 8px; 
					display: block; border-bottom: 1px solid #e6e4d1; }
		#page.sub #right.estimate p { margin: 6px; }

		.visible 	{ display: block; }
		.hidden 	{ display: none; }

	/* COMPANY PAGES */
	/* =========================================================================== */
		
		#page.sub .company 	{ margin: 0 0 6px 0; background-color:#fff; font: normal 11px georgia, garamond, serif; color: #666; }		
		#page.sub .company p 	{ padding: 5px 14px 10px 14px; }
		#page.sub #right .company ol	{ margin:0; padding:10px 10px 10px 40px; }
		#page.sub #right .company li	{ padding: 0 0 12px 0; }

	/* CONTACT PAGE */
	/* =========================================================================== */

		#page.contact .content 	{ height: auto; padding: 6px 6px 0 6px; }
		#page.contact #left 	{ width:350px; height:420px; margin: 0 0 6px 0; float:left; background-color:#fff; }
		#page.contact #right 	{ width:350px; height:420px; margin: 0 0 6px 0; float:right; background-color:#fff; }
		
		#page.contact h5	{
					background-color: #f4f3ea; padding: 6px 0 6px 8px; display: block;
					border-bottom: 1px solid #e6e4d1; }

		#page.contact hr { color:#ccc; }

		.required { font: normal 11px georgia, garamond, serif; color:#CC3300; }

		h6.thanks { padding:12px; }
		p.thanks { padding:0 0 0 12px; }


/* FOOTER */
/* ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */

	#footer {	width: 718px; height: 31px; margin: 0 0 0 0; padding: 34px 0 6px 0; text-align: center;
			background: url(../graphix/footer/bgFooter.gif) no-repeat #fff; }
