/* CSS Document */

body {
 min-width: 765px;
 font-family: Verdana, Arial, Helvetica, sans-serif;
 font-size: 0.8em;}
#frame {width: 60em; margin-right: auto; margin-left: auto;}

/* 2 Column Equal Layout */
#twocolumnequalwrap {
 width: 100%;
 float: right;}
#twocolumnequalwrap #column1 {
 width: 49.75%;
 float: left;
 display: inline;}
#twocolumnequalwrap #column2 {
 margin-left: 50.25%;}
 
/* 2 Column Layout */
#twocolumnouterwrap #twocolumninnerwrap {
 width: 100%;
 float: right;
 margin-left: -15.5em;}
#twocolumnouterwrap #column1 {
 width: 15em;
 float: left;
 display: inline;}
#twocolumnouterwrap #twocolumninnerwrap #column2 {
 margin-left: 15.5em;}
 
/* 3 Column Layout */
#threecolumns #twocolumnwrap {
 width: 100%;
 float: left;
 margin-right: -12.5em;}
#threecolumns #twocolumnwrap #twocolumns {
 margin-right: 12.5em;}
#threecolumns #column2wrap {
 width: 100%;
 float: right;
 margin-left: -15.5em;}
#threecolumns #column1 {
 width: 15em;
 float: left;
 display: inline;}
#threecolumns #column2wrap #column2 {
 margin-left: 15.5em;}
#threecolumns #column3 {
 width: 12em;
 float: right;
 display: inline;}
 
#footer {
 clear: both;
 margin-top: 5px; 
 text-align: center;
 padding-top: 5px; 
 border-top: 1px dotted #CCC;
 font-size: 0.8em;
 color: #999;}
#footer a {color: #999;}
#footer a:hover {color: #333;}
#footer p.info {color: #CCC;}

/* Clear Fix (applied to entry, shoplist_0, shoplist_1 classes too) */
.clearfix:after, .entry:after, .shoplist_0:after, .shoplist_1:after {
 content: "."; 
 display: block; 
 height: 0; 
 clear: both; 
 visibility: hidden;}
.clearfix, .entry, .shoplist_0, .shoplist_1 {display: inline-block;}
/* Hides from IE-mac \*/
* html .clearfix, * html .entry, * html .shoplist_0, * html .shoplist_1 {height: 1%;}
.clearfix, .entry, .shoplist_0, .shoplist_1 {display: block;}
/* End hide from IE-mac */
 
/* Global Styling */
* {
 margin: 0 0 0 0; 
 padding: 0;}
h1, h2, h3, h4, p {
 margin-bottom: 0.75em;}
ul, ol {
 margin: 0.75em 0 0.75em 3em; 
 padding: 0;}
fieldset {margin: 0.75em 0; padding: 0.5em;}
dl dd {margin: 0.5em 0 1em 1.2em;}
h1 {
 font-size: 1.4em; 
 color: #666;}
h2 {
 font-size: 1.2em; 
 color: #666;}
a {
 color: #0E5CA4; 
 text-decoration: none;}
a:hover {
 color: #FE8F01; 
 text-decoration: underline;}
.error {color: #F00;}
dl.float dt {float: left; width: 8em;}
dl.float dd {margin-left: 8.5em;}
dl.float_large dt {float: left; width: 12em;}
dl.float_large dd {margin-left: 12.5em;}
 
/* Header */
ul#topmenu {
 clear: both;
 height: 1.8em;
 list-style: none;
 margin: 0;
 background: #0E5CA4 url(/media/images/barbg.jpg) repeat-x top left;
 padding: 0 }
ul#topmenu li {
 display: inline;
 font-size: 80%;}
ul#topmenu li a {
 display: block;
 float: right;
 padding-left: 6px;
 margin: 0.5em 0.5em 0 0;
 color: #FFF;
 background: url(/media/images/arrow1.gif) no-repeat 0 50%;}
 
#header {
 position: relative;
 height: 100px;
 background: url(/media/images/hdrbg.jpg) no-repeat top left;}
#header p#sitetitle {
 position: absolute;
 top: 0;
 left: 0;
 text-indent: -5000px; 
 display: block;
 float: left;
 width: 123px;
 height: 98px;
 background-image: url(/media/images/logo.jpg);}
#header p#sitetagline1 {
 position: absolute;
 top: 0;
 left: 123px;
 text-indent: -5000px; 
 display: block;
 float: left;
 width: 590px;
 height: 54px;
 background-image: url(/media/images/poolsandspas.jpg);}
