body{
	background-color:#EEEEEE;
}
/*#mainWrapper {

	width: 850px !important;
	height: 638px !important;
    position: relative;
    margin: 0 auto;
    top: 50%;
    left: 50%;
    margin-top: -397px;
    margin-left: -425px;
    overflow: hidden;
}*/
#sunLightHeaders{
	position:absolute;
	top:115px;
	left:0px;
	width:220px;
	height:30px;
	cursor:pointer;
	background-image:url("../images/sunvaluesBg.png");
	z-index:20;
}

#sunLight{
	position:absolute;
	top:135px;
	left:0px;
	width:220px;
	height:160px;
	overflow:scroll;
	overflow-x:hidden;
	z-index:20;
}
#createCustomPowerRequirement{
	position:absolute;
	left:0px;
	top:68px;
	width:220px;
	height:32px;
	font-family:Arial;
	font-size:12px;
	color:#FFFFFF;
	z-index:20;
	text-align:center;
	line-height:30px;
	background-color:#555555;
}
#yourNearestLocation{
	position:absolute;
	left:0px;
	top:100px;
	width:220px;
	height:15px;
	font-family:Arial;
	font-size:11px;
	color:#cccccc;
	z-index:20;
	text-align:center;
	line-height:15px;
	background-color:#333333;
}
#calculateButton{
	position:absolute;
	left:0px;
	top:362px;
	z-index:20;
	width:220px;
	height:38px;
	font-family:Arial;
	font-size:12px;
	background-color:#555555;
	color:#FFFFFF;
}
#calculateButtonTitle{
	position:absolute;
	left:0px;
	top:342px;
	width:220px;
	height:20px;
	font-family:Arial;
	font-size:14px;
	color:#FF0000;
	z-index:20;
	text-align:center;
	line-height:20px;
	background-color:#222222;
}
#calculatedValue{
	position:absolute;
	left:80px;
	top:362px;
	z-index:20;
	height:38px;
	font-family:Arial;
	font-size:30px;
	color:#FF0000;
}
#inputArea{
	position:absolute;
	left:0px;
	top:295px;
	width:220px;
	height:47px;
	font-family:Arial;
	font-size:11px;
	color:#cccccc;
	z-index:20;
	text-align:center;
	line-height:20px;
	background-color:#000000;
}
.inputClass{
	font-family:Arial;
	font-size:11px;
	width:30px;
	height:12px;
}
.inputBtnClass{
	font-family:Arial;
	font-size:14px;
	font-weight:bold;
	line-height:20px;
	width:15px;
	height:15px;
	/*background-color:#444444;*/
	border-radius:2px;
	cursor:pointer;
}
.plus{
	background-image:url("../images/plus.jpg");
}
.minus{
	background-image:url("../images/minus.jpg");
}

