/* Graph Сharts */
#body #page_cases {
  background: none no-repeat scroll 0 0 transparent;
  height: 433px;
  padding: 0 0 60px 0;
}
#body #energy_time {
  background: none no-repeat scroll 0 0 transparent;
  padding: 60px 0;
}
#body #energy_type {
  background: none no-repeat scroll 0 0 transparent;
  padding: 0 0 60px 0;
  border-bottom: 1px solid #eee;
}

.clear {
  clear: both;
  display: block;
  height: 0;
  overflow: hidden;
  visibility: hidden;
}

.dayliprodwrap {
  float: left;
  /*width: 320px;*/
  width: 340px;
}

/* +  xenon615 --------------------------------------------------------------------------------------*/

.totals.off,
.totals.brandeis.off,
.dayliprodwrap.off,
.monthlyprodwrap.off,
.legend.off,
.legend.brandeis.off,
.co2avoidwrap.off, 
.co2avoidwrap.brandeis.off{
  display: none;
}

#daylibrandeis-ph > div:nth-child(2) > div:nth-child(2){
  background:  url('../images/bar-bg.png') no-repeat left top;
  /*
  background-size: 50px 165px;
  height: 165px;
  */
  background-size: 50px 175px;
  height: 175px;
  
}


div.flot-y-axis:nth-child(3){
  background: url('../images/bar-bg.png') no-repeat right top;
  background-size: 50px 175px;
  height: 175px;
}
#monthlybrandeis-ph > div:nth-child(2) > div:nth-child(2){
  background:  url('../images/bar-bg.png') no-repeat left top;
  background-size: 50px 175px;
  height: 175px;
}
.legend.brandeis > div {
  margin-top: 20px;
 }

.legend.brandeis > div > div{
  margin-left: 20px;
  display: inline-block;
 }
 .legend.brandeis > div > div input{
 margin-left: 10px;
 margin-right: 5px 
}

#daylibrandeis-ph{
width: 340px;
height: 250px;
/*margin: 0px 20px 0px 20px;*/
}

#monthlybrandeis-ph{
width: 340px;
height: 250px;
margin: 0px;
}

.flot-y-axis .flot-tick-label{
  color: white;
  font-size: 10px;
  width: 50px;
/*line-height: 4em;*/
text-align: center !important;
}

.flot-x-axis .flot-tick-label{
color: #333;
  font-size: 10px;
  -webkit-transform: rotate(-90deg);
  -moz-transform: rotate(-90deg);
  -ms-transform: rotate(-90deg);
  -o-transform: rotate(-90deg);
  transform: rotate(-90deg);
  white-space: nowrap;
  margin: 30px 0;
  text-align: right !important;
  max-width: 60px !important;
  width: 60px

}

.axisLabel {
	position: absolute;
	text-align: center;
	font-size: 12px;
        color: #666;
        font-weight: bold;
}

.yaxisLabel {
 top: 185px;
 left: 15px;
 }

#daylibrandeis-ph .yaxisLabel.left{
	left: 10px;
}

#daylibrandeis-ph .yaxisLabel.right{
	left: 305px;
}
#daylibrandeis-ph .xaxisLabel{
	left: 50%;
        top:90%;
}

/* -  xenon615 -------------------------------------------------------------------------------------*/



.monthlyprodwrap {
  float: left;
  width: 340px;
  margin-left: 50px;
}
.co2avoidwrap {
  width: 219px;
  float: right;
  text-align: center;
  position: relative;
}
.co2avoidwrap > img {
  position: absolute;
  top: 80px;
  left: 50%;
  margin-left: -102px;
  -webkit-transition: opacity 1000ms ease-in;
  -moz-transition: opacity 1000ms ease-in;
  -ms-transition: opacity 1000ms ease-in;
  -o-transition: opacity 1000ms ease-in;
  transition: opacity 1000ms ease-in;
  opacity: 0;
}

/* + xenon615 --------------- */

.co2avoidwrap.brandeis > img {
  -webkit-transition: opacity 200ms ease-in;
  -moz-transition: opacity 200ms ease-in;
  -ms-transition: opacity 200ms ease-in;
  -o-transition: opacity 200ms ease-in;
  transition: opacity 200ms ease-in;
}
.co2avoidwrap.brandeis > img#frameb0 {
  opacity: 1;
}
/* - xenon615 --------------- */

