html > div[style] {
  display: none !important;
}
body{
font-family: 'Cabin', sans-serif;

}
h1{
font-size:2em;
font-weight:normal;	
}
h2{
margin-bottom:0;	
}

#overlay_layer{
position:absolute;
top:0;
width:100%;
max-width:2200px;
text-align:left;
}
.time{

}
#image{
position:absolute;
right:5px;
top:70px;	
}
.overlay{
width:150px;	
}

.row{
background: rgba(84,67,54,0.7);
/*color:#afa395;*/
color:white;
margin-left:0;
margin-right:0;
padding:5px;
height:auto;
}
.col-{
padding-left:2px;
padding-right:2px;	
display:table;

}
.col{
padding-left:20px;
padding-right:20px;	
display:table;
}
#col1{
border-right:0.5px solid;	
}
#col2{
border-right:0.5px solid;	
}
#col3{
border-right:0.5px solid;	
}
#col4{
border-right:none;	
}
.temperatur{
margin-right:3px;	
cursor:pointer;

}
.labelsmall{
font-size:0.7em;
}

#map{
width:100%;	
height:50vh;
margin-top:10px;
margin-bottom:10px;
}
#close_map,#close_error_stream,#thermometer{
cursor:pointer;	
}
.map_header,.webcam_header{
display:block;
font-size:1.5em;
}

#bedienungshinweise{
text-align:center;
}

#wetter_content{
padding-top:5px;
background-color:white;
}

div.gallery img {
    width: 100%;
	max-width:180px;
    height: auto;
	image-rendering: -webkit-optimize-contrast;
	display:flex;
    justify-content: center;
    align-items: center;
}

div.desc {
	text-align:center;
    padding:1px;
	min-height:20px;
	text-overflow:ellipsis;
	overflow:hidden;
	max-width:180px;
	white-space:nowrap;
	display:flex;
    justify-content: center;
    align-items: center;
}

* {
    box-sizing: border-box;
}

.responsive {
    padding: 0 6px;
    float: left;
	width: 19.99999%;
}

@media only screen and (max-width: 4000px) {
	.responsive {
		width:3.99999%;
		margin: 6px 0;
	}
}
@media only screen and (max-width: 2600px) {
	.responsive {
		width:6.99999%;
		margin: 6px 0;
	}
}
@media only screen and (max-width: 1920px) {
	.responsive {
		width:9.99999%;
		margin: 6px 0;
		font-size:0.8em;
	}
}
@media only screen and (max-width: 1200px) {
    .responsive {
        width: 16.66666%;
        margin: 6px 0;
		font-size:0.8em;
    }
}
@media only screen and (max-width: 1000px) {
    .responsive {
        width: 19.99999%;
        margin: 6px 0;
		font-size:0.8em;
    }
}
@media only screen and (max-width: 800px) {
    .responsive {
        width: 24.99999%;
        margin: 6px 0;
		font-size:0.8em;
    }
}
@media only screen and (max-width: 500px) {
    .responsive {
		width:49.99999%;
		font-size:0.8em;
    }
}
@media only screen and (max-width: 319px) {
    .responsive {
		width:49.99999%;
		font-size:0.8em;
    }
}

.calender{
width:30px;
cursor:pointer;	
}

.respimg{
width:auto;
max-width:100%;
}

.hersteller{
font-size:0.7em;
margin-left:3px;
color:#afa395;
text-decoration:underline;	
}
.hersteller:hover{
color:#afa395;
}

.weatherwidget-io{
display:none;
}
#temperatur{
width:100%;	
}
#close_temperatur{
cursor:pointer;	
}

/*--------NEW*/
.layer {
width:auto;
position:relative;
}

.c-video {
width: auto;
position:relative;
text-align:center;
max-height:100vh;
}
.buttons{
position:absolute;
left:50%;
top:50%;	
}
#stream{
width:100%;	
max-height:100vh;
}
#play-pause{
font-size:2em;
color:white;
cursor:pointer;
transform:translateX(100%);
}
#outer{
display:none;	
}
#marker{
padding-right:5px;
	
}
.standort{
	
}
.height{
	
}
#fullscreen{
padding-left:5px;
padding-right:5px;
cursor:pointer;

}
#weather{
padding-left:5px;
padding-right:5px;
cursor:pointer;

}
#informations{
padding-left:5px;
padding-right:5px;
cursor:pointer;
}
#height{
padding-left:5px;
padding-right:5px;
	
}
#menu{
padding-right:10px;
cursor:pointer;

}
.bar{
height:10px;
position:absolute;
bottom:0px;
left:0;
width:100%;
background-color:#dbdbdb;
}
.juice{
height:10px;
background-color:#afa395;
}
.date{
padding-left:5px;	
}
#thermometer{
padding-right:5px;	

}
#archiv_wrapper,#weather_wrapper,#info_wrapper,#temperatur_wrapper{
display:none;
position:absolute;
left:0;
top:0;
width:100%;
height:100%;
text-align:center;	
background-color:black;
}
#bg-image{
background-image:url("../seeblick/current/current.jpg");	
filter: blur(16px);
-webkit-filter: blur(16px);
background-position:center;
background-repeat:no-repeat;
background-size:cover;
height:100%;
}
#archiv_content{
height:auto;
position:absolute;
top:0;
margin-top:10px;
background:rgba(255,255,255,0.2);
padding-bottom:10px;
}
#weather_content{
width:100%;
height:auto;
position:absolute;
top:0;
margin-top:10px;
background:rgba(255,255,255,0.2);
padding-bottom:10px;	
}
#info_content{
width:100%;
height:auto;
position:absolute;
top:0;
margin-top:10px;
background:rgba(255,255,255,0.2);
padding-bottom:10px;	
}
#temperatur_content{
width:100%;
height:auto;
position:absolute;
top:0;
margin-top:10px;
background:rgba(255,255,255,0.2);
padding-bottom:10px;	
}
#dates{
font-size:1.5em;	
}
.arrows{
margin-right:5px;
margin-left:5px;
cursor:pointer;	
}
.arrows:hover{
color:white;
}
#archiv_header,#weather_header,#info_header,#temperatur_header{
font-size:2em;	
}
.close_archiv,.close_weather,.close_info,.close_temperatur{
margin-left:5px;
cursor:pointer;	
}
#close_archiv:hover,#close_weather:hover,#close_info:hover,#close_temperatur:hover{
transform: rotate(180deg);
transition: all 0.3s ease-in-out 0s;
color:white;
}
.archivstream{
cursor:pointer;	
}
.wrapper_currentstream{
position:relative;	
}
.currentstream{
left:50%;
top:60%;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
position:absolute;
color:white;
font-size:3em;
cursor:pointer;
}
.current{
color:white;	
}
#month{
display:block;	
}
#stoerung{
position:fixed;
width:100%;
top:20%;	
z-index:200;
text-align:center;
background-color:white;
}