#roof{
	position:absolute;
	left:505px;
	top:146px;
	/*width:480px;
	height:369px;*/
	opacity:1;
	-webkit-transition: opacity 1s ease-out;
	-moz-transition: opacity 1s ease-out;
	-o-transition: opacity 1s ease-out;
	transition: opacity 1s ease-out;
	z-index:12;
}
#solarPanels{
	position:absolute;
	left:220px;
	top:31px;
	width:480px;
	height:369px;
	/*background-image:url("../images/panels/reference.jpg");*/
	opacity:1;
	-webkit-transition: opacity 0.2s ease-out;
	-moz-transition: opacity 0.2s ease-out;
	-o-transition: opacity 0.2s ease-out;
	transition: opacity 0.2s ease-out;
	z-index:11;
}
#houseNormal{
	position:absolute;
	left:220px;
	top:31px;
	width:480px;
	height:369px;
	background-image:url("../images/houseNormal.jpg");
	opacity:1;
	-webkit-transition: opacity 1s ease-out;
	-moz-transition: opacity 1s ease-out;
	-o-transition: opacity 1s ease-out;
	transition: opacity 1s ease-out;
	z-index:10;
}
#houseEvening{
	position:absolute;
	left:220px;
	top:31px;
	width:480px;
	height:369px;
	background-image:url("../images/houseEvening.jpg");
	opacity:1;
	-webkit-transition: opacity 1s ease-out;
	-moz-transition: opacity 1s ease-out;
	-o-transition: opacity 1s ease-out;
	transition: opacity 1s ease-out;
	z-index:9;
}
#houseLateEvening{
	position:absolute;
	left:220px;
	top:31px;
	width:480px;
	height:369px;
	background-image:url("../images/houseLateEvening.jpg");
	opacity:1;
	-webkit-transition: opacity 1s ease-out;
	-moz-transition: opacity 1s ease-out;
	-o-transition: opacity 1s ease-out;
	transition: opacity 1s ease-out;
	z-index:8;
}
#houseNight{
	position:absolute;
	left:220px;
	top:31px;
	width:480px;
	height:369px;
	background-image:url("../images/houseNight.jpg");
	opacity:1;
	-webkit-transition: opacity 0.5s ease-out;
	-moz-transition: opacity 0.5s ease-out;
	-o-transition: opacity 0.5s ease-out;
	transition: opacity 0.5s ease-out;
	z-index:7;
}
#houseNightLight{
	position:absolute;
	left:220px;
	top:31px;
	width:480px;
	height:369px;
	background-image:url("../images/houseNightLight.jpg");
	z-index:6;
}

#sunicon{
	position:absolute;
	left:455px;
	top:0px;
	width:20px;
	height:20px;
	background-image:url("../images/sunicon.png");
	z-index:6;
}

