/* allgemeine angaben
-------------------------------------- */
:root {
    /*--gruen: #6cb121;alt*/
    /*--dunkelgruen: #508800;alt*/
    --gruen: #538718;
    --dunkelgruen: #467414;
    --rot: #bf0949;
}
body {padding: 0;margin: 0;background-color: #ffffff;color: #000000;font-family: Arial, sans-serif , Verdana, Geneva, Helvetica;font-size: 100%;line-height: 1.6em;}
a, a:link, a:active, a:visited, font a, font a:link, font a:active, font a:visited {color: var(--dunkelgruen);text-decoration: none;}
a:hover, font a:hover {color: #508800;text-decoration: underline;}
a:focus, button:focus {outline: 3px dotted var(--rot);z-index: 1;}

table, tr, td, th {font-size: 1.25rem;vertical-align: top;}
table {border-spacing: 0;}
img {border: none;max-width:100%;height:auto;}
/* am Bildschirm verstecken */
.hideScreen, .showPrint {display: none;visibility: hidden;height: 1px;overflow: hidden;}
.hyphenate {-webkit-hyphens: auto;-webkit-hyphenate-limit-chars: auto 3;-webkit-hyphenate-limit-lines: 4;
        -ms-hyphens: auto;-ms-hyphenate-limit-chars: auto 3;-ms-hyphenate-limit-lines: 4;
        hyphens: auto;hyphenate-limit-chars: auto 3;hyphenate-limit-lines: 4;}
/*Sprunglinks*/
.unsichtbar {position: absolute;top: 0;left: 0;z-index: 100;}
.unsichtbar a {display: inline-block;font-weight: bold;background-color: #fff;padding: 15px;margin: 5px;border: 3px solid var(--gruen);text-decoration: none;}
.unsichtbar a:not(:focus):not(:active) {position: absolute;width: 1px;height: 1px;overflow: hidden;clip: rect(0 0 0 0);clip-path: inset(100%);white-space: nowrap;}

/* mainnav
------------------------------------ */
#navigation ul {list-style-type:none;padding:0;margin:0;width:266px}
#navigation ul li {padding-bottom:1px;margin:0;line-height:2.5em;text-indent:5%;background-image:url(../images/linie_navi.gif);background-repeat:no-repeat;background-position:bottom;vertical-align:middle;font-weight:700}
#navigation ul li a {text-decoration:none;color:var(--gruen);font-size:1.25rem;margin: 0 0 0 22px;display:block;transition: all 0.2s ease;}
#navigation ul li a:hover,#navigation ul li.active a {background-color: var(--gruen);background-image:url(../images/navibutton.gif);background-repeat:no-repeat;background-position:top right;
        margin-right:1px;color:#fff;transition: all 0.2s ease;}

#page {border-top:18px solid var(--rot)}
#header {background-image:url(../images/bg_header.png);background-repeat:repeat-x;width:100%}
#flashi {height:106px;width:479px}
#header-image img{width: 755px;height: 140px;}
#contentbox {max-width:1100px;padding-bottom:5em;padding-right:20px;display: flex;justify-content: start;}
#contentbox .left {}
#contentbox #navigation {width: 30%;margin-top: 1em;margin-left: 5em;}

footer {position:fixed;bottom: 0;width: 100%;height: 2em;display: flex;justify-content: start;padding: 0.3em;background-color: var(--rot);gap:3em;flex-wrap: wrap;align-items: center;}
footer #address {display: flex;flex-wrap: wrap;gap: 1em;}
footer #address span {position: relative;color: #fff;font-weight: bold;font-size: 1.125rem;}
footer #address span a {color:#fff;text-decoration: underline;}
footer #address span:before {content: '';background-image: url(../images/line.gif);background-repeat: no-repeat;background-position: bottom left;padding: .5em 0 0 1em;}
footer #footernavigation {}
footer #footernavigation ul {padding: 0;}
footer #footernavigation ul li {display: inline;list-style: none;padding: 0.3em 1em;}
footer #footernavigation ul li a {color: #fff;font-weight: bold;font-size: 1.125rem;text-decoration: underline;}

#content {width: 70%;margin-left: 8em;margin-top:1em;}
.umbruch {clear:both;float:none;height:0;overflow:hidden}

#content .team-container {display: flex;flex-wrap: wrap;gap: 2em;margin: 1em 0;}
#content .bild {padding: 1em 0;}
#content .bild .caption {color: #444;}
#content .teambild {width:122px;margin:0 20px 10px 0;background-color:var(--rot);display: flex;flex-direction: column;justify-content: space-between;}
#content .teambild img {width: 122px;height: 170px;}
#content .teambild .fotoname {line-height:1.3em;padding:.3em 0;height:auto;color:#fff;font-weight:700;margin-left:.5em;hyphens: none;}
#content .teambild .fotoname h2 {color:#fff;padding:.3em 0;font-size: 1.125rem;margin: 0;}
#map_canvas {max-width:100%}

h1 {font-size:1.6rem;line-height:1.2em;font-weight:700;margin:0 0 1em;padding:0;color:var(--rot);text-align:left}
h2 {font-size:1.4rem;line-height:1.2em;font-weight:400;margin:0 0 .5em;padding:0;color:#BF0949;text-align:left}
h3 {font-size:1.25rem;line-height:1.2em;font-weight:700;margin:0 0 .3em;padding:0;color:var(--dunkelgruen);text-align:left}
h4, h5, h6 {font-size:1.125rem;line-height:1.2em;font-weight:700;margin:0 0 .3em;padding:0;color:#333;text-align:left}
p, ul, ol {margin:0;padding:0 0 .5em;font-size: 1.125rem;}

#content ul{padding-left:0;margin:0 0 1em;list-style-type:none}
#content ul li{background-image:url(../images/line.gif);background-repeat:no-repeat;background-position:bottom left;padding:.5em 0 0 18px;line-height:1.2em}
#content ul li ul{padding-left:1.5em}
#content ul li ul li{font-weight:400}
#content dl{margin:0 0 .5em}
/*br {margin: 0 0 1.5em 0;}*/
.link{color:var(--gruen);margin:0;padding:0}
#content .beschreibung{margin-left:30px}
#content .hervorhebung-1{color:var(--rot)}
#content .hervorhebung-2{color:var(--dunkelgruen);}

#map_canvas > div {padding:1.5em 1em;text-align: center;}
#map_canvas button {display: inline-block;border: none;background: var(--rot);color: #fff; padding: 0.3em 1em; font-weight: bold; font-size: 1.4em; cursor: pointer;}

@media only screen and (max-width: 1200px) {
    footer {position: relative;height: auto;row-gap: 1em;justify-content: center;padding: 0.5em 0;}
    footer #address {justify-content: center;padding: 1em;width: 96%;}
    footer #address span {text-align: center;}
}
@media only screen and (max-width: 1100px) {
    #contentbox {max-width:100%;}
    #contentbox #navigation {margin-left: 1em;}
    #content {margin-left: 3em;}
}
@media only screen and (max-width: 950px) {
/*    #header,#header-image {min-width:auto;width:100%}
    #header-image {background-size:contain}*/
    #content {width:98%;padding-right: 2%;}
    /*#contentbox .left {width:30%;display:inline-block}*/
    /*#contentbox #navigation {width:100%}*/    
    #flashi {max-width:100%}
}
@media only screen and (max-width: 850px) {
    #contentbox {flex-wrap: wrap;padding-right: 0;}
    #contentbox #navigation {width:100%;margin: 0;border-top:1px solid var(--rot);border-bottom:1px solid var(--rot)}
    #contentbox #navigation ul {max-width:100%;width:100%}
    #contentbox #navigation ul li {background:none;float:left;text-indent:0;padding:0}
    #contentbox #navigation ul li a {padding:0 15px}
    #content{width: 96%;padding: 0 1em;margin:3em auto;}
    
}
@media only screen and (max-width: 760px) {
    #header-image img {object-fit: contain;height: auto;}
    #contentbox {margin-top: 0.5em;}
}