d/*	Top Dog Pool Supply
	http://www.topdogpoolsupply.com/
	Style Sheet */

/* RESET */

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,p,blockquote,th,td,html,label,table,tr,td {margin:0;padding:0;}
table{border-collapse:collapse;border-spacing:0;}
fieldset,img,a img,:link img,:visited img {border:0;}
address,caption,cite,code,dfn,th,var {font-style:normal;font-weight:normal;}
ol,ul {list-style:none;}
caption,th {text-align:left;}
h1,h2,h3,h4,h5,h6 {font-size:100%;}
q:before,q:after {content:'';}

/* GLOBAL */

body {
	color: #000;
	background: #014c66;
	line-height: 18px;
	font-family: Arial, sans-serif;
	font-size: 12px;
}

p {
	padding-bottom: 18px;
}

a, a:active, a:hover, a:visited {
	color: #000;
	text-decoration: underline;
}

a:hover {
	color: #0d7a77;
}

h1 {
	color: #014c66;
	font-size: 18px;
	padding-bottom: 18px;
}

.clear {
	clear: both;
}

.fine-print {
	font-size: 10px;
}

.error {
	color: #f00;
}

div.img-left { 
	float:left; 
	margin:2px 10px 10px 0px;
	text-align: center;
	}
	div.img-left img {
		border: 1px solid #DFDFDF;
		display: block;
		}
		
div.testimonial {
	clear: both;
	margin-bottom: 25px;
	}

#global_banner{margin:0 auto; text-align:center;}

/* STRUCTURE */

#bucket {
	background: #0d7a77 url(../graphics/00000001/bucket.gif);
	background-position: 217px left;
	margin: 0 auto;
	padding-bottom: 24px;
	position: relative;
	width: 960px;
}

#header {
	background: #0d7a77 url(../graphics/00000001/header.jpg) no-repeat;
	color: #fff;
	height: 178px;
	width: 960px;
	position: relative;
}
	#header a {
		position: absolute;
		display: block;
		width: 290px;
		height: 105px;
		top:35px;
		left:30px;
		}
		
		#header a span {
			display: none;
			}

#meta {
	font-family: Tahoma, Arial, sans-serif;
	font-size: 13px;
	font-weight: bold;
	margin-bottom: 17px;
}

#meta, #meta a {
	color: #0d7a77;
	position: relative;
	text-decoration: none;
}

#meta #meta-phone-number {
	float: left;
	font-size: 18px;
	padding: 14px 6px 0;
	width: 288px;
}

#meta #meta-links {
	float: left;
	padding: 6px;
	text-align: right;
	width: 324px;
}

#meta #meta-links .secondary, #meta #meta-links .secondary a {
	color: #000;
}

#cattree {
	background: #fff url(../graphics/00000001/cattree.jpg) top left repeat-y;
	float: left;
	margin: 0 17px 24px;
	width: 249px;
}

#content {
	background: #fff url(../graphics/00000001/content.gif) bottom center no-repeat;
	float: left;
	padding: 12px 12px 86px 12px;
	margin: 0 17px 17px 0;
	width: 636px;
}

#content h2 {
	border-bottom: 3px solid #057f92;
	clear: both;
	color: #014c66;
	font-size: 16px;
	margin-bottom: 18px;
	padding-bottom: 6px;
}

#fountain {
	float: left;
	margin: 0 12px 24px 0;
	position:relative;
	z-index:1;
}

#bottom-bar {
	border: 1px solid black;
	background: #fff;
	margin: 0 auto;
	text-align: center;
	width: 221px;
}

#bottom-bar div {
	margin-bottom: 12px;
}

#bottom-bar #bbb {
	background: url(../graphics/00000001/bbb.gif) center bottom;
	float: left;
	height: 116px;
	margin-left: 40px;
	width: 76px;
	position: relative;
}

	#bottom-bar #bbb a {
		width: 76px;
		height: 116px;
		display: block;
		left:0;
		top:0;
		}

