@font-face {
	font-family:		'Roboto Medium';
	src:				url('incl/Roboto-Medium.ttf') format('truetype');
	font-weight:		500;
}

@font-face {
	font-family:		'Roboto Black';
	src:				url('incl/Roboto-Black.ttf') format('truetype');
	font-weight:		900;
}

html {
	height:				100%;
	scrollbar-gutter:	stable;
}

body {
	font-family:		"Roboto Medium", sans-serif;
	font-size:			11pt;
	width:				100%;
	margin:				0;
	padding:			0;
}

.skip-link {
    position:			absolute;
    top:				-40px;
    left:				0;
    background:			#28651B;
    color:				white;
    padding:			8px;
    z-index:			100;
    transition:			top 0.3s;
}

.skip-link:focus {
    top:				0;
}

#wrapper {
	margin-top:			104px;
}

#header_wrap {
	position:			fixed;
	top:				0;
	left:				50%;
	transform:			translateX(-50%);
	background:			white;
	width:				100%;
}

#header_top {
	width:				1110px;
	max-width:			100%;
	margin:				0 auto;
	padding:			15px 0;
	display:			flex;
	justify-content:	space-between;
	align-items:		center;
}

	@media screen and (max-width:1155px) {
		#header_top {
			max-width:			90%;
		}		
	}

#header_left {
	flex-grow:			1;
	align-items:		center;
}

#header_left img {
	width:				369.44px;
	max-width:			100%;
}

	@media screen and (max-width:800px) {
		#header_left img {
			width:				263.88px;
		}
	}

#header_right {
	width:				100px;
	text-align:			right;
	position:			relative;
}

#menu_icon {
position:			relative;
cursor:				pointer;
height:				70px;
fill:				#28651B;
background:			white;
}

#icon_menu_icon_wrap {
	display:			inline-block;
}

.menu-button {
background:			none;
border:				none;
padding:			0;
cursor:				pointer;
color:				#28651B;
}

#navigation_inhalt {
position:			fixed;
display:			none;
pointer-events:		none;
transition:			opacity 0.5s ease; /* Weicher Übergang für Opazität */
background:			#28651B;
padding-top:		25px;
padding-bottom:		25px;
font-size:			13pt;
top:				0;
right:				0;
width:				30%;
height:				100vh;
box-sizing:			border-box;
overflow-y:			auto;
z-index:			98;
}

#navigation_inhalt ul {
padding:			0;
margin:				0;
}

	@media screen and (max-width:1110px) {
		#navigation_inhalt {
			width:				40%;
		}
	}
	@media screen and (max-width:850px) {
		#navigation_inhalt {
			width:				60%;
		}
	}
	@media screen and (max-width: 800px) and (orientation: landscape) {
		#navigation_inhalt {
			padding-bottom: 75px; /* Erhöht den Platz nur im Querformat auf mobilen Geräten */
		}
	}
	@media screen and (max-width:550px) {
		#navigation_inhalt {
			width:				100%;
		}
	}

.navigation, .navigation_inhalt {
margin-bottom:		15px;
}

.navigation a, .navigation_inhalt a {
text-decoration:	none;
}

#button_navigation_schliessen {
display:			none;
position:			fixed;
top:				40px;
right:				50px;
width:				20px;
height:				20px;
padding:			0;
background:			transparent;
border:				none;
z-index:			99;
cursor:				pointer;
}

#button_navigation_schliessen img {
width:				100%;
height:				auto;
display:			block;
}

.navipunkt {
display:			block;
text-align:			left;
margin:				20px 60px 20px 40px;
}

.navipunkt a {
text-decoration:	none;
}

.navipunkt a {
color:				white;
}

.navipunkt a:hover, .navipunkt:hover {
color:				black;
}

li.navipunkt_aktiv > a {
color:				black;
}

.navipunkt_linie {
border-right:		3px solid white;
}

.navipunkt_sub {
	padding-left:		20px;
}

#header_banderole {
	width:				100%;
	margin:				0;
	padding:			0;
	margin-bottom:		40px;
}

#header_banderole img {
	display:			block;
	width:				100%;
}

