@import url("nav.css");

@import url("nav.css");


/*-----------------------
Colours - Watergarden Warehouse

Orange = #f68f1e
Yellow = #f6c11e
Light Grey = #d6d6d6
Dark Grey = #303030

----------------------*/


* {
	padding: 0;
	margin: 0;
} /* this will reset all elements to margin/padding = 0 */


/*-----------------------
Body
----------------------*/
body {
	margin: 0;
	padding: 0;
	font-size: 62.5%;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	background: url('../images/core/bg-container.gif') repeat-x 50% 0;
}


/*-----------------------
Background Container
----------------------*/

/*-----------------------
Container
----------------------*/
div#container {
	width: 982px;
	height: auto;
	margin: 0 auto;
	display: block;
}


/*-----------------------
Standard
----------------------*/
div.standard {
	font-size: 1.2em;
	color: #3d3e40;
}

div.standard img.left {
	float: left;
	margin: 0 15px 15px 0;
	border: 6px solid #cacaca;
	clear: left;
}

div.standard img.right {
	float: right;
	margin: 0 0 15px 15px;
	border: 6px solid #cacaca;
	clear: right;
}

div.standard ul {
	padding-left: 40px;
	margin-bottom: 18px;	
	list-style: disc;
}

div.standard ul li {
	line-height: 1.5em;
}

div.standard ul.left-list {
	list-style: disc;
	width: 250px;
	padding-left: 40px;
	margin-bottom: 18px;
	float: left;
}

div.standard ul.pdf-list {
	list-style: none;
	margin-left: -15px;
}

div.standard ul li.pdf a {
	background: url('../images/core/icon-pdf.gif') left center no-repeat;
	padding-left: 25px;
	line-height: 1.5em;
}

div.standard ol {
	padding-left: 30px;
	margin-bottom: 18px;
}

div.standard ol li {
	margin-left: 20px;
	line-height: 1.5em;
}

div.standard h1 {
	font: 500 2.4em "Verdana";
	color: #013850;
	margin-bottom: 15px;
}

div.standard h2 {
	font: bold 1.4em "Verdana";
	color: #007d2f;
	margin-bottom: 15px;
}

div.standard h3 {
	font: normal 1.3em "Verdana";
	color: #668abb;
	margin-bottom: 15px;
}

div.standard h4 {
	font: 1.2em "Verdana";
	color: #85c6b2;
	margin-bottom: 15px;
}

div.standard h5 {
	font: 1.1em "Verdana";
	color: #85c6b2;
	margin-bottom: 15px;
}

div.standard p { 
	line-height: 2em;
	margin-bottom: 15px;
}

div.standard a {
	color: #356cb8;
	text-decoration: none;
}

div.standard a:hover {
	color: #008343;
	text-decoration: underline;
}

div.standard hr {
	border: 0;
	height: 0;
	border-bottom: 1px solid #848484;
	margin-bottom: 15px;
}

div.clear {
	clear: both;
	display: block; 
}


/*-----------------------
Left side
----------------------*/
div#left-side {
	width: 269px;
	float: left;
	margin-top: 8px;
	padding: 29px 9px 0 32px;
	background: url('../images/core/left-logo-bg.gif') no-repeat;
}

/* ---- Logo ----- */
div.left-logo {}

div.left-logo img {
	border: 0;
}

/* ---- Left Nav ----- */
div.left-products-nav {
	width: 215px;
	height: auto;
	padding-left: 54px;
	margin-top: 22px;
}

h1#products-cat {
	margin: 0 0 10px 3px;
}

/* Left Nav (see nav.css) */

.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

/* ---- Left Button ---- */
div.left-button {
	width: 215px;
	padding-left: 50px;
	margin-top: 20px;
}

/* Expert Advice */
div.expert { 
	padding: 3px 0;
}

div.expert h2 a {
	width: 219px;
	height: 93px;
	text-indent: -9999px;
	overflow: hidden;
	display: block;
	background: url('../images/core/left-expert.gif') 0 0 no-repeat;
}

div.expert h2 a:hover {
	background: url('../images/core/left-expert-on.gif') 0 0 no-repeat;
}

/* Find Out More About Us */
div.about { 
	padding: 3px 0;
}

div.about h2 a {
	width: 219px;
	height: 93px;
	text-indent: -9999px;
	overflow: hidden;
	display: block;
	background: url('../images/core/left-about.gif') 0 0 no-repeat;
}

div.about h2 a:hover {
	background: url('../images/core/left-about-on.gif') 0 0 no-repeat;
}

/* View our 500sqm Warehouse */
div.warehouse { 
	padding: 3px 0;
}

div.warehouse h2 a {
	width: 219px;
	height: 93px;
	text-indent: -9999px;
	overflow: hidden;
	display: block;
	background: url('../images/core/left-warehouse.gif') 0 0 no-repeat;
}

div.warehouse h2 a:hover {
	background: url('../images/core/left-warehouse-on.gif') 0 0 no-repeat;
}


/*-----------------------
Right side
----------------------*/
div#right-side {
	width: 672px;
	float: left;
}

div.right-header {
	height: 40px;
	padding: 25px 0 0 14px;
}

/* ---- CTA Phone ---- */
div.cta-phone h2 {
	width: 272px;
	height: 18px;
	text-indent: -9999px;
	overflow: hidden;
	display: block;
	background: url('../images/core/cta-phone.gif') 0 0 no-repeat;
	float: left;
}

