/*   
Name: Protoytpe Layout CSS
Creative by: Rise Creative Group
Date modified: 6/30/08
------------------------------------*/

/*  Reset all CSS 
------------------------------------*/
	
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, fieldset, form, label, legend, caption, tbody, tfoot, thead { margin : 0; padding : 0; border : 0; outline : 0; font-weight : inherit; font-style : inherit; font-size : 100%; font-family : inherit; vertical-align: baseline; background: transparent; }




/* Base style
------------------------------------*/

body {
	background: #D0EDED url(/images/body.jpg) repeat-x 50% top;
	padding: 0;
	margin: 0;
	}


/* Things to hide
------------------------------------*/
#header .logo span, .need_help h2, .shop_with_confidence h2 {
display: none;

}


/* Container
------------------------------------*/
#container {
	width:958px;
	padding: 38px 0 0 0;
	margin: 0 auto;
	position: relative;
		}
	
#container_bottom {
	background: url(/images/container.jpg) repeat-x 0 bottom;
}

	
#top_border {width: 100%; height: 10px; background: #333;}
	
/* Header
------------------------------------*/
#header {
	background:url(/images/header-trans.png) no-repeat;
	width:958px;
	height: 100px;
	margin: 0; 
	padding: 0;
	position: relative;
	}

#header .logo, #header .logo a {
	position:absolute;
	left: 0;
	display:block; 
	width: 300px;
	height:98px;
}

#phone1 {
position: absolute; left: 757px; top: 15px;  padding: 10px; font-size: 1.8em; color:#fff; font-weight: bold; width: 180px;
}


/* Navigation
------------------------------------*/

#nav {
	background: url(/images/nav.png) no-repeat;
	width: auto;
	height: 51px;
	margin: 0;
	padding: 0;
}

#nav li {
	list-style: none;
	float: left;
	margin: 0;
	padding: 0;
	border-right: 1px solid #82B1B9;
	border-left: 1px solid #A2D4DE;
	}
	
#nav li a {
	text-decoration:none;
	color: #274146;
	margin: 0;
	padding: 20px 9px 18px 9px;
	display: block;
	font-size: 90%;
	font-weight:bold;
}

#nav li a:hover {
	color: #274146;
	background-color: #BDE7EF;
}

.pool-cartridge-filters #pool-cartridge-filters-nav {
	background-color:#045868;
	color: #B8E2EA;
}


.pools 		#nav li.l1 a{ background-color:#045868; color:#B8E2EA;}
.de			#nav li.l2 a{ background-color:#045868; color:#B8E2EA;}
.spa		#nav li.l3 a{ background-color:#045868; color:#B8E2EA;}
.motors		#nav li.l4 a{ background-color:#045868; color:#B8E2EA;}
.units		#nav li.l5 a{ background-color:#045868; color:#B8E2EA;}
.lights			#nav li.l6 a{ background-color:#045868; color:#B8E2EA;}
.accessories	#nav li.l7 a{ background-color:#045868; color:#B8E2EA;}
.living		#nav li.l8 a{ background-color:#045868; color:#B8E2EA;}





#secondary_nav {position: absolute; left: 320px; top: 98px; font-size: .8em; width: 600px; color:#fff; font-weight: bold;}

#secondary_nav li {float: left; list-style: none; margin: 0; padding: 0;}

#secondary_nav li a {display: block; padding: 5px 6px 0 8px; color:#fff; text-decoration: none;}

#secondary_nav li a:hover {text-decoration: underline;}

#breadcrumbs {
	padding: 15px 0 12px 12px;
	font-size: 0.9em;
	background-color:#D7F5F5;
}


/* Features
------------------------------------*/

#feature {
background: url(/images/sub_feature.png) no-repeat;
width: 958px;
height: 97px;
margin: 0;
padding: 0;
}


#feature_home {
background: url(/images/feature_home.jpg) no-repeat;
height: 232px;
}

#intro_text h1 {
	color: #023C47;
	font-weight: bold;
	}	

#intro_text {
	float: right;
	padding: 15px 25px 5px 15px;
	width: 475px;
	color: #000;
	font-weight:bold;
	font-size:1.2em;
}	
	
#feature_products_holder {
	background:url(/images/feature_products_holder.png) no-repeat;
	height: 221px;
	padding-left: 18px;
	}

#feature_products_holder h2 {
	margin: 0;
	padding: 10px 0 0 0;
	color: #B4DEE6;
}

.feature_product {
	float: left;
	margin: 10px 15px 10px 4px;
	width: 160px;
	height: 115px;
	background: #fff;
	border: 4px solid #AED9E2;
	}

	
/* Search
------------------------------------*/

#search {
	height: 30px;
	float: left;
	padding: 7px 0 0 36px;
	display: block;
}

	
/* Form styles 
-------------------------------------*/	


/* Content
------------------------------------*/

#content {
	width:958px;
	margin: 0;
	padding: 0;
	background: url(/images/content.png);
	}
	



/* Columns
------------------------------------*/

#full_col {
	float: left;
	width: 910px;
	margin: 0;
	padding: 18px 18px 12px 30px;
	}

