@font-face { font-family: 'Fira Sans Extra Condensed';
             src: url('fonts/Fira_Sans_Extra_Condensed/FiraSansExtraCondensed-Light.ttf') format('truetype'); font-weight: 300; font-display: swap; }
@font-face { font-family: 'Fira Sans Extra Condensed';
             src: url('fonts/Fira_Sans_Extra_Condensed/FiraSansExtraCondensed-Regular.ttf') format('truetype'); font-weight: 400; font-display: swap; }
@font-face { font-family: 'Fira Sans Extra Condensed';
             src: url('fonts/Fira_Sans_Extra_Condensed/FiraSansExtraCondensed-SemiBold.ttf') format('truetype'); font-weight: bold; font-display: swap; }
@font-face { font-family: 'Fira Sans Extra Bold';
             src: url('fonts/Fira_Sans/FiraSans-ExtraBold.ttf') format('truetype'); font-weight: 900; font-display: swap; }
@font-face { font-family: 'Fira Sans Semi Bold';
             src: url('fonts/Fira_Sans/FiraSans-SemiBold.ttf') format('truetype'); font-weight: 400; font-display: swap; }


:root {
  /*--mb-text: #676564;
  --mb-read-more: #1d7ebc;
  --mb-headline: #ef7900;*/
  --mb-text: #333;
  --mb-read-more: #006699;
  --mb-headline: #cc3300;
  --mb-link: #4C6697;
  --mb-link-hover: #000;
}

body
{
	background-color: #fff;
	margin: 1rem 0 0;
	font-family: "Fira Sans Extra Condensed", sans-serif;
	font-size: 16px;
	font-weight: 300;
  color: var(--mb-text);
}

figure { margin: 0 1rem 2rem 0; }
figcaption { font-size: .75em; }
figcaption.text-fullsize { font-size: 1.25rem; }
img { border: 0; max-width: 100%; height: auto; }

div { box-sizing: border-box; }

p
{
	margin: 0px 0px 1.2em 0px;
}

a { color: var(--mb-link); }
a:hover { color: var(--mb-link-hover); }

h1
{
	font-size: 2rem;
	font-weight: normal;
	margin: 0 0 .25em 0;
	text-transform: uppercase;
	color: var(--mb-read-more);
}
h1.h1-home
{
	font-size: 1.5rem;
	text-transform: none;
	margin-top: .5rem;
}

h2
{
	font-size: 1.5rem;
	font-weight: normal;
	margin: 1.25rem 0 .25rem 0;
	text-transform: uppercase;
	color: var(--mb-headline);
}

h2 small { font-size: .6em; }

h3
{
	font-size: 1.5rem;
	font-weight: normal;
	margin: 1.25em 0 .25em 0;
}

h3 small { font-size: .6em; }

.no-padding {
	padding: 0 !important;
}

a.toplink { display: block; margin-top: 1rem; }
a.toplink::before {content: url("images/icons/back-to-top.png");}
ul.downlinks {
	margin: 0;
	padding: 0;
	list-style: none;
}
ul.downlinks a::before {content: url("images/icons/down.png");}

.htmlbanner {
	font-family: "Fira Sans Semi Bold", sans-serif;
	width: 100%;
	background: white;
	font-size: 24px;
	padding: 16px 24px 4px 24px;
	margin-bottom: 1.5rem;
}

.banner-headline {
	font-family: "Fira Sans Extra Bold", sans-serif;
	font-weight: 900;
	font-size: 36px;
	color: #fdc300;
}

.banner-headline .indented { padding-left: 84px; }

.banner-headline big { font-size: 60px; }

.htmlbanner p { color: var(--mb-text); }
.htmlbanner a,
.htmlbanner .coloured { color: var(--mb-read-more); }
.htmlbanner a { font-weight: bold; }
.htmlbanner a::before { content: '⇨ '; }
.banner-link { text-align: right; }

.calendar * { font-size: 1.5rem; }
.cal-title-description h2 { margin-top: 0; }
.date,
.hinweis,
.cal-hinweis { color: var(--mb-headline); font-size: 1.5rem; }
.cal-date { font-size: 1.5rem; }
.calendar h2 { font-size: 1.5rem; text-transform: none; color: var(--mb-text); }

dd { margin-bottom: 1rem; }

