:root {
    --hex-container-width: 6rem;
    --hex-border-width: 0rem;
}

.dropmenu ul li a.active, .dropmenu ul li a:hover {
    color: red !important;
}

#info_mail {
    float: right;
}

#info_adr {
    display: flex;
    margin-left: auto;
    margin-right: auto;
}

div#info {
    transition: background-color 1s ease-out;
    display: flex;
    flex-wrap: nowrap;
    width: 100%;
    background-color: rgb(172, 172, 172);
}

div#info.scrolled {
    background-color: rgb(228, 228, 228);
}

.dropmenu.animated {
    margin-left: auto;
    margin-right: auto;
/*     padding-top: 100px; */
}

.dropmenu ul li a {
    display: block;
    padding: 10px 30px 0px 20px;
    padding-right: 30px;
    text-decoration: none;
}

.navi-sc {
    display: none;
    margin: auto;
}

.navi-sc ul li a {
    display: block;
    padding: 10px 30px 0px 20px;
    padding-right: 30px;
    text-decoration: none;
}

.section.modular-text.bg-gray {
    padding-top: 100px;
}

#header {
    height: 7.8rem;
    background: rgb(41, 41, 41);
    border: none;
}

#header a {
    color: white;
}

#header .navi-sc a {
    color:  rgb(41, 41, 41);
}

section.section {
    padding-right: 0px;
    padding-left: 0px;
}

h1 {
    margin: 0;
}

section#hero h1, section#hero h2, section#hero h3, 
section#hero h4, section#hero h5, section#hero h6,
.hero h1, section#hero p, i#to-start {
    color:white;
    text-shadow: 1px 1px black;
}

#info_n {
    margin-left: 5px;
} 
#info_mail {
    margin-right: 5px;
}

#info_n:hover, #info_mail:hover {
    cursor: pointer;
    text-decoration: underline;
}

#header.section.scrolled {
    height: 5.5rem;
}

@media (max-width:820px) {
    .navi-sc {
        display: none !important;
    }
}

.navi-sc {
    display: flex;
}

/* header */
@media (max-width:899px) {

    section.section.modular-text.bg-white {
        padding-top: 0px;
    }
 
    section#hero {
        background-position: 50% 98px;
        height: 392px !important;
    }

    #info {
        justify-content: space-between;
        background: rgb(219, 219, 219) !important;
    }
    #info_adr {
        display: none;
    }
    
    div#info.scrolled {
        background: rgb(247, 247, 247) !important;
        border-bottom: 1px solid rgb(199, 199, 199);
    }

    #header.section.scrolled {
        height: 2.8vh;
    }    

    #header.section {
        height: 4.25rem;
    }
}

/* kontakt */
@media (max-width:704px) {
    #kontakt_impr {
        margin-top: 1rem;
        flex-direction: row !important;
        width: 100%;
        justify-content: space-between;
    }

}
@media (max-width:590px) {
    #kontakt_impr {
        justify-content: space-around;
        margin-top: 2rem;
    }
    #contact {
        text-align: left;
    }
    #r_footer {
        margin-left: 0px !important;
    }
}
@media (max-width:546px) {
    #contact {
        margin-top: 1rem;
    }
}

section.oddEvenBg:nth-of-type(odd) {
    background-color: rgb(228, 228, 228) !important
}

section.oddEvenBg:nth-of-type(even) {
    background-color: rgb(41,41,41) !important

}

section.oddEvenBg:nth-of-type(even) h1, section.oddEvenBg:nth-of-type(even) h2, section.oddEvenBg:nth-of-type(even) h3,
section.oddEvenBg:nth-of-type(even) h4, section.oddEvenBg:nth-of-type(even) h5, section.oddEvenBg:nth-of-type(even) h6,
section.oddEvenBg:nth-of-type(even) p, section.oddEvenBg:nth-of-type(even) label, section.oddEvenBg:nth-of-type(even) span {
    color: rgb(228, 228, 228);
}

