/* CSS Document */



	@font-face {
		font-family: 'titelschrift';
		src: url('font/bhl_____.eot'), 
			url('font/bhl_____.eot?#iefix') format('embedded-opentype'),
			url('font/bhl_____.woff') format('woff'),
			url('font/bhl_____.ttf')  format('truetype');			
			// url('font/bhl_____.woff2') format('woff2'),
	}
	
	
/* ... Formatdefinitionen zum Drucken ... */

@media print {
	
	header, #bluetenleiste, #rahmen1, #rahemen2, #menuebutton, #menue1, #menue2, #cookie_hinweis {
		display: none;
	}
	
	#titelgrafik_druck {
	    position:absolute;
		top:0mm;
		left:0mm;
		width:180mm;
		height:36.5mm;
	}
	
	#flaeche {
		display:inline;
	    width:100%;
	    height:100%;
	}
	
	#adresse_druck {
	        position:absolute;
	        font-family:Verdana,Arial,sans-serif;
	        font-size:10pt;
	        color:black;
	        line-height:13pt;
	        text-align:left;
	        top:50mm;
	        left:0mm;
	        width:94%;
	}
	
	#adresse {
		display: none;	
	}

	h2 {
	   font-size:14pt;
	   font-weight:normal;
	   margin-top:13pt;
	   margin-bottom:4px;
	}
	
	h3 {
	   font-size:12pt;
	   font-weight:normal;
	   font-style:italic;
	   margin-top:7px;
	   margin-bottom:0px;
	}
	
	b {
	   font-weight:normal;
	   font-style:italic;
	}
	
	p {
	   font-size:10pt;
	}
			
	#textfeld {
	        position:absolute;
	        font-family:Verdana,Arial,sans-serif;
	        font-size:10pt;
	        color:black;
	        line-height:15pt;
	        text-align:left;
	        top:78mm;
	        left:0mm;
	        width:165mm;
	        z-index:2;
	        }

	a, a.imtext {
	font-family:Verdana,Arial,sans-serif;
	text-decoration:none;
	color:black;
	}
	a:link {color:black;}
	a:visited {color:black;}
	a:active {color:black;}
	a:hover {color:black;}
		        
}

/* ... Formatdefinitionen für den Bildschirm ... */

