html, body {
	width: 100%; height: 100%;
	margin: 0; padding: 0;
	background: #2D2E2F;
	background: #00000c;
	overflow: hidden;
}


#grad
{
	font-family: 'Nixie One', Arial, serif; font-weight: 400;
	display: inline-block; 
	height:100%;
	width:100%; 
}

#gradInfo
{     
	font-size:2em;
	color:#fff;
	text-align:center;
	margin: 100px auto;
}

#gradInfoDetail
{     
	font-size: 2em;
    color: #fff;
	text-align: center;
	
}

#gradInfoDetail .row {
    margin: 30px 0;
}


#slider-parent
{ 
	width:50%; 
	margin-left:auto;
	margin-right:auto; 
	position:fixed;
	height: 40px;
	left: 25%;
	bottom: 0;
	cursor: pointer;
}

#slider 
{ 
	width:50%; 
	margin-left:auto;
	margin-right:auto; 
	position:fixed;
	bottom: -20px;
	left: 25%;
}

#slider-parent:hover #slider 
{ 
	bottom: 20px;
}

#time
{ 
	font-size:6em;
	margin-bottom:10px;
}

#timeOfDay
{ 
	font-size:.3em;
	margin-left:18px;
	visibility:hidden;
}

#date
{ 
	font-size:1.5em;
}


#gradInfo canvas
{ 
	margin-top:25px;
}

#temp,#temp_min,#temp_max
{
	display:inline-block;
	margin-left:  20px;
	margin-right: 20px;
}
#temp
{ 
	font-size:5em;
	margin-top:-5px;
}

#temp_min,#temp_max
{ 
	font-size:3em;
	margin-top:10px;
}

#wind
{ 
	font-size:3em;
}


#fullscreentoggler 
{ 
	width: 50px; 
	height: 50px;
	position: fixed;
	top: 0;
	right: 0;
	cursor: pointer;
}