
html, body { height: 100%; } /*  background-image:url(../media/images/common/bg.png); background-repeat:repeat-x; */
form  { border:0px; padding:0px; margin:0px; }
img  { border:0px; padding:0px; margin:0px; }
body  { margin:0px; padding:0px; line-height:17px; background-color:#ffffff; font-size:12px; font-family: Arial, Helvetica, Geneva, Swiss, SunSans-Regular, sans-serif; }

a {text-decoration:none; color:#666666; }
.left { float:left; }
.clear { clear: both; }
.clearfix {
  *zoom: 1;
}

.clearfix:before,
.clearfix:after {
  display: table;
  line-height: 0;
  content: "";
}
.clearfix:after {
  clear: both;
}

#mainwrapper { min-height: 95%; float:left; }


/* kopfzeile nur fuer standalone */
#kopfzeile { float:left; width:100%; min-width:300px; height:50px; background: transparent url(../media/images/customer/header/bg.png) repeat-x 0px 0px; }
#kopfzeile-2020 { float:left; width:100%; min-width:300px; height:50px; background: white; }
 .logo { width:300px; height:50px; float:left; padding:5px 0px 0px 5px; background: transparent url(../media/images/customer/header/ku-logo-weiss.png) no-repeat 0px 0px; }
 .logo-2020 { width:300px; height:40px; float:left; margin:5px 0px 0px 5px; background: transparent url(../media/images/customer/header/ku-logo-2020.svg) no-repeat 0px 0px; }
 #kopfzeile-links { width:300px; height:50px; float:left; padding:5px 0px 0px 5px; background: transparent url(../media/images/customer/header/ku-logo-weiss.png) no-repeat 0px 0px; }
 #kopfzeile-rechts { height:40px; float:right; padding:10px 10px 0px 0px; text-align:right; font-size:1.8vw; }
 /* background-image:url(../media/images/common/das-ku-wetter.png); background-position: right; background-repeat:no-repeat;  */
  
  #inhalt    { width:100%; height:100%; min-width:660px; display: -webkit-flex; display: flex; -webkit-flex-flow: row wrap; flex-flow: row wrap; }
  #inhalt-links { min-width:440px; margin: 0% 0% 0% 0%; flex:2; }/*float:left; width:64%; }*/
  #inhalt-links-breit { min-width:440px; margin: 0% 0% 0% 0%; flex:3; }
	#content1 { background-image: url(../media/images/common/temperatur.png); }
	#content2 { background-image: url(../media/images/common/luftfeuchte.png); }
	#content3 { background-image: url(../media/images/common/niederschlag.png); }
	
	
	.content { margin-bottom:5px; background-color:#e9e9e9; width: 100%; overflow:hidden; text-align: right; float: left; background-position: left; background-size: contain; background-repeat: no-repeat; }
	
	.content-halbe { width:50%; float:left; }
	  .chart { float:right; width:100%; }
	  .chart img { width:100%; }
	  .chart-perc { float:right; width:93%; }
	  .chart-perc img { width:100%; }
	  
  #inhalt-rechts { margin: 0% 0% 5px 5px; background-color:#e9e9e9;  flex:1; }/*float:left; width:31%;  min-width:220px; }*/
  .schmal { min-width:180px; }
	.streifen { float: left; width: 96%; margin: 2% 2% 0% 2%; background-color: #e9e9e9; color: #666666;}
	.headline_rechts { font-size: 1.5vw; line-height: 1.9vw;}
	.messzeit_rechts { font-size: 1.1vw; line-height: 1.4vw;}
	.schmal .headline_rechts { 
	font-size: 2.0vw;
    line-height: 2.4vw;
    font-weight: bold;
	}
	.schmal .messzeit_rechts {
	font-size: 2.0vw;
    line-height: 2.4vw;
    font-weight: bold;
    margin: 0 0 19px 0;
	}
	.streifen_links { float: left; width: 50%; margin: 0; padding:0; }
	.streifen_rechts { float: left; width: 50%; margin: 0; padding:0; }	
	.schmal .streifen_links { float: left; width: 100%;  margin: 0% 0% 0% 0%; padding:0; }
	.schmal .streifen_rechts { float: left; width: 100%;  margin: 2% 0% 0% 0%; padding:0; }
	.mw-label {width:100%; float:left; font-size: 1.1vw; line-height: 1.4vw; text-align:center;}
	.schmal .mw-label { font-size: 1.6vw; line-height: 1.7vw; font-weight:bold; }
	.mw-wert {width:100%; float:left; font-size: 2.9vw; line-height: 3.7vw; text-align:center;}
	.schmal .mw-wert {width:100%; float:left; font-size: 3.2vw; line-height: 4.8vw; text-align:center;}
	.link { font-size: 1.5vw; line-height: 1.9vw; }
	#bildchen { float:left; padding:0%; width:38%; line-height:120%;}
	#text {     float: left;
    width: 60%;
    text-align: center; font-size: 2.9vw; line-height: 3.7vw;
    font-weight: bold;
    color: #666666; }
	.einheit {     clear: both; font-size: 1.1vw; line-height: 0.5vw;
    color: #666666;
    font-weight: normal; }
	#wettervorhersage { float:left; width:100%; text-align:center; }
.img_s { width:95%; }
.footer { position: fixed; bottom: 0; padding: 2px 5px 2px 5px; margin: 0; left: 0; z-index: 12; background-color: #febd5d; opacity: .7; }


@media (max-width: 700px) {
    #inhalt-links    { flex:1; order:2; min-width:200px;}
    #inhalt-rechts { flex:1; order: 1; min-width:200px; } 
    #inhalt { min-width:400px; -webkit-flex-flow: column wrap;
    flex-flow: column wrap;}
	#text { font-size: 4.6vw; line-height: 5.0vw; }
	.einheit { font-size: 2.95vw; line-height: 3.4vw; }
	.headline_rechts { font-size: 3.5vw; line-height: 1.9vw; }
	.messzeit_rechts, .mw-label { font-size: 2.5vw; line-height: 3.4vw; }
	.mw-wert { font-size: 4.5vw; line-height: 5.5vw; }
}