/* Top Nav (see nav.css) */

div.right-container {
	width: 654px;
	padding: 0 9px;
}

/* ---- Banner ---- */
div.banner {
	width: 654px;
	height: 267px;
	margin-top: 38px;
}

div.content {
	padding: 34px 10px 0 10px;
}

/* Featured Products */
div.featured-products {
	height: 130px;
	padding: 10px 0;
}

div.home-thumbnail {
	float: left;
	width: 96px;
	height: 96px;
	margin: 0 11px 0 0;
	display: inline;
}

div.home-image a {
	width: 84px;
	height: 84px;
	display: block; 
	border: 6px solid #cacaca;
}

div.home-image a:hover {
	border: 6px solid #008343;
}

div.home-image img {
	border: 0;
}

div.home-caption {
	margin-top: 10px;
	width: 96px;
}


/*-----------------------
Breadcrumb
----------------------*/
div#breadcrumb {
	font: 1.1em/1.4em 'Verdana';
	color: #989a9e;
	padding: 0 3px;
	margin: -20px 0 30px 0;
	border-bottom: 1px dashed #989a9e;
}

div#breadcrumb p {
	margin: 0;
}

div#breadcrumb a {
	color: #989a9e;
	text-decoration: none;
}

div#breadcrumb a:hover {
	color: #018646;
	text-decoration: none;
}


/*-----------------------
Products
----------------------*/
/* ---- Category/Sub Category ---- */
div.products-cats {
	width: 652px;
}

div.products-thumbnail {
	float: left;
	padding: 10px;
	width: 96px;
}

div.products-image a {
	width: 84px;
	height: 84px;
	display: block; 
	border: 6px solid #cacaca;
}

div.products-image a:hover {
	border: 6px solid #008343;
}

div.products-image img {
	border: 0;
}

div.products-caption {
	margin-top: 10px;
	text-align: center;
}

/* ---- Listing ---- */
div.products-listing {
	width: 652px;
}

div.listing {
	width: 612px;
	padding: 20px;
	border-top: 1px solid #cacaca;
}

div.listing:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

div.listing p {
	font: normal 0.9em 'Verdana';
	color: #999999;
	margin-top: 3px;
}

div.listing-image {
	float: left;
}

div.listing-image img {
	border: 6px solid #cacaca;
	display: block;
}

div.listing-content {
	width: 470px;
	padding: 0 15px 0 25px;
	float: left;
}

div.listing-button {
	font: normal 0.8em 'Verdana';
	margin-top: 15px;
}

div.listing-button ul {
	margin: 0;
	padding: 0;
}	

div.listing-button ul li {
	float: left;
	margin-right: 10px;
	list-style-type: none;
}

div.listing-button ul li a {
	color: #ffffff;
	background: #668abb;
	padding: 5px;
	display: block;
	float: left;
	text-align: center;
}

div.listing-button ul li a:hover {
	color: #ffffff;
	background: #96b6e1;
	text-decoration: none;
}

/* ---- Detail ---- */
div.products-detail {
	width: 652px;
}

div.detail {
	width: 612px;
	padding: 20px;
	border-top: 1px solid #cacaca;
}

div.detail:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

div.detail p {
	margin-top: 3px;
}

/*div.detail-image {
	float: left;
}

div.detail-image img {
	border: 6px solid #cacaca;
}*/

/*div.detail-content {
	width: 470px;
	padding: 0 15px 0 25px;
	float: left;
}*/

div.detail-content {
	float: left;
}

div.detail-image {
	width: 612px;
	border-top: 1px dashed #b5b5b5;
}

div.detail-image p {
	font: normal 0.8em 'Verdana';
	color: #acacac;
	margin: 10px 0 20px 3px;
}

div.detail-thumbnail {
	float: left;
	width: 84px;
	height: 84px;
	margin: 0 15px;
	_margin: 0 5px; /* IE 6 */
}

div.detail-thumbnail img {
	border: 6px solid #cacaca;
}


/*-----------------------
Contact
----------------------*/
div.contact-left {
	width: 300px;
	float: left;
}

div.contact-right {
	width: 300px;
	float: left;
}

div.contact-right img {
	border: 0;
}


/*-----------------------
Footer
----------------------*/
div.footer {
	width: 982px;
	clear: both;
	display: block;
}

div.contact {
	padding: 15px 40px;
	text-align: right;
	color: #3d3e40;
}

div.contact a {
	color: #356cb8;
	text-decoration: none;
}

div.contact a:hover {
	color: #008343;
	text-decoration: underline;
}

div.contact em {
	font-style: normal;
	margin-right: 24px
}

div.footer-box {
	border-top: 1px solid #7f7f7f;
	padding: 15px 15px 15px 0;
	width: 900px;
	float: right;
}

div.footer-links {
	padding: 0 5px;
	color: #aeadad;
	float: left;
}

div.footer-links a {
	color: #aeadad;
	text-decoration: none;
}

div.footer-links em.copyright {
	font-style: normal;
	padding-left: 18px;
}

div.footer-links a:hover {
	color: #008543;
	text-decoration: underline;
}

div.wflogo {
	width: 72px;
	height: 19px;
	float: right;
}


/*-----------------------
Programmer Added
----------------------*/
div.dynamically-centered {
  background-repeat: no-repeat;
  background-position: center center;
}

span.standard-price { font-weight: bold; }
span.special-price { font-weight: bold; }
span.standard-price-strike { text-decoration: line-through; }