:root {
  --white: #fff;
  --grey: #58585a;
  --black: #000;
  --yellow: #fdcb3c;
  --red: #E36F99 /**ea7597**/;
  --blue: #3EA2B0 /**62bfc6**/;
  --green: #79A21E /**9fc341**/;
  --focus: #EB1806;
  --navTransition: 280ms all 120ms ease-out;
}

*:focus { outline: 0 }
html { box-sizing: border-box }
*, *:before, *:after { margin: 0; padding: 0; box-sizing: inherit }

body { color: var(--grey); font-family: verdana, arial, sans-serif ; font-size: 1em;  }
h1 { color: var(--green); font-size: 150%; margin: 2rem 0 1rem 0 }
h1 a { color: var(--green) }
h2{ color: var(--yellow); font-size: 125% }
h2 a { color: var(--yellow) }
h3 { color: var(--red); font-size: 100% }
p { font-size: 100%; line-height: 142%; margin: 0 0 1rem 0 }

ul, dl { font-size: 100%; padding: 0 0 1rem 14px }
ol { font-size: 100%; padding: 0 0 0 25px }
/*ul li { list-style-type: none }*/
ol li { list-style-type: decimal; list-style-image: none; padding: 0 0 0 10px }
li p { font-size: 100%; margin: 0 }


a { color: var(--blue); text-decoration: underline }
a:hover { text-decoration: none }

.clear { clear: both }
.visually-hidden { position: absolute; position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important;	margin: -1px !important; overflow: hidden !important; clip-path: inset(0 0 0 0) !important; white-space: nowrap !important; border: 0 !important }

#currentNews img.bg { min-height: 100%; min-width: 1440px; width: 100%; height: auto; position: fixed; top: 0;  left: 0; z-index: -100 }
#container { z-index: 50; position: relative }
#main { max-width: 900px; margin: 0 auto !important; }

header { background:var(--grey); position: relative }
.logoPosition { background: var(--white); padding: 5px 5px 0 5px; text-align: center }
.logoPosition img { width: 100%; max-width: 200px; height: auto }

section header { background: none }

.mod_breadcrumb { font-size: 80%; background: var(--green); padding: 5px 0 }
.mod_breadcrumb div { max-width: 900px; margin: 0 auto !important; display: flex; gap: 5px; padding: 0.25rem 0; font-size: 0.8rem }
.mod_breadcrumb p { padding: 0; margin: 0; color: var(--black) }
.mod_breadcrumb ol { display: flex; justify-content: left; gap: 5px; flex-wrap: wrap; margin: 0; padding: 0 }
.mod_breadcrumb li { color: var(--black); list-style: none; padding: 0 }
.mod_breadcrumb a { color: var(--black); text-decoration: none }

.menuTop { max-width: 900px; margin: 0 auto !important; padding: 0 10px }
.menuTop ul, .secLevelMenu ul { margin: 0; padding: 0 }
.menuTop a, .secLevelMenu a { color: var(--white); text-decoration: none; padding: 0 10px 5px 0; width: 45% }
.menuTop span, .secLevelMenu span { color: var(--white); font-weight: bold; padding:0 10px 5px 0; width: 45% }
.menuTop li, .secLevelMenu li { list-style-type: none; position: relative; display: inline-Block; vertical-align: top; padding: 10px 15px 10px 0 !important }
.menuTop .secLevel li { display: block; padding: 0 0 5px 0 !important }

.menuTop .secLevel { display: none }

