﻿body {
	background-color: #000000;
}

header h1 {
	text-align: center;
	color: #ffffff;
}


.weather-sensor-row {
	 display: block;
     background-color: #dedede;
     padding: 0 15px 15px 15px;
	 margin: 15px 0 0 0;
}

.weather-sensor-row.mobile {
	 display: block;
     background-color: #dedede;
     padding: 0 15px 15px 15px;
	 margin: 15px 0 0 0;
	 border-right: 15px solid black;
}

.weather-sensor-row h2 {
	display: inline-block;
	margin: 10px 10px 5px 0;
}

.weather-sensor-row h5 {
	display: inline-block;
	float: right;
	margin-top: 15px;
}

.weather-sensor-row h5 a {
	text-decoration: none;
}

area-chart, 
gauges-chart {
	display: block;
	max-height: 400px;
	transition: max-height .75s;
	overflow: hidden;
}

.hide-area-chart area-chart {
	max-height: 0px;
	transition: max-height .75s;
	overflow: hidden;
}

.hide-gauges gauges-chart {
	max-height: 0px;
	transition: max-height .75s;
	overflow: hidden;
}

 .highcharts-background {
     fill: rgba(0,0,0,0) !important;
 }

.spinner-overlay,
.gauges-spinner-overlay,
.historic-spinner-overlay {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: rgba(0, 0, 0, 0.5);
    text-align: center;
	z-index: 2;
}

.spinner-overlay img,
.gauges-spinner-overlay img,
.historic-spinner-overlay img {
	display: block;
	height: 40%;
	margin: auto;
	margin-top: 10%;
}

.hidden-xs .gauges-spinner-overlay img {
	margin-top: 5%;
	height: 60%;
}