.co2avoidwrap > img#frame0 {
  opacity: 1;
}

.dayliprodwrap h3,
.monthlyprodwrap h3 {
  font-family: 'GothamBlackGothamBlack';
  font-size: 14px;
  font-weight: normal;
  line-height: normal;
  padding: 0 0 29px;
  text-transform: uppercase;
}
.dayliprodwrap h3 span,
.monthlyprodwrap h3 span {
  color: #999;
  font-family: 'GothamLightGothamLight';
  font-size: 14px;
  font-weight: normal;
  line-height: normal;
  text-transform: uppercase;
}
.co2avoidwrap h3 {
  font-family: 'GothamBlackGothamBlack';
  font-size: 14px;
  font-weight: normal;
  line-height: normal;
  padding: 0 0 9px;
  text-transform: uppercase;
}
.co2avoidwrap h4 {
  color: #66a1d5;
  font-family: 'GothamBlackGothamBlack';
  font-size: 24px;
  font-weight: normal;
  line-height: normal;
  padding: 0 0 19px;
  text-transform: uppercase;
}

/* + xenon615 ----------------------- */

.co2avoidwrap.brandeis > img {
  margin-left: -55px !important;
}
.co2avoidwrap.brandeis h4{
  position: absolute;
  top: 140px;
  left: 80px;
  z-index: 100;
  color: white;
  font-size:20px !important;
}

.co2avoidwrap.brandeis > img{
  top:40px;
}
/* - xenon615 ----------------------- */



.d-chart {
  height: 175px;
  position: relative;
  width: 320px;
}
.d-chart .grid {
  width: 275px;
  height: 175px;
  display: block;
  border-left: 45px solid #9db3b6;
  position: absolute;
  left: 0;
  top: 0;
}
.d-chart .grid > li {
  border-bottom: 1px solid #eee;
  display: block;
  height: 24px;
}
.d-chart .grid > li span {
  color: #fff;
  display: inline-block;
  font-size: 10px;
  position: relative;
  text-align: right;
  top: 15px;
  left: -45px;
  width: 35px;
}

.m-chart {
  height: 175px;
  position: relative;
  width: 325px;
}
.m-chart .grid {
  width: 276px;
  height: 175px;
  display: block;
  border-left: 49px solid #9db3b6;
  position: absolute;
  left: 0;
  top: 0;
}
.m-chart .grid > li {
  border-bottom: 1px solid #eee;
  display: block;
  height: 21px;
}
.m-chart .grid > li span {
  color: #fff;
  display: inline-block;
  font-size: 10px;
  position: relative;
  text-align: right;
  top: 12px;
  left: -47px;
  width: 40px;
}

.d-chart .forecasted {
  bottom: 0;
  font-size: 0;
  left: 45px;
  position: absolute;
}
.d-chart .forecasted > li {
  background-color: #ddd;
  vertical-align: bottom;
  display: inline-block;
  height: 120px;
  margin: 0 0 0 3px;
  width: 36px;
}
.d-chart .actual {
  bottom: 0;
  font-size: 0;
  left: 45px;
  position: absolute;
}
.d-chart .actual > li {
  background: #4786b3 url('../images/bgr_bar.png') repeat left top;
  vertical-align: bottom;
  display: inline-block;
  height: 90px;
  margin: 0 0 0 3px;
  width: 36px;
}

.m-chart .forecasted {
  bottom: 0;
  font-size: 0;
  left: 49px;
  position: absolute;
}
.m-chart .forecasted > li {
  background-color: #ddd;
  vertical-align: bottom;
  display: inline-block;
  height: 120px;
  margin: 0 0 0 2px;
  width: 21px;
}
.m-chart .actual {
  bottom: 0;
  font-size: 0;
  left: 49px;
  position: absolute;
}
.m-chart .actual > li {
  background: #4786b3 url('../images/bgr_bar.png') repeat left top;
  vertical-align: bottom;
  display: inline-block;
  height: 90px;
  margin: 0 0 0 2px;
  width: 21px;
}
.d-labels {
  width: 320px;
  display: block;
  font-size: 0;
}
.d-labels > ul > li {
  width: 39px;
  height: 55px;
  text-align: center;
  display: inline-block;
}
.d-labels > ul > li.first {
  width: 47px;
}
.d-labels > ul > li > span {
  color: #333;
  font-size: 10px;
  -webkit-transform: rotate(-90deg);
  -moz-transform: rotate(-90deg);
  -ms-transform: rotate(-90deg);
  -o-transform: rotate(-90deg);
  transform: rotate(-90deg);
  display: inline-block;
  position: relative;
  top: 20px;
}
.d-labels > ul > li.first > span {
  color: #999;
}

