/*	Screen Styles for Custom Sunroofs */

* {margin: 0; padding: 0}

body {
	background: transparent url('img/bg_top.jpg') repeat-x center top;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	line-height: 150%;
	color: #000;
	}

/* header */

#header {
	height: 250px;
	margin: 0 auto; padding: 10px 0 0 0;
	text-align: center;
	}

#header h1 a {
	background: transparent url('img/logo.gif') no-repeat center top;
	display: block;
	width: 536px; height: 176px;
	margin: 0 auto; 
	}

#header h1 span {display: none;}

/* nav */

#nav {
	width: 605px;
	margin: 0 auto;
	height: 50px;
	text-align: center;
	padding-top: 5px;
	}
	
#nav ul {list-style: none;}
	
#nav li {
	display: inline;
	list-style: none;
	}
	
#nav a {
	float: left; display: block;
	height: 40px;
	text-align: center;
	margin: 4px 6px 0 6px;
	background-image: url('img/nav.gif');
	background-repeat: no-repeat;
	background-position: 0 0;
	}
	
#nav a#navHome {
	width: 53px;
	background-position: -18px 0;
	}
#nav a#navAbout {
	width: 86px;
	background-position: -88px 0;
	}
#nav a#navSunroof {
	width: 91px;
	background-position: -190px 0;
	}
#nav a#navGold {
	width: 117px;
	background-position: -297px 0;
	}
#nav a#navRepairs {
	width: 74px;
	background-position: -429px 0;
	}
#nav a#navContact {
	width: 103px;
	background-position: -519px 0;
	}
	
#nav ul li a span {display: none;}

body#home #nav a#navHome, #nav a#navHome:hover {background-position: -18px -45px;}
body#about #nav a#navAbout, #nav a#navAbout:hover {background-position: -88px -45px;}
body#sunroofs #nav a#navSunroof, #nav a#navSunroof:hover {background-position: -190px -45px;}
body#gold #nav a#navGold, #nav a#navGold:hover {background-position: -297px -45px;}
body#repairs #nav a#navRepairs, #nav a#navRepairs:hover {background-position: -429px -45px;}
body#contact #nav a#navContact, #nav a#navContact:hover {background-position: -519px -45px;}

/* content */

#content {
	clear: both;
	width: 750px;
	margin: 0 auto;
	padding-bottom: 40px;
	}
	
#content h2 {
	font-size: 21px; 
	font-weight: normal; 
	font-family: Arial;
	display: inline;
	color: #340300;
	border-bottom: 2px solid #DCC747;
	}
	
#content p {
	margin: 15px 0;
	}
	
#content p.first {margin-top: 25px;}

#content a {
	color: #796E34; 
	text-decoration: underline; 
	}

#content a:hover {text-decoration: none;}

#content img {border: 1px solid #DCC747;}

/*content-home*/

#content .home {
	float: left;
	width: 200px;
	font-size: 14px;
	margin-top: 15px;
	}

#content .home p {margin-top: 0px;}
	
#content .home img {
	margin-top: 15px;
	border: none;
	}
	
#content img.office {
	margin: 0 0 25px 20px;
	}
	
#content .home a {
	display: block; 
	font-size: 12px;
	}

#content .awards {
	clear: both; float: left;
	width: 750px;
	padding: 20px 0;
	border-top: 1px solid #DCC747;
	}
	
#content .awards img {
	float: left; 
	margin-right: 15px;
	}
	
#content .awards img.award01 { 
	margin-left: 100px;
	}
#content .awards img.award02 { 
	margin-left: 25px;
	}
	
#content .awards span {
	float: left; 
	width: 150px;
	font-size: 12px;
	font-weight: bold;
	}
	
#content .awards span em {
	color: #00B2C9;
	font-style: normal;
	}
	
/*content-sunroofs*/

ul#products {
	float: left; width: 450px;
	list-style: none;
	margin: 0 0 0 0; padding-bottom: 49px; padding-top: 0;
	}
	
ul#products li {
	float: left;
	display: inline;
	}
	
ul#products img, ul#features img {border: none;}
	
ul#products a, ul#features a {
	margin: 20px 20px 0 0;
	display: block;
	float: left;
	border: 2px solid #4B0400;
	}
	
ul#products a:hover, ul#features a:hover {border: 2px solid #DCC747;}

ul#features {
	float: left;
	list-style: none;
	margin: 0 0 0 0;
	}
	
#content p.prod { margin: 20px 0 0 0; }

/*content-repairs*/

#content ul.list li {
	font-size: 16px; 
	color: #156B9B; 
	margin-left: 30px;
	}