#bottom-bar .AuthorizeNetSeal {
	float: left;
	height: 65px;
	margin-top: 31px;
	width: 70px;
}

#bottom-bar #credit-cards {
	background: url(../graphics/00000001/credit-cards.gif) center bottom;
	clear: both;
	height: 38px;
	margin-left: 1px;
	width: 219px;
}

#bottom-bar #controlscan-secure {
	background: url(../graphics/00000001/controlscan-secure.gif) center bottom;
	float: left;
	height: 50px;
	margin-left: 9px;
	width: 100px;
}

#bottom-bar #controlscan-background {
	background: url(../graphics/00000001/controlscan-background.gif) center bottom;
	float: left;
	height: 50px;
	margin-left: 2px;
	width: 100px;
}

#bottom-bar #baby {
	background: url(../graphics/00000001/baby.gif) center bottom;
	clear: both;
	height: 101px;
	margin-bottom: 0;
	width: 220px;
}

#bottom-bar .controlscan a {
	display: block;
	height: 50px;
	width: 100px;
}

#footer {
	color: #fff;
	margin: 17px auto;
	padding: 10px;
	text-align: center;
	width: 960px;
}

/* THUMBNAILS */

.thumbnail-container {
	clear: both;
	}

.thumbs {
		margin: 10px 0 10px 17px;
		float:left;
		display: inline;
		width: 184px;
	}

.thumbs img {
	border: 1px solid #CCC;
	padding: 2px;	
	}

.thumbs small {
	display: block;
	color: #5f5f5f;
	text-align: center;
	}

/* NAVIGATION BAR */

#nav { 
	background:url("../graphics/00000001/nav.gif") no-repeat; 
	width:960px; 
	height:39px; 
	margin:0;
	padding:0; 
	}

#nav span { display: none; }

#nav li, #nav a { height:39px; display:block; } /* change height here also */

#nav li { float:left; list-style:none; _display:inline; position:relative; }

#retail-showroom { width: 185px; margin-left: 45px;}
#expert-advice { width: 162px;}
#about-us { width: 116px;}
#return-policy { width: 161px;}
#how-to-tips { width: 139px;}
#home { width: 80px;}


/*-------------- (-79px) X position of button / (-30px) height of image from above ------------- */
#retail-showroom a:hover { background:url("../graphics/00000001/nav.gif")  -45px -39px no-repeat; }
#expert-advice a:hover { background:url("../graphics/00000001/nav.gif") -230px -39px no-repeat; }
#about-us a:hover { background:url("../graphics/00000001/nav.gif") -392px -39px no-repeat; }
#return-policy a:hover { background:url("../graphics/00000001/nav.gif") -508px -39px no-repeat; }
#how-to-tips a:hover { background:url("../graphics/00000001/nav.gif") -669px -39px no-repeat; }
#home a:hover { background:url("../graphics/00000001/nav.gif") -808px -39px no-repeat; }


#content ul { padding-left:15px; }
		#content ul li { 
			padding-left:0px; /* pushes text to the right to display bg img */
			margin-bottom:10px;
			list-style-type: disc;
			}

/* CATEGORY TREE */

#cattree ul {
	color: #0d7a77;
	font-size: 15px;
	margin-bottom: 5px;
	padding: 3px 0;
	position: relative;
	z-index: 9999;
}

#cattree ul li {
	position: relative;
	white-space: nowrap;
}

#cattree li a {
	border-top: 1px solid #0d7a77;
	color: #0d7a77;
	display: block;
	padding: 3px 5px;
	text-decoration: none;
}

#cattree li a:hover {
	background: #014c66;
	color: #fff;
}

#cattree li ul {
	display: none;
	filter:alpha(opacity=80);
	font-size: 12px;
	left: 100%;
	opacity: 0.8;
	padding: 0;
	position: absolute;
	top: 0px;
}

