/* CSS Document */

/* Basic Stuff */

/*.clearfix:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}*/

/* Hides from IE-mac \*/
/** html .clearfix {height: 1%;}*/
/* End hide from IE-mac */


body {
	font: 11px "Lucida Grande","Lucida Sans Unicode",Verdana,Arial,sans-serif; 
	color: #333;
	line-height: 18px;
	margin: 0;
	padding: 0;
	}
	
body A:link    	{ color: #008fd5; font-weight: normal; text-decoration: underline; }
body A:active  	{ color: #008fd5; font-weight: normal; text-decoration: underline; }
body A:visited 	{ color: #008fd5; font-weight: normal; text-decoration: underline; }
body A:hover  	{ color: #000; font-weight: normal; text-decoration: underline; }
	

	
h1 {
	font: 13px "Lucida Grande","Lucida Sans Unicode",Verdana,Arial,sans-serif; 
	color: #333; 
	padding: 0;
	margin: 0;
	font-weight: bold;
}
	
h2 {
	font: 13px "Lucida Grande","Lucida Sans Unicode",Verdana,Arial,sans-serif;
	color: #219dda;
	margin-top: 7px;
	margin-bottom: 7px;
	line-height: 16px;
	font-weight: bold;
	}
	
h2 A:link    	{ color: #219dda; font-weight: bold; text-decoration: none; }
h2 A:active  	{ color: #219dda; font-weight: bold; text-decoration: none; }
h2 A:visited 	{ color: #219dda; font-weight: bold; text-decoration: none; }
h2 A:hover  	{ color: #219dda; font-weight: bold; text-decoration: underline; }
	
h3 {
	font: 11px "Lucida Grande","Lucida Sans Unicode",Verdana,Arial,sans-serif;
	color: #333;
	margin-bottom: 0px;
	font-weight: normal;
	line-height: 16px;
	}

h3 A:link    	{ color: #29769d; font-weight: normal; text-decoration: underline; }
h3 A:active  	{ color: #29769d; font-weight: normal; text-decoration: underline; }
h3 A:visited 	{ color: #29769d; font-weight: normal; text-decoration: underline; }
h3 A:hover  	{ color: #a4c00d; font-weight: normal; text-decoration: underline; }

	
h4 {
	font: 15px "Lucida Grande","Lucida Sans Unicode",Verdana,Arial,sans-serif;
	color: #219edb;
	margin-bottom: 0px;
	margin-top: 0px;
	font-weight: normal;
	line-height: 16px;
	}

#main {
	width: 100%;
	background: #fff;
	}
	
/* Top Section */
	
#head {
	width: 980px;
	margin: 0 auto;
	padding: 0px;
	}
	
	
#top {
	
	position: relative;
	margin: 0 auto;
	padding-top: 0px;
	height: 113px;
	}

/* Navigation */

#wrapper {
	width: 980px;
	position: left;
	margin: 0 auto;
	padding-top: 0px;
	}

#navbar {
	width: 100%;
	height: 39px;
	margin-top: 3px;
	margin-bottom: 0px;
	
	padding-top: 2px;
	background: url("images/layout/top-nav.gif") repeat-x;
	}

#nav {
	margin-top:0px;
	padding-top: 0px;
	line-height: 5px;
	float:left;
	width:980px;
	position: relative;
	height: 39px;

	}
	
	  
#nav ul {	
	margin:0 0 0 0px;
	padding:0px 0px 0 0px;
	list-style:none;
	}
	  
#nav li {
	float:left;
	margin:0 0 0 0px;
	padding:0px 0px 0 0px;
	}
	
#nav a {
	float:left;
	display:block;
	left:-14px;
	margin-top: 0px;
	padding:12px 12px 14px 12px;
	border-right: 1px solid #48b1e2;
	text-decoration:none;
	font-weight:bold;
	color:#fff;
	}
	  
#nav > ul a {
	width:auto;
	margin-top:0px;
	}
    
/* Commented Backslash Hack hides rule from IE5-Mac \*/
#nav a {float:none;}
/* End IE5-Mac hack */

#nav a:hover {
	color:#48a1ca;
	}
	  
#home #nav-home, 
#pool #nav-pool,
#frameless #nav-frameless, 
#semi #nav-semi, 
#diy #nav-diy, 
#products #nav-products, 
#gallery #nav-gallery,
#testimonials #nav-testimonials,
#quote #nav-quote,
#regulations #nav-regulations,
#faq #nav-faq,
#careers #nav-careers,
#contact #nav-contact {
	background-color: #046ea2;
	 color: #fff;
	}
	  
