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

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

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

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

#wrapper {
	margin-top:			152px;
}

	@media screen and (max-width:800px) {
		#wrapper {
			margin-top:			122px;
		}
	}

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

#header_streifen {
	width:				100%;
	background:			#733445;
}

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

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

#header_left {
	flex-grow:			1;
}

#header_left img {
	height:				100px;
}

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

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

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

#icon_menu_icon_wrap {
	display:			inline-block;
}

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

#navigation_inhalt {
position:			fixed;
display:			none; /* Immer inline-block */
pointer-events:		none; /* Keine Interaktion, wenn unsichtbar */
transition:			opacity 0.5s ease; /* Weicher Übergang für Opazität */
background:			#733445;
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:				#D2B1A2;
}

li.navipunkt_aktiv > a {
  color: #D2B1A2;
}

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

#header_banderole {
	width:				100%;
	margin:				0 auto;
	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;
}

#content a, #content a:visited {
	color:				#733445;
	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, .mitgliederliste_1-4, .terminliste_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, .mitgliederliste_1-3, .terminliste_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, .mitgliederliste_1-2, .terminliste_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, .mitgliederliste_1-1, .terminliste_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, .mitgliederliste_2-3, .terminliste_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, .mitgliederliste_3-4, .terminliste_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, .mitgliederliste_1-4, .terminliste_1-4,
		.bild_1-3, .text_1-3, .box_1-3, .kontaktformular_1-3, .kontaktbox_1-3, .newsbox_1-3, .mitgliederliste_1-3, .terminliste_1-3,
		.bild_1-2, .text_1-2, .box_1-2, .kontaktformular_1-2, .kontaktbox_1-2, .newsbox_1-2, .mitgliederliste_1-2, .terminliste_1-2,
		.bild_2-3, .text_2-3, .box_2-3, .kontaktformular_2-3, .kontaktbox_2-3, .newsbox_2-3, .mitgliederliste_2-3, .terminliste_2-3,
		.bild_3-4, .text_3-4, .box_3-4, .kontaktformular_3-4, .kontaktbox_3-4, .newsbox_3-4, .mitgliederliste_3-4, .terminliste_3-4 {
			width:				100%;
		}
	}

.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;
}

#footer {
	color:				white;
	width:				100%;
	padding:			30px 0;
	background:			#733445;
}

#footer a, #footer a:visited {
	color:				#D2B1A2;
	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:			22pt;
	font-weight:		bold;
	color:				#733445;
	margin-bottom:		20px;
	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:		"Arial", sans-serif;
	font-size:			12pt;
	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:			12pt;
	background:			#733445;
	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 #733445;
	padding:			20px;
	text-align:			center;
}

#kontaktbox_titel {
	font-size:			22pt;
	font-weight:		bold;
	color:				#733445;
	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-bottom:		13px;
	padding-bottom:		13px;
	border-bottom:		1px dashed #7F6035;
	width:				100%;
}

.newsuebersicht_titel {
	margin-bottom:		8px;
}

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

.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;
}

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

.news_paginator_zahl_aktiv {
	background:			#733445;
}

.news_paginator_zahl:hover {
	background:			#733445;
}
	
#news_datum {
	margin-bottom:		30px;
}

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

#news_bilder_erstes {
	margin-bottom:		30px;
}

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

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

#news_beitrag {
	margin-bottom:		30px;
}

.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 {
	color:				white;
	background:			#733445;
	border:				1px solid black;
	box-sizing:			border-box;
	padding:			20px 20px 7px 20px;
}

#newsbox_wrap a, #newsbox_wrap a:visited {
	color:				white;
}

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

.newsuebersicht_nurtitel {
	margin-bottom:		13px;
}

.newsuebersicht_nurtitel_titel {
	font-weight:		bold;
}

.mitglieder_wrap {
	width:				100%;
	display:			flex;
	flex-wrap:			wrap;
	justify-content:	flex-start;
}

.mitglieder_eintrag {
	margin-right:		90px;
	margin-bottom:		30px;
	width:				133.33px;
}

.mitglieder_eintrag img {
	width:				100%;
	display:			block;
}