/*content-goldplating*/

#content img.goldplating {
	float: right;
	margin-top: 5px; padding: 0 0 50px 20px;
	border: none;
	}

/*content-contact us*/

.contact {
	float:left;
	padding-bottom: 20px;
	}

#content img.map {
	float: right;
	border: 6px solid #DCC747;
	}
	
body#contact #content h3 {
	float: right;
	width: 319px;
	text-align: center;
	font-family: Arial; 
	}
	
/*content-hollandia products*/

body#sunroofs #content {position:relative;}

ul#submenu {
	position:absolute;
	margin-left: 65px; padding: 2px 0;
	display: inline;
	list-style: none;
	border: 1px solid #B2A139;
	}
	
ul#submenu li {
	display: inline; 
	font-size: 12px; 
	font-weight: bold; 
	color: #B2A139;
	}

ul#submenu a {
	float: left;
	display: block;
	width: 113px;
	height: 20px;
	margin: 0 2px;
	}
	
ul#submenu a.hollfeat {
	width: auto;
	padding: 0 10px;
	background: white;
	text-align: center;
	color: #cc0000;
	}
	
ul#submenu a.holl100 span,
ul#submenu a.holl300 span,
ul#submenu a.holl700 span,
ul#submenu a.holl900 span {
	display: none;
	}
	
ul#submenu a.holl100 {background: #FFF url('img/holl100_logo.gif') no-repeat 0 0 ;}
ul#submenu a.holl300 {background: #FFF url('img/holl300_logo.gif') no-repeat 0 0 ;}
ul#submenu a.holl700 {background: #FFF url('img/holl700_logo.gif') no-repeat 0 0 ;}
ul#submenu a.holl900 {background: #FFF url('img/holl900_logo.gif') no-repeat 0 0 ;}
	
body.holl100 #content ul#submenu a.holl100,
body.holl300 #content ul#submenu a.holl300,
body.holl700 #content ul#submenu a.holl700,
body.holl900 #content ul#submenu a.holl900, 
body.hollfeat #content ul#submenu a.hollfeat 
	{
	text-decoration: none;
	color: #B2A139;
	}
	
#content .product {
	clear: both;
	float: left;
	margin-top: 30px; padding-top: 20px;
	padding-bottom: 50px;
	border-top: 1px solid #B2A139;
	}
	
#content .product .images {
	float: left;
	width: 315px;
	}

#content .product .images img.main {
	margin: 0 5px 5px 0;
	width: 280px; height: 224px;
	}

#content .product .images img.sub {
	float: left;
	margin: 0 5px 5px 0;
	width: 90px; height: 72px;
	cursor:pointer; cursor:hand;
	}
	
#content .product .images img.how {
	clear: left;
	margin: 0 5px 5px 0;
	width: 280px; height: 58px;
	}
	
#content .product .images img {
	border: none;
	}
	
#content .product .images a.download {
	display: block; clear:left;
	width: 280px;
	padding: 2px 0;
	background: #796E34;
	text-align: center;
	color: #FFF;
	text-decoration: none;
	font-size: 11px;
	text-transform: uppercase;
	font-weight: bold;
	}
	
#content .product .images a.download:hover {
	background: #500700;
	color: #FFF;
	}
		
#content .product .text {
	float: left;
	width: 400px;
	}
	
#content .product .text h3 {
	float: left;
	color: #6F282E;
	font-size: 21px;
	font-family: Arial;
	font-weight: normal;
	}

body.holl100 #content .product .text h3,
body.holl300 #content .product .text h3,
body.holl700 #content .product .text h3,
body.holl900 #content .product .text h3 {
	display: none;
	}

#content .product .text h4 {
	color: #156B9B;
	font-size: 16px;
	font-family: Arial;
	font-weight: normal;
	}
	
#content .product ul {margin-bottom: 10px;}
	
#content .product ul li {margin-left: 15px;}

#content .product .text img.logo,
#content .product .text img.warranty {
	float: right;
	border: none;
	}
	
body#sunroofs #content .product .text img.logo {float:left;}
	
#content .product .text img.warranty {
	padding: 0 10px 10px 0;
	}
		
#content .product .text p.first {
	clear: left;
	margin-top: 40px;
	}
	
/* footer */

#footer {
	clear: both;
	background: transparent url('img/bg_bottom.jpg') repeat-x center bottom;
	height: 141px;
	margin: 0 auto; 
	text-align: right;
	font-size: 9px;
	text-transform: uppercase;
	font-weight: bold;
	color: #855E2B;
	}
	
#footer p {padding: 100px 20px 0 ;}