html {height:100%; }
body {height:100%; height:100%; margin:0px; font-family:Franklin Gothic Medium, Arial, Sans Serif; font-size:medium; background-color:#fff; color:#6a6a6a; cursor:default}
form {height:100%; margin:0px}
textarea {font-size:9pt}
select {font-size:9pt}

a: {}
a:link {color:#336699; text-decoration:none}
a:hover {color:#336699; text-decoration:underline}
a:active {color:#336699; text-decoration:none}
a:visited {color:#336699; text-decoration:none}

div#page {width:1024px; height:100%; margin:0px auto; border:solid 0px red; }
div#page div#leftShad {display:none; width:30px; height:100%; float:left; background-color:#6fc05a; background-image:url(/kiosk/_images/SolarGuard/_masterLeftShad.gif); background-repeat:repeat-y}
div#page div#content {height:100%; background-color:#fff}

table.page {width:1024px; height:100%; margin:0px auto; border:solid 0px red; background-color:#fff; }

/* content */
div.content {margin:0px 90px; overflow:hidden; border:solid 0px blue}

div.content-solarguard {width:884px; margin:0px auto}

/* header */
div.hdr {margin:0px 70px 15px 70px}
div.hdr div.title {width:600px; float:left; font-size:30px; margin-top:30px; border:solid 0px red; }
div.hdr div.title div.location {font-size:16px}
div.hdr div.logo {width:200px; margin-top:15px; float:right}

/* chart support */
div.chartSupport {height:86px; margin:0px 70px; overflow:hidden}

div.chartSupport #nav {width:320px; overflow:hidden; white-space:nowrap; float:left; border:solid 0px red}
div.chartSupport #nav table.nav {}
div.chartSupport #nav table.nav td.bar {text-align:center}


div.chartSupport #nav img.dateNav {cursor:pointer}
div.chartSupport #nav div.linkBar {width:80px; height:10px; float:left}
div.chartSupport #nav div.linkBar div.bar {background-color:#ddae00; width:1px; height:10px; margin:0px auto}

div.chartSupport #nav span.link {color:#6fc05a; cursor:pointer}
div.chartSupport #nav span.linkOn {color:#ddae00; cursor:pointer}
div.chartSupport #nav table.subNav {height:30px; width:244px; margin:0px auto}

div.chartSupport #btns {width:161px; overflow:hidden; white-space:nowrap; float:left; margin:0px 10px}

/* weather */
div.chartSupport #wxInfo {width:162px; height:84px; float:left; border:solid 1px #ddae00; background-color:#fff; white-space:nowrap}
div.chartSupport #wxInfo div.icon {width:48px; float:left; overflow:hidden; margin-right:4px}
div.chartSupport #wxInfo div.info {width:90px; float:left; overflow:hidden}
div.chartSupport #wxInfo div.info div.infoItem {border:solid 0px red; font-size:11px; line-height:13px; font-family:Tahoma; color:#606060}
div.chartSupport #wxInfo div.info div.infoItem span.label {color:#ddae00; margin-right:3px; font-size:12px; }

/* output info */
div.chartSupport #outputInfo {width:212px; font-size:14px; margin-top:20px; overflow:hidden; white-space:nowrap; float:left; border:solid 0px red}
div.chartSupport #outputInfo img.label {margin-left:44px}
div.chartSupport #outputInfo span.value {color:#ddae00; font-size:15px; margin-left:44px}

/* chart */
div.chart {margin:10px 70px; background-color:#616161; background-image:url(../_images/SolarGuard/chart_bg.gif); color:#ddae00; border:solid 0px #6fc05a}
div.chart div.chartSumm {height:67px}
div.chart div.chartSumm div#chartDate {margin-top:30px; margin-left:60px; font-size:18px; width:275px; float:left; border:solid 0px red}

div.chart div.chartSumm div.chartOutput {margin-top:15px; float:right; overflow:hidden}
div.chart div.chartSumm div.chartOutput div.label {margin-left:0px; border:solid 0px red}
div.chart div.chartSumm div.chartOutput span.value {margin-left:0px; font-size:15px}

div.chart div.chartSumm div.chartLegend {float:right; margin-top:16px; height:30px; border:solid 0px red; margin-right:5px}
div.chart div.chartSumm div.chartLegend div.legendColor {float:right; height:10px; width:10px; margin-left:3px; margin-bottom:3px; overflow:hidden}

/* benefits */
div#benefits {margin:10px 70px 5px 70px; height:151px; color:#606060}
div#benefits #finance {width:439px; height:151px; float:left; background-color:#fff;}
div#benefits #finance img.pic {float:left}

div#benefits #legend {width:437px; height:149px; float:left; background-color:#fff; border:solid 1px #6fc05a}
div#benefits #legend table.legend {font-size:75%}
div#benefits #legend table.legend td.legdColor {width:10px}
div#benefits #legend table.legend td.legdName {padding-left:0.25em; white-space:nowrap}

div#benefits #enviro {width:435px; height:149px; float:right; background-color:#fff; border:solid 1px #6fc05a}
div#benefits #enviro img.pic {float:right}


/* consumption info */
div#consumptionInfo {margin:10px 70px 5px 70px; height:149px; color:#606060}

div#consumptionInfo div#baseLoadInfo {width:435px; height:149px; float:left; background-color:#fff; border:solid 1px #6fc05a; text-align:center; font-size:14pt}

div#consumptionInfo div#appLoadInfo {width:435px; height:149px; float:right; background-color:#fff; border:solid 1px #6fc05a}

div.consumpLegend {font-size:9pt}
div.consumpLegend table.consumpLegend {border-width:0px; margin-top:10px}
div.consumpLegend table.consumpLegend td {border-width:0px; padding:2px 5px}
div.consumpLegend table.consumpLegend td.colorCol {padding-right:0px}
div.consumpLegend table.consumpLegend td.pctCol {text-align:right; white-space:nowrap}
div.consumpLegend table.consumpLegend div.appLegendColor {height:14px; width:14px; overflow:hidden}

/* footer */
div#ftr {margin:0px 70px; margin-bottom:10px; font-size:80%; font-weight:normal}
div#ftr a:link {text-decoration:none}
div#ftr a:visited {text-decoration:none}
div#ftr a:hover {text-decoration:none}
div#ftr a:active {text-decoration:none}
div#ftr span#copyright {}
div#ftr span.divider {margin:0px 0px; color:#999}

/* social */
div.social {margin-top:10px; padding-top:5px; padding-bottom:20px; border-top:solid 1px #cccccc; font-size:90%}
div.social span.socialLink {margin-left:25px}
div.social span.socialLink img {margin-right:6px; }


/* modal */
.modalBg {background-color:#666; filter:alpha(opacity=60); opacity:0.6; }

div.modal {background-color:#fff; border:solid 2px #6fc05a; width:460px}
div.modal input {border:solid 1px #aaa}
div.modal input.btn {background-color:#d4e875; padding:3px 10px}
div.modal textarea {border:solid 1px #aaa}
div.modal select {border:solid 1px #aaa}

div.modal div.modalTitle {background-color:#6fc05a; color:#fff; padding:1px 5px 3px 5px; font-size:15px; font-variant:small-caps}
div.modal div.modalClose {text-align:center; margin-top:25px; margin-bottom:3px}
div.modal div.modalClose span.modalClose {color:#336699; font-size:14px; cursor:pointer; font-variant:small-caps}
div.modal div.modalBody {margin:20px; font-size:14px}

/* modal - share this page */
div.modal div.share {}
div.modal div.share div.person {margin-bottom:5px}
div.modal div.share div.person table.person {background-color:#efefef; width:100%}
div.modal div.share div.person table.person th {white-space:nowrap; text-align:left; width:1%; font-weight:normal; padding-left:10px; padding-right:10px}
div.modal div.share div.person table.person td {white-space:nowrap}
div.modal div.share div.sender {background-color:#eee; padding:10px; font-size:95%}
div.modal div.share div.sender div.info {color:#606060}
div.modal div.share div.submit {margin-left:10px; margin-top:0.75em}

/* modal - download */
div.modal div.download {}
div.modal div.download table.opts {background-color:#efefef; margin-bottom:5px; width:100%}
div.modal div.download table.opts th {white-space:nowrap; text-align:left; width:1%; font-weight:normal; padding-left:10px; padding-right:10px}
div.modal div.download table.opts td {white-space:nowrap}
div.modal div.download div.submit {margin-left:10px; margin-top:0.75em}