#home #nav-home a, 
#pool #nav-pool a,
#frameless #nav-frameless a, 
#semi #nav-semi a, 
#diy #nav-diy a, 
#products #nav-products a, 
#gallery #nav-gallery a,
#testimonials #nav-testimonials a,
#quote #nav-quote a,
#regulations #nav-regulations a,
#faq #nav-faq a,
#careers #nav-careers a,
#contact #nav-contact a {
	background-color: #046ea2;
	 color: #fff;
	}
	  
/* not for IE5.x or IE6 */
#nav li:hover, 
#nav li:hover a {
	background-color: #046ea2;
	 color: #fff;
	}

#nav li:hover a {
	background-color: #046ea2;
	 color: #fff;
	}
	
	
	
	
	
ul.dropdown,
ul.dropdown li,
ul.dropdown ul {
 list-style: none;
 margin: 0;
 padding: 0;

}

ul.dropdown {
 position: relative;
 z-index: 597;
 float: left;
  margin: 0;
 padding: 0;
}

ul.dropdown li {
 float: left;
 line-height: 1.1em;
 vertical-align: middle;
 zoom: 1;
}

ul.dropdown li.hover,
ul.dropdown li:hover {
 position: relative;
 z-index: 599;
 cursor: default;
}

ul.dropdown ul {
 visibility: hidden;
 position: absolute;
 top: 100%;
 left: 0;
 z-index: 598;
 width: 100%;
}

ul.dropdown ul li {
 float: none;
}

ul.dropdown ul ul {
 top: 1px;
 left: 99%;
}

ul.dropdown li:hover > ul {
 visibility: visible;
}

ul.dropdown {
 font-weight: normal;
 margin: 0px;
   background: url("images/layout/top-nav.gif") repeat-x;

}

	ul.dropdown li {
	 padding: 9px 0px 5px 17px;
	 border-bottom: 1px solid #28a3dd;
	 
	 color: #fff;
	}
	
ul.dropdown {
 font-weight: normal;
 margin: 0px;
   background: url("images/layout/top-nav.gif") repeat-x;
   background-position:0 -150px;
	

}

	ul.dropdown li.hover,
	ul.dropdown li:hover {
	 background-color: #046ea2;
	 color: #fff;
	}

	ul.dropdown a:link,
	ul.dropdown a:visited	{ color: #fff; text-decoration: none;  font-weight: normal;}
	ul.dropdown a:hover		{ color: #fff; font-weight: normal; }
	ul.dropdown a:active	{ color: #fff;  font-weight: normal;}


	/* -- level mark -- */

	ul.dropdown ul {
	 width: 200px;
	 margin-top: 1px;
	 
	}

		ul.dropdown ul li {
		 font-weight: normal;
		  background-color: #0190d5;
		  padding: 7px 15px 7px 15px;
		}



/*-------------------------------------------------/
 * @section		Support Class `dir`
 * @level sep	ul, .class
 */


ul.dropdown *.dir {
 padding-right: 20px;
border-right: solid 1px #4ab2e3;
height: 22px;

}


/* -- Components override -- */

ul.dropdown-horizontal ul *.dir {
 padding-right: 15px;
 background-image: url(images/nav-arrow-right.png);
 background-position: 100% 50%;
 background-repeat: no-repeat;
}

ul.dropdown-upward *.dir {
 background-image: url(images/nav-arrow-top.png);
}

ul.dropdown-vertical *.dir,
ul.dropdown-upward ul *.dir {
 background-image: url(images/nav-arrow-right.png);
}

ul.dropdown-vertical-rtl *.dir {
 padding-right: 10px;
 padding-left: 15px;
 background-image: url(images/nav-arrow-left.png);
 background-position: 0 50%;
}


















































#subnav-bar {
	background-color: #dedede;
	border-top: 0px solid #aaa;
	width: 100%;
	height: 22px;
	margin-bottom: 2px;
}

#subnav {
	font: 9px "Lucida Grande","Lucida Sans Unicode",Verdana,Arial,sans-serif;
	color: #5e5d5d;
	line-height: 22px;
	padding-left:15px;
}

/* Large Text Area */

#mainstrip {
	background: #008fd5 url('images/pool-water.jpg') bottom left repeat-x;
	height: 202px;
	margin-top: 0px;
	}
	

#maincontentarea {
	width: 950px;
	margin: 0 auto;
	text-align: left;
	vertical-align: middle;
	}