#header p#sitetagline2 {
 position: absolute;
 top: 54px;
 left: 123px;
 text-indent: -5000px; 
 display: block;
 float: left;
 width: 335px;
 height: 44px;
 background-image: url(/media/images/logos.jpg);}
#header p#sitetagline3 {margin: 0;}
#header p#sitetagline3 a {
 position: absolute;
 top: 56px;
 left: 463px;
 text-indent: -5000px; 
 display: block;
 float: left;
 width: 292px;
 height: 39px;
 background-image: url(/media/images/ukPoolProductsLogo.png);}
.corner {
 position: absolute;
 height: 2px;
 width: 100%;
 bottom: 0;
 left: 0;
 background: url(/media/images/corner_left.gif) no-repeat;}
.corner div {
 position: absolute;
 height: 2px;
 width: 2px;
 bottom: 0;
 right: 0;
 background: url(/media/images/corner_right.gif) no-repeat;}
 
p#breadcrumbs {
 clear: both;
 margin: 0.5em 0; 
 font-size: 0.8em; 
 padding-bottom: 5px; 
 border-bottom: 1px dotted #CCC;}
 
#home h1, #home h2, #home h3 {
 margin: 0;
 font-size: 1.2em;
 padding: 0.3em;
 color: #FFF;
 background: #0E5CA4 url(/media/images/barbg.jpg) repeat-x top left;}
#home h1 a, #home h2 a, #home h3 a {
 display: block;
 color: #FFF;}
#home h3 {clear: both;}
a.homeShop,
a.homeShow,
a.homePools,
a.homeMore {
 position: absolute;
 bottom: 0.3em;
 left: 0.3em;
 text-indent: -5000px; 
 display: block;
 width: 104px;
 height: 28px;}
a.homeShop {
 background-image: url(/media/images/homeShopButton.png);}
a.homeShow {
 background-image: url(/media/images/homeShowroomButton.png);}
a.homePools {
 width: 108px;
 background-image: url(/media/images/homePoolsButton.png);}
a.homeMore {
 background-image: url(/media/images/read_more_button.png);}

.box {
 position: relative;
 height: 14.5em;
 padding: 0.3em;
 background: #FFF url(/media/images/boxbg.jpg) repeat-x bottom left;
 margin-bottom: 0.3em;}
.box p, .box ul {font-size: 0.8em;}
.box ul {margin-left: 1.5em;}
.box img {float: right; margin-left: 0.3em;}
.box a.more {
 position: absolute;
 bottom: 0.3em;
 left: 0.3em;
 text-indent: -5000px; 
 display: block;
 width: 69px;
 height: 28px;
 background-image: url(/media/images/more.jpg);}
 
p.pagenav {margin: 0.5em 0; text-align: center; border: 1px solid #CCC; padding: 0.3em; font-size: 0.8em}
p.pagenav .active {font-weight: bold;}

/* Sibling Menu */
ul.navleft {
 margin: 0; 
 list-style-type: none;}
ul.navleft li {
 border: 1px solid #0E5CA4; 
 color: #0E5CA4;
 margin-bottom: 1px;}
ul.navleft li a {
 display: block; 
 border-left: 6px solid #0E5CA4; 
 color: #0E5CA4; 
 padding: 3px;
 font-size: 0.9em;}
ul.navleft li a:hover {
 border-color: #FE8F01; 
 color: #FE8F01; 
 text-decoration: none;}
 
 /* Shop Nav*/
ul#navshop, ul#navshop ul {
 margin: 0; 
 list-style-type: none;}
ul#navshop li {
 font-weight: bold; 
 font-size: 0.9em}
ul#navshop li a {
 display: inline-block;}
ul#navshop li a {
 color: #FFF;
 background-color: #0E5CA4;
 border: 1px solid #0E5CA4; 
 margin-bottom: 1px;
 display: block; 
 padding: 3px;}
ul#navshop li a:hover {
 border-color: #FE8F01; 
 text-decoration: none;}
ul#navshop ul li {
 font-weight: normal;}
ul#navshop ul li a {
 display: block; 
 color: #0E5CA4;
 background-color: #FFF;
 border-left: 6px solid #0E5CA4; 
 padding: 3px;}
ul#navshop ul li a:hover {
 border-color: #FE8F01; 
 text-decoration: none;}

/* Product Listings Specific Styles */
.shoplist_0, .shoplist_1 {
 position: relative;
 border: 1px solid #EEE;
 padding: 0.3em;
 margin: 0.3em 0;}