#cattree li ul li ul {
	filter:alpha(opacity=100);
	opacity: 1;
}

#cattree li:hover ul {
	display: block;
}

#cattree li ul li a {
	background: #014c66;
	border: 0;
	color: #fff;
	padding: 2px 8px;
}

#cattree li.parent ul li a {
	background-image: none;
}

#cattree a.sf-with-ul {
	background: url(../graphics/00000001/arrow_green.gif) right center no-repeat;
}

#cattree a.sf-with-ul:hover {
	background: #014c66 url(../graphics/00000001/arrow_white.gif) right center no-repeat;
	color: #fff;
}

#cattree li ul li a.sf-with-ul {
	background: #014c66 url(../graphics/00000001/arrow_white.gif) right center no-repeat;
	padding-right: 17px;
}

#cattree li ul li a.sf-with-ul:hover, #cattree li ul li.current a.sf-with-ul {
	text-decoration: underline;
}

#cattree li.current a.sf-with-ul, #cattree li.hovered a.sf-with-ul {
	background: #014c66 url(../graphics/00000001/arrow_white.gif) right center no-repeat;
	color: #fff;
}


#cattree h2 {
	background: transparent url(../graphics/00000001/cattree-header.gif) repeat-x;
	border: 0;
	font-size: 18px;
	font-weight: bold;
	height: 28px;
	padding: 5px 0 0;
}

/* SEARCH */

form#search {
	margin: 6px 3px;
}

form#search input {
	border: 1px solid #d54a27;
	color: #0d7a77;
	height: 16px;
	width: 186px;
}

form#search input[type=submit] {
	background: #d54a27;
	color: #fff;
	height: 20px;
	width: 50px;
}

/* EMAIL SIGNUP */

#email-signup {
	margin: 17px 14px;
	font-size: 17px;
	text-align: right;
	white-space: nowrap;
}

#email-signup #text {
	float: left;
	padding-top: 4px;
	text-align: justify;
	width: 182px;
}

#email-signup img {
	float: right;
	margin-left: 9px;
}

#email-signup form input[type=text] {
	border: 1px solid black;
	width: 221px;
}

#email-signup form input[type=submit] {
	background: #030045;
	border: 0;
	color: #fff;
}

/* FORMS */

.forms {
	width: 200px;
	float: left;
	}
	
.forms input {
	width: 170px;
	margin-top:10px;
	}

.forms div {
	margin-bottom: 10px;
}

.forms .key {
	font-weight: bold;
}

.forms .required {
	clear: left;
	float: left;
	font-size: 10px;
}

.forms .key label {
	float: left;
	}
	
.forms #register, .forms #checkout {
	width: auto;
	margin: 3px 0 0 6px;
	}

.forms .submit {
}

.form-border {
	border-right: 1px dashed #CCC;
	margin-right: 10px;
	padding-right: 5px;
	}
	
input#btn-continue {
	background:url("../graphics/00000001/btn-continue.gif") !important;
	width: 119px;
	height: 28px;
	border: 0;
	}
	
input#btn-login {
	background:url("../graphics/00000001/btn-login.gif") !important;
	width: 94px;
	height: 28px;
	border: 0;
	}
	
input#btn-password {
	background:url("../graphics/00000001/btn-password.gif") !important;
	width: 180px;
	height: 28px;
	border: 0;
	}
	
.btn-checkout-now {
	float:right;
	}

/* PRODUCT CATALOG */

#product-catalog {
	text-align: left;
	width: 100%;
}

#product-catalog th {
	background: #3399cc;
	color: #fff;
}

#product-catalog th, td {
	padding: 3px;
}

#product-catalog td.product {
	width: 60%;
}

#product-catalog td.price {
	width: 25%;
}

#product-catalog td.add-to-cart {
	width: 15%;
}

/* PAGINATION */

#prevbutton {
	float: left;
	padding-top: 24px;
}

