#legende_container, #legende_containerjs {
	margin-right: 5%;
	float: right;
	display:block;
	min-width:260px;
}

#legende, #legende_trend {
	display: flex;
}

#legende_trend {
	line-height: 3.0rem;
}

#legende_end {
	display: flex;
	line-height: 1.7rem;
}

#legende_container h3, #legende_containerjs h3 {
	margin-top: 0px;
	padding-top: 0px;
}

.layer {
	border: 1px solid #555;
	padding:5px;
	font-size: 1.4rem;
	margin-top:10px;
}

#legende_icon, #legende_icon1 {
	width: 20px;
	height: 20px;
	margin-top: 2px;
	margin-right: 5px;
	float:left;
} 

#legende_icon2, #legende_icon3, #legende_icon4, #legende_icon5, #legende_icon6, #legende_icon7, #legende_icon8 {
	width: 30px;
	height: 30px;
	margin-top: 2px;
	margin-left: 10px;
	float:left;
}

.table_legende td {
	padding: 3px !important;
}

.flexcontainer {
	display:flex;
	min-width: 280px;
	margin-top: 30px;
	flex-direction: column;
	align-items:end;
}

.btnactive {
	background-color:#2d4b9b;
	color: white;
}

.none {
	display:none;
}

.nonejs {
	display:none !important;
}

#warnwrap, #warnjs {
	margin-top: 60px;
    border: solid 1px #000;
    padding: 10px;
 	background-image: linear-gradient(to right, white 0%, rgba(0,0,0,0.05) 50%, rgba(0,0,0,0.1) 100%); 
 	margin-right: 5%;
 /*	background-color: rgba(100,10,100,0.02); */
}

#warncontainer {
    padding-top:30px;
    width:100%;
    margin: 25px auto;
    height: 100%;
/*    display:inline-flex; */ 
    border-top: solid 1px #000;
    padding-bottom:30px;
}

#warncontainer:first-child {
    padding-top:0px;
    width:100%;
    margin: 25px auto;
    height: 100%;
/*    display:inline-flex; */ 
    border-top: solid 0px #000;
}

#warncontainer:last-child {
	padding-bottom: 20px;
}

#warninline div {
    padding: 0px;
    margin: 0px;
}

#warninline {
    display:inline-flex; 
}

#ort {
/*    width: 150px; */
    margin-right: 50px !important;
    height: 50px;
    font-size: 1.5rem;
    margin-top: 25px !important;
}

#tag1 {
    margin-right: 10px !important;
}

.border {
    border-bottom: 2px solid #000;
    height:57px;
    min-width: 30px;
    padding: 0px;
    margin: 0px;
}

.tagtext {
    padding-top:18px;
    text-align: center;
    min-width: 50px;
    
}

.kein {
}

.stark_old {
/*    background-color: #cc99ff; */
    background-color: rgba(255, 235, 59, 1.0);
}
.stark {
    background-color: #cc99ff; 
}

.extrem_old {
 /*   background-color: #9e46f8; */
    background-color: rgba(229, 57, 53, 1.0);
}
.extrem {
    background-color: #9e46f8; 
}

.trend_old {
	background-image: -moz-linear-gradient(-45deg, rgba(255, 255, 255, 1.0) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 1.0) 50%, rgba(255, 255, 255, 1.0) 75%, transparent 75%, transparent);
	background-image: -linear-gradient(-45deg, rgba(255, 255, 255, 1.0) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 1.0) 50%, rgba(255, 255, 255, 1.0) 75%, transparent 75%, transparent);
	background-image: -ms-linear-gradient(-45deg, rgba(255, 255, 255, 1.0) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 1.0) 50%, rgba(255, 255, 255, 1.0) 75%, transparent 75%, transparent);
	background-image: -o-linear-gradient(-45deg, rgba(255, 255, 255, 1.0) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 1.0) 50%, rgba(255, 255, 255, 1.0) 75%, transparent 75%, transparent);
	background-image: -webkit-linear-gradient(-45deg, rgba(255, 255, 255, 1.0) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 1.0) 50%, rgba(255, 255, 255, 1.0) 75%, transparent 75%, transparent);
	background-size: 5px 5px;