#newsletter-maincontentarea {
	width: 600px;
	margin: 0 auto;
	text-align: left;
	vertical-align: middle;
	}

#maintext{
	margin: 0px 0 0 0px;	
	position: relative;
	float: left;
	display:inline;
	vertical-align: middle;
	}
	
/* Homepage Content */

#contentholder {
	background: #000;
}

#content2 {
	width: 980px;
	margin: 0 auto;
	text-align: left;
	padding: 0;

}

#home-flash {
	float: left;
	display:inline;
	width: 980px;
	height:368px;
	margin-top: 10px;
	}
	
#home-flash-left {
	float: left;
	display:inline;
	width: 655px;
	height:368px;
	
	}
	
#home-flash-right {
	float: left;
	display:inline;
	width: 285px;
	height:328px;
	background:#29a7de;
	background: url('images/home/intro-background.jpg');
	padding: 20px;
	color: #fff;
	}

	
#home-flash-right h1 {
	color: #FFFF00;
	font-weight: normal;
	font-size: 16px;
	margin-top: 0px;
	}
	
#sub-flash {
	float: left;
	width: 990px;
	height:376px;
	margin-top: 0px;
	display:inline;
	}
	
#sub-flash-left {
	float: left;
	width: 728px;
	height:376px;
	background: url('themes/sub-background.gif');
	display:inline;
	}
	
#sub-flash-right {
	float: left;
	width: 210px;
	height:336px;
	background:#29a7de;
	background: url('images/home/intro-background.jpg');
	padding: 20px;
	color: #fff;
	display:inline;
	}
	
#sub-flash-right h1 {
	color: #FFFF00;
	font-weight: normal;
	font-size: 16px;
	margin-top: 10px;
	}
	
#sub-images {
	float: left;
	display:inline;
	width: 980px;
	height:312px;
	margin-top: 10px;
	}
	
#sub-images-left {
	float: left;
	display:inline;
	width: 728px;
	height:312px;
	}
	
#sub-images-right {
	float: left;
	display:inline;
	width: 210px;
	height:272px;
	background:#29a7de;
	background: url('images/home/intro-background.jpg');
	padding: 20px;
	color: #fff;
	}
	
#sub-images-right h1 {
	color: #FFFF00;
	font-weight: normal;
	font-size: 16px;
	margin-top: 10px;
	}	

#home-left {
	float: left;
	display:inline;
	width: 381px;
	margin-top: 0px;
	margin-right: 20px;
	margin-bottom:0px;
	}
	
#home-middle {
	float: left;
	display:inline;
	width: 359px;
	margin-top: 45px;
	margin-right: 0px;
	margin-bottom:0px;
}

#home-right {
	float: right;
	display:inline;
	width: 193px;
	margin-top: 35px;
	margin-right: 0px;
	margin-bottom:0px;
}

#home-feature {
	float: left;
	display: inline;
	width: 323px;
	height:246px;
	margin: 5px 4px 0 0;

	}
	
#home-feature2 {
	float: left;
	display:inline;
	width: 323px;
	height:246px;
	margin: 5px 0px 0 0;
	
	}
	
#home-feature-image {
	float: left;
	display:inline;
	width: 324px;
	margin-bottom:1px;
	height: 149px;
	}
	
#home-feature-text {
	float: left;
	display:inline;
	width: 293px;
	color: #fff;
	background: url('images/home/feature-background.jpg');
	height: 66px;
	padding: 15px;
	margin:0px;
	}
	
	#home-feature-text a{
	color: #fff;
	text-decoration: underline;
	}
	
	#home-feature-text a:hover{
	color: #000;
	text-decoration: underline;
	}
	
#home-feature-text h2{
	color: #FFFF00;
	font-weight: normal;
	font-size: 14px;
	margin-top: 0px;
	margin-bottom: 0px;
	}
	
#home-content-left {
	float: left;
	display:inline;
	width: 635px;
	margin-right: 20px;
	margin-top: 10px;
	font-size: 12px;
	}
	
#home-content-left h3 {
	color: #000;
	font-size: 17px;
	font-weight: normal;
	line-height: 20px;
	margin-top: 0px;
	}
	
#home-content-left ul {
	color: #000;
	list-style-image: url(images/home/star.gif);
	line-height: 22px;
	}
	
.black{
	color: #000;
	}
	
#home-content-right {
	float: left;
	display:inline;
	width: 325px;
	padding: 0px;
	margin-top: 10px;
	}
	