#nextbutton {
	float: right;
	padding-top: 24px;
}

.breadcrumb_div {
	margin-bottom:10px;
	clear: both;
	}

/* CATEGORY PAGE */

.product {
	float: left;
	font-weight: bold;
	margin: 0 0 60px 0;
	text-align: center;
	width: 200px;
}

.new-row {
	clear: both;
	margin-left: 0;
}

.image {
	height: 150px;
	margin: 0 auto;
	width: 150px;
}

.name {
	margin-bottom: 9px;
	padding: 0 5px;
}

.price {
	color: #0d7a77;
	margin-bottom: 9px;
}

.ctgy_sub_div{
	width:25%;
	height:150px;
	float:left;
	text-align:center;
}

	.ctgy_sub_img_div{
				height:100px;
				overflow:hidden;
	}

	.ctgy_sub_img{
				max-width:170px;
				border:1px solid #666666;
				padding:4px;
	}

	.ctgy_sub_name{
				margin:8px auto 0 auto;
				font:bold 1em Arial, sans-serif;
				color:#030045;
				width:111px;
				text-align:center;
				height:30px;
				overflow:hidden;
	}

			.ctgy_sub_name a:link,
			.ctgy_sub_name a:visited,
			.ctgy_sub_name a:active,
			.ctgy_sub_name a:hover{
						text-decoration:none;
			}


/* PRODUCT PAGE */

#product img {
	float: left;
	margin-bottom:24px;
}

#product h1 {
	color: #000;
	font-size: 24px;
	line-height: 28px;
}

#product #info {
	border: 1px solid black;
	float: right;
	margin: 0 0 24px 48px;
	padding: 12px 12px 24px 10px;
	text-align: right;
	width: 180px;
}

#product .code {
	color: #0d7a77;
	font-size: 14px;
}

#product .price {
	color: #0d7a77;
	font-size: 24px;
	margin-top: 24px;
}

#product form input.buy-one-now {
	background: url(../graphics/00000001/buy-now.gif);
	border: 0;
	height: 28px;
	text-indent: -9999px;
	width: 94px;
}

#product form input.prod-add-to-cart {
	background: url(../graphics/00000001/add-to-cart.gif);
	border: 0;
	height: 28px;
	text-indent: -9999px;
	width: 143px;
}

#prod-quantity {
	width: 26px;
	float: right;
	display: inline;
	text-align: center;
	border: 1px solid #0D7A77;
	padding: 3px;
}

#product form label {
	float: right;
	display: inline;
	padding: 4px;
	margin-bottom: 10px;
}

#product form input[type=submit]:hover {
	cursor: pointer;
}

#product #tab1, #product #tab2, #product #tab3, #product #tab4, #product #tab5 {
	background: #f4f4f4;
	border: 1px solid #d5d5d5;
	border-bottom: 0;
	color: #656567;
	float: left;
	font-weight: bold;
	margin-right: 9px;
	padding: 3px 9px;
	-moz-border-radius-topleft: 3px;
	-moz-border-radius-topright: 3px;
	-webkit-border-top-left-radius: 3px;
	-webkit-border-top-right-radius: 3px;
}

#product #tab1:hover, #product #tab2:hover, #product #tab3:hover, #product #tab4:hover, #product #tab5:hover{
	cursor: pointer;
}

#product .content {
	display: none;
}

#product #info-box {
	border: 1px solid #d5d5d5;
	clear: both;
	height: 300px;
	margin-bottom: 24px;
	overflow: auto;
	padding: 12px;
}

#product #info-box li {
	margin-left: 15px;
}

/* SHOPPING CART */

.basket th, .basket td {
	padding: 3px;
}

.basket th {
	background: #0d7a77;
	color: #fff;
}

#expert-advice-pg img {
	float:left;
	margin: 0 10px 20px 0;
	padding: 3px;
	border: 1px solid #CCC;
	}
#expert-advice-pg p {
	clear: both;
	}