/*	background-color: #9e46f866; */
	background-color: rgba(229, 57, 53, 0.6);
}
/*
.trend {
	background-image: -moz-linear-gradient(-45deg, rgba(255, 255, 255, 1.0) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 1.0) 50%, rgba(255, 255, 255, 1.0) 75%, transparent 75%, transparent);
	background-image: -linear-gradient(-45deg, rgba(255, 255, 255, 1.0) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 1.0) 50%, rgba(255, 255, 255, 1.0) 75%, transparent 75%, transparent);
	background-image: -ms-linear-gradient(-45deg, rgba(255, 255, 255, 1.0) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 1.0) 50%, rgba(255, 255, 255, 1.0) 75%, transparent 75%, transparent);
	background-image: -o-linear-gradient(-45deg, rgba(255, 255, 255, 1.0) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 1.0) 50%, rgba(255, 255, 255, 1.0) 75%, transparent 75%, transparent);
	background-image: -webkit-linear-gradient(-45deg, rgba(255, 255, 255, 1.0) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 1.0) 50%, rgba(255, 255, 255, 1.0) 75%, transparent 75%, transparent);
	background-size: 5px 5px;
	background-color: #9e46f866; 
}
**************************************************************************/

.trend_stark_gering {
	background-image: -moz-linear-gradient(-45deg, rgba(255, 255, 255, 1.0) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 1.0) 50%, rgba(255, 255, 255, 1.0) 75%, transparent 75%, transparent);
	background-image: -linear-gradient(-45deg, rgba(255, 255, 255, 1.0) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 1.0) 50%, rgba(255, 255, 255, 1.0) 75%, transparent 75%, transparent);
	background-image: -ms-linear-gradient(-45deg, rgba(255, 255, 255, 1.0) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 1.0) 50%, rgba(255, 255, 255, 1.0) 75%, transparent 75%, transparent);
	background-image: -o-linear-gradient(-45deg, rgba(255, 255, 255, 1.0) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 1.0) 50%, rgba(255, 255, 255, 1.0) 75%, transparent 75%, transparent);
	background-image: -webkit-linear-gradient(-45deg, rgba(255, 255, 255, 1.0) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 1.0) 50%, rgba(255, 255, 255, 1.0) 75%, transparent 75%, transparent);
	background-size: 7px 7px;
	background-color: #9e46f866; 
}

.trend_stark_wahr {
	background-size: 10px 10px;
	background-color: #9e46f866; 
}
/*
.trend_extrem_gering {
	background-image: -moz-linear-gradient(45deg, rgba(255, 255, 255, 1.0) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 1.0) 50%, rgba(255, 255, 255, 1.0) 75%, transparent 75%, transparent);
	background-image: -linear-gradient(45deg, rgba(255, 255, 255, 1.0) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 1.0) 50%, rgba(255, 255, 255, 1.0) 75%, transparent 75%, transparent);
	background-image: -ms-linear-gradient(45deg, rgba(255, 255, 255, 1.0) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 1.0) 50%, rgba(255, 255, 255, 1.0) 75%, transparent 75%, transparent);
	background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 1.0) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 1.0) 50%, rgba(255, 255, 255, 1.0) 75%, transparent 75%, transparent);
	background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 1.0) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 1.0) 50%, rgba(255, 255, 255, 1.0) 75%, transparent 75%, transparent);
	background-size: 7px 7px;
	background-color: #9e46f8; 
}
*/
.trend_extrem_gering {
	background-image: -moz-linear-gradient(45deg, rgba(158, 70, 248, 1.0) 25%, transparent 25%, transparent 50%, rgba(158, 70, 248, 1.0) 50%, rgba(158, 70, 248, 1.0) 75%, transparent 75%, transparent);
	background-image: -linear-gradient(45deg, rgba(158, 70, 248, 1.0) 25%, transparent 25%, transparent 50%, rgba(158, 70, 248, 1.0) 50%, rgba(158, 70, 248, 1.0) 75%, transparent 75%, transparent);
	background-image: -ms-linear-gradient(45deg, rgba(158, 70, 248, 1.0) 25%, transparent 25%, transparent 50%, rgba(158, 70, 248, 1.0) 50%, rgba(158, 70, 248, 1.0) 75%, transparent 75%, transparent);
	background-image: -o-linear-gradient(45deg, rgba(158, 70, 248, 1.0) 25%, transparent 25%, transparent 50%, rgba(158, 70, 248, 1.0) 50%, rgba(158, 70, 248, 1.0) 75%, transparent 75%, transparent);
	background-image: -webkit-linear-gradient(45deg, rgba(158, 70, 248, 1.0) 25%, transparent 25%, transparent 50%, rgba(158, 70, 248, 1.0) 50%, rgba(158, 70, 248, 1.0) 75%, transparent 75%, transparent);
	background-size: 7px 7px;
	background-color: #9e46f866; 
}