#home-quote {
	float: left;
	display:inline;
	width: 275px;
	padding: 0px;
	margin-top: 10px;
	background-color:#e9f6fc;
	padding: 25px;
	}
	
	#home-quote input {
	border: 1px solid #ccc;
	height: 25px;
	
	}


#subpage-nav {
	float: left;
	display:inline;
	width: 185px;
	margin-right: 30px;
	margin-top: 20px;
	font-size: 12px;
	}
	
#subpage-nav ul li {
	list-style-image: url(images/sub/blue-arrow.gif);
	line-height: 14px;
	font-size:11px;
	padding: 5px 0 5px 0;
	border-bottom: solid 1px #e6f4fb;
	color: #4ab1e2;
	margin-top: 0px;
	}
	
#subpage-nav ul li a{
	text-decoration:none;
	}
	
#subpage-nav ul li a.hover{
	color: #000;
	text-decoration:none;
	}
	
#sub-content-left {
	float: left;
	
	width: 478px;
	margin-right: 35px;
	margin-top: 10px;
	font-size: 12px;
	display:inline;
	}
	
#sub-content-left h1 {
	color: #000;
	font-size: 19px;
	font-weight: normal;
	line-height: 20px;
	margin-top: 10px;
	}
	
#sub-content-left ul {
	color: #000;
	list-style-image: url(images/sub/blue-arrow.gif);
	line-height: 22px;
	}

#home-content-right {
	float: left;
	display:inline;
	width: 325px;
	padding: 0px;
	margin-top: 10px;
	}
	
#sub-content-right {
	float: left;
	display:inline;
	width: 250px;
	padding: 0px;
	margin-top: 10px;
	}
	
#sub-quote {
	float: left;
	display:inline;
	width: 200px;
	padding: 0px;
	margin-top: 10px;
	background-color:#e9f6fc;
	padding: 20px;
	margin-bottom: 10px;
	}
	
	#sub-quote input {
	border: 1px solid #ccc;
	height: 25px;
	
	}
	


























#products {
	float: left;
	width: 560px;
	margin-top: 10px;
	}
	
#home-testimonials {
	float: left;
	width: 560px;
	margin-top: 10px;
	margin-bottom: 20px;
	}
	
#title {
	float: left;
	width: 354px;
	}
	

	
#sub-image{
	float: left;
	width: 300px;
	height: 225px;
	margin-top: 10px;
	margin-right: 29px;
	border:solid;
	border-color: #ddf0f9;
	border-width: 5px;
	margin-bottom: 20px;
	
	}
	


#home-right div{
	margin: 0 0 5px 0;
}

#homecontent-left {
	float: left;
	width: 360px;
	margin-top: 30px;
	margin-right: 30px;
	
	}
	

	
#homecontent-right {
	float: left;
	width: 193px;
	margin-top: 0px;
	margin-right: 0px;
	line-height:14px;
}

#subcontent-left {
	float: left;
	width: 678px;
	margin-top: 0px;
	margin-right: 30px;
	margin-right: 0;
	font-size: 12px;
	}
	
#subcontent-right {
	float: left;
	width: 242px;
	margin-top: 0px;
	margin-right: 0px;
}

#home-news {
	height: 88px;
	position: relative;
	margin: 0 auto;
	padding-top: 10px;
	background:url("images/home/news.gif") no-repeat left top;
	overflow: hidden;
	}
	
#home-focus {
	height: 88px;
	position: relative;
	margin: 0 auto;
	padding-top: 10px;
	background:url("images/home/focus.gif") no-repeat left top;
	overflow: hidden;
	}

#submaintext{
	margin-top: 0px;
	width: 950px;
	position: relative;
	float: left;
	vertical-align: middle;
	}
	
#newsletter-submaintext{
	margin: 0px 0 0 0px;	
	width: 600px;
	position: relative;
	float: left;
	vertical-align: middle;
	}
	

#footer {
	font: 11px "Lucida Grande","Lucida Sans Unicode",Verdana,Arial,sans-serif;
	line-height: 15px;
	color: #7b7b7b;
	float: left;
	width: 980px;
	margin-top: 15px;
	padding-bottom: 15px;
}

#footer A:link    	{ color: #999; font-weight: normal; text-decoration: none; }
#footer A:active  	{ color: #999; font-weight: normal; text-decoration: none; }
#footer A:visited 	{ color: #999; font-weight: normal; text-decoration: none; }
#footer A:hover  	{ color: #29769d; font-weight: normal; text-decoration: underline; }