@media screen {
	
	html {
	    box-sizing: border-box;
	    color: #000;
	    font-size: 115%;
		letter-spacing: 0.01em;
	    line-height: 160%;;
	    font-family: Verdana, sans-serif;
	    -webkit-text-size-adjust: 100%;
	    -moz-text-size-adjust: 100%;
	    text-size-adjust: 100%;
	    overflow: auto;
	}
	
	body {
		margin: 0 auto;
		display: grid;
		grid-template-columns: [outer-start] 5vw [center-start] 90vw [center-end] 5vw [outer-end];
		grid-template-rows: [oben] 8vh [inhalt-top] 80vh [inhalt-bottom] 12vh [unten];
		background-color:#C6D669;
	}

	address {
		font-style:normal;
	}
	
	#adresse_druck, #titelgrafik_druck {
		display: none;	
	}

	a {
		text-decoration:none;
	}
	
	a:link {color: black;}
	a:visited {color: black;}
	a:active {color: black;}
	a:hover {color: black;text-decoration:underline;}
	
	table {
		border-collapse:collapse;
	}
	
	b {
	   font-weight:normal;
	   // letter-spacing:0.02em;
	   color:#666600;
	   color:black;
	}
	
	#textfeld p {
	   margin-right:10px;
	   margin-top:7px;
	   margin-bottom:7px;
	}
	
	ul {
	   // margin-top:7px;
	
	}
	
	#flaeche {
	        grid-column: center-start / center-end;
	        grid-row:  inhalt-top / inhalt-bottom;
	        
			display: grid;
			grid-template-columns: [flaeche-left] 100% [flaeche-right];
			grid-template-rows: [header_top] max-content [header_bottom] minmax(30px, 4%) [menu1_top] minmax(50px, 7.2%) [main_top] 70% [main_bottom];
	        background-color:#FFFFFF;
	        z-index:0;
	        }
	
	header {
			grid-column: flaeche-left / flaeche-right;
	        grid-row: header_top /  header_bottom;
	        width:100%;
	        height:148px;
	        background-color:#e3ebb6;
	        background-image: url("image/logo.jpg");
		  	background-position: right; 
			background-repeat: no-repeat; 
  			background-size: auto 100%; 
	        z-index:0;
	        
	        display: grid;
			grid-template-columns: [titel-left] auto [titel-center] max-content [titel-right] 9% [titel-rand];
			grid-template-rows: [titel_oben] 5% [titel1] 60% [titel2] auto [titel_unten];
			
	        }
	
	h1 {
		display:inline-grid;
		grid-column: titel-center / titel-right;
	    grid-row: titel1 /  titel12;
		font-family:titelschrift;
		font-weight:normal;
		font-size:2.07rem;
		line-height:95%;
		color:#666600;
	}
	
	h1 a:link, h1 a:hover, h1 a:active {		    
	    text-decoration:none;
		color:#666600;
	}
	
	header p {
		display:inline;
		grid-column: titel-center / titel-right;
	    grid-row: titel2 /  titel1_unten;
		font-size:0.8rem;
		font-weight:normal;
		color:#666600;
	}
		
	h2 {
		font-family:titelschrift;
	   font-size:1.5rem;
	   font-weight:normal;
	   color:#5C6C0B;
	   margin-top:2%;
	   margin-bottom:2%;
	}
	
	h3 {
		font-family:titelschrift;
	   font-size:1.18rem;
	   font-weight:normal;
	   color:#5C6C0B;
	   margin-top:3%;
	   margin-bottom:0;
	}
	
	h4 {
	   font-weight:normal;
		font-size:0.89rem;
	   line-height:130%;
	   color:#5C6C0B;
	   margin-top:2.2%;
	   margin-bottom:0;
	}
	
	#titelgrafik {
	        display:none;
	}
	
	#bluetenleiste {
			grid-column: flaeche-left / flaeche-right;
	        grid-row: header_bottom /  menu1_top;
	        background-color:#c7d769;
	        text-align:left;
	        margin-top:0px;
	        overflow:hidden;
	}
	
	#bluetenleiste img {
		height:100%;
	}
		
	#menue1 {
			grid-column: flaeche-left / flaeche-right;
	        grid-row: menu1_top /  main_top;
	        padding-left:3.2%;
	        padding-top:0.5%;
	}
	
	#menue2 {
			grid-column: rahmen1-start / rahmen1-end;
	        grid-row: main-mitte / main-unten;	        
	        margin-top:2%;
	        font-size:0.8rem;
	        line-height:170%;
	        z-index:2;
	        }
	        
	.menuepunkte {
			display:none;
	}
	
	main {
			grid-column: flaeche-left / flaeche-right;
	        grid-row: main_top /  main_bottom;
			display: grid;
			grid-template-columns: [main-start] 3% [rahmen1-start] 27% [rahmen2-start] 2% [rahmen1-end] 63% [rahmen2-end] 3% [main-end];
			grid-template-rows: [main-oben] 45% [main-mitte] 40% [main-unten];
	}
	
	#rahmen1 {
		    grid-column: rahmen1-start / rahmen1-end;
	        grid-row: main-oben / main-mitte;
	        
			display: grid;
			grid-template-columns: [bildframe-start] 36% [bildframe-mitte] min-content [bildframe-end];
			grid-template-rows: [bildframe-oben] 68% [bildframe-center] 32% [bildframe-unten];
			
	        padding:3%;
	        margin-top:4%;
	        border:0.12rem solid #C6D669;
	        background-color:white;
	        z-index:2;
	        }
	        
	#rahmen1 img {
		grid-column: bildframe-mitte / bildframe-end;
	    grid-row: bildframe-oben / bildframe-unten;
		height:100%;
	}
	
	#rahmen1 p {
		grid-column: bildframe-start / bildframe-mitte;
	    grid-row: bildframe-center / bildframe-unten;
	    font-size:0.7rem;
	    line-height:140%;
	    color:#58585A;
		text-align:right;
		padding-right:12%;
	}
				
	#rahmen2 {
		    grid-column: rahmen2-start / rahmen2-end;
	        grid-row: main-oben / main-unten;
	        padding:2.5%;
	        padding-left:7%;
	        border:0.12rem solid #C6D669;
	        z-index:1;
	        }
	        
	#textfeld {
	        font-size:0.88rem;
	        color:#58585A;
	        line-height:150%;
	        hyphens: auto;
	        text-align:left;
	        overflow:auto;
	        height:100%;
	        padding-right:2%;
	        }
	
	#adresse {
	        position:absolute;
	        top:540px;
	        left:37%;
	        width:492px;
	        height:9px;
	        z-index:2;
	        }
	
	a {
	text-decoration:none;
	color:#5C6C0B;
	}
	a:link {color:#5C6C0B;}
	a:visited {color:gray;}
	a:active {color:black;}
	a:hover {color:black;}
	
	#textfeld a {
		color:#666600;
		text-decoration:none;
	}
	#textfeld a:link {color:#666600;}
	#textfeld a:visited {color:#666600;}
	#textfeld a:active {color:black;}
	#textfeld a:hover {color:black; text-decoration:underline;}
	
	#cookie_hinweis {
		position: fixed;
		bottom: 0px;
		left: 0%;
		right: 0px;
		height: 3vh;
		z-index: 5;
		padding:4%;
		padding-top:0;
		background-color: white;
		border: 2px solid #c6d669;
		color: #5C6C0B;
		visibility: visible;
		display:grid;
		grid-template-columns: [cookie-links] auto [cookie-mitte] min-content [cookie-rechts];
		grid-template-rows: max-content;
		gap:2.5%;
	}
	
	#cookie_hinweis .text {
		grid-column: cookie-links / cookie-mitte;
		font-size: 0.8rem;
		line-height: 150%;
	    hyphens: auto;
	}
	
	#cookie_hinweis .text a {
		font-size: 0.8rem;
		font-weight: bold;
		text-decoration: none;
		line-height: 150%;
	}
	
	#cookie_hinweis .button {
		grid-column: cookie-mitte / cookie-rechts;
		font-size: 0.8rem;
		line-height: 150%;
		vertical-align:top;
	}
	
	#menuebutton {
		display:none;
	}

	@media (max-height: 760px) {
	
		body {
			grid-template-rows: [oben] 4vh [inhalt-top] 92vh [inhalt-bottom] 4vh [unten];
		}
		
		main {	
			grid-template-rows: [main-oben] 35% [main-mitte] 35% [main-unten];
		}
		
	}

	@media (min-height: 1000px) {
		
		main {
			grid-template-rows: [main-oben] 25% [main-mitte] 70% [main-unten];
		}
	
	}
		
	@media (min-width: 1400px) {
		
		body {
			grid-template-columns: [outer-start] 8vw [center-start] 84vw [center-end] 8vw [outer-end];
		}	
		
	}
	
	@media (min-width: 1600px) {
		
		body {
			grid-template-columns: [outer-start] 10vw [center-start] 80vw [center-end] 10vw [outer-end];
		}	
		
	}
	
	@media (max-width: 1300px) {
	
		#menue1 {
			display:none;
			border:0px solid red;
    		grid-row: main_top / main_bottom;
			background-color:white;
			z-index:3;
		}
		
		#menuebutton {
			display:inline;	    
			padding-left:3%;
			padding-top:1.5%;
			font-size: 0.88rem;
    		color: #58585A;		
		}
		
		#menuebutton img {
			vertical-align:middle;
			margin-right:0.7%;
		}

		#menuebutton a:link, #menue2 a:hover, #menue2 a:active {		    
	        text-decoration:none;
	    }
		
	}
	
	@media (max-width: 1200px) {

		html {
			font-size: 100%;	
		} 
		
		h1 {
			font-size:2.2rem;
		}
	}
	
	@media (max-width: 1100px) {

		html {
			font-size: 95%;	
		} 	

		header {
			grid-template-rows: [titel_oben] 10% [titel1] 60% [titel2] auto [titel_unten];
		}
		
		h1 {
			font-size:2.1rem;
		}
		
		#rahmen1 {
			grid-template-columns: [bildframe-start] 15% [bildframe-mitte] min-content [bildframe-end];
			max-height:15vh;
		}
	
		#rahmen1 p {
			display:none;
		}
		
	}

	@media (max-width: 900px) {

		h1 {
			font-size:1.8rem;
		}
		
		#rahmen1 {
			grid-template-columns: [bildframe-start] 15% [bildframe-mitte] min-content [bildframe-end];
			max-height:14vh;
		}	
	
		#rahmen1 p {
			display:none;
		}
		
		#cookie_hinweis {
			height:5vh;;
		}

	}


	/* Smartphone */
	
	@media (max-width: 500px) {

		html {
	    	font-size: 120%;
	    }
	    
		body {

			grid-template-columns: [outer-start] 2vw [center-start] 96vw [center-end] 2vw [outer-end];
			grid-template-rows: [oben] 3vh [inhalt-top] 92vh [inhalt-bottom] 6vh [unten];	
		}
		
		#flaeche {		
			grid-template-columns: [flaeche-left] 100% [flaeche-right];
			grid-template-rows: [header_top] max-content [header_bottom] minmax(20px, 4%) [menu1_top] minmax(60px, 7.2%) [main_top] auto [main_bottom];	
		}
		
		header {
			display:block;
			background-image: url("image/logo2.jpg");
			background-size: auto 90%; 
			background-position: right top; 
			background-color:white;
			padding-left:4%;
			padding-bottom:2%;
			width:96%;
		}
			
		h1 {
			margin-top:11.5%;
			margin-bottom:0;
			display:block;	
			font-size:1.7rem;
		}	

		header p {	
			display:block;
			margin-top:2%;
			font-size:0.8rem;	
		}
		
		header p span {
			display:none;
		}
			
		h2 {
			font-size:1.4rem;
	   		margin-top:2.5%;
	   		margin-bottom:3.5%;
		}
		
		main {
			grid-template-columns: [main-start] 3% [rahmen1-start] 80% [rahmen1-end] 14% [rahmen2-end] 3% [main-end];
			grid-template-rows: [main-oben] max-content [main-mitte] max-content [main-menue2] max-content [main-unten];		        
			background-color:white;		
		}
		
		#menue1 {
			background-color:#c6d669;
	        padding-left:0.8%;
		}
		
		#menuebutton {
			padding-top:5%;
		}

		#rahmen1 {
			margin-top:4%;
			margin-bottom:1%;
			padding:4%;
			border:0.1rem solid #C6D669;
			grid-column: rahmen1-start / rahmen1-end;
		    grid-row: main-oben / main-mitte;
			max-height:17vh;
			
			grid-template-columns: [bildframe-start] 40% [bildframe-mitte] 60% [bildframe-end];
			grid-template-rows: [bildframe-oben] 60% [bildframe-center] 40% [bildframe-unten];
		}
		
		#rahmen1 p {
			display:inline-grid;
		}
					
		#rahmen2 {
			    grid-column: rahmen1-start / rahmen2-end;
		        grid-row: main-mitte / main-menue2;
		        padding:0;
		        padding-top:5%;
		        border:0;
		        z-index:1;
		}	

		#textfeld p {
			margin-right:1%;
			margin-left:1%;
		}
				
		#menue2 {
			grid-column: main-start / main-end;
	        grid-row: main-menue2 / main-unten;	  
	        background-color:#C6D669;
	        padding-left:4%;
	        padding-top:3vh;
	        padding-bottom:10vh;
		}	
		
		#menue2 p {
			display:none;	
		}
			
		#menue2 a {		
	        font-size:0.8rem;
	        color: black;
	    }
	    
	    #cookie_hinweis {
	    	height:21vh;
			background-color:#C6D669;
			color:black;
	    }
		
	}
	    
	
	@media (max-width: 400px) {
	    
	    #cookie_hinweis {
	    	height:19vh;
	    }
	    
	}
	
	@media (max-width: 360px) {

		html {
	    	font-size: 95%;
	    }
		
	}
	    
	@media (max-width: 300px) {

		html {
	    	font-size: 90%;
	    }
	    
	    header {
			background-size: auto 70%; 
		}
	    
	}
	
}