#content {
	width:				1110px;
	max-width:			100%;
	margin:				0 auto;
	margin-bottom:		40px;
	display:			flex;
	flex-wrap:			wrap;
	justify-content:	space-between;
	text-align:			center;
}

#content a, #content a:visited {
	color:				#28651B;
	text-decoration:	none;
	border-bottom:		1px dotted currentColor;
}

#content a:hover, #content a:focus {
	border-bottom-style:	solid;
}

	@media screen and (max-width:1155px) {
		#content {
			max-width:			90%;
		}		
	}
	@media screen and (max-width:600px) {
		#content {
			flex-direction:		column;
		}
	}

.bild_1-4, .text_1-4, .box_1-4, .kontaktformular_1-4, .kontaktbox_1-4, .newsbox_1-4 {
	width:				calc(25% - 15px);
	margin-bottom:		20px;
}

.bild_1-3, .text_1-3, .box_1-3, .kontaktformular_1-3, .kontaktbox_1-3, .newsbox_1-3 {
	width:				calc(33.3% - 15px);
	margin-bottom:		20px;
}

.bild_1-2, .text_1-2, .box_1-2, .kontaktformular_1-2, .kontaktbox_1-2, .newsbox_1-2 {
	width:				calc(50% - 15px);
	margin-bottom:		20px;
}

.bild_1-1, .text_1-1, .box_1-1, .kontaktformular_1-1, .kontaktbox_1-1, .newsbox_1-1 {
	width:				100%;
	margin-bottom:		20px;
}

.bild_2-3, .text_2-3, .box_2-3, .kontaktformular_2-3, .kontaktbox_2-3, .newsbox_2-3 {
	width:				calc(66.7% - 15px);
	margin-bottom:		20px;
}

.bild_3-4, .text_3-4, .box_3-4, .kontaktformular_3-4, .kontaktbox_3-4, .newsbox_3-4 {
	width:				calc(75% - 15px);
	margin-bottom:		20px;
}

.bild_1-4 img, .bild_1-3 img, .bild_1-2 img, .bild_1-1 img, .bild_2-3 img, .bild_3-4 img,
.box_1-4 img, .box_1-3 img, .box_1-2 img, .box_1-1 img, .box_2-3 img, .box_3-4 img {
	display:			block;
	max-width:			100%;
}

	@media screen and (max-width:600px) {
		.bild_1-4, .text_1-4, .box_1-4, .kontaktformular_1-4, .kontaktbox_1-4, .newsbox_1-4,
		.bild_1-3, .text_1-3, .box_1-3, .kontaktformular_1-3, .kontaktbox_1-3, .newsbox_1-3,
		.bild_1-2, .text_1-2, .box_1-2, .kontaktformular_1-2, .kontaktbox_1-2, .newsbox_1-2,
		.bild_2-3, .text_2-3, .box_2-3, .kontaktformular_2-3, .kontaktbox_2-3, .newsbox_2-3,
		.bild_3-4, .text_3-4, .box_3-4, .kontaktformular_3-4, .kontaktbox_3-4, .newsbox_3-4 {
			width:				100%;
		}
	}
	
.kontaktformular_1-4, .kontaktformular_1-3, .kontaktformular_1-2, .kontaktformular_2-3, .kontaktformular_3-4 {
	margin-bottom:		40px;
}

.box_1-4, .box_1-3, .box_1-2, .box_1-1, .box_2-3, .box_3-4 {
	background:			lightgrey;
}

.box_inhalt {
	padding:			20px;
}

.box_titel {
	font-weight:		bold;
	margin-bottom:		10px;
}

.box_link_button {
	display:			inline-block;
	padding:			10px 20px;
	background:			#28651B;
	color:				white;
	cursor:				pointer;
}

#footer {
	width:				100%;
	padding:			30px 0;
	background:			#EBDBCC;
}

#footer a, #footer a:visited {
	color:				#28651B;
	text-decoration:	none;
	border-bottom:		1px dotted currentColor;
}

#footer a:hover, #footer a:focus {
	border-bottom-style:	solid;
}

