body, html { width: 100%; height: 100%; }

body { z-index:500; margin:0px; text-align:center; background:#dae9fe url(../images/template/bkgrd.gif) repeat-x; font-family:Lucida Sans Unicode,Lucida Grande,Garuda,sans-serif; font-size:11px; }

#wrapper { width:982px; margin:0px auto; text-align:left; top:0px; overflow:hidden; background:url(../images/template/repeat.gif); position:relative;}

img { border:0px; }
.co2 { font-size:0.7em; }

#headerTop { background-image:url(../images/template/top.gif); width:982px; height:15px; }
#headerBox { position:relative; margin:0px auto; width:980px; height:57px; clear:both; background:url(../images/template/header.gif); }
#logo { width:56px; height:52px; position:absolute; top:-5px; left:5px; }
#logoText { position:absolute; left:70px; top:-5px; color:#bcbec0; font-size:28px; }
#logoSubText { color:#ffffff; font-weight:bold; }
#strapline { position:absolute; left:70px; top:32px; color:#ffffff; font-size:12px; font-weight:bold;  }
#contact { width:393px; height:64px; position:absolute; left:578px; top:-7px; color:#ffffff; font-weight:bold; font-size:12px; }
#contactL1 { height:20px; font-weight:bold; float:right; margin:10px 10px 0px 0px; }
#contactL2 { height:20px; width:400px; font-weight:bold; color:#ffffff; float:right; text-align:right; clear:both; margin:6px 10px 0px 0px; }

#contact a { color:#ffffff; font-weight:bold; text-decoration:none; }
#contact a:link { color:#ffffff; font-weight:bold; text-decoration:none; }
#contact a:visited { color:#ffffff; font-weight:bold; text-decoration:none; }
#contact a:hover { color:#ffffff; font-weight:bold; text-decoration:underline; }

#subMenu { list-style-type:none; height:24px; width:950px; background-color:#e6e7eb; border-bottom:solid 1px #000000; font:13px bold; margin-left:1px; color:#333333; padding-top:6px; padding-left:30px; }
#subMenu .subLinks { margin:0px; float:left; color:orange; padding:2px 16px 0px 2px; }
#subMenu .subLinksCat { margin:0px; float:left; color:#000000; padding:2px 16px 0px 2px; }
#subMenu .subLinks:link { color:#9a9a9a; text-decoration:none; }
#subMenu .subLinks:visited { color:#9a9a9a; text-decoration:none; }
#subMenu .subLinks:hover { color:orange; text-decoration:none; }

.subMenu_heading { height:19px; padding-top:2px; padding-left:10px; color:#ffffff; font-size:12px; font-weight:bold; border:solid 1px #000000; background:url('../images/template/submenu_heading.gif') repeat-x; }
.subMenu_links { font-size:11px; background-color:#e6e7eb; border-left:solid 1px #000000;border-right:solid 1px #000000;border-bottom:solid 1px #000000; padding-left:10px; }
.subMenu_lnk { padding-top:10px; }
.subMenu_lnk_bottom { padding-top:10px; padding-bottom:10px; }

.subMenu_links a:link {color:#000000; text-decoration:none; }
.subMenu_links a:visited {color:#000000; text-decoration:none; }
.subMenu_links a:hover {color:#000000; text-decoration:underline; }

#breadcrumb { color:#000000; text-decoration:none; margin-left:17px; font-size:11px; }
#breadcrumb a { color:#ff9c00; text-decoration:none; }
#breadcrumb a:link { color:#ff9c00; text-decoration:none; }
#breadcrumb a:visited { color:#ff9c00; text-decoration:none; }
#breadcrumb a:hover { color:#ff9c00; text-decoration:underline; }

#container { float:none; clear:both; margin-top:0px; min-height:400px; }

#mainContent {font-size:11px; line-height:1.7em; float:right; width:774px; height:auto; min-height:100px; margin-left:5px; margin-top:5px; position:relative; }
#leftContent { float:left; width:184px; height:auto; min-height:300px; color:#000000; margin:10px 0px 0px 10px; }
#ifr_DundasImage { float:left; width:80px; height:auto; min-height:170px; color:#000000; margin:10px 0px 0px 10px; }


#mainContent #mainContentPadding { margin-right:10px; }

#mainContent h1 { font-size:13px; border:0px; margin:0px; padding:6px 0 10px 0; color:#000000; }
#mainContent h2 { font-size:11px; border:0px; margin:0px; padding:0px; color:#000000; text-align:left;  }
#mainContent .h2_center { text-align:left;  font-size:14px; font-weight:normal; }
#mainContent a { color:#1f5fa3; }
#mainContent a:link { color:#1f5fa3; text-decoration:none; }
#mainContent a:visited { color:#1f5fa3; text-decoration:none;}
#mainContent a:hover { color:#1f5fa3; text-decoration:underline;}
#mainContentHeading { float:left; height:27px; }
#subContentHeading { float:right; height:27px; }

#main { width:530px; float:left; }
#main_title { height:21px; margin-top:5px; margin-bottom:10px; padding-left:10px; color:#ffffff; font-size:12px; font-weight:bold; border:solid 1px #000000; background:url('../images/template/submenu_heading.gif') repeat-x; }
#right { float:right; padding-top:5px; padding-right:4px; } 

#footer { margin:0px auto; background-image:url(../images/template/footer.gif); width:982px; height:23px; text-align:left; color:#ffffff; font-size:10px; }
#footerBox { float:left; padding:4px 0px 0px 8px; }
#footerBox a { color:#ffffff; text-decoration:none; }
#footerBox a:link { color:#ffffff; text-decoration:none; }
#footerBox a:visited { color:#ffffff; text-decoration:none; }
#footerBox a:hover { color:#ffffff; text-decoration:underline; }
#footerlinks { float:right; padding:4px 8px 0px 0px; }
#footerlinks a { color:#ffffff; text-decoration:none; }
#footerlinks a:link { color:#ffffff; text-decoration:none; }
#footerlinks a:visited { color:#ffffff; text-decoration:none; }
#footerlinks a:hover { color:#ffffff; text-decoration:underline; }


/* error page */
#errorContainer { margin:40px auto; width:750px; min-height:261px; }
#errorBox { width:600px; min-height:261px; border:1px #000000 solid; float:left; position:relative;
	top: 2px;
	left: 104px;
}
#errorTitle { width:592px; height:19px; background:url(../images/template/submenu_heading.gif) repeat-x; margin:2px; padding:2px 0px 0px 4px; color:#ffffff; font-size:12px; font-weight:bold; border-bottom:solid 1px #000000; }
#errorContent {	width:570px; min-height:250px; height:250px; padding:15px 0 0 30px; font-size:11px; }
#errorContent1 {	width:570px; height:auto; padding:15px 0 0px 30px; font-size:11px; }
#errorBox #errorLbl { font-size:12px; width:550px }

/* login page */
#loginContainer { margin:40px auto; width:628px; min-height:261px; }
#loginBox { width:402px; min-height:261px; border:1px #000000 solid; float:left; position:relative;
	top: 2px;
	left: -11px;
}
#loginTitle { width:394px; height:19px; background:url(../images/template/submenu_heading.gif) repeat-x; margin:2px; padding:2px 0px 0px 4px; color:#ffffff; font-size:12px; font-weight:bold; border-bottom:solid 1px #000000; }
#loginContent {	width:378px; min-height:200px; height:200px; padding:15px 0 0 30px; font-size:11px; }
#loginContent1 {	width:378px; height:auto; padding:15px 0 0px 30px; font-size:11px; }
#loginBox #userNameLbl { font-size:11px; }
#loginBox #passwordLbl { font-size:11px; padding-top:7px;}
#loginBox #rememberMeChkBox { padding-top:10px; margin-left:-4px; font-size:11px; }
#loginBox #ChangePasswordChkBox { padding-top:10px; margin-left:-4px; font-size:11px; }
#loginBox #errorMsg { font-size:11px; color:Red; padding-top:10px; padding-bottom:10px; }
#loginBox #loginBtn { padding-top:0px; }
#loginBox #forgottenPwd { margin-top:6px; z-index:100px; font-size:11px; }

#loginContainer #contactBox { width:208px; height:261px;  border:1px #000000 solid; float:right; }
#loginContainer #contactTitle { width:200px; height:19px; background:url(../images/template/submenu_heading.gif) repeat-x; margin:2px; padding:2px 0px 0px 4px; color:#ffffff; font-size:12px; font-weight:bold; border-bottom:solid 1px #000000; }

#loginContainer #contactContent { width:186px; height:200px; padding:15px 0 0 20px; font-size:11px; }
#loginContainer #contactBtn { margin-left:40px; }
#loginContainer a { color:#1f5fa3; text-decoration:none; }
#loginContainer a:visited {color:#1f5fa3;}
#loginContainer a:active {color:#1f5fa3;}
#loginContainer a:hover {color:#1f5fa3; text-decoration:underline;}

#passwordSent { font-size:11px; padding-bottom:20px; padding-right:20px; }

#dateBox { font-weight:bold; font-size:1em; position:absolute; top:0px; right:6px; padding:0px 4px 0px 4px; }
/* #dateBox { font-weight:bold; font-size:1.2em; position:absolute; top:0px; right:93px; border:solid 1px #0a529d; background-color:#e6e7eb; padding:2px 4px 4px 4px; } */
.dateBoxTB { vertical-align:middle; text-align:center; font-weight:bold; color:#1f5fa3; }

#dateSelect {position:absolute; right:10px; top:27px; width:188px; height:298px; background-color:#ffffff; visibility:hidden; color:#ffffff; border:1px #000000 solid; }
#dateSelectHeader {width:180px; height:19px; margin:2px; padding:2px 0px 0px 4px; background:url(../images/template/submenu_heading.gif); position:relative; border-bottom:solid 1px #000000; }
#dateSelectTitle { position:absolute; top:-1px; left:5px; padding:0px; font-size:1em;  }
#dateSelectClose { position:absolute; top:-3px; right:5px; padding:0px; font-size:1em; }
#dateSelectContent { color:#6a8393; padding:5px; }
#dateSelectClose a:link {color:#ffffff; vertical-align:middle; }
#dateSelectClose a:visited {color:#ffffff; vertical-align:middle; }
#dateSelectClose a:active {color:#ffffff; vertical-align:middle; }
#dateSelectClose a:hover {color:#ffffff; vertical-align:middle; }
#dateSelectContent { color:#000000; }

.ajax__calendar_today { color:Red; }

#mainContent #circuits { position:absolute; left:0px; top:27px; width:742px; height:408px; padding:10px; border:solid 1px #0a529d; background-color:#ffffff; visibility:hidden; display:none }
#mainContent #circuitCloseBtn { position:absolute; right:0px; top:0px; width:178px; height:26px; visibility:hidden; z-index:500; }
#mainContent #circuitApply { padding-top:10px; width:178px; height:26px; visibility:hidden; z-index:500; float:right; }
#mainContent #circuitTitle { font-size:11px; }

#engineerContainer { margin:40px auto; width:428px; min-height:261px; }

#Graph { clear:both; margin-top:-1px;}
#GraphSummary { border:solid 1px #bbbbbb; background-color:#ffffff; height:40px; width:762px; margin-top:-2px; }

#totalConsumption { position:absolute; left:0px; width:300px; text-align:center; border-right:solid 1px #bbbbbb; height:18px; font-size:11px; padding:8px 0px 12px 0px; }
#consumptionTotal { position:absolute; left:300px; width:300px; text-align:center; border-right:solid 1px #bbbbbb; height:18px; font-size:11px; padding:8px 0px 12px 0px; }

#showHideCircuits { position:absolute; right:50px; width:78px; height:26px; padding:8px 0 0 4px;  }
#circuitCloseBtn { position:absolute; right:50px;  width:78px; height:26px; padding:8px 0 0 4px; visibility:hidden; z-index:500; }

#circuitsEnabled { border:solid 1px #000000; background-color:#ffffff; height:auto;  width:762px; margin-top:-4px; }
#circuitTitle { padding:10px; }

/* Home page */
#main_feature { margin:0px 0px 16px 0px; padding-top:70px; color:#ffffff; width:981px; font-size:24pt; text-align:center; height:260px; background:url(../images/home/main_feature.jpg); }

#sub_features { position:relative; margin:30px 0px 30px 18px; height:200px;}
#sub1_feature { position:absolute; left:40px; width:340px; height:200px; line-height:3em; }
#sub2_feature { position:absolute; left:396px; top:-80px; width:130px; height:200px; background:url(../images/home/sub_feature2.gif); padding:0px 15px 0px 15px; text-align:center; }
#sub3_feature { position:absolute; left:570px; top:-80px; width:130px; height:222px; background:url(../images/home/sub_feature3.gif); padding:0px 15px 0px 15px; text-align:center; }
#sub4_feature { position:absolute; left:744px; top:-80px; width:130px; height:200px; background:url(../images/home/sub_feature4.gif); padding:0px 15px 0px 15px; text-align:center; }
#sub_features h1 { font-size:12px; border:0px; margin:0px; padding:10px 0 0 0; color:#000000; text-align:center; }
#sub_features a { font-size:10px; color:#000000; text-decoration:none; }
#sub_features a:link { color:#000000; text-decoration:none; }
#sub_features a:visited { color:#000000; text-decoration:none; }
#sub_features a:hover { color:#000000; text-decoration:none; }

#sub2_arrow { position:absolute; left:461px; top:100px; width:28px; height:15px; }
#sub3_arrow { position:absolute; left:635px; top:160px; width:28px; height:15px; }
#sub4_arrow { position:absolute; left:809px; top:100px; width:28px; height:15px; }

/* Terms and Conditions */
#termsContainer { margin:40px auto; width:628px; }
.termsBox { width:100%; border:1px #0a529d solid; float:left; position:relative; }
.termsTitle { width:619px; height:19px; background:url(../images/template/submenu_heading.gif) repeat-x; margin:2px; padding:2px 0px 0px 4px; color:#ffffff; font-size:12px; font-weight:bold; border-bottom:solid 1px #000000; }
.termsContent {	width:578px; padding:15px 0 15px 30px; font-size:11px; }
.spacer1 { height:10px; width:100%; float:left; position:relative; }

#summary { margin-left:10px; }
.summary_tab { background-color:#e6e7eb; border:solid 1px #000000; width:730px; height:36px; position:relative; }
.summary_title { text-align:center; font-size:13px; color:#000000; font-weight:bold; padding-top:8px; }

.summary_sub_total { background-color:#ffffff; width:730px; height:20px; position:relative; }
.summary_sub_total #total { float:left; position:absolute; left:210px; text-align:right; }
.summary_sub_total #average { float:right; position:absolute; left:330px; text-align:right; }
.summary_sub_total #average_hour { float:right; position:absolute; left:490px; text-align:right; }
.summary_tab .summary_day { text-align:left; font-size:1.2em; color:#000000; padding-top:8px; padding-left:10px; float:left;  }
.summary_tab .summary_value { background-color:#ffffff; width:121px; height:21px; text-align:right; font-size:12px; color:#000000; position:absolute; left:140px; margin-top:6px; padding-top:2px; padding-right:10px; }
.summary_tab .summary_value2 { background-color:#ffffff; width:121px; height:21px; text-align:right; font-size:12px; color:#000000; position:absolute; left:313px; margin-top:6px; padding-top:2px; padding-right:10px; }
.summary_tab .summary_value3 { background-color:#ffffff; width:121px; height:21px; text-align:right; font-size:12px; color:#000000; position:absolute; left:480px; margin-top:6px; padding-top:2px; padding-right:10px; }
.summary_tab .summary_view { position:absolute; right:0px; margin-top:6px; padding-right:10px; }
.summary_tab .summary_refresh { position:absolute; left:283px; margin-top:10px; padding-right:10px; }
#summary_updated { width:730px; height:36px; text-align:right; font-size:9px; color:#000000; padding-top:0px; }
.summary_spacer { height:5px; }
.summary_description { width:730px; height:36px; text-align:left; font-size:11px; color:#000000; padding-top:0px; }

/* Button hover overs */
.loginButton {
  background: url(../images/buttons/btn_login.gif);
  width:79px;
  height:28px;
}

.loginButton:hover {
    background: url(../images/buttons/btn_login_over.gif);
    width:79px;
    height:28px;
    cursor:hand;
}

.contactButton {
  background: url(../images/buttons/btn_contact.gif);
  width:79px;
  height:28px;
}

.contactButton:hover {
    background: url(../images/buttons/btn_contact_over.gif);
    width:79px;
    height:28px;
    cursor:hand;
}

.submitButton {
  background: url(../images/buttons/btn_submit.gif);
  width:79px;
  height:28px;
}

.submitButton:hover {
    background: url(../images/buttons/btn_submit_over.gif);
    width:79px;
    height:28px;
    cursor:hand;
}

.continueButton {
  background: url(../images/buttons/btn_continue.gif);
  width:79px;
  height:28px;
}

.continueButton:hover {
    background: url(../images/buttons/btn_continue_over.gif);
    width:79px;
    height:28px;
    cursor:hand;
}

.registerButton {
  background: url(../images/buttons/btn_register.gif);
  width:79px;
  height:28px;
}

.registerButton:hover {
    background: url(../images/buttons/btn_register_over.gif);
    width:79px;
    height:28px;
    cursor:hand;
}

.noButton {
  background: url(../images/buttons/btn_no.gif);
  width:79px;
  height:28px;
}

.noButton:hover {
    background: url(../images/buttons/btn_no_over.gif);
    width:79px;
    height:28px;
    cursor:hand;
}

.yesButton {
  background: url(../images/buttons/btn_yes.gif);
  width:79px;
  height:28px;
}

.yesButton:hover {
    background: url(../images/buttons/btn_yes_over.gif);
    width:79px;
    height:28px;
    cursor:hand;
}

.applyButton {
  background: url(../images/buttons/btn_apply.gif);
  width:79px;
  height:28px;
}

.applyButton:hover {
    background: url(../images/buttons/btn_apply_over.gif);
    width:79px;
    height:28px;
    cursor:hand;
}

.circuitsButton {
  background: url(../images/buttons/btn_circuits.gif);
  width:79px;
  height:28px;
}

.circuitsButton:hover {
    background: url(../images/buttons/btn_circuits_over.gif);
    width:79px;
    height:28px;
    cursor:hand;
}

.backButton {
  background: url(../images/buttons/btn_cancel.gif);
  width:79px;
  height:28px;
}

.backButton:hover {
    background: url(../images/buttons/btn_cancel_over.gif);
    width:79px;
    height:28px;
    cursor:hand;
}

.createButton {
  background: url(../images/buttons/btn_create.gif);
  width:79px;
  height:28px;
}

.createButton:hover {
    background: url(../images/buttons/btn_create_over.gif);
    width:79px;
    height:28px;
    cursor:hand;
}

.cancelButton {
  background: url(../images/buttons/btn_cancel.gif);
  width:79px;
  height:28px;
}

.cancelButton:hover {
    background: url(../images/buttons/btn_cancel_over.gif);
    width:79px;
    height:28px;
    cursor:hand;
}

.viewButton {
	background: url(../images/buttons/btn_view.gif);
	width:79px;
	height:28px;
}

.viewButton:hover {
	background: url(../images/buttons/btn_view_over.gif);
	width:79px;
    height:28px;
    cursor:hand;
}

.showPagesButton 
{
	vertical-align:middle;
	margin-top:8px;
	margin-bottom:5px;
	background: url(../images/buttons/btn_show_all_pages.gif);
	width:79px;
	height:28px;
}

.showPagesButton:hover 
{
	margin-top:8px;
	margin-bottom:5px;
	background: url(../images/buttons/btn_show_all_pages_over.gif);
	width:79px;
    height:28px;
    cursor:hand;
}

.hidePagesButton 
{
	vertical-align:middle;
	margin-top:8px;
	margin-bottom:5px;
	background: url(../images/buttons/btn_hide_all_pages.gif);
	width:79px;
	height:28px;
}

.hidePagesButton:hover 
{
	margin-top:8px;
	margin-bottom:5px;
	background: url(../images/buttons/btn_hide_all_pages_over.gif);
	width:79px;
    height:28px;
    cursor:hand;
}

.endConnectionButton 
{

	background: url(../images/buttons/btn_end_connection.gif);
	width:117px;
	height:25px;
}

.endConnectionButton:hover 
{
	background: url(../images/buttons/btn_end_connection_over.gif);
	width:117px;
    height:25px;
    cursor:hand;
}

.calculateButton 
{

	background: url(../images/buttons/btn_calculate.gif);
	width:79px;
	height:28px;
}

.calculateButton:hover 
{
	background: url(../images/buttons/btn_calculate_over.gif);
	width:79px;
	height:28px;
    cursor:hand;
}