﻿/* Home Page Top Row */
DIV#home_top {float:left; width:618px; margin:6px 0px 0px 0px; background:url(/structure/bg_home_top_mid.gif) 0px 0px repeat-y;} 
DIV#home_top DIV.outer {float:left; width:618px; background:url(/structure/bg_home_top_top.gif) 0px 0px no-repeat;}
DIV#home_top DIV.inner {float:left; width:618px; background:url(/structure/bg_home_top_bottom.gif) 0px 100% no-repeat;}
DIV#home_top DIV#col_1 {float:left; width:202px; margin:0px 3px 0px 0px;}
DIV#home_top DIV#col_2 {float:left; width:205px; margin:0px 3px 0px 0px;}
DIV#home_top DIV#col_3 {float:left; width:201px;}
/* Home Page Bottom Row */
DIV#home_bottom {float:left; width:615px; margin:8px 0px 0px 0px; background:url(/structure/bg_home_bottom_mid.gif) 0px 0px repeat-y;}
DIV#home_bottom DIV.inner {float:left; width:615px; background:url(/structure/cnr_home_bottom.gif) 0px 0px no-repeat;}
DIV#home_bottom DIV.col_1 {float:left; width:202px; margin:0px 3px 0px 0px;}
DIV#home_bottom DIV.col_2 {float:left; width:409px;}
/* Water Storage */
DIV#water_storage {float:left; width:180px; padding:7px 0px 10px 17px;}
DIV#water_storage H2 {float:left; width:150px; text-indent:-9000px; background:url(/structure/img-hp-help-with-your-account.gif) 0px 0px no-repeat; font-size:10px;}
DIV#water_storage DIV.chart {float:left; width:175px; padding:5px 0px 20px 0px;}
DIV#water_storage DIV.item {float:left; width:170px; padding:10px 0px 0px 0px;}
DIV#water_storage DIV.graph {float:left; width:161px; background:#FFF; border:1px solid #9B9A90;}
DIV#water_storage DIV.bar {float:left; height:10px;}
DIV#water_storage SPAN {float:left; clear:left; width:175px; padding:1px 0px 0px 2px; color:#8599B7;}
DIV#water_storage DIV.shade_a {background:#ACB2BA;}
DIV#water_storage DIV.shade_b {background:#8B94A1;}
DIV#water_storage DIV.shade_c {background:#677281;}
DIV#water_storage DIV.shade_d {background:#414C5B;}
/* News */
DIV.news {float:left; width:195px; padding:7px 5px 7px 5px;}
DIV.news H2 {float:left; width:100%; text-indent:-9000px; background:url(/structure/img-hp-help-with-your-account.gif) 0px 0px no-repeat; font-size:10px;}
DIV.news DIV.listing {float:left; width:195px; padding:4px 0px 0px 0px;}
DIV.news DIV.item {float:left; width:195px; padding:4px 0px;}
DIV.news DIV.item DIV.txt {float:left; width:190px; padding:0px 0px 4px 0px;}
DIV#community.news H2 {background:url(/structure/img-hp-community-information.gif) 0px 0px no-repeat;}
DIV#latest.news H2 {background:url(/structure/img-hp-latest-news.gif) 0px 0px no-repeat;}
/* Survey */
DIV.survey {float:left; width:195px; padding:7px 5px 7px 5px;}
DIV.survey H2 {float:left; width:100%; text-indent:-9000px; background:url(/structure/img-hp-major-projects.gif) 0px 0px no-repeat; font-size:10px;}
DIV.survey DIV.item {float:left; width:195px; padding:5px 0px;}
DIV.survey DIV.item UL {float:left; width:190px; padding:3px 0px 3px 5px; list-style:none;}
DIV.survey DIV.item UL LI {float:left; clear:left; width:190px; padding:2px 0px;}
DIV.survey DIV.item UL INPUT {float:left; clear:left; height:15px; width:15px;}
DIV.survey DIV.item UL LABEL {float:left; clear:none; width:165px; padding:1px 0px 0px 4px;}
DIV.survey DIV.btn {float:left; width:190px;}
DIV.survey DIV.btn INPUT {float:right; padding:2px 4px; color:#8B94A1; background:#E6E6E7; border:1px solid #D8DCE2; font-size:11px;}
/* Sidebar Panel */
DIV.panel {float:left; width:144px; margin:6px 0px 10px 0px;}
DIV.panel DIV.body {background:#F6BD56; padding:4px;}
DIV.panel DIV.body h3 { margin-bottom: 10px; color:#fff; font-size:1.0em; font-weight: bold;}
DIV.panel DIV.body P { color:#fff; }
DIV.panel DIV.body UL { color:#000; list-style:none;}
DIV.panel DIV.body UL LI { margin-top: 10px; }
DIV.panel DIV.body A { color:#A26A28; }
DIV.panel DIV.body A:hover { color:#fff; }
DIV.panel DIV.foot {float:left; height:20px; width:144px; background:url(/structure/cnr_sidebar_secondary_inner.gif) 100% 100% no-repeat;}

DIV.panel TABLE.orangealt { border: 1px solid #DB9933; width: 136px; border-left: 0px;}
DIV.panel TABLE.orangealt TR { vertical-align:top; }
DIV.panel TABLE.orangealt TR.alt { background: #F6BD55; }
DIV.panel TABLE.orangealt TD { padding: 4px; color: #FFF !important; border-left: 1px solid #DB9933;}
TABLE.orangealt TD p {font-size:.9em; margin:0;padding:0}
TABLE.orangealt TD span {white-space:nowrap}
DIV.panel TABLE.orangealt TR.header TD { background: #F6BD55; font-weight: bold; height: auto; }
DIV.panel TABLE.orangealt A { color:#A26A28; }
DIV.panel TABLE.orangealt A:hover { color:#fff; }
DIV.panel DIV.purplerounded { background: #849CBC url(/structure/purplerounded_orange_br.gif) 100% 100% no-repeat; margin-bottom: 10px }
DIV.panel DIV.purplerounded DIV { color:#fff; font-size: 1.1em; font-weight: bold; padding: 15px 5px 15px 5px; background: url(/structure/purplerounded_orange_tl.gif) no-repeat; }
DIV.panel DIV.purplerounded DIV A { color: #fff; font-size: 0.9em; text-decoration: none}
DIV.panel DIV.purplerounded DIV A:hover { color: #C2CCD8; }
DIV.panel DIV.purplerounded DIV A.small { color: #607083; text-decoration: underline; font-weight: normal; }
DIV.panel DIV.purplerounded DIV A.small:hover { color: #fff; }
DIV.panel DIV.dsp_list { overflow: auto;  width: 130px; height: 140px; background: #fff; padding: 3px; }
DIV.panel DIV.dsp_list, DIV.panel DIV.dsp_list * { color:#607083!important; font-size: 1.0em; }
DIV.panel DIV.dsp_list A { text-decoration: none; color: #A26A29!important; }
DIV.panel DIV.dsp_list A:hover { text-decoration: none; color: #F6BD55!important; }
DIV.panel DIV.dsp_list A.selected { font-weight: bold; text-decoration: underline; }

/* Table Styles */
TABLE.orangealt { border-top: 3px solid #FFEED8; width: 420px; }
TABLE.orangealt TR { vertical-align: top; }
TABLE.orangealt TD { padding: 4px; color: #404C5B !important; border-left: 1px solid #EFCFA3;}
TABLE.orangealt TR.alt { background: #FFEED8;}
TABLE.orangealt TR.header { background: #FFEED8; height: 30px;  vertical-align: middle;}
TABLE.orangealt TD SPAN.title { font-weight: bold; }
TABLE.orangealt TD.first { border-left: 0px; }
TABLE.orangealt TD.cent, TABLE.orangealt TR.cent TD { text-align: center }
TABLE.orangealt TR.last TD { border-bottom: 1px solid #EFCFA3; }
TABLE.orangealt TR.selected TD { background: #FFEED8; }

/* Box styles */
DIV#content DIV.purpleroundedselected { background-image: url(/structure/purplerounded_white_selected.gif) !important; }
DIV#content DIV.purplerounded1 { float: left; height: 55px; width: 126px; background: #C8D0DF url(/structure/purplerounded_white.gif) no-repeat; }
DIV#content DIV.purplerounded2 { float: left; height: 55px; width: 126px; background: #D4DAE6 url(/structure/purplerounded_white.gif) no-repeat; margin-left: 21px;}
DIV#content DIV.purplerounded3 { float: left; height: 55px; width: 126px; background: #E1E5EC url(/structure/purplerounded_white.gif) no-repeat; margin-left: 21px;}
DIV#content DIV.purplerounded1 DIV, DIV#content DIV.purplerounded2 DIV, DIV#content DIV.purplerounded3 DIV { color: #849CBC; padding: 8px 5px 0px 20px; }
DIV#content DIV.greyrounded {float:left; width:428px; background:#E8E5E2 url(/structure/cnr_bottom_grey_box.gif) 0px 100% no-repeat;}

/* Content Items */
DIV#DSP_MapInfo { float: left; background: #E2DEDA; margin-right: 10px; }
DIV#DSP_MapInfo DIV.DSP_MapInfo_inner {padding:3px; color:#607083;}
DIV#DSP_MapFlash { float: left; background: #CED9BC; }

/* Old Projects Listing */
DIV.listing {float:left; clear:left; width:420px; }
DIV.listing DIV.item {float:left; clear:left; padding:0px 0px 11px 0px;}
DIV.listing DIV.wrap {float:left; width:412px; padding:3px; border:1px solid #E4E1DD;}
DIV.listing DIV.highlight DIV.wrap {background:#E4E1DD;}
DIV.listing DIV.txt {float:left; width:300px; padding:0px 0px 0px 5px;}
DIV.listing DIV.noimage {width:400px;}
DIV.listing DIV.item DIV.btn {float:left; width:420px; margin:0px;}
DIV.listing DIV.btn A.more {float:right; width:auto; margin:4px 0px 0px 0px; padding:2px 8px;}
DIV.listing DIV.btn {float:left; width:420px; margin:26px 0px 0px 0px;}
DIV.listing DIV.btn A {float:left; width:173px; padding:3px 0px; color:#8B94A1; background:#E8E4DE; border:1px solid #C7C9CE; text-align:center; text-decoration:none;}
DIV.listing DIV.btn A.next {float:right;}
DIV.listing TABLE {width:100%;}
DIV.listing a.top{float:left;clear:both;width:100%;}

/* White Content Box */
DIV.box_white {float:left; clear:left; width:428px; margin:15px 0px 0px 0px; background:url(/structure/bg_box_white_mid.gif) 0px 0px repeat-y;}
DIV.box_white DIV {float:left; width:428px; background:url(/structure/bg_box_white_top.gif) 0px 0px no-repeat;}
DIV.box_white DIV DIV {width:400px; padding:15px 8px 15px 20px; background:url(/structure/bg_box_white_bottom.gif) 0px 100% no-repeat;}
DIV.box_white DIV DIV DIV {float:none; width:auto; background:none;}
DIV.box_white DIV.btn {float:left; clear:left; width:385px; padding:0px;}
DIV.box_white DIV.btn A {float:right; padding:3px 10px; color:#8B94A1; background:#E8E4DE; border:1px solid #C7C9CE; text-align:center; text-decoration:none;}

/* Blue Content Box */
DIV.box_blue {float:left; clear:left; width:428px; margin:15px 0px 0px 0px; background:#E6E9F0;}
DIV.box_blue DIV {float:left; width:428px; background:url(/structure/bg_box_blue_top.gif) 0px 0px no-repeat;}
DIV.box_blue DIV DIV {width:400px; padding:15px 8px 15px 20px; background:url(/structure/bg_box_blue_bottom.gif) 0px 100% no-repeat;}
DIV.box_blue DIV DIV DIV {float:none; width:auto; background:none;}
DIV.box_blue DIV.btn {float:left; clear:left; width:385px; padding:0px;}
DIV.box_blue DIV.btn A {float:right; padding:3px 10px; color:#8B94A1; background:#E8E4DE; border:1px solid #C7C9CE; text-align:center; text-decoration:none;}

/* Blue Inset Content Box */
DIV.box_blue_inset {float:left; clear:left; width:428px; margin:15px 0px 0px 0px; background:url(/structure/bg_box_blue_inset_mid.gif) 0px 0px repeat-y;}
DIV.box_blue_inset DIV {float:left; width:428px; background:url(/structure/bg_box_blue_inset_top.gif) 0px 0px no-repeat;}
DIV.box_blue_inset DIV DIV {width:400px; padding:15px 8px 15px 20px; background:url(/structure/bg_box_blue_inset_top.gif) 0px 100% no-repeat;}
DIV.box_blue_inset DIV DIV DIV {float:none; width:auto; background:none;}
DIV.box_blue_inset DIV.btn {float:left; clear:left; width:385px; padding:0px;}
DIV.box_blue_inset DIV.btn A {float:right; padding:3px 10px; color:#8B94A1; background:#E8E4DE; border:1px solid #C7C9CE; text-align:center; text-decoration:none;}

DIV#content DIV.image_leftaligned { float: left; background: #E2DEDA; padding: 2px; margin: 0px 10px 5px 0px; width: 161px;}
DIV#content DIV.image_rightaligned { float: right; background: #E2DEDA; padding: 2px; margin: 0px 0px 5px 10px; width: 161px;}
DIV#content DIV.image_rightaligned DIV.caption, DIV#content DIV.image_leftaligned DIV.caption { clear: both; font-size: 0.9em; padding-top: 2px;}
DIV#content DIV.image_rightaligned DIV.caption { clear: both; font-size: 0.9em; padding-top: 2px;}
DIV.formtable { background: #EBEDF2 url('/structure/purplecorner_white_br.gif') 100% 100% no-repeat; float:left }
DIV.formtable DIV.row, DIV.formtable DIV.header { padding: 10px 5px 10px 5px; }
DIV.formtable DIV.header { background: #EBEDF2 url('/structure/purplecorner_white_tl.gif') no-repeat; color: #A9B8CF; }
DIV.formtable DIV.alt { background: #E5E8EE; }
DIV.formtable TR { vertical-align: top; }
DIV.formtable TD.label { width: 100px; padding-right: 5px; text-align: right;}
DIV.formtable TD.label_wide { width: 185px; padding-right: 10px; text-align: right;}
DIV.formtable TD { padding-bottom: 8px; }
DIV.formtable TD DIV.radio_sml INPUT, DIV.formtable TD DIV.radio_lrg INPUT { margin-right: 2px;float: left; }
DIV.formtable TD DIV.radio_sml DIV, DIV.formtable TD DIV.radio_lrg DIV { padding-top: 4px; float: left; }
DIV.formtable TD DIV.radio_sml { float: left; width: 30px; font-size: 0.9em; padding-bottom: 5px; vertical-align: middle; }
DIV.formtable TD DIV.radio_lrg { float: left; width: 105px; font-size: 0.9em; padding-bottom: 5px; vertical-align: middle; }
DIV.twocol { float: left; width: 420px; background: url('/structure/twocol_bg.gif') repeat-y; }
DIV.twocol DIV.leftcol { float: left; width: 122px; text-align: right; padding: 2px 6px 2px 2px; clear: both; }
DIV.twocol DIV.rightcol { float: left; width: 272px;  padding: 2px 2px 2px 6px;}
DIV.twocol DIV.rightcol p { float: left; padding: 2px 2px 2px 6px;}
DIV.twocol DIV.leftimage {clear:left; float:left; font-size:0.9em; width:113px; margin:40px 0px 0px 9px; font-weight:bold;}
DIV.eventinfo { float: left; padding-bottom: 20px; }
DIV.eventinfo DIV.text { float: left; width: 245px; }

/* Usage Calculator */
DIV#usage_calculator {float:left; width:418px; background:#F1F5FB; border:2px solid #CCD6E7; position:relative;}
DIV#usage_calculator DIV.control {float:left; width:175px; padding:8px 0px 0px 9px;}
DIV#usage_calculator DIV.control H1 {float:left; height:10px; width:100%; background:url() 0px 0px no-repeat; text-indent:-9000px;}
DIV#usage_calculator DIV.control UL {float:left; clear:left; width:100%; list-style:none; z-index:10;}
DIV#usage_calculator DIV.control UL LI {background:none; padding-left:0px;}
DIV#usage_calculator DIV#floorplan {float:left; height:190px; width:231px; position:relative; padding:3px 0px 0px 3px; z-index:0;}
DIV#usage_calculator A.highlight SPAN {position:absolute; display:block; height:100%; background:url(/structure/pixel_transparent.gif); border:2px solid transparent; text-indent:-9000px;}
DIV#usage_calculator A.highlight:hover SPAN, DIV#usage_calculator A.selected SPAN {background:url(); border:2px solid #EB8F72; cursor:pointer;}
DIV#usage_calculator A SPAN#kitchen {left:99px; top:41px; height:27px; width:57px;}
DIV#usage_calculator A SPAN#bathroom1 {left:79px; top:121px; height:25px; width:38px;}
DIV#usage_calculator A SPAN#bathroom2 {left:174px; top:90px; height:29px; width:22px;}
DIV#usage_calculator A SPAN#laundry {left:140px; top:72px; height:15px; width:16px;}
DIV#usage_calculator A SPAN#garden1 {left:141px; top:3px; height:34px; width:89px;}
DIV#usage_calculator A SPAN#garden2 {left:93px; top:150px; height:39px; width:89px;}
DIV#usage_calculator A SPAN#pool {left:28px; top:66px; height:123px; width:47px;}
DIV#usage_calculator A SPAN#car {left:49px; top:8px; height:28px; width:51px;}
DIV#usage_calculator DIV.graph {float:left; clear:left; width:418px; padding:6px 0px 7px 0px;}
DIV#usage_calculator DIV.graph TABLE {width:100%; margin:0px; padding:0px;}
DIV#usage_calculator DIV.graph TABLE TD {color:#9C9692; font-size:1.0em;}
DIV#usage_calculator DIV.graph TABLE THEAD TH {padding:4px 0px; background:#F3E8D6; text-align:center;}
DIV#usage_calculator DIV.graph TABLE THEAD TD {padding:4px 7px; text-align:left; color:#000000;}
DIV#usage_calculator DIV.graph TABLE THEAD TR.alt TD {background:#F3E8D6;}
DIV#usage_calculator DIV.graph TABLE TBODY TD {width:340px; padding:3px 0px; border-bottom:1px solid #E9D4B8; color:#000000;}
DIV#usage_calculator DIV.graph TABLE TBODY TD.label {width:auto; padding:0px 15px 0px 0px; border-right:1px solid #E9D4B8; text-align:right; color:#000000;}
DIV#usage_calculator DIV.graph SPAN {float:left; display:block; background:#CFD2DD; color:#CFD2DD; overflow:hidden; height:1.2em;}
DIV#usage_calculator DIV.graph SPAN.label {padding:0px 0px 0px 6px; background:none; color:#000000;}
DIV#usage_calculator DIV.graph SPAN.savings {border:1px solid #CFD2DD; color:#FFF; background-color:#FFF;}
@media print 
{
    DIV#usage_calculator DIV.graph SPAN { display:none; }
    DIV#usage_calculator DIV.graph SPAN.label { display:inline }
}


/* Weather Feed */
.weather_title { display:none }
.weather_header { font-weight:bolder}
.weather_body { }
.weather_col1 { padding-bottom:10px }
.weather_col2 { padding-bottom:10px }
.weather_row1 { }