#main_col {
	float: right;
	width: 620px;
	margin: -18px 0 0 0;
	padding: 0 10px 10px 10px;
}

#sub_col {
	float: left;
	width: 306px;
	margin: 0;
	padding: 0 0 12px 0;
}

.contact #sub_col {
	margin: -18px 0 0 0;
}

.home #main_col {
	margin: -10px 0 0 0;
}


.need_help {
background:url(/images/need_help.png) no-repeat;
width:306px;
margin-top: -25px;
padding: 70px 0 41px 0;
}

.home .need_help {
margin-top: -24px;
}

.shop_with_confidence {
background:url(/images/shop_with_confidence.png) no-repeat;
width:306px;
padding-top: 70px;
}

#sub_col p, #sub_col h3 {
	padding: 0 5px 0 25px;
}

#sub_col ul{
	list-style: none;
	list-style-type: none;
	display: inline;
	margin: 0;
	padding: 0;
	font-weight:bold;
	font-size:1em;
}

#sub_col li {
	margin: 0;
	display: block;	
	padding: 10px 5px 0 25px;
}
	
#sub_col li a {
	text-decoration:none;
	color: #045868;
}

#sub_col li a:hover {
	text-decoration:underline;
}

#sub_col li a:visited {
	color: #045868;
}
	
.col {

	width: 295px;
	float: left;
	height:220px;
	margin:0 0 0 10px;
	padding:0;
	}
	
/*.col img {
float: left;
padding: 5px 10px 0 0;
}
*/


.col ul {
	list-style: none;
	list-style-type: none;
	margin:0;
	padding:10px 0 0 0;
	}


.col ul li {
float:left;
width:120px;
}


.home .col {
height:225px;
margin:10px 0 10px 0;

}

.home .col ul li {
	list-style: none;
	list-style-type: none;
	margin:0;
	padding:0 0 10px 0;
	float:left;
}

	
#extras_holder {
	background: #162D31 url(/images/content_bottom.png) no-repeat;
	padding: 54px 5px 32px 22px;
	color: #fff;
	}
	
#extras_holder h3 {
	color: #B8E2EA;
	font-weight:bold;
	font-size: 1.2em;
	}
	
#extras_holder a {
	color: #fff;
	}
	
#extras_holder a:visited {
	color: #B8E2EA;
	}
	
.newsletter {
	width: 250px;
	float: left;
	padding: 18px 0 10px 15px;
	}
	
.quick_links {
	width: 582px;
	float: right;
	padding: 18px 30px 10px 15px;
	}
	
.quick_links ul {
	font-size: .85em;
	padding-top: 15px;
	}	

.quick_links li {
	padding: 8px 0 0 0;
	}	

/* Miscellaneous
------------------------------------*/

.center {
	text-align:center;
}

.right {
	float: right;
}

.left {
	float: left;
	}

.clear {
	clear: both;
}

img {
	border: 0;
	}
	
.alert {
	color: #CC0000;
	font-weight: bold;
}

.note {
	text-transform: uppercase;
	color: #ccc;
}

.highlight {
	background-color: #ffcc99;
}

.small {
font-size:90%;
}

.view_btn {
padding:6px 0 0 0;
}
/* Tables
------------------------------------*/
	
.tabular {
	width: 100%;
	background-color: #A2D4DE;
	margin-bottom: 10px;
	margin-top: 10px;
}	
	
.tabular th {
	background-color: #6A9AA3;
	text-align:left;
	height:10px;
	color: #162D31;
}

.tabular_highlight {
	background-color: #82B1B9;
}


TD.Button {								 
	BACKGROUND: url(/xcart/skin1/images/butbg.gif);
	/*BACKGROUND-COLOR: #FF8600;*/
	BACKGROUND-REPEAT: repeat-x;
	PADDING-LEFT: 5px;
	PADDING-RIGHT: 5px;
	VERTICAL-ALIGN: middle;
	WHITE-SPACE: nowrap;
}


FONT.Button {								 
	FONT-FAMILY: Arial;
	COLOR: #FFFFFF;
	FONT-WEIGHT: bold;
	FONT-SIZE: 11px;
	TEXT-DECORATION: none;
}


A.Button:link, A.Button:visited, A.Button:hover, A.Button:active {
	/*COLOR: #FFFFFF;*/
	FONT-WEIGHT: bold;
}

TABLE.ButtonTable {
	CURSOR: pointer;
	VERTICAL-ALIGN: middle;
	DIRECTION: ltr;
}


TD.PListImgBox {
width:25%;

}

TD.DialogTitle {
background:none;
display:none;
}

.DialogBorder {
background:none;
}


.VertMenuItems {
color:#fff;
}




/* Site Information
------------------------------------*/

#site_information {
	background: url(/images/footer.png) no-repeat;
	width: 938px;
	height: 76px;
	margin: 0;
	padding: 35px 10px 0 10px;
	list-style: none;
	list-style-type:none;
	clear:both;
	font-size: 0.9em;
	color: #162D31;
	line-height:1.6em;
	font-weight:bold;
}

#site_information li {
float: left; 
padding-right: 12px;
}

#site_information a, #site_information a:visited {
color: #162D31
}

i was thinking about calling link point and determine if we're even hitting their server