#sun{
	position:absolute;
	left:210px;
	top:20px;
	width:128px;
	height:128px;
	z-index:15;
}
#sunimage{
	position:absolute;
	top:0px;
	left:0px;
	width:128px;
	height:128px;
	-webkit-transition: all 1s ease-out;
	-moz-transition: all 1s ease-out;
	-o-transition: all 1s ease-out;
	transition: all 1s ease-out;
}
#logo{
	position:absolute;
	left:530px;
	top:0px;
	z-index: 25;
}
#state{
	position:absolute;
}
#location{
	position:absolute;
}
#sunValue{
	position:absolute;
}
#stateHeader{
	position:absolute;
	z-index:10;
}
#locationHeader{
	position:absolute;
	z-index:10;
}
#sunValueHeader{
	position:absolute;
	z-index:10;
}
.headerHover{
	width:100%;
	font-family:Arial;
	font-size:11px;
	background-image:url("../images/sunvaluesBg_rollover.png");
	background-color:#cccccc;
	color:#ffffff;
	padding:3px;
	font-weight:bold;
}
.btnClass{
	font-family:Arial;
	font-size:11px;
}
.titleName{
	position:absolute;
	height:14px;
	width:100%;
	font-family:Arial;
	font-size:11px;
	background-image:url("../images/sunvaluesBg.png");
	background-color:#888888;
	color:#FFFFFF;
	padding:3px;
	font-weight:bold;
}
.columnOdd{
	background-image:url("../images/sunvaluesBg1.png");
	background-color:#efefef;
	font-family:Arial;
	font-size:11px;
	padding:3px;
	color:#FFFFFF;
	cursor:pointer;
}
.columnEven{
	background-image:url("../images/sunvaluesBg1.png");
	background-color:#cccccc;
	font-family:Arial;
	font-size:11px;
	padding:3px;
	color:#FFFFFF;
	cursor:pointer;
}
.columnHover{
	background-image:url("../images/sunvaluesBg1_rollover.png");
	background-color:#0000ff;
	color:#ffffff;
}
.columnSelected{
	background-color:#000000;
	font-family:Arial;
	font-size:11px;
	padding:3px;
	color:#FFFFFF;
	cursor:auto;
}
#helpholder{
	position:absolute;
	left:0px;
	top:0px;
	width:700px;
	height:400px;
	background-color:#000000;
	background-image:url("../images/transparent.png");
	opacity:0.7;
	z-index:20;
}
#helpBtn{
	position:absolute;
	left:667px;
	top:3px;
	width:30px;
	height:19px;
	opacity:0.5;
	z-index:22;
	background-image:url("../images/close.png");
	cursor:pointer;
	-webkit-transition: opacity 0.5s ease-out;
	-moz-transition: opacity 0.5s ease-out;
	-o-transition: opacity 0.5s ease-out;
	transition: opacity 0.5s ease-out;
}
#help{
	position:absolute;
	width:575px;
	height:275px;
	border:5px solid #FFFFFF;
	padding:10px;
	font-family:Arial;
	font-size:15px;
	overflow-y:scroll;
	left:45px;
	top:45px;
	/*background-color:#ff0000;*/
	background-image:url("../images/helptile.png");
	color:#FFFFFF;
	z-index:21;
}
#stage{
	position:absolute;
	width:700px;
	height:400px;
	border:1px solid #000000;
}
#activityTitle{
	position:absolute;
	left:0px;
	top:0px;
	width:700px;
	height:31px;
	font-family:Arial;
	font-size:24px;
	text-align:center;
	color:#FFFFFF;
	background-image:url("../images/titleBg.png");
	background-color:#000000;
}
#kwh{
	position:absolute;
	top:31px;
	left:0px;
	height:33px;
	width:221px;
	background-color:#000000;
	text-align:right;
	padding:2px;
}
#kwhTarget{
	font-family:Arial;
	font-size:25px;
	color:#FF0000;
}
#kwhTargetText{
	font-family:Arial;
	font-size:20px;
	color:#FF0000;
}
#solarholder{
	position:absolute;
	left:300px;
	top:70px;
	border:1px solid #000;
	width:400px;
	height:300px;
}
.solar{
	z-index:20;
	position:absolute;
	width:30px;
	height:30px;
	-webkit-transition: opacity 1s ease-in-out;
	-moz-transition: opacity 1s ease-in-out;
	-o-transition: opacity 1s ease-in-out;
	transition: opacity 1s ease-in-out;
}
#consumption{
	position:absolute;
	left:220px;
	top:31px;
	width:476px;
	height:365px;
	border:2px solid #000000;
	background-color:#000000;
	z-index:18;
	font-family:Arial;
	font-size:11px;
	color:#FFFFFF;
	overflow-y:scroll;
	cursor:pointer;
	display:none;
}
#consumptionBlacker{
	position:absolute;
	display:none;
	left:0px;
	top:100px;
	width:220px;
	height:300px;
	background-color:#000000;
	background-image:url("../images/transparent.png");
	opacity:0.7;
	z-index:20;
}

.arrows{
	position:absolute;
	right:10px;
	top:10px;
}

#resultBlocker{
	display:none;
	position:absolute;
	left:0px;
	top:0px;
	width:700px;
	height:400px;
	background-color:#000000;
	background-image:url("../images/transparent.png");
	opacity:0;
	z-index:45;
	-webkit-transition: opacity 1s ease-in-out;
	-moz-transition: opacity 1s ease-in-out;
	-o-transition: opacity 1s ease-in-out;
	transition: opacity 1s ease-in-out;
}

#result{
	display:none;
	position:absolute;
	width:540px;
	left:50px;
	top:50px;
	height:240px;
	border:3px solid #FFFFFF;
	background-color:#000000;
	text-align:center;
	color:#FFFFFF;
	padding:30px;
	font-family:Arial;
	font-size:14px;
	z-index:50;
	opacity:0;
	-webkit-transition: opacity 1s ease-in-out;
	-moz-transition: opacity 1s ease-in-out;
	-o-transition: opacity 1s ease-in-out;
	transition: opacity 1s ease-in-out;
}