.m-labels {
  width: 325px;
  display: block;
  font-size: 0;
}
.m-labels > ul > li {
  width: 23px;
  height: 55px;
  text-align: center;
  display: inline-block;
}
.m-labels > ul > li.first {
  width: 24px;
}
.m-labels > ul > li > span {
  color: #333;
  width: 60px;
  font-size: 10px;
  text-align: right;
  -webkit-transform: rotate(-90deg);
  -moz-transform: rotate(-90deg);
  -ms-transform: rotate(-90deg);
  -o-transform: rotate(-90deg);
  transform: rotate(-90deg);
  display: inline-block;
  position: relative;
  left: -15px;
  top: 30px;
}
.m-labels > ul > li.first > span {
  color: #999;
}

.legend {
  border-bottom: 1px solid #eee;
  border-top: 1px solid #eee;
  margin-top: 10px;
  padding: 10px 0;
  color: #999;
  font-family: 'GothamLightGothamLight';
  font-size: 12px;
  font-weight: normal;
  line-height: normal;
  text-transform: uppercase;
}
.legend strong {
  font-family: 'GothamBlackGothamBlack';
  font-size: 12px;
  font-weight: normal;
  line-height: normal;
  text-transform: uppercase;
}
.legend .forecasted {
  background: none repeat scroll 0 0 #ccc;
  display: inline-block;
  height: 13px;
  margin: 0 15px 0 0;
  overflow: hidden;
  vertical-align: middle;
  position: relative;
  top: -1px;
  width: 13px;
}
.legend .actual {
  background: #4786b3 url('../images/bgr_bar.png') repeat left top;
  display: inline-block;
  height: 13px;
  margin: 0 15px 0 16px;
  overflow: hidden;
  vertical-align: middle;
  position: relative;
  top: -1px;
  width: 13px;
}

/* + xenon615 -------------------------*/
.legend.brandeis {
margin-top:10px;
padding: 20px 0;

}

.legend.brandeis .actual{
  background-image: none;
  background-color: #009900;
}

.legend.brandeis .forecasted{
  background-color: #4786b3;
}

.legend .oil {
  background-color:  #3f464d ;
  display: inline-block;
  height: 13px;
  margin: 0 15px 0 16px;
  overflow: hidden;
  vertical-align: middle;
  position: relative;
  top: -1px;
  width: 13px;
}
/* - xenon615 -------------------------*/


.totals > div {
  float: left;
  padding-top: 40px;
  width: 320px;
}
.totals > div > h3 {
  font-family: 'GothamBlackGothamBlack';
  font-size: 14px;
  font-weight: normal;
  line-height: normal;
  text-transform: uppercase;
}
.totals > div > h4 {
  color: #66a1d5;
  font-family: 'GothamLightGothamLight';
  font-size: 24px;
  font-weight: normal;
  line-height: normal;
  padding-top: 20px;
  text-transform: uppercase;
}
.totals > div > h4 > strong {
  font-family: 'GothamBlackGothamBlack';
}

/* + xenon615 -----------*/
.totals.brandeis > div {
  width: 480px;
}
/* - xenon615 -----------*/

.mixovertime-chart {
	display: block;
  position: relative;
  height: 470px;
	width: 100%;
}