#footer_inhalt {
	width:				1110px;
	max-width:			100%;
	margin:				0 auto;
	text-align:			center;
}

	@media screen and (max-width:1155px) {
		#footer_inhalt {
			max-width:			90%;
		}		
	}

h1 {
	font-size:			18pt;
	font-weight:		bold;
	color:				#28651B;
	margin-bottom:		35px;
	width:				100%;
}

h2 {
	font-size:			16pt;
	font-weight:		bold;
	margin-top:			10px;
	margin-bottom:		20px;
	width:				100%;
}

.titel_h1, .titel_h2 {
	width:				100%;
}

.formfield, .formfield_fehler {
	height:				25px;
	padding:			2px 8px;
}

.formfield_select, .formfield_select_fehler {
	height:				31px;
	padding:			2px 4px;
}

.formfield_textarea, .formfield_textarea_fehler {
	height:				120px;
	padding:			8px 8px;
}

.formfield, .formfield_fehler,
.formfield_select, .formfield_select_fehler,
.formfield_textarea, .formfield_textarea_fehler {
	font-family:		"Roboto Medium", sans-serif;
	font-size:			0.9em;
	max-width:			100%;
	border:				1px solid lightgrey;
	box-sizing:			border-box;
}

.formfield, .formfield_fehler,
.formfield_textarea, .formfield_textarea_fehler,
.formfield_select, .formfield_select_fehler {
	width:				300px;
}

.formfield_fehler, .formfield_select_fehler, .formfield_textarea_fehler {
	background:			#FE797B;
}

.form_kontakt {
	margin-bottom:		15px;
}

.form_kontakt_datenschutz {
	width:				100%;
	display:			flex;
	flex-wrap:			nowrap;
}

.form_kontakt_datenschutz_box {
	margin-right:		10px;
}

.form_kontakt_datenschutz_text {
	width:				290px;
	max-width:			100%;
}

.formmeldung_fehler, .formmeldung_ok {
	padding:			10px 20px;
	color:				white;
	font-weight:		bold;
}

.formmeldung_fehler {
	margin-bottom:		25px;
	background:			#e30613;
}

.formmeldung_ok {
	background:			green;
}

.form_titel {
	font-weight:		bold;
}

input[type=submit] {
	font-size:			11pt;
	background:			#28651B;
	border:				none;
	color:				white;
	padding:			8px 16px;
	text-decoration:	none;
	cursor:				pointer;
}

.df_field {
	display:			none;
}

.maps {
	width:				100%;
	height:				450px;
}

.youtube_container {
	width:				100%;
	height:				0;
	padding-bottom:		56.25%;
	position:			relative;
}

.youtube_container iframe {
	position:			absolute;
	top:				0;
	left:				0;
	width:				100%;
	height:				100%;
}

#kontaktbox_wrap {
	border:				4px solid #28651B;
	padding:			20px;
	text-align:			center;
}

#kontaktbox_titel {
	font-size:			22pt;
	font-weight:		bold;
	color:				#28651B;
	margin-bottom:		20px;
	width:				100%;
}

#kontaktbox_einleitung {
	margin-bottom:		30px;
}

.kontaktbox_felder_wrap {
	display:			flex;
	flex-wrap:			wrap;
	justify-content:	center;
}

.kontaktbox_felder_1, .kontaktbox_felder_2 {
	margin-bottom:		20px;
	text-align:			left;
	box-sizing:			border-box;
}

.kontaktbox_felder_1 {
	padding-right:		10px;
}

.kontaktbox_felder_2 {
	padding-left:		10px;
}

	@media screen and (max-width:750px) {
		#kontaktbox_wrap {
			text-align:			left;
		}
		.kontaktbox_felder_wrap {
			flex-direction:		column;
		}
		.kontaktbox_felder_1, .kontaktbox_felder_2 {
			padding-left:		0;
			padding-right:		0;
			width:				100%;
		}
	}

.newsuebersicht_wrap {
	margin:				0 auto;
	margin-bottom:		13px;
	padding:			18px 25px;
	border-bottom:		1px dashed #7F6035;
	width:				calc(100%-50px);
	max-width:			720px;
	background:			lightgrey;
}

