/* CSS Document */

span.datum
{
font-size:2em;
}
div.weathericon
{
	width: 50px;
	height: 50px;
    background-size: 100% 100%;

}
div.float_right
{ float:right;}

.dttoday
{ color:#999999; font-size:.5em;}


.temperaturmax .temperaturmin
{ float:right;}

span.dt
{ font-size:1.6em;}

div.forecast16wrap
{
width:100%; height:auto;;
}
div.forecast3h
{ width:100%;}

div.forecast16
{ float:left;
height:auto;
width:25%;
padding-bottom:1em;
}
div.forecast16 .datum sup
{ font-size:.6em; color:#999999 }

div.forecast16 .datum sup
{ font-size:.6em; color:#999999 }

.gray
{ #ddd }

div.forecast16.item0, div.forecast3h.item0
{ background-color:#F5F5F5}

div.forecast16.item0.w6, div.forecast16.item0.w0
{ background-color:#EFEFEF}
div.forecast16.item1.w6, div.forecast16.item1.w0
{ background-color:#E4E4E4}

.weather_sixteenday h2, .weather_threehour h2
{
margin-bottom:.5em; 
}
p.h2sub
{
font-size:.8em; padding:0px; margin:0px;
}


.todayright .temperatur
{ width:20%;}

.temperaturmax, .temperaturmin, .seperator
{ float:right;}



.data
{ width:50%;}
.data .prop
{ width:100%;}
.temperatur
{ margin-right:.5em;}
.temperatur:after
{ content:'°C'; color:#999999;margin-left:.5em;}
.pressure:after
{ content:'hpa'; color:#999999; margin-left:.5em;}
.windspeed:after
{ content:'m/s'; color:#999999; margin-left:.5em;}
.data .date
{ font-size:2em; text-align:right;padding-right:.5em;}
.data .prop .temperatur, .data .prop .pressure, .data .prop .winddeg, .data .prop .windspeed
{font-size:.8em} 
.data .prop .temperatur,.data .prop .winddeg
{ margin-right:.5em; width:39%;}
.data .prop .pressure,.data .prop .windspeed
{ margin-right:.2em; width:45%; text-align:right;}

.temperaturmax:before 
{content:'('; color:#999999;}
.temperaturmax:after
{content:'°C';margin-left:0.1em;}
.temperaturmin:after
{content:'°C)'}


.temperaturmin
{ color:#0066FF; }

.temperaturmax
{ color:#990000; font-size:1.5em;} 

.seperator:after
{content:' / ';padding-right:.5em;}
.hum:after
{
content:'% hum.';color:#999999; margin-left:.5em;
}
.desc
{ color:#0066FF;}


span.windspeed
{ font-size:1.2em;}
span.winddeg
{ font-size:1.2em;}
span.pressure, span.hum
{ font-size:1.2em;}


span.tempday
{ color:#990000; font-size:2em;}
span.tempnight
{color:#0066FF; font-size:1.5em;}





div.forecast16wrap img
{ width:25% !important;}






div.clear
{ clear:both; }



div.datum2
{font-size:2em; width:55px; text-align:right; }
div.tempday
{font-size:2em; width:15%;text-align:right;}
div.pressure
{font-size:2em;width:20%;text-align:right;}
div.winddeg
{font-size:2em;width:20%;text-align:right;}


div.icon
{  background-size:100%; min-height:80px; min-width:80px;
background-position:top; background-repeat:no-repeat; background-position: -5px -5px;
}

div.icon01d
{ background-image:url(icon/01d.png); }
div.icon01n
{ background-image:url(icon/01n.png); }
div.icon02d
{ background-image:url(icon/02d.png); }
div.icon02n
{ background-image:url(icon/02n.png); }
div.icon03d
{ background-image:url(icon/03d.png); }
div.icon03n
{ background-image:url(icon/03n.png); }
div.icon04d
{ background-image:url(icon/04d.png); }
div.icon04n
{ background-image:url(icon/04n.png); }
div.icon09d
{ background-image:url(icon/09d.png); }
div.icon09n
{ background-image:url(icon/09n.png); }
div.icon10d
{ background-image:url(icon/10d.png); }
div.icon10n
{ background-image:url(icon/10n.png); }
div.icon11d
{ background-image:url(icon/11d.png); }
div.icon11n
{ background-image:url(icon/11n.png); }
div.icon11d
{ background-image:url(icon/13d.png); }
div.icon11n
{ background-image:url(icon/13n.png); }
div.icon50d
{ background-image:url(icon/50d.png); }
div.icon50n
{ background-image:url(icon/50n.png); }
div.icon01ddd
{ background-image:url(icon/01ddd.png); }


.forecast3h
{ float:left; width:24% !important; margin-bottom:5px; overflow:auto;}
.iconxx
{ width:18% !important;}
.datum2, .data2
{ width:55% !important;}

.winddeg
{ clear:both;}



.b0
{ clear:both;}


.todayleft
{ width:30%; float:left; overflow:auto;}
.todayright
{ width:70%; float:right; overflow:auto;}
.today
{ overflow:auto; max-width:400px;}

.weather
{
max-width: 75em;
margin: 0 auto;
}

.footer
{ font-size:.7em; color:#ddd;}

.hide
{ display:none;}

@media 
only screen and (min-width: 500px) and (max-width: 800px)
{
.forecast16
{ width:50% !important; margin-bottom:5px;}
.y0
{
background-color:#E8F9FF !important;
}
.y1
{
background-color:#B4EFFC !important;
}
.y2
{
background-color:#C7EAFC !important;
}
.y3
{
background-color:#ABD8FC !important;
}

.forecast3h
{ float:left; width:48% !important; margin-bottom:5px; overflow:auto;}
.icon
{ width:20% !important;}
.datum2, .data2
{ width:60% !important;}

.winddeg
{ clear:both;}


.tempday, .pressure, .winddeg, .windspeed
{ font-size:.8em !important; width:45%!important; text-align:right;}
.b2
{ clear:both;}


}


@media 
only screen and (max-width: 500px)
{
.forecast16
{ width:100% !important; margin-bottom:5px;}
.x0
{
background-color:#E8F9FF !important;
}
.x1
{
background-color:#B4EFFC !important;
}

.forecast3h
{ width:100% !important; margin-bottom:5px; overflow:auto;}
.icon
{ width:20% !important;}
.datum2, .data2
{ width:60% !important;}

.winddeg
{ clear:both;}


.tempday, .pressure, .winddeg, .windspeed
{ font-size:.8em !important; width:45%!important; text-align:right;}


}