.mixovertime-chart .labels {
  display: block;
  position: absolute;
  width: 10px;
	bottom: 40px;
	left: 14px;
}
.mixovertime-chart .labels > li {
  display: block;
  height: 63px;
  border-bottom: 1px solid #ccc;
  border-right: 1px solid #ccc;
}
.mixovertime-chart .labels > li:first-child {
	height: 0px;
  border-right: none;
}
.mixovertime-chart .labels > li span {
  color: #777;
  display: block;
  position: relative;
  font-family: 'GothamMediumGothamMedium';
	font-size: 10px;
  -webkit-transform: rotate(-90deg);
  -moz-transform: rotate(-90deg);
  -ms-transform: rotate(-90deg);
  -o-transform: rotate(-90deg);
  transform: rotate(-90deg);
	top: 61px;
  left: -12px;
	text-align: center;
}
.mixovertime-chart .labels > li:first-child span {
  top: 0px;
}
.mixovertime-chart .labels > li:last-child span {
  top: 58px;
}

.mixovertime-chart .graph {
  display: block;
  position: absolute;
  width: 936px;
	bottom: 39px;
	left: 24px;
}
.mixovertime-chart .grid {
  display: block;
  position: absolute;
  width: 936px;
	bottom: 40px;
	left: 24px;
}
.mixovertime-chart .grid > li {
  display: block;
  height: 0px;
  width: 100%;
  border-bottom: 1px solid #ddd;
}

.mixovertime-chart .arrow {
  display: block;
  position: absolute;
	bottom: 38px;
	right: 0px;
}
.mixovertime-chart .arrow > li {
  display: block;
  width: 9px;
	height: 5px;
	font-size: 0;
  background: url('../images/arrow.png') no-repeat;
}

.mixovertime-chart .years {
	display: block;
	position: absolute;
  left: 24px;
	bottom: 41px;
	font-size: 0;
}
.mixovertime-chart .years > li {
  display: inline-block;
  width: 40px;
	height: 380px;
	font-size: 0;
	vertical-align: bottom;
	position: relative;
	cursor: pointer;
  background: url('../images/bgbb.png') repeat-y;
}
.mixovertime-chart .years > li:hover{
  background: url('../images/bgbbh.png') repeat-y;
}
.mixovertime-chart .years > li span{
  color: #666;
  display: block;
	position: relative;
  font-family: 'GothamLightGothamLight';
	font-size: 10px;
	text-align: center;
	text-transform: uppercase;
	top: 390px;
}
.mixovertime-chart .years > li:hover span{
	color: #333;
  font-family: 'GothamBlackGothamBlack';
}

.mixovertime-chart .types {
	display: block;
	position: absolute;
  left: 24px;
	bottom: 15px;
	font-size: 0;
}
.mixovertime-chart .types > li {
  display: inline-block;
  width: 132px;
	font-size: 0;
	margin: 0 12px;
	vertical-align: bottom;
	position: relative;
	background: red;
}
.mixovertime-chart .types > li span {
  display: block;
  font-family: 'GothamMediumGothamMedium';
	font-size: 14px;
	text-align: center;
	text-transform: uppercase;
}

.mixovertime-chart .tinfobox {
	display: block;
	position: absolute;
	left: 60px;
	top: 60px;
}
.mixovertime-chart .tinfobox .tyear {
	display: block;
	position: absolute;
	font-family: 'GothamBlackGothamBlack';
	font-size: 90px;
	color: #F0F0F0;
}
.mixovertime-chart .tinfobox .tlegend {
	display: block;
	position: absolute;
	left: 280px;
	top: -10px;
	width: 600px;
}
.mixovertime-chart .tinfobox .tlegend ul {
	display: block;
	width: 100%;
}
.mixovertime-chart .tinfobox .tlegend > ul li {
	display: block;
	float: left;
	margin-right: 40px;
}
.mixovertime-chart .rect {
	display: inline-block;
	width: 28px;
	height: 13px;
	background: orange;
	margin-right: 0.5em;
}
.mixovertime-chart .tinfobox .tlegend > ul li span{
	font-family: 'GothamBlackGothamBlack';
	text-transform: uppercase;
	font-size: 14px;
	vertical-align: 20px;
}
.mixovertime-chart .tinfobox .tlegend > ul li strong{
	font-family: 'GothamBlackGothamBlack';
	text-transform: uppercase;
	font-size: 24px;
	color: #66a1d5;
}
.mixovertime-chart .tinfobox .tlegend > ul li span:last-child{
  font-family: 'GothamLightGothamLight';
	text-transform: uppercase;
	font-size: 24px;
	vertical-align: 0;
	color: #66a1d5;
}
.mixovertime-chart .tcoal .rect {
  background: url('../images/tcoal.png') no-repeat;
}
.mixovertime-chart .tngas .rect {
  background: url('../images/tngas.png') no-repeat;
}
.mixovertime-chart .trenew .rect {
  background: url('../images/trenew.png') no-repeat;
}

