@charset "UTF-8";

/*########################################

	Project:    Vision Water
	Version:    1.1 
	Last change:    22/08/08 [stylesheet dev] 
	Designed by:    Big Click Studios - www.bigclick.com.au

#########################################*/

/*------------------------------------------------------------------ 

	[Table of contents] 
  
	1. GLOBAL STYLES
	2. COLUMN STYLES
	3. NAVIGATION
	4. BLOGS, NEWS, STUDIES
	5. DOWNLOADS
	6. GALLERY
	7. CONTACT, FORM
	8. sFIR STYLES
	9. FOOTER
	
# -------------------------------------------------------------------*/  



/*---------------------------------------

	1. GLOBAL STYLES - body, text, images, links, logo

-----------------------------------------*/ 


* { margin: 0em; padding: 0em; }

body { color:#333333; font-size: 13px; line-height: 20px; margin-bottom:14px; font-family:Helvetica,Arial,Verdana,sans-serif; background: url(/img/layout/background-full.jpg) no-repeat top center #CFE3F1; }

#logo { margin:30px 30px 0px 30px; float:left; display:block; border:none; }



/*   Text Styles  */

p { line-height: 20px; margin-bottom:16px; }

p span { font-size:14px; font-weight:bold; color:#003366; }

h1 { color:#333333; font-weight: normal; text-transform:capitalize; border-bottom:#999999 dotted 1px; padding-top:4px; margin-bottom:20px; background:url(/img/layout/hline.gif) top left no-repeat; }

h2 { color:#333333; font-weight: normal; font-size:18px; border-bottom:#999999 dotted 1px;  }

h2 a { color:#333333; border:none; background:url(/img/layout/bullet.png) 0px 5px no-repeat; padding:0px 0px 5px 18px;  }

h2 a:hover { color:#FF6600; border:none; background:url(/img/layout/bullet-orange.png) 0px 5px no-repeat; }

h3 { color:#333333; font-weight: normal; text-transform:capitalize; border-bottom:#999999 dotted 1px; padding-top:4px; margin-bottom:20px; background:url(/img/layout/hline.gif) top left no-repeat; }

h4 { height:30px; }

h5 { color:#fff; font-weight: normal; font-size:24px; text-transform:capitalize; }

ul.point-list { margin:5px 0px 16px 16px; padding:0px;  list-style-image:url(/img/layout/bullet-orange.png); font-weight:bold; }

ul.point-list li { margin-bottom:8px; padding-bottom:4px; border-bottom:#FFFFFF dotted 1px; }



/*   Other Stuff  */

#rcol ul.textlist { display:block; list-style:url(/img/layout/bullet.png); padding-left:15px; margin-left:30px; }

#rcol ul.textlist li { padding:1px; }

br.clear { clear: both; }

img { padding: 0px; }

a { text-decoration: none; color:#1A1444; border-bottom:dotted 1px #333333; }

a:hover { text-decoration: none; border-bottom:solid 1px #333333; color:#FF6600; }

a.feature { text-decoration: none; color: #FF6600; border-bottom:none; font-size:14px; background:url(/img/layout/bullet-orange.png) left no-repeat; padding:3px 3px 3px 15px; margin:10px 0px; }

a.feature:hover { text-decoration: none; color:#1A1444; background:url(/img/layout/bullet.png) left no-repeat; }

.noborder { border:none; }

.buttonSubmit { width:55px; height:20px; color:#FFF; font-weight:bold; padding:2px 5px; background:url(/img/layout/searchbutt.png) no-repeat; background-position: top left; cursor:pointer; border:none; }

.clearer { width: 100%; color: #fff; clear: both; height: 2px; margin:0px; }

.greenButton a { display:block; width:111px; height:26px; background:url(/img/layout/button-large-green.png) top center no-repeat; border:none; text-align:center; color:#fff; font-size:14px; padding-top:5px; }

.greenButton a:hover { background:url(/img/layout/button-large-green.png) bottom center no-repeat; }

a img.blueBorder { border:#7DB6C8 4px solid; }

a:hover img.blueBorder  { border:#3786B3 4px solid; }

#indexAwards { width:640px; height:122px; margin-bottom:20px; background:url(/img/layout/indexAwards.png) no-repeat; text-align:center; }

#indexAwards img { height:101px; margin:10px 20px 0px 20px; border:none; }

#indexAwards a { border:none; }

.smallText { font-size:11px; }







/*---------------------------------------

	2. COLUMN STYLES - header, content structure, modules

-----------------------------------------*/

#hd { height:244px; background:url(/img/layout/hd-bg-grad.jpg) repeat-x top #143D55; border-bottom:#AFC9D2 1px solid; }

#hdImage { height:187px; background:url(/img/layout/hd-bg.jpg) no-repeat top center;}

#hdWrap { height:187px; margin:auto; width:960px; position:relative; }



/*   Search Bar   */

#hdWrap div#searchbar { height:25px; margin:auto; width:541px; position:absolute; top:0px; right:14px; padding:5px 0px 0px 0px; }

#hdWrap div#searchbar ul li { display:block; float:left; list-style:none; padding:0px 15px; }

#hdWrap div#searchbar .buttonSubmit:hover { background-position: bottom left; }

#hdWrap div#searchbar #searchinput { margin-left:16px; }

#hdWrap div#searchbar a { color:#1566A3; border:none; }

#hdWrap div#searchbar a:hover { color:#FF6600; border:none; }


/*	 New Home Buttons	*/

.vision-online, .vision-buttons{padding: 5px 0 5px 0; display:block;}

.vision-buttons{margin-bottom: 30px;}

.vision-online a{display:block; width: 672px; height: 129px; border: none; background-image: url(../img/hm-order-online.png); text-indent: -9999px}
.vision-online a:hover{background-position: 0px -130px;}

.vision-buttons a{display:block; float:left; width: 336px; height: 102px; border: none; background-image: url(../img/hm-services.png); text-indent: -9999px}

.clear-box{clear: both; border: none;}

.vision-buttons .home:hover{background-position: 0px -204px;}

.vision-buttons .fire{background-position: 0px -102px;}
.vision-buttons .fire:hover{background-position: 0px -306px;}

.vision-buttons .retro{background-position: 336px 0px;}
.vision-buttons .retro:hover{background-position: 336px -204px;}

.vision-buttons .storm{background-position: 336px -102px;}
.vision-buttons .storm:hover{background-position: 336px -306px;}



/*   Header Message  */

#hdWrap div#message { color:#FFAB23; font-size:22px; line-height:30px; display:block; padding:60px 50px 40px 360px; }

#hdWrap div#message blockquote { background:url(/img/layout/quote-open.png) top left no-repeat; display: block; padding:10px 0px 0px 42px; }

#hdWrap div#message blockquote p span { color:#FFAB23; margin-top: 12px; font-weight: normal; background:url(/img/layout/quote-close.png) bottom right no-repeat; display: block; padding:0px 42px 10px 0px; text-align:right; font-size:36px; }


/*   Home Panel Container   */

#hmpan { min-height:247px; display:block; background:#CFE3F1 url(/img/layout/hmpan-grad.jpg) repeat-x top; border-bottom:#3F7789 1px solid;  }

#hmpanImage { height:247px; background:url(/img/layout/hmpan-bg.jpg) no-repeat top center; }

#hmpanWrap { height:247px; display:block; margin:auto; width:960px; padding:0px 0px 30px 0px; position:relative; }



/*   Contents Container   */

#ctHome { height:auto; clear:both; display:block; background:#CFE3F1 url(/img/layout/ct-grad.jpg) repeat-x top; border-top:#AFC9D2 1px solid; border-bottom:#3F7789 1px solid;  }

#ct { height:auto; clear:both; display:block; background:#CFE3F1 url(/img/layout/ct-grad.jpg) repeat-x top; border-bottom:#3F7789 1px solid;  }

#ctImage { min-height:540px;  background:url(/img/layout/ct-bg.jpg) no-repeat top center; }

#ctWrap { height:auto; display:block; margin:auto; width:972px; padding:40px 0px 30px 0px; }

#ctWrap .ctlcol { display:block; float:left; width:310px; height:100px; margin:0px 20px 20px 0px; }

#ctWrap .ctrcol { display:block; float:left; width:310px; min-height:300px; margin-bottom:20px; }



/*   Columns, Panels   */

#lcol { width:300px; float:left; }

#rcol { width:672px; height:auto; float:left; display:block; }

#sdColtop { background:url(/img/layout/sidepan-top.png) top no-repeat; width:240px; height:16px; }

#sdCol { background:url(/img/layout/sdcol-bg.png) top repeat-x #8EB8C9; width:240px; color:#fff; }

#sdColbot { background:url(/img/layout/sidepan-bot.png) bottom no-repeat ; width:240px; height:16px; margin-bottom:20px; }

#sdCol .module { width:220px; padding:10px; }

#sdCol .readmore { display: block; border-bottom:#4D8DA4 solid 1px; background:url(/img/layout/read-more.png) top left no-repeat; height:15px; text-indent: -999px }

#sdCol .readmore:hover { background:url(/img/layout/read-more.png) bottom left no-repeat; }


/*   Home Article Pullout   */

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

ul.pullout li { list-style:none; width:281px; height:43px; background:#E1EDF6 url(/img/layout/pullout-bg.png) top left no-repeat; margin:0px 0px; border-bottom:#999999 dotted 1px; padding:10px 10px 0px 20px; line-height:16px; }

ul.pullout li a { color:#1A1444; font-size:13px; text-decoration:none; border:none; font-weight:bold;  }

ul.pullout li a span { color:#1566A3; font-size:12px; }

ul.pullout li:hover {  background:#E1EDF6 url(/img/layout/pullout-bg.png) bottom left no-repeat; }


 /*---------------------------------------

	3. NAVIGATION - stucture, header, navigation

-----------------------------------------*/ 

/*   Main Menu   */

#nv { position:relative; height:56px; color:#E0E0E0; width:100%; font-family:Helvetica,Arial,Verdana,sans-serif; background: #143D55 url(/img/layout/nv-bg.jpg) repeat-x 0px 4px; border-bottom:#000000 solid 1px; }

#nvWrap { margin:auto; width:960px; position:relative; height:33px; font-size:12px; text-transform:uppercase; font-weight:bold; background: url(/img/layout/dolphin_bg.gif) repeat-x bottom left; padding:0 0 0 20px; }

#nvWrap ul {  padding:0; list-style-type:none; width:auto;  }

#nvWrap ul li { display:block;float:left;margin:0 1px; }

#nvWrap ul li a { display:block; float:left; color:#EAF3F8; text-decoration:none;padding:0 0 0 20px;height:33px; border:none; }

#nvWrap ul li a span { padding:10px 20px 0 0; height:23px; float:left; }
 
#nvWrap ul li a:hover { color:#236A93; background:transparent url(/img/layout/dolphin_bg-OVER.gif) repeat-x bottom left; }

#nvWrap ul li a:hover span { display:block; width:auto; cursor:pointer; }

#nvWrap ul li a.current,#nvWrap ul li a.current:hover { color:#fff; background: url(/img/layout/dolphin_left-ON.gif) no-repeat top left; line-height:275%; }

#nvWrap ul li a.current span{ display:block; padding:0 20px 0 0; width:auto; background:url(/img/layout/dolphin_right-ON.gif) no-repeat top right; height:33px; }



/*   Sub WaterCell Menu  */

#lcol ul#sublinks { list-style:none; margin-bottom:20px;  }

#lcol ul#sublinks li a { padding:3px 10px; border-bottom:#999999 1px dotted; width:210px; display:block; }

#lcol ul#sublinks li a:hover { padding:3px 20px; width:190px; color:#FF6600; }


 /*---------------------------------------

	4. BLOGS, NEWS, STUDIES, AWARDS - lists

-----------------------------------------*/ 


ul.blogs, ul.news, ul.case-studies, ul.awards  { list-style:none; }

ul.blogs li, ul.news li, ul.case-studies li, ul.awards li { position:relative; }

ul.blogs h2, ul.news h2, ul.case-studies h2, ul.awards h2 { margin-bottom:6px; }
 
ul.blogs p.pullout, ul.news p.pullout, ul.case-studies p.pullout, ul.awards p.pullout  { background:#E1EDF6; padding:8px; margin-bottom:0px; }
 
ul.blogs p.details, ul.news p.details, ul.case-studies p.details, ul.awards p.details { border-top:#999999 dotted 1px; margin:5px 0px 40px 0px; font-size:11px; }

#rightImages img { float:right; clear:both; margin:20px 0px 20px 20px;}

ul.blogs li .moreLink, ul.news li .moreLink, ul.case-studies li .moreLink, ul.awards li .moreLink { position:absolute; bottom:0px; right:0px; }

 ul.awards img { display:block; float:right; }



 /*---------------------------------------

	5. DOWNLOADS - icons, list

-----------------------------------------*/ 

ul.downloads { list-style:none; } 

ul.downloads li img { margin-right:10px; float:left; }



 /*---------------------------------------

	6. GALLERY - list

-----------------------------------------*/ 

ul.gallery { list-style:none; }

ul.gallery li { display:block; height:100px; }

 
 /*---------------------------------------

	7. CONTACT, FORM - input, text area, submit button, custom layout

-----------------------------------------*/ 

	p.largeorange { font-size:24px; color:#FF6100; }
	
	input, textarea { border:1px #AFD1E1 solid; background:url(/img/layout/form-bg.jpg) left top no-repeat #fff; padding:3px; }
	
	#contactForm input, #contactForm textarea { width:240px; }
	
	#contactForm .buttonSubmit { float:left; width:55px; }


 /*---------------------------------------

	8. sIFR styles - do not modify

-----------------------------------------*/ 

.sIFR-flash { visibility: visible !important; margin: 0; }

.sIFR-replaced { visibility: visible !important; }

span.sIFR-alternate { position: absolute; left: 0; top: 0; width: 0; height: 0; display: block; overflow: hidden; }

/* Hide Adblock Object tab: the text should show up just fine, not poorly with a tab laid over it. */

.sIFR-flash + div[adblocktab=true] { display: none !important; }

/* These "decoy" styles are used to hide the browser text before it is replaced... the negative-letter spacing in this case is used to make the browser text metrics match up with the sIFR text metrics since the sIFR text in this example is so much narrower... your own settings may vary... any weird sizing issues you may run into are usually fixed by tweaking these decoy styles */

.sIFR-hasFlash h1 { visibility: hidden; height:24px; }

.sIFR-hasFlash h3 { visibility: hidden; height:24px; }

.sIFR-hasFlash h4 { visibility: hidden; letter-spacing: -5px; font-size: 21px; }

.sIFR-hasFlash h5 { visibility: hidden; }



 /*---------------------------------------

	9. FOOTER - site links, big click logo, w3 validation

-----------------------------------------*/ 


#ft { height:240px; background:#143D55 url(/img/layout/ft-grad.jpg) repeat-x top; border-top:#fff 1px solid; padding-top:10px; color:#fff; }

#ftWrap { height:230px; margin:auto; width:960px; border-left:#fff dotted 1px; }

#ftWrap .col {  height:200px; width:209px; display:block; float:left; padding:15px; border-right:#fff dotted 1px; }

#ftWrap .col.credits { text-align:right; }

#ft a { color:#fff; border:none; }

#ft a:hover { color:#FFAB23; }

ul.subnav { list-style:url(/img/layout/bullet-orange.png); padding-left:15px; text-align:left; text-transform:uppercase; }

ul.subnav li { padding:1px; }

#ft input { width:130px; float:left; margin-right:5px; }

#ft .buttonSubmit { float:left; width:55px; }

#sub-footer-wrap { height:30px; background:#143D55 url(/img/layout/ft-grad.jpg) repeat-x top; border-top:#fff 1px solid; padding-top:10px; color:#fff; }

#sub-footer-wrap #policy-wrap { width: 600px; margin:auto; }

.policy { float: left; width: 150px; list-style: none; font-size: 11px}

.policy a { text-decoration: none; color: white; border: none;}

.policy a:hover{ color:#FFAB23; }

/*---------------------------------------

	9. STORE.

-----------------------------------------*/ 

.store-list{ list-style: none;}
.store-list img{ float: left !important; padding: 0 10px 0 0;}
.store-list .clear{clear:both; }

.store-list li{ padding: 15px; border-bottom: 1px dotted #999999;}

.product-heading{ display:block; font-family:Helvetica,Arial,Verdana,sans-serif; font-size: 16px; font-weight: bold;}

.alt{ background-color: #E1EDF6; }

.add-cart{color: white; text-decoration: none; border: none; font-size: 11px; /*line-height:26px;*/ text-align: center; display: block; float: right;  background:url(/img/layout/addbutt.png) top center no-repeat; width: 111px; height: 25px;}
.add-cart:hover{background:url(/img/layout/addbutt.png) bottom center no-repeat; color: white; border: none; }

a.add-cart{color: white; text-decoration: none; border: none; font-size: 11px; line-height:26px; text-align: center; display: block; float: right;  background:url(/img/layout/addbutt.png) top center no-repeat; width: 111px; height: 25px;}

.view-cart{color: white; text-decoration: none; border: none; padding: 6px 5px 4px 5px; text-align: center; display: block; float: right;  background:url(/img/layout/button-large-green.png) top center no-repeat; width: 111px; height: 21px;}
.view-cart:hover{background:url(/img/layout/button-large-green.png) bottom center no-repeat; color: white; border: none; }

.checkout{ width: 120px !important; color: white;text-decoration: none; border: none; padding: 5px; text-align: center; display: block; float: left;  background:url(/img/layout/button-large-green.png) top center no-repeat; width: 111px; height: 31px; font-size:13px;}
.checkout:hover{background:url(/img/layout/button-large-green.png) bottom center no-repeat; color: white; border: none; }

.lefty{float: left !important;}

ul.store-list li .shoplist-right { float:left;  width:160px;  padding:0px 0px 0px 10px; text-align:center; }

ul.store-list li .shoplist-left { float:left;  width:440px;}

.redprice { background:#15415c; color:#fff; font-weight:bold; font-size:16px; display:block; padding:15px; width:140px;  margin-top: 20px; text-align:center; }

.error{ color: red;}

#personal input, #personal select{ width: 240px; }

label.error {display: block;}

.desc-container{ width:435px; float: right;}


 /*---------------------------------------

	9. NEW PAGES - new-home-projects, retrofit-your-home, fire-protection, stormwater-management-osd.

-----------------------------------------*/ 

.page-title, .page-description, .page-image, .page-list, .page-list-wide { display: block; float: left;}

.page-list, .page-list-wide {  padding:0px; font-weight:bold; }

.page-list li, .page-list-wide li { margin-left: 45px; margin-bottom:8px; padding-bottom:4px; border-bottom:#FFFFFF dotted 1px; list-style-image:url(/img/layout/bullet-orange.png);}

.page-list li a, .page-list-wide li a { text-decoration: none !important; border-bottom: none; }

.page-title { width: 174px; font-size:14px; font-weight:bold; margin-right:20px; }

.page-description { width: 224px; }

.page-image { margin-right: 6px; border:2px solid #7DB6C8; height:auto; padding:0px; }

.page-image img{ display: block; }

.page-list { width: 254px; }

.page-list-wide { width: 478px; }

.page-clear { clear:both; height: 5px; margin-bottom:25px; padding-top:20px; border-bottom:#8EB8C9 solid 1px;  }