.newsuebersicht_titel {
	margin-bottom:		8px;
	text-align:			left;
}

.newsuebersicht_inhalt {
	width:				100%;
	display:			flex;
	flex-wrap:			nowrap;
	text-align:			left;
}

.newsuebersicht_bild {
	margin-right:		10px;
}

.newsuebersicht_bild img {
	display:			block;
}

.newsuebersicht_text {
	flex-grow:			1;
}

.news_paginator {
	width:				100%;
	margin-top:			20px;
}

.news_paginator a {
	color:				black;
}

.news_paginator_legende {
	width:				100%;
	margin-bottom:		3px;
}

.news_paginator_zahlen {
	width:				100%;
	display:			flex;
	flex-wrap:			wrap;
	justify-content:	center;
}

.news_paginator_zahl, .news_paginator_zahl_aktiv {
	border:				1px solid black;
	box-sizing:			border-box;
	padding:			4px 8px;
	margin:				0 4px 8px 4px;
}

.news_paginator_zahl_aktiv {
	background:			#28651B;
}

.news_paginator_zahl:hover {
	background:			#28651B;
}
	
#news_datum {
	width:				100%;
	margin-bottom:		20px;
}

#news_einleitung {
	font-weight:		bold;
	margin-bottom:		30px;
	width:				100%;
}

#news_bilder_erstes {
	margin-bottom:		30px;
}

#news_bilder_erstes img {
	max-width:			100%;
}

#news_bilder_weitere_wrap {
	display:			flex;
	flex-wrap:			wrap;
	justify-content:	center;
	margin-left:		-15px;
}

#news_beitrag {
	margin-bottom:		30px;
	width:				100%;
}

.news_bilder_weitere {
	width:				calc(33.3% - 15px);
	margin-left:		15px;
	margin-bottom:		30px;
}

	@media screen and (max-width:500px) {
		#news_bilder_weitere_wrap {
			flex-direction:		column;
			margin-left:		0;
		}	
		.news_bilder_weitere {
			width:				100%;
			margin-left:		0;
		}
	}

.news_bilder_weitere img {
	display:			block;
	max-width:			100%;
}

#newsbox_wrap {
	background:			#28651B;
	border:				1px solid black;
	box-sizing:			border-box;
	padding:			20px 20px 7px 20px;
}

.newsbox_titel {
	font-size:			16pt;
	font-weight:		bold;
	margin-bottom:		20px;
	width:				100%;
}

.newsuebersicht_nurtitel {
	margin-bottom:		13px;
}

.newsuebersicht_nurtitel_titel {
	font-weight:		bold;
}

#galerie_wrap {
	width:				100%;
	display:			flex;
	flex-wrap:			wrap;
	justify-content:	flex-start;
	margin-left:		-15px;
}

.albumliste_wrap {
	width:				calc(25% - 15px);
	margin-left:		15px;
	margin-bottom:		30px;
}

.albumliste_wrap img {
	width:				100%;
}

.albumliste_detail_datum {
	width:				100%;
}

.albumliste_detail_beschreibung {
	width:				100%;
	margin-bottom:		20px;
}

.albumliste_zurueck {
	width:				100%;
	margin-bottom:		20px;
}

.albumliste_bild {
	margin-bottom:		10px;
}

.albumliste_text_titel {
	font-weight:		bold;
}

	@media screen and (max-width:930px) {
		.albumliste_wrap {
			width:				calc(33.3% - 15px);
		}		
	}
	@media screen and (max-width:750px) {
		.albumliste_wrap {
			width:				calc(50% - 15px);
		}		
	}
	@media screen and (max-width:500px) {
		#galerie_wrap {
			flex-direction:		column;
		}
		.albumliste_wrap {
			width:				100%;
		}		
	}

* {
	margin:				0;
	padding:			0;
}

p {
	margin-bottom:		15px;
}

ul {
	padding-left:		20px;
	margin-bottom:		15px;
	list-style-position:	inside;
}

ol {
	padding-left:		20px;
	list-style-position:	inside;
}