.shoplist_0 img, .shoplist_1 img {float: left;}
.shoplist_0 p, .shoplist_1 p {margin-left: 70px}
.shoplist_0 p.more a, .shoplist_1 p.more a, .shoplist_0 p.buy a, .shoplist_1 p.buy a {
 margin: 0;
 text-indent: -5000px;
 display: block;
 width: 69px;
 height: 28px;
 clear: left;
 float: right;}
.shoplist_0 p.more a, .shoplist_1 p.more a {
 background-image: url(/media/images/more_white.jpg);}
.shoplist_0 p.buy a, .shoplist_1 p.buy a {
 background-image: url(/media/images/buy_white.jpg);}

/* Product Detail Specific Styles */
#productdetail {position: relative;}
#productdetail .col1 {
 float: left;
 width: 150px;
 margin-right: 10px;
 display: inline;}
#productdetail .col1 p {
 text-align: center; 
 font-size: 0.8em;}
#productdetail .col2 {
 float: left;}
 
#productdetail dl dt {
 float: left; 
 width: 8.5em; 
 clear: left;}
#productdetail dl dd {
 margin: 0 0 0.3em 8.5em;}
#productdetail form select {
 font-size: 0.9em;}
#productdetail form input.submit, #productdetail form img {
 vertical-align: middle;}
#productdetail #productimage {
 float: left; 
 text-align: center;}
#productdetail #productimage p {
 font-size: 0.8em; 
 margin: 0;}
#productdetail p.title {
 clear: both; 
 border: 1px solid #A5947F;
 padding: 3px;}
#productdetail p.buy a {
 text-indent: -5000px;
 display: block;
 width: 69px;
 height: 28px;}
#productdetail p.buy a {
 background-image: url(/media/images/buy_white.jpg);}
#productdetail .colour0, #productdetail .colour1 {
 margin-bottom: 0.5em;
 float: left;
 width: 50%;
 text-align: center;}
#productdetail .colour0 {
 clear: left;}
#productdetail .colours p {
 margin: 0;}

/* Product Photo Styles */ 
#productphoto {text-align: center;}
#productphoto ul {list-style: none; margin-left: 0;}
#productphoto ul li {display: inline; padding: 0.3em 0.5em; background: #EEE; border: 1px solid #CCC; margin: 0 1px;}
#productphoto ul li a.active {font-weight: bold;}

#cart table {width: 100%;}

form#search {
 postion: relative;
 background-color: #0E5CA4; 
 padding: 0.3em;}
form#search p {
 color: #FFF;
 margin-bottom: 0.3em;
 font-weight: bold;}
form#search input {
 float: left;}
form#search input.button {
 margin-top: -0.2em;}
 
#popularproducts {
 text-align: center;
 border: 1px solid #0E5CA4}
#popularproducts p.title {
 background-color: #0E5CA4;
 color: #FFF;
 font-size: 0.9em;
 font-weight: bold;
 padding: 0.3em;}
#popularproducts p.subtitle {
 font-size: 0.8em;}
 
.banner {
 text-align: center;
 margin: 0.5em 0;
 border: 0;}
.banner img {border: 0;}

#gallery_2columns .image0, #gallery_2columns .image1 {
 margin-bottom: 0.5em;
 float: left;
 width: 50%;
 text-align: center;}
#gallery_2columns .image0 {
 clear: left;}
#gallery_2columns p {
 margin: 0;}

.attachment_left {float: left; margin: 0 0.5em 0.5em 0;}
.attachment_right, img.right {float: right; margin: 0 0 0.5em 0.5em;}
.attachment_above, .attachment_below {margin-left: auto; margin-right: auto;}

#cart table {font-size: 0.8em; margin-bottom: 1em;}

p#cartstatus {
 float: right;
 text-align: right;
 font-size: 0.75em;}

#hydropool-info {list-style:none; margin:0; padding:0;}
#hydropool-info li {list-style:none; margin:0; padding:0;}
#hydropool-info li a {text-indent:-500em; display:block; width:100px; height:100px; margin:0 auto 10px auto;}
#hydropool-info .cleaning {background:transparent url(/media/images/logo-cleaning.png) no-repeat top center;}
#hydropool-info .thermal {background:transparent url(/media/images/logo-thermal.png) no-repeat top center;}
#hydropool-info .comfort {background:transparent url(/media/images/logo-comfort.png) no-repeat top center;}
#hydropool-info .science {background:transparent url(/media/images/logo-science.png) no-repeat top center;}
#hydropool-info .evergreen {background:transparent url(/media/images/logo-evergreen.png) no-repeat top center;}