.mixovertime-legend {
	display: block;
	position: relative;
  height: 70px;
	width: 100%;
	padding-top: 8px;
	border-bottom: 1px solid #eee;
	border-top: 1px solid #eee;
}
.mixovertime-legend ul {
	display: block;
	position: relative;
	left: 560px;
}
.mixovertime-legend > ul li {
	display: block;
	float: left;
	margin-right: 20px;
}
.mixovertime-legend .rect {
	display: inline-block;
	width: 22px;
	height: 10px;
	margin-right: 0.5em;
	vertical-align: -2px;
}
.mixovertime-legend > ul li strong{
  font-family: 'GothamLightGothamLight';
	text-transform: uppercase;
	font-size: 13px;
}
.mixovertime-legend .tcoal .rect {
  background: url('../images/tcoal.png') no-repeat;
}
.mixovertime-legend .tngas .rect {
  background: url('../images/tngas.png') no-repeat;
}
.mixovertime-legend .trenew .rect {
  background: url('../images/trenew.png') no-repeat;
}




/*    */
.mixbytype-chart {
	display: block;
  position: relative;
  height: 470px;
	width: 100%;
	}
/*    */
.mixbytype-chart .labels {
  display: block;
  position: absolute;
  width: 10px;
	bottom: 40px;
	left: 14px;
}
.mixbytype-chart .labels > li {
  display: block;
  height: 75px;
  border-bottom: 1px solid #ccc;
  border-right: 1px solid #ccc;
}
.mixbytype-chart .labels > li:first-child {
	height: 0px;
  border-right: none;
}
.mixbytype-chart .labels > li span {
  display: block;
  position: relative;
  font-family: 'GothamMediumGothamMedium';
	font-size: 10px;
  -webkit-transform: rotate(-90deg);
  -moz-transform: rotate(-90deg);
  -ms-transform: rotate(-90deg);
  -o-transform: rotate(-90deg);
  transform: rotate(-90deg);
	top: 75px;
  left: -12px;
	text-align: center;
}
.mixbytype-chart .labels > li:first-child span {
  top: 0px;
}
.mixbytype-chart .labels > li:last-child span {
  top: 72px;
}
/*    */
.mixbytype-chart .grid {
  display: block;
  position: absolute;
  width: 936px;
	bottom: 40px;
	left: 24px;
}
.mixbytype-chart .grid > li {
  display: block;
  height: 75px;
  width: 100%;
  border-bottom: 1px solid #eee;
}
.mixbytype-chart .grid > li:last-child {
  border-bottom: 1px solid #ccc;
}
/*    */
.mixbytype-chart .data {
	display: block;
	position: absolute;
  left: 24px;
	bottom: 41px;
	font-size: 0;
}
.mixbytype-chart .data > li {
  display: inline-block;
  width: 132px;
	height: 110px;
	font-size: 0;
	margin: 0 12px;
	vertical-align: bottom;
	position: relative;
}
.mixbytype-chart .data > li.oil {
  background: url('../images/bgboil.png') repeat-x;
	height: 4px;
}
.mixbytype-chart .data > li.hydro {
  background: url('../images/bgbhydro.png') repeat-x;
	height: 41px;
}
.mixbytype-chart .data > li.coal {
  background: url('../images/bgbcoal.png') repeat-x;
	height: 220px;
}
.mixbytype-chart .data > li.nuclear {
  background: url('../images/bgbnuclear.png') repeat-x;
	height: 101px;
}
.mixbytype-chart .data > li.ngas {
  background: url('../images/bgbngas.png') repeat-x;
	height: 120px;
}
.mixbytype-chart .data > li.renew {
  background: url('../images/bgbrenewable.png') repeat-x;
	height: 21px;
}
.mixbytype-chart .data > li span{
  display: block;
	position: relative;
  font-family: 'GothamBlackGothamBlack';
	font-size: 20px;
	text-align: center;
	text-transform: uppercase;
	margin-top: -20px;
}

