/*Style-CSS für AB */
:root {		
	--main-color-1: 	#D2232A;
	--main-color-2:		#939598;
	--main-border: 		2px solid var(--main-color-2);
	--main-shadow: 		4px 4px 5px 0px var(--main-color-2);
}
@media(prefers-color-scheme: dark){	
	:root {		
	
	}
}

* {	
	font-size: 			12px;
	outline: 			none;
	outline-style: 		none;
	box-sizing:			border-box;
	font-family: 		'Verdana', sans-serif;
	font-size: 			var(--main-font-size);	
	line-height:		var(--main-font-size-lh);
	padding: 			0;      
	margin: 			0;		
	border: 			0;	
	-webkit-tap-highlight-color: none;
	-webkit-tap-highlight-color: transparent;  
}
iframe{	
	background: 		none;
}	
body {			
	background: 		none; 	
}
table{ 	
  	border-collapse: 	collapse;	
}
a {
	padding: 			10px;	
	color: 				black;
	text-decoration:	none;
	
}
h1{	font-size: 24px;		}
h2{	font-size: 20px;		}
h3{	font-size: 16px;		}

button{
	border: 		1px solid var(--main-color-1);
	border-radius: 	5px;
	cursor: 		pointer;
	padding: 		5px;
	box-shadow: 	var(--main-shadow);
	font-weight: 	bold;
}
input {
	border: 		1px solid var(--main-color-1);
}	

.bereiche{	
	cursor: 			pointer;
	width: 				400px;
	height: 			200px;
	border: 			var(--main-border);
	border-radius: 		20px;	
	background-color: 	white;
	background-position: right;
	background-repeat: 	no-repeat;
	background-size: 	40%;	
	box-shadow: 		var(--main-shadow);
	overflow: 			hidden;	
	padding: 			10px;
}
.bereiche:hover{	
	transform: 			scale(105%);
}
@media(max-width: 500px){
	.bereiche { width: 100%; }								
}
.inhalte{
	border: 				var(--main-border);
	border-radius: 			20px;	
	background-color: 		white;		
	box-shadow: 			var(--main-shadow);
	overflow: 				hidden;
	display: 				none; 
	position: 				fixed; 
	top: 					50px; 
	left: 					50%; 
	transform: 				translateX(-50%); 
	width: 					600px; 
	height: 				80dvh; 
	padding: 				0;	
}
.inhalt{
	display: 	none; 
	width: 		100%; 
	padding: 	10px; 
	z-index: 	10;	
	background-color: white;
}
.inhalt td{
	padding: 5px;
}
.bilder{
	 width: 				100%; 
	 height: 				calc(80dvh - 300px); 
	 position: 				fixed; 
	 bottom: 				0px; 
	 background-repeat: 	no-repeat; 
	 background-size: 		contain;
	 background-position: 	bottom;
	 z-index: 				0;  
}
@media(max-width: 600px){
	.inhalte{
		width: 		500px;
		height: 	90vh;
	}	
}
@media(max-width: 500px){
	.bilder{
		
	}	
	.inhalte{
		width: 		450px;
		height: 	90vh;
	}	
}	
.pfeil{
	color: 				var(--main-color-1); 
	font-weight: 		bold; 
	font-size: 			1rem;
	padding: 			0 5px; 
	vertical-align: 	top;
}
.svg_close { 	
	border: 			5px solid #333; 
	background-color: 	#aaa;
	border-radius: 		10px; 
	width: 				35px; 
	height:				35px; 
	position: 			absolute; 
	right: 				5px; 
	top: 				5px;	
}		
.svg_close line{ 	 }




.btn{
	background-position: 	10px;
	background-repeat: 		no-repeat;
	background-size:		20px;
	justify-content: 		center;
	align-items: 			center;
	padding-left:			35px;
}
.btn_kontakt{
	position: 				fixed; 
	top: 					60px; 
	right: 					10px;
	background-image: 		url('img/message.gif');	
}
.btn_tel{
	width: 					300px;
	background-image: 		url('img/telefon.gif');	
}
.btn_whatsapp{
	width: 					300px;
	background-image: 		url('img/whatsapp.gif');	
}
.btn_mail{
	width: 					300px;
	background-image: 		url('img/message.gif');	
}