.menuTop li li { display: none }
.menuTop li li { font-size: 100% }
.menuTop navActive { color: #ef4023; background: #dcefb8 }

.secLevelMenu { border-top: 1px solid var(--white); clear: both; font-size: 90% }
.secLevelMenu li { padding: 10px 10px 10px 0 !important }

.content, #innerCon, .content-vorstand { max-width: 900px; margin: 0 auto; padding: 0 10px }
.content-vorstand .ce-gallery figcaption { display: none }
.content li { font-size: 100%; margin: 0 0 15px 0 }

.ce-uploads span { display: inline }
.ce-uploads .ce-uploads-filesize::after { content: ")" }
.ce-uploads .ce-uploads-filesize:before { content: " (" }

.copyright { clear: both; text-align: center; font-size: 80% }
.sitemap { display: block; background: var(--grey); min-height: 25px }
.sitemap ul, .sitemap h3 { display: none }

.latestView article { margin: 0 1% 1% 0; padding: 1%; background: rgba(255, 255, 255, 0.8); border: 1px solid var(--black) }
.latestView article h2 { font-size: 95%; line-height: 142%; margin: 0  }
.latestView .imgWrap a img { max-width: 100%; height: auto }
.latestView .more { text-align: right }

.latestView .imgWrap a img { max-width: 100%; height: auto }
.newsDateCat { display: block }

.listView { border-top: 1px solid var(--black) }
.listView article { border-bottom: 1px solid var(--black) }
.listView article .imgWrap img { margin-top: 5px; width: 25%; height: auto; border: 1px solid var(--black) }
.listView article .imgWrap .no-media-element img { border: none; width: 210px !important }
.listView article .newsImage { width: 100%; height: auto }
.listView .more { text-align: right; clear: both }

.news-list-category { margin-bottom: 10px }
.teaser { font-weight: bold  }

.related-info { float: right; max-width: 290px }
.related-info img { border: 1px solid var(--black) }

.news-related-links span { display: block }

.newsBacklink { margin-bottom: 10px }

.articleBody { max-width: 600px; margin-top: 10px }

.page-navigation li { display: inline-block; margin: 0 3px }

footer { clear: both }

@media screen and (min-width: 590px) {

.content-vorstand { display: flex; flex-wrap: wrap }
.content-vorstand .ce-textpic { width: 30%/*; float: left*/ }
.content-vorstand .ce-left .ce-gallery {float: none}
.content-vorstand .ce-intext.ce-left .ce-gallery { margVn-bottom: 0 }

}

@media screen and (min-width: 750px) {

header { background: url(header-bg.jpg) var(--grey) top left no-repeat; background-size: cover; position: relative }
.logoPosition { background: url(bg-logo.png) top left no-repeat; padding: 15px 5px 70px 5px; text-align: center; max-width: 230px; height: 200px; position: relative; top: 0; left: 25% }
.logoPosition img { width: 100%; max-width: 190px; height: auto }

#currentNews header { background: none }

.menuTop { margin: 70px auto 0 !important }
.menuTop ul { margin: 0 }
.menuTop li { position: relative }
.menuTop li .secLevel { display: none }
.menuTop li:hover .secLevel { display: block; position: absolute; top: 40px; left: 0; z-index: 100; background: rgba(88,88,90,0.8); padding: 0 0 0 5px !important }
.secLevelMenu { display: none }

.content-left { float: left; width: 47% }
.content-right { float: right; width: 47% }

.latestView article { width: 30%; float: left; margin: 0 1% 1% 0; padding: 1%; background: rgba(255, 255, 255, 0.8); height: 25em; overflow: hidden }
.latestView article:first-child { width: 96.5% !important; height: 22em }
.latestView article .imgWrap { max-width: 100%; text-align: center; padding: 5px 5px 0px 5px }
.latestView article:first-child .imgWrap { max-width: 50%; float: right; margin-left: 2% }
.latestView .imgWrap a img { border: none }

.listView { width: 98.7% }

.listView article .imgWrap img { float: right; margin-top: 5px; width: 25%; height: auto; border: 1px solid var(--black) }
.listView article .imgWrap .no-media-element img { border: none; width: 210px !important }

}

@media screen and (min-width: 1024px) {

.menuTop li { padding: 10px 20px 10px 0 !important }

.sitemap { display: block; background: var(--grey) }
.sitemap { font-size: 75% }
.sitemap h3 { position: absolute; left: -90000px }
.sitemap ul { display: block; color: var(--white); padding: 20px 10px; margin: 0 auto; max-width: 900px }
.sitemap li:last-child { margin: 0 }
.sitemap li { display: inline-block; vertical-align: top; font-weight: bold; margin: 0 20px 0 0 }
.sitemap ul ul { padding: 8px 0 0 0; margin: 0 }
.sitemap ul li ul li { display: block; font-weight: normal; max-width: 100% }
.sitemap a { color: #fff; text-decoration: none }
.sitemap a:hover { color: #fff; text-decoration: underline }

}