.mitglieder_eintrag_bild {
	margin-bottom:		5px;
}

	@media screen and (max-width:600px) {
		.mitglieder_wrap {
			display:			flex;
			flex-wrap:			wrap;
			gap:				20px;
		}
		.mitglieder_eintrag {
			width:				calc(50% - 10px);
			margin:				0;
		}
	}
	@media screen and (max-width:280px) {
		.mitglieder_eintrag {
			width:				100%;
		}
	}

#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%;
		}		
	}

#termine_filter {
	margin-bottom:		20px;
}

.termine_filter_select {
	height:				31px;
	padding:			2px 4px;
	font-family:		"Arial", sans-serif;
	font-size:			12pt;
	max-width:			100%;
	border:				1px solid lightgrey;
	box-sizing:			border-box;
}

.termine_eintraege_wrap {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.termine_eintrag {
  display: grid;
  grid-template-columns: minmax(0, 100px) minmax(0, 220px) minmax(0, 150px) minmax(0, 100px);
  gap: 20px;
  width: 100%;
}

.termine_eintrag_datum {
  overflow-wrap: break-word;
}

.termine_eintrag_titel {
  overflow-wrap: break-word;
}

.termine_eintrag_ort {
  overflow-wrap: break-word;
}

.termine_eintrag_kategorie {
  overflow-wrap: break-word;
}



	@media screen and (max-width: 600px) {
		.termine_eintrag {
			display: flex;
			flex-wrap: wrap;
			margin-bottom: 15px;
			gap: 3px;
		}

		.termine_eintrag_datum,
		.termine_eintrag_titel,
		.termine_eintrag_ort,
		.termine_eintrag_kategorie {
			flex: 1 1 100%;
			margin-right: 0;
		}
	}

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

#termin_datumort {
	font-weight:		bold;
	margin-bottom:		15px;
	width:				100%;
}

#termin_text {
	width:				100%;
}

#termin_bild {
	width:				50%;
}

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

	@media screen and (max-width:500px) {
		#termin_bild {
			width:				100%;
		}	
	}
	
#termin_textbild {
    display:			flex;
    gap:				30px;
    align-items:		flex-start;
	width:				100%;
}

#termin_texbild_text {
    flex:				1 1 auto;
}

#termin_texbild_bild {
    width:				400px;
	min-width:			400px;
	margin-left:		auto;
    display:			flex;
    justify-content:	flex-end;
}

#termin_texbild_bild img {
    width:				100%;
    height:				auto;
}

	@media screen and (max-width:825px) {
		#termin_texbild_bild {
			width:				250px;
			min-width:			250px;
		}		
	}
	@media screen and (max-width: 650px) {
		#termin_textbild {
			flex-direction:		column;
			gap:				25px;
		}
		#termin_texbild_text,
		#termin_texbild_bild {
			width:				100%;
		}
	}
	
#termine_archiv {
	margin-top:			20px;
}

#intern_dateiliste a:hover {
text-decoration:	none;
}

.intern_bereich {
background:			#733445;
color:				white;
font-weight:		bold;
padding:			5px 8px;
margin-bottom:		12px;
cursor:				pointer;
}

.intern_bereich_sub {
font-weight:		bold;
margin-bottom:		8px;
}

.intern_dateien_wrap {
margin-bottom:		16px;
padding:			0 8px;
display:			none;
}

.intern_dateien_sub_wrap {
margin-left:		15px;
margin-bottom:		15px;
display:			none;
}

.intern_datei_wrap {
margin-bottom:		5px;
}

.intern_datei_wrap:hover {
background:			#F7C9B6;
}

.intern_datei_icon {
line-height:		26px;
float:				left;
margin-right:		10px;
}

.intern_datei_name {
line-height:		26px;
overflow:			hidden;
cursor:				pointer;
}

.intern_userinfo {
border:				1px solid #733445;
line-height:		25px;
padding:			8px 15px;
clear:				both;
margin-bottom:		25px;
}

.loginform_meldung, .passwortform_meldung {
color:				white;
background:			red;
padding:			10px;
border:				1px solid black;
margin-bottom:		20px;
clear:				both;
}

.passwortform_meldung_ok {
color:				white;
background:			green;
padding:			10px;
border:				1px solid black;
margin-bottom:		20px;
clear:				both;
}

* {
	margin:				0;
	padding:			0;
}

p {
	margin-bottom:		15px;
}

ul {
	padding-left:		20px;
	margin-bottom:		15px;
}

ol {
	padding-left:		20px;
}