.orange { color: var(--mb-headline); }
.red { color: red; }
.yellow { color: #fdc300; }
.textshadow {  text-shadow: 0 0 2px #333; }
.bigger { font-size: 1.5em; }
.stellungnahme::before { content: '↳'; text-decoration: none; }

ol > li { margin-bottom: 1rem; }

.mini { font-size: .25rem; }
.textlabel-180 { display: inline-block; min-width: 180px; }
.textlabel-150 { display: inline-block; min-width: 150px; }
.textlabel-120 { display: inline-block; min-width: 120px; vertical-align: top; }
.textlabel-small { display: inline-block; min-width: 80px; }
.centered { text-align: center; }
.nowrap { white-space: nowrap; }

.news-section { margin-bottom: 2rem; }
.news-section h3 { text-transform: uppercase; }

.festprogramm,
.festprogramm h3,
.festprogramm h4 { font-size: 1rem; }
.festprogramm h3,
.festprogramm h4 { font-weight: bold; }
.festprogramm h3 { color: #83217a; margin-top: 1.25rem !important; }
.festprogramm h4 { display: inline; }

textarea { max-width: 98%; }

.resultCount p { margin-top: 1rem; }

/* Container */

.content { padding: 2rem 0; }

.beschluesse h2 { padding-top: 1.5rem; }

section:first-child { margin-top: 0; }
section { margin-top: 4rem; }

.main-wrapper,
.footer
{
	width: 100%;
	max-width: 1024px;
	margin: auto;
	font-size: 1.25rem;
}

.main-wrapper { padding: 0 1rem; }

.header
{
	width: 100%;
}

.menu-wrapper
{
	padding: 20px 0 0 0;
  margin: 0 auto;
  width: 100%;
}

.footer-wrapper {
	width: 100%;
	margin-top: 2rem;
	background-color: #fff;
}

.social-icons-container {
	display: flex;
	flex-flow: row nowrap;
	justify-content: center;
	align-items: center;
}
.social-icons-container div { padding: 2rem; }
.social-icons-container img { width: 80px ! important; height: auto; }
.social-icons-container img { width: 80px ! important; height: auto; }

.has-padding { padding: 2rem; text-align: center; }
.logo-small { max-width: 361px; }
.hidden { display: none; }
.visually-hidden {
	clip: rect(0,0,0,0);
  border: 0;
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  white-space: nowrap;
  width: 1px;
}

/* MENU */

/* menu trigger */
#nav-trigger
{
	float: right;
	margin-top: 1.5rem;
	display: block;
	cursor: pointer;
	box-sizing: border-box;
	display: flex;
	justify-content: flex-start;
	padding-top: 4px;
}

	.line {
		width: 40px;
		height: 4px;
		background: #000000;
		margin-bottom: 5px;
	}
	

/* menu close-button */
#main-nav #x-close-wrapper { float: right; }
#main-nav a#x-close { display: inline-block; text-decoration: none; font-family: mono-space; padding: .2em .3em; background-color: #fff; margin-right: 0.5em; font-size: 2em; }
#main-nav a#x-close:hover { text-decoration: none; }

#nav1 { clear: right; }

/* main menu */
#main-nav {
	position: fixed;
	top: 0;
	left: -100vw;
	z-index: 10000;
	width: 100vw;
	height: 100vh;
	min-height: 23em;
	padding: 1rem;
	background-color: rgba(255,255,255,0.9);
	transition: left .5s;
}
/* menu styles */
ul.mbm-menu { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; }

ul.mbm-menu li { 
	margin: 0;
	text-align: center;
	font-size: 1.25rem;
}

ul.mbm-menu li a
{
	display: block;
	width: auto;
	height: auto;
	font-weight: 400;
	color: var(--mb-text);
	padding: 4px 10px;
	text-decoration: none;
}

ul.mbm-menu li a:hover,
ul.mbm-menu li a.current
{
	color: #000;
	background-color: #cfcfcf;
}

ul.mbm-footer-menu li a { font-weight: 300; }

@media (min-width: 920px) {
	#nav-trigger { display: none; }
	#main-nav #x-close-wrapper { display: none; }
	#main-nav li#x-li { display: none; }
	
	#main-nav
	{
		position: static;
		border: 0;
		min-height: .8rem;
		background: #eee;
		z-index: 0;
		width: 100%;
		height: auto;
		margin-top: 1rem;
		padding: 0;
		overflow: auto;
		-webkit-transition: all 0.3s;
		-moz-transition: all 0.3s;
		transition: all 0.3s;
	}
	ul.mbm-menu { flex-direction: row; flex-wrap: nowrap; justify-content: space-between; }
}


/* Pages menu */

ul.nav-pages { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; }
ul.nav-pages li { 
	margin: 0;
	text-align: center;
	font-size: 1.25rem;
	padding: 0.25rem;
}
ul.nav-pages li a
{
	display: block;
	width: auto;
	height: auto;
	color: var(--mb-text);
	padding: 4px 10px;
	text-decoration: none;
}
ul.nav-pages li a::before { content: '⇨ '; }
ul.nav-pages li a:hover,
ul.nav-pages li a.current
{
	color: #000;
	background-color: #cfcfcf;
}

/* rows and columns */
/*
.row { display: flex; flex-flow: row wrap; align-items: center; }
.col {  }
*/

.row { display: grid; column-gap: 1.25rem; row-gap: 1.25rem; }
.header .row { align-items: center; }
.header .search { justify-self: end; }
.imgbox { line-height: 0; }
.imgbox p { line-height: 1.25rem; }
.imgbox img { width: 100%; height: auto; }
.imgbox figure { margin-right: 0; }
.imgbox figcaption { line-height: 1rem; padding: .5rem; }
.twocols { grid-template-columns: 1fr; }
.threecols { grid-template-columns: 1fr; }
.fourcols { grid-template-columns: 1fr; }

.galerie { display: flex; flex-flow: row wrap; align-items: flex-end; width: 100%; }
.galerie div { padding: 0 .85rem .45rem 0; }
.galerie-copyright {font-weight: normal; color: #999999; padding-left: 1rem;}

@media screen and (min-width: 540px) {
	.main-wrapper { padding: 0 2rem; }
	.twocols { grid-template-columns: 1fr 1fr; }
	.threecols { grid-template-columns: 1fr; }
	.fourcols { grid-template-columns: 1fr 1fr; }
}
@media screen and (min-width: 760px) {
	.threecols { grid-template-columns: 1fr 1fr 1fr; }
	.fourcols { grid-template-columns: 1fr 1fr 1fr 1fr; }
	h2 { font-size: 1.75rem; }
	h3 { font-size: 1.75rem; }
}
.with-margin-b { margin-bottom: 3rem; }
.with-border-b { border-bottom: 1px solid #cfcfcf; padding: 1rem 0; }


/* col colors */

.textbox { display: grid; align-items: center; padding: 1.5rem; color: white; }
.nopt { padding-top: 0; }
.news-section .textbox { align-items: start; }
.textbox h2,
.textbox h3 { margin-top: 0; }
.textbox a { color: white; text-decoration: none; }
.textbox a.current,
.textbox a:hover { text-decoration: underline; }

.textbox.align-top { align-content: baseline; }
.textbox.align-items-top { align-items: start; }

.bg-textbox { background-color: #fff; color: var(--mb-text); }
.bg-textbox a { color: var(--mb-read-more); }
.bg-textbox a::before { content: '⇨ '; }
.bg-white { background-color: #ffffff; color: var(--mb-text); }
.bg-white a { color: var(--mb-read-more); }
.bg-purple { background-color: #904481; }
.bg-orange { background-color: var(--mb-headline); }
.bg-blue { background-color: var(--mb-read-more); }
.bg-aqua { background-color: #489889; }


/* Tile List */
.tile-list-container { margin-top: 4rem; }
ul.tile-list { display: flex; flex-flow: row wrap; justify-content: flex-start; gap: 1rem; list-style: none; margin: 0; padding: 0; }
ul.tile-list li { background-color: var(--mb-headline); }
ul.tile-list li a { display: block; padding: 1rem; font-size: 2rem; font-weight: bold; color: white; text-decoration: none; background-color: var(--mb-headline); }
ul.tile-list li a:hover { background-color: #EF5700; }


main {display: block;}

.hero {
	text-align: center;
}
.hero-image { width: 100%; background-color: #fff; }
.hero-text { padding-top: 3rem; }


/* Terminkalender */
.cal-wrapper {width: 100%;}
.cal-row { display: flex; flex-flow: column wrap; gap: 1rem; flex-basis: 100%; border-bottom: 1px solid gray; }
.cal-col { flex: 0 1 auto; padding: .25rem; }

.nav_calendar {
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
	padding: 1rem 0 0 0;
}
.nav_calendar p { margin: 0; }
.nav_calendar div { padding: 0 1rem; text-align: center; }
.nav_calendar div.w1 { flex-basis: 100px; }
.nav_calendar div.w2 { flex-basis: 220px; }
.nav_calendar div.fullwidth { width: 100%; text-align: center; }

@media screen and (min-width: 760px) {
	.cal-row { flex-flow: row nowrap; }
	.cal-date { width: 160px; flex-shrink: 0; }
	.cal-title-description { -webkit-flex-grow: 4; flex-grow: 4; }
	.cal-note { width: 160px; text-align: right; }
	.cal-edit-delete { width: 140px; flex-shrink: 0; }
}

.footer
{
  margin: 0 auto;
  padding: 3rem 2rem 5rem 2rem;
  background-color: #fff;
  background-image: none;
  color: var(--mb-text);
	font-weight: 300;
}
.footer a { color: var(--mb-text); }

.footer-navi { float: right; }