/*    */
.mixbytype-chart .types {
	display: block;
	position: absolute;
  left: 24px;
	bottom: 15px;
	font-size: 0;
}
.mixbytype-chart .types > li {
  display: inline-block;
  width: 132px;
	font-size: 0;
	margin: 0 12px;
	vertical-align: bottom;
	position: relative;
	background: red;
}
.mixbytype-chart .types > li span {
  display: block;
  font-family: 'GothamMediumGothamMedium';
	font-size: 14px;
	text-align: center;
	text-transform: uppercase;
}
.mixbytype-chart .infobox {
  width: 420px;
  display: table;
  position: relative;
  left: 60px;
  top: 20px;
}
.mixbytype-chart .infobox > * {
  display: table-cell;
  vertical-align: top;
}
.mixbytype-chart .infobox > span {
  color: #66a1d5;
  font-family: 'GothamBlackGothamBlack';
  font-size: 90px;
  font-weight: normal;
  line-height: normal;
}
.mixbytype-chart .infobox > p {
  width: 180px;
  color: #66a1d5;
  font-family: 'GothamLightGothamLight';
  font-size: 24px;
  font-weight: normal;
  line-height: normal;
  text-transform: uppercase;
  padding-top: 20px;
  opacity: 1;
}
.mixbytype-chart .infobox > p strong {
  font-family: 'GothamBlackGothamBlack';
  font-size: 14px;
  font-weight: normal;
  line-height: normal;
  text-transform: uppercase;
  display: block;
}
/*    */
.mixbytype-timeline {
	display: block;
  position: relative;
  width: 950px;
	height: 70px;
	left: 5px;
}
.mixbytype-timeline .notches {
	display: table;
  position: absolute;
  width: 100%;
	border-top: 1px solid #eee;
	border-bottom: 1px solid #eee;
	vertical-align: bottom;
  text-align: center;
	bottom: 0px;
}
.mixbytype-timeline .notches > span {
  display: table-cell;
	height: 26px;
  font-family: 'GothamBlackGothamBlack';
	font-size: 11px;
	text-align: center;
	position: relative;
}
.mixbytype-timeline .baloon {
	display: block;
	position: absolute;
  width: 17px;
	height: 25px;
  background: url('../images/baloon.png') no-repeat;
	vertical-align: bottom;
  left: 875px;
	bottom: 35px;
}
.mixbytype-timeline #sliderwrap {
  bottom: 5px;
  display: block;
  height: 20px;
  position: absolute;
  width: 950px;
}
.mixbytype-timeline #emslider {
	display: block;
  position: absolute;
  width: 33px;
	height: 20px;
  background: url('../images/sbpos.png') no-repeat;
	vertical-align: bottom;
  left: 867px;
  top: 0;
  cursor: pointer;
}
.mixovertime-chart .tlegend .tcoal {
  width: 130px;
}
.mixovertime-chart .tlegend .tngas {
  width: 150px;
}
.mixovertime-chart .tlegend .trenew {
  width: 140px;
}

/*melkin
radiobutton and checkbox*/

.brandeis label {
    width: 13px;
    height: 13px;
    display: inline-block;
    position: relative;
    margin-right: 4px;
    margin-left: 12px;
}

.brandeis input[type="checkbox"] + span {
    position: absolute;
    left: 0;
    top: -1px;
    width: 100%; height: 100%;
    background: url(../images/custom_checkbox.png) no-repeat;
    background-position: -13px 0px;
    cursor: pointer;
}

.brandeis input[type="checkbox"]:checked + span {
    background-position: 0 0px;
}

.brandeis input[type="radio"] + span {
    position: absolute;
    left: 0;
    top: -1px;
    width: 100%;
    height: 100%;
    background: url(../images/custom_radiobutton.png) no-repeat;
    background-position: -13px 0px;
    cursor: pointer;
}

.brandeis input[type="radio"]:checked + span {
    background-position: 0 0px;
}

.brandeis input[type="radio"], .brandeis input[type="checkbox"]{
    opacity: 0;
}

.legend .pdate{
    margin: 0 16px;
}