section.oddEvenBg:nth-of-type(odd) h1, section.oddEvenBg:nth-of-type(odd) h2, section.oddEvenBg:nth-of-type(odd) h3,
section.oddEvenBg:nth-of-type(odd) h4, section.oddEvenBg:nth-of-type(odd) h5, section.oddEvenBg:nth-of-type(odd) h6,
section.oddEvenBg:nth-of-type(odd) p, section.oddEvenBg:nth-of-type(odd) label, section.oddEvenBg:nth-of-type(odd) span {
    color: rgb(41,41,41);
}


 /* leistungen */
@media screen and (max-width: 750px) {
    #leistung_container {
        display: flex;
        flex-direction: column;
        justify-content: center;
        margin-top: 2rem;
    }
    #leistung_container > div {
        width: 100% !important;
        margin-bottom: 1rem;
        padding: .5rem !important;
    }
    #leistung_container > div:nth-of-type(even) {
        background-color: rgba(225,229,234, .25);
    }
    #leistung_container > div:nth-of-type(odd) {
        background-color: rgba(183, 183, 183, 0.5)
    }
    #leistung_container > div {
        border-radius: 1rem;
        padding: 0.5rem;
    }
    #leistung_container > div > div:not(.avatar) {
        margin-top: .5rem !important;
    }
    #leistung_container div label:first-child {
        font-size: 18px !important;
    }
    .avatar {
        height: 6rem;
        width: 6rem;
    }
}

.container.grid-lg {
    max-width: 1200px !important;
}

div.frame-box {
    max-width: 100% !important;
}

.leistungElem:hover {
    box-shadow: rgba(46, 46, 46, 0.25) 0px 25px 50px -12px;
    translate: 0 -.25em;
}

.leistungElem {
    transition: all ease-in-out .2s;
}

div.frame-box p img {
    margin-left: auto;
    margin-right: auto;
    display: flex;
    justify-content: center;
}

img {
    max-width: 100%;
}

.modular-text {
    padding-bottom: 3rem;
    padding-top: 3rem;
}

section.modular-text.bg-gray, .section.modular-text.bg-gray {
    padding-top: 0px;
}

.mask {
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
}

.mask-hexagon {
    -webkit-mask-image: url("data:image/svg+xml,%3csvg width=%27182%27 height=%27201%27 xmlns=%27http://www.w3.org/2000/svg%27%3e%3cpath d=%27M.3 41.486c0-9.196 6.687-20.063 14.211-25.078l61.86-35.946c8.36-5.016 20.899-5.016 29.258 0l61.86 35.946c8.36 5.015 14.211 15.882 14.211 25.078v71.055c0 9.196-6.687 20.063-14.211 25.079l-61.86 35.945c-8.36 4.18-20.899 4.18-29.258 0L14.51 161.62C6.151 157.44.3 145.737.3 136.54V41.486Z%27 fill=%27black%27 fill-rule=%27nonzero%27/%3e%3c/svg%3e");
    mask-image: url("data:image/svg+xml,%3csvg width=%27182%27 height=%27201%27 xmlns=%27http://www.w3.org/2000/svg%27%3e%3cpath d=%27M.3 41.486c0-9.196 6.687-20.063 14.211-25.078l61.86-35.946c8.36-5.016 20.899-5.016 29.258 0l61.86 35.946c8.36 5.015 14.211 15.882 14.211 25.078v71.055c0 9.196-6.687 20.063-14.211 25.079l-61.86 35.945c-8.36 4.18-20.899 4.18-29.258 0L14.51 161.62C6.151 157.44.3 145.737.3 136.54V41.486Z%27 fill=%27black%27 fill-rule=%27nonzero%27/%3e%3c/svg%3e");
}

.avatar {
    position: relative;
    display: inline-flex;
}

#leistung_container label p {
    margin: 0;
}

.navigation a svg {
    position: absolute;
    bottom: .75rem;
    right: -.25rem;
    top: -2px;
    transition: opacity .1s ease;
}

.navigation a.active svg {
    opacity: 1;
}

.navigation a:not(.active) svg {
    opacity: 0;
}
 