.trend_extrem_wahr {
	background-size: 10px 10px;
	background-color: #9e46f8; 
}

.trend_stark_extrem_wahr1 {
	background-image: -moz-linear-gradient(-45deg, rgba(158, 70, 248, 1.0) 25%, transparent 25%, transparent 50%, rgba(158, 70, 248, 1.0) 50%, rgba(158, 70, 248, 1.0) 75%, transparent 75%, transparent);
	background-image: -linear-gradient(-45deg, rgba(158, 70, 248, 1.0) 25%, transparent 25%, transparent 50%, rgba(158, 70, 248, 1.0) 50%, rgba(158, 70, 248, 1.0) 75%, transparent 75%, transparent);
	background-image: -ms-linear-gradient(-45deg, rgba(158, 70, 248, 1.0) 25%, transparent 25%, transparent 50%, rgba(158, 70, 248, 1.0) 50%, rgba(158, 70, 248, 1.0) 75%, transparent 75%, transparent);
	background-image: -o-linear-gradient(-45deg, rgba(158, 70, 248, 1.0) 25%, transparent 25%, transparent 50%, rgba(158, 70, 248, 1.0) 50%, rgba(158, 70, 248, 1.0) 75%, transparent 75%, transparent);
	background-image: -webkit-linear-gradient(-45deg, rgba(158, 70, 248, 1.0) 25%, transparent 25%, transparent 50%, rgba(158, 70, 248, 1.0) 50%, rgba(158, 70, 248, 1.0) 75%, transparent 75%, transparent);
	background-size: 7px 7px;
	background-color: #9e46f866; 
	
}


.error {
	color: red;
	background-color: transparent;
}

.tagtextdat {
	display: block;
}


#tag0 img, #tag1 img {
	max-width: 45px;
	margin-left: 5px;
	margin-top:1px;
}

.tagtext_margin {
	margin-top: -36px !important;
}

.borderextrem {
	border: 2px solid #9e46f8;
	background-color: #9e46f8; 
}

.borderstrong {
	border: 2px solid #cc99ff;
	background-color: #cc99ff; 
}

.borderextrem img, .borderstrong img {
	vertical-align: baseline;
}

/*************************************************************************/

@media screen and (max-width:950px) {
	#legende_container, #legende_containerjs {
		float: none;
		margin-bottom: 20px;
		border: 1px solid #000;
		padding: 5px;
	}
}

@media screen and (max-width:800px) {
	 .border {
	/*	min-width: 10px; */
		height: 25px;
	}
	
	#tag2, #tag3, #tag4, #tag5, #tag6, #tag7 {
		margin-top:-5px !important;
		height: 27px;
	}
	
	.tagtext_margin {
		margin-top: -26px !important;
	}
	
	#tag0 img, #tag1 img {
		max-width: 18px;
		margin-bottom: -3px;
		margin-top:2px;
	}
	
	#warninline div {
		margin-top: -3px;
	}

	#tag0, #tag1 {
	text-align:center;
	}

	#warninline {
		padding-top:10px;
	}
	
	#warnwrap, #warnjs {
		border: none;
		background-image: none;
		margin-top: 0px;
	}
	
	#ort {
		height: 25px;
		margin-top: 0 !important;
	}
	
	p.tagtext {
		margin: 0px;
	}
	
	#warncontainer {
		padding-top: 10px;
    	width:100%;
    	height: 100%;
    	padding-bottom:60px;
	}

	#warncontainer:first-child {
    	padding-top:10px;
    	height: 100%;
	}
}

@media screen and (max-width:640px) {
	.tagtextdat {
		display: none;
	}
	
	.tagtext {
		min-width: 0px;
		margin-right: 5px !important;
		font-size: 1.2rem;
	}
	
	#ort {
		font-size: 1.2rem;
		margin-right: 5px !important;
	/*	min-width: 100px; */
	}
	
	#legende_container, #legende_containerjs {
		font-size: 1.2rem;
	}
	
	#warncontainer {
    	padding-bottom:20px;
	}
	
}

@media screen and (max-width:550px) {
	.flexcontainer {
		align-items:center;
	}
	
}

@media screen and (max-width:400px) {
	#legende_trend {
		-webkit-hyphens: auto;
   		-moz-hyphens: auto;
        hyphens: auto;
        line-height: normal;
   	}
   	
   	#warninline {
   		padding-top: 15px;
   	}
}