#newsletter-footer {
	font: 11px "Lucida Grande","Lucida Sans Unicode",Verdana,Arial,sans-serif;
	color: #7b7b7b;
	float: left;
	width: 600px;
	margin-top: 15px;
	padding-bottom: 15px;
}

#newsletter-footer A:link    	{ color: #999; font-weight: normal; text-decoration: none; }
#newsletter-footer A:active  	{ color: #999; font-weight: normal; text-decoration: none; }
#newsletter-footer A:visited 	{ color: #999; font-weight: normal; text-decoration: none; }
#newsletter-footer A:hover  	{ color: #29769d; font-weight: normal; text-decoration: underline; }

ul {
	margin-top: 5px;
	margin-left: 15px;
	padding-left: 0px;
	}


.toptext {
	font: 16px Georgia, Times New Roman, Times, serif; 
	color: #fff; 
	padding: 0;
	margin: 0;
}
	



 br{
 clear: left;
 }
 


#sitemap {
	color: #1d6db7;
	float: left;
	width: 770px;
	margin-right: 0px;
	}
	
#sitemap-dot {
	height: 1px;
	position: relative;
	margin-top: 10px;
	margin-bottom: 10px;
	background:url("images/sub/sitemap-dot.gif") no-repeat left top;
	overflow: hidden;
	}
	

a img {
  border-width:0;
  }
 
#thumbs-left {
	float: left;
	width: 158px;
	margin-top: 0px;
	margin-right: 12px;
	}
	
	#thumbs-right {
	float: left;
	width: 158px;
	margin-top: 0px;
	margin-right: 0px;
	}
	
	#last {
	float: left;
	width: 158px;
	margin-top: 0px;
	margin-right: 12px;
	}
	
	#back {
	float: left;
	width: 176px;
	margin-top: 0px;
	margin-right: 70px;
	}
	
	#next {
	float: left;
	width: 76px;
	margin-top: 0px;
	margin-right: 0px;
	}



/* Footer */

#footer-bg {
	float:left;
	position:relative;
	width:100%;
	margin-top: 10px;
	margin-bottom: 0px;
	border-top: 1px solid #dedede;
	border-bottom: 1px solid #dedede;
	padding-top: 0px;
	background-color: #ecf4f9;
	
}

#newsletter {
	margin-top:20px;
	width:400px;
	float:left;
	position:relative;
}

#most-viewed1 {
	width:120px;
	float:left;
	position:relative;
	margin: 20px 20px 0px 0px;
}
#most-viewed1 ul {	
	margin:0;
	padding:0;
	list-style:none;
}

#most-viewed1 li {
	margin:0;
	padding:0;
}	

#most-viewed {
	width:90px;
	float:left;
	position:relative;
	margin: 20px 20px 0px 0px;
}
#most-viewed ul {	
	margin:0;
	padding:0;
	list-style:none;
}

#most-viewed li {
	margin:0;
	padding:0;
}	


#foot {
	float:left;
	width:800px;
	font-size: 8pt;
	color: #0076ab;
	padding-top: 10px;
	margin-bottom: 20px;
	}
	
#icons {
	float:left;
	width:150px;
	position: relative;
	padding-top: 10px;
	}
	  
#foot ul {
	margin:0;
	padding:0px 0px 0px 0px;
	list-style:none;
	}
	  
#foot li {
	float:left;
	margin:0 0 0 0px;
	padding:0;
	}
	
#foot a {
	float:left;
	margin-right:0px;
	text-decoration:none;
	font-size: 8pt;
	color:#70b2d0;
	padding-right:5px;
	padding-left: 5px;
	}
	
#foot a:hover {
	color:#0076ab;
	text-decoration: underline;
	}
	
#famouslink {
	float:left;
	position:absolute;
	padding-bottom: 20px;
}

#famouslink a {
	float:left;
	margin-right:0px;
	text-decoration:none;
	font-size: 8pt;
	color:#b3b3b3;
	}
	
#famouslink a:hover {
	color:#b81616;
	text-decoration: none;
	}

/* Form*/	

#slideshow {
    position:relative;
    height:368px;
margin: 0px;
float: left;
}

#slideshow IMG {
    position:absolute;
    top:0;
    left:0;
    z-index:8;
    opacity:0.0;

}

#slideshow IMG.active {
    z-index:10;
    opacity:1.0;
}

#slideshow IMG.last-active {
    z-index:9;
}

#holder {
    margin-top: 15px;
	background: url(themes/background.gif);
}