.hexagon {
    display: inline-block;
    position: relative;
    width: var(--hex-container-width);
    height: var(--hex-container-width);
    background: none;
    box-sizing: border-box;
    clip-path: polygon(92.32051% 40%, 93.79385% 43.1596%, 94.69616% 46.52704%, 95% 50%, 94.69616% 53.47296%, 93.79385% 56.8404%, 92.32051% 60%, 79.82051% 81.41064%, 77.82089% 84.50639%, 75.35575% 86.97152%, 72.5% 88.97114%, 69.3404% 90.44449%, 41.97296% 91.34679%, 62.5% 91.41064%, 37.5% 91.41064%, 34.02704% 91.34679%, 30.4196% 90.44449%, 27.5% 88.97114%, 24.64425% 86.97152%, 22.17911% 84.50639%, 20.17949% 81.41064%, 7.67949% 60%, 6.20615% 56.8404%, 5.30384% 53.47296%, 5% 50%, 5.30384% 46.52704%, 6.20615% 43.1596%, 7.67949% 40%, 20.17949% 18.34936%, 22.17911% 15.49361%, 24.64425% 13.02848%, 27.5% 11.02886%, 30.4196% 9.55551%, 34.02704% 8.41321%, 37.5% 8.34936%, 62.5% 8.34936%, 41.97296% 8.41321%, 69.3404% 9.55551%, 72.5% 11.02886%, 75.35575% 13.02848%, 77.82089% 15.49361%, 79.82051% 18.34936%);
}
  
.hexagon div {
    position: absolute;
    top: var(--hex-border-width); /* equal to border thickness */
    left: var(--hex-border-width); /* equal to border thickness */
    width: calc(var(--hex-container-width) - var(--hex-border-width) * 2); /* container height - (border thickness * 2) */
    height: calc(var(--hex-container-width) - var(--hex-border-width) * 2); /* container height - (border thickness * 2) */
    clip-path: polygon(92.32051% 40%, 93.79385% 43.1596%, 94.69616% 46.52704%, 95% 50%, 94.69616% 53.47296%, 93.79385% 56.8404%, 92.32051% 60%, 79.82051% 81.41064%, 77.82089% 84.50639%, 75.35575% 86.97152%, 72.5% 88.97114%, 69.3404% 90.44449%, 41.97296% 91.34679%, 62.5% 91.41064%, 37.5% 91.41064%, 34.02704% 91.34679%, 30.4196% 90.44449%, 27.5% 88.97114%, 24.64425% 86.97152%, 22.17911% 84.50639%, 20.17949% 81.41064%, 7.67949% 60%, 6.20615% 56.8404%, 5.30384% 53.47296%, 5% 50%, 5.30384% 46.52704%, 6.20615% 43.1596%, 7.67949% 40%, 20.17949% 18.34936%, 22.17911% 15.49361%, 24.64425% 13.02848%, 27.5% 11.02886%, 30.4196% 9.55551%, 34.02704% 8.41321%, 37.5% 8.34936%, 62.5% 8.34936%, 41.97296% 8.41321%, 69.3404% 9.55551%, 72.5% 11.02886%, 75.35575% 13.02848%, 77.82089% 15.49361%, 79.82051% 18.34936%);
    background-position: center;
    background-size: cover;
}

/* wont work */
#label_datens:visited, #label_impressum:visited {
    color: white;
}

.section.modular-text.bg-gray {
    background: rgb(41,41,41) !important;
}


.header-fixed .hero {
    background-position: 50% 125px;
    background-repeat: no-repeat;
}

section .modular-features {
    background: rgb(228, 228, 228) !important;
}

.mobile-menu #toggle .top, .mobile-menu #toggle .middle, .mobile-menu #toggle .bottom {
    filter: drop-shadow(0 0 1px rgba(0,0,0, .33));
}

.dropmenu.animated {
    margin-top: 12px;
}

@media screen and (max-width: 1080px) { /* bis 1000 */
    #header.section.scrolled {
        height: 3rem;
    }
    .dropmenu.animated {
        margin-top: 0;
    }
}

li {
    list-style: none;
}

::marker {
    display: none;
    opacity: 0;
}