@charset "UTF-8";


html {
    font-size: 10px
}

body {
    color: #7c7c7b;
    font-family: FFNettoStdRegular
}

h1 {
    color: #e4003a;
    font-family: FFNettoStdRegular;
    font-size: 2.7rem;
    font-weight: 800;
    hyphens: auto
}

a {
    text-decoration: none
}

a:hover {
    text-decoration: none
}

label {
    font-size: 1.25rem;
    margin-bottom: 0;
    margin-top: .66rem
}

strong {
    font-family: FFNettoStdBold;
    font-weight: 800
}

video {
    border: 1px solid #ccc
}

[type=text],
[type=email],
[type=tel],
.textarea {
    font-size: 1.66rem;
    margin-bottom: .5rem;
    margin-top: .5rem;
    width: 100%
}

.bgHelleKontrastfarbe {
    background: #ececec;
    color: #e4003a
}

.bgKontrastfarbe {
    background: #e4003a;
    color: #fff
}

.container {
    max-width: 1536px
}

.viewport {
    overflow: hidden;
    width: 100%
}

header {
    background: #fff;
    position: fixed;
    width: 100%;
    z-index: 1000
}

header .naviHeader .container,
footer .container {
    max-width: 1452px
}

#header .mod_navigation,
#mainNavi {
    display: none
}


.logo {
    height: auto;
    margin: 15px 0 20px 25px;
    max-width: 120px;
}

#toggleBox {
    position: relative;
    z-index: 1010;
    text-align: right;
}

#toggleBox img {
    display: inline;
    position: relative;
    right: 0;
    top: 30px;
    height: auto;
    width: 34px;
    margin: 0 10% 0 0;
}

#mainNavi.responsive {
    background: #fff;
    color: #7c7c7b;
    display: block;
    margin-top: 85px;
    width: 100%;
    opacity: 1;
    overflow: inherit;
    padding: 0;
    position: fixed;
    text-align: center;
    z-index: 1000;
    top: -10px;
}

#mainNavi.responsive .active,
#mainNavi.responsive .trail {
    color: #e4003a;
    font-weight: 400
}

#mainNavi.responsive a,
#mainNavi.responsive strong {
    color: #7c7c7b;
    display: block;
    font-size: 1.125rem;
    line-height: 2.25rem;
    text-decoration: none;
    text-transform: uppercase
}

#mainNavi.responsive li.sibling,
#mainNavi.responsive li.active,
#mainNavi.responsive li {
    padding-left: 2rem
}

#mainNavi.responsive ul {
    background: #fff;
    display: block;
    list-style-type: none;
    margin: 1rem 0 0;
    padding-left: 0
}

#mainNavi.responsive a,
#mainNavi.responsive strong {
    font-size: 1.525rem;
    line-height: 3rem;
    padding-left: 1rem
}

#header .mod_navigation .level_1 .nachhaltigkeit.active strong,
#header .mod_navigation .level_1 .nachhaltigkeit :hover {
    color: #2E5941
}

.slider-wrapper,
.wolf-header,
.wolf-header-pic img {
    margin-top: 100px;
    height: 220px;
}

.headerBox {
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    height: 220px;
    position: relative
}

.wolf-header .headerBox .header-action-button {
    display: block;
    margin: 18px 0;
}

.wolf-header .headerBox .header-action-button a {
    background: #e4003a;
    border-bottom-right-radius: 22px;
    color: #fff;
    display: inline-block;
    padding: 15px 30px;
    font-size: 1.4rem;
}

.wolf-header .headerBox .header-action-button a:hover {
    background: #D9D9D9;
    color: #e4003a
}

.wolf-header .headerText h1 a {
    color: #000;
    text-decoration: none;
}

.wolf-header .headerText h1 a span {
    background: none;
    color: #e4003a
}

.wolf-header .headerText p {
    font-family: FFNettoStdBold;
    font-size: 1.5rem;
    line-height: 1.8rem
}

.wolf-header-pic img,
.stimmungsbilder .ce_image,
.container-fluid.full-width,
.galerie .ce_image {
    padding: 0
}

.wolf-header .headerBox .emblem img {
    width: 180px;
}

.wolf-header .headerBox .emblem {
    left: -52px;
    position: relative;
    top: 50px
}

.content-slider,
.wolf-header .headerText {
    position: relative;
    top: -188px;
    left: 140px;
    width: 61%;
}

.nachhaltigkeit .wolf-header .headerText {
    top: 70px;
}

.content-slider img,
.wolf-header img {
    margin-bottom: 2rem;
    max-width: 320px;
    padding-top: 6px
}

.content-slider p,
.wolf-header p {
    font-size: 1.706rem;
    line-height: 2.118rem;
    display: none;
}

.noHeader {
    margin-top: 100px
}

.faq-modul {
    margin: 3% 0
}

.faq-modul .accordion {
    background: #D9D9D980;
    overflow: hidden;
    padding: 10px 20px
}

.faq-modul .tab {
    border-bottom: 1px solid #000;
    position: relative
}

.faq-modul .tab input {
    opacity: 0;
    position: absolute;
    z-index: -1
}

.faq-modul .tab input:checked + .tab__label::after {
    transform: rotate(270deg)
}

.faq-modul .tab input:checked ~ .tab__content {
    max-height: 25rem;
    padding-bottom: 20px
}

.faq-modul .tab.last {
    border-bottom: 0
}

.faq-modul .tab__close {
    font-size: .75rem;
    justify-content: flex-end;
    padding: .5rem 1rem
}

.faq-modul .tab__content {
    max-height: 0;
    overflow: hidden;
    transition: all .35s
}

.faq-modul .tab__content p {
    color: #000;
    font-size: 1.3rem;
    margin: 0;
    padding: 1rem
}

.faq-modul .tab__content ul {
    color: #000;
    font-size: 1.3rem;
    margin: 0 0 0 40px
}

.faq-modul .tab__content ul li {
    list-style: disc
}

.faq-modul .tab__label {
    justify-content: space-between;
    padding: 1rem
}

.faq-modul .tab__label,
.faq-modul .tab__close {
    color: #000;
    cursor: pointer;
    display: flex;
    font-size: 1.3rem;
    font-weight: 700
}

.faq-modul .tab__label::after {
    content: "\276F";
    height: 1em;
    text-align: center;
    transform: rotate(90deg);
    transition: all .35s;
    width: 1em
}

.fc-inverted,
.fc-inverted:hover,
.kontaktdaten a {
    color: #fff
}

.fc-kontrast,
.fc-kontrast:hover,
.wolf-header h1 a,
.content-slider h1 a,
.backlink a {
    color: #e4003a
}

.fs-17 {
    font-size: 1rem;
    line-height: 1rem
}

.fs-25,
.mod_article .fs-25 p {
    font-size: 1.47rem
}

.hochgestellt {
    font-size: 60%;
    vertical-align: .75rem
}

.kontrast-inverted {
    background: #e4003e;
    color: #fff;
    padding: 7px
}

.mod_article .kontaktdaten p {
    font-size: 2rem
}

.mod_article h2 {
    color: #000;
    font-family: FFNettoStdBold;
    font-size: 2.5rem;
    font-weight: 700;
    text-box-trim: none;
    letter-spacing: -1%;
    line-height: 42px;
    margin-bottom: 3%
}

.mod_article p,
.fs-40 {
    font-size: 1.6rem
}

.ce_text a,
.highlight {
    color: #e4003a
}

.mod_article.claimbox p {
    font-size: 2.75rem;
    line-height: 3.529rem
}

.nachhaltigkeit .fc-kontrast,
.nachhaltigkeit .fc-kontrast:hover,
.nachhaltigkeit .einleitung strong,
.nachhaltigkeit .ce_text span {
    color: #93c124;
    text-decoration-color: #93c124
}

.nachhaltigkeit .leistungen-symbole div.block h3,
.nachhaltigkeit .tm_group .tm_teaser .tm_teaser_content h3,
.nachhaltigkeit .highlight {
    color: #2E5941 !important
}

.nachhaltigkeit .tm_group .tm_teaser .tm_teaser_content a,
.nachhaltigkeit .wolf-header .header-action-button a {
    background: #2E5941
}

.nachhaltigkeit .tm_group .tm_teaser .tm_teaser_content a:hover {
    background: #e4003e
}

.new-content-article.headline {
    margin: 6% 0 2%
}

.new-content-article.mod_article {
    margin: 6% 0;
}

.scroll {
    margin-top: 1.176rem;
    opacity: .3
}

.storyline {
    background: #D9D9D980;
    border-bottom-right-radius: 30px
}

.storyline .slide-item-inner-comment-end {
    bottom: 120px
}

.storyline .storyline-content {
    padding: 60px;
    position: relative
}

.storyline h3 {
    color: #E10B3A;
    margin: 6% 0 2%;
    text-align: center
}

.tab input:not(:checked) + .tab__label:hover::after {
    animation: bounce .5s infinite
}

.teaser-headline {
    color: #000;
    font-family: FFNettoStdBold;
    font-weight: 700;
    margin-top: 3%;
    font-size: 2.5rem;
}

.tm_group {
    display: flex;
    flex-direction: column;
    margin: 3% 0
}

.tm_group .tm_teaser {
    background: #D9D9D980;
    border-bottom-right-radius: 30px;
    display: block;
    margin: 0 0 10% 0;
    min-height: 400px;
    width: 100%
}

.tm_group .tm_teaser .tm_teaser_content {
    height: 300px;
    padding: 20px;
    position: relative
}

.tm_group .tm_teaser .tm_teaser_content a {
    background: #e4003a;
    border-bottom-right-radius: 22px;
    bottom: 10px;
    color: #fff;
    display: inline-block;
    font-family: FFNettoStdBold;
    margin: 20px 0;
    padding: 10px 50px;
    position: absolute;
    text-decoration: none;
    font-size: 1.5rem;
}

.tm_group .tm_teaser .tm_teaser_content a:hover {
    background: #000
}

.tm_group .tm_teaser .tm_teaser_content h3 {
    color: #e4003a;
    font-family: FFNettoStdBold;
    font-size: 2rem;
    font-weight: 700;
    height: 50px
}

.tm_group .tm_teaser .tm_teaser_content p {
    color: #000;
    font-family: FFNettoStdLight;
    font-size: 1.6rem
}

.two-column {
    display: flex;
    flex-direction: column;
}

.two-column .block {
    flex: 50%
}

.two-column .ce_text.first.block {
    padding-right: 10%
}

@keyframes bounce {
    25% {
        transform: rotate(90deg) translate(.25rem)
    }

    75% {
        transform: rotate(90deg) translate(-.25rem)
    }
}

.arrow {
    background: none;
    border: 0;
    cursor: pointer;
    display: grid;
    height: 50px;
    place-items: center;
    position: absolute;
    top: 60%;
    transform: translateY(-50%);
    width: 50px;
    z-index: 5
}

.arrow svg {
    fill: none;
    height: 50px;
    stroke: #fff;
    stroke-width: 2.5;
    width: 50px
}

.arrow.left {
    left: 1%
}

.arrow.right {
    right: 2%
}

.arrow:focus,
.arrow:focus-visible {
    border: none;
    outline: none
}

.arrow[disabled] {
    cursor: default;
    opacity: .35
}

.kundenstimmen {
    height: 850px
}

.kundenstimmen-inner {
    background-color: #1A1A1A;
    height: 850px;
    padding: 20px;
    position: relative;
}

.kundenstimmen-inner .carousel {
    margin: 0 auto 32px;
    max-width: 80%;
    overflow: hidden;
    position: relative;
    touch-action: pan-y;
    user-select: none
}

.kundenstimmen-inner h3 {
    color: #FFF;
    text-align: center;
    font-size: 2.5rem;
    width: 70%;
    margin: 0 auto;
}

.slide {
    aspect-ratio: 16 / 9;
    display: grid;
    flex: 0 0 100%;
    place-items: center;
}

.slide-item .slide-item-content {
    font-size: 1rem
}

.slide-item .slide-item-inner {
    background: #FFFC;
    border-bottom-right-radius: 30px;
    padding: 60px 40px 40px;
    position: relative
}

.slide-item h4 {
    color: #E10B3A;
    margin-top: 40px;
    text-align: center
}

.slide-item p {
    font-size: 1.4rem;
}

.slide-item img {
    height: 180px;
    margin-top: 10px;
}

.slide-item-image {
    background: #FFF;
    border-radius: 100px;
    height: 200px;
    left: 50%;
    margin-left: -100px;
    position: relative;
    text-align: center;
    top: 40px;
    width: 200px
}

.slide-item-inner-comment-end {
    bottom: 70px;
    right: 30px
}

.slide-item-inner-comment-start {
    left: 40px;
    top: 20px
}

.slide-item-inner-comment-start,
.slide-item-inner-comment-end {
    color: #E10B3A;
    font-size: 2rem;
    position: absolute
}

.track {
    display: flex;
    transition: transform 260ms ease;
    will-change: transform
}

@media (prefers-reduced-motion: reduce) {
    .track {
        transition: none
    }
}


.galerie {
    margin-bottom: 3%
}

.galerie .col-lg-3,
.galerie .col-lg-6,
.galerie .col-md-6,
.galerie .col-xl-3 {
    padding-left: 0;
    padding-right: 0;
    position: relative;
}

.galerie .kontaktdaten li {
    font-size: 1.7rem
}

.galerie .kontaktdaten li.telefon {
    margin-left: 48px;
    margin-top: 15px
}

.galerie .kontaktdaten li.titel {
    margin-left: 48px;
    margin-top: -20px
}

.galerie .kontaktdaten ul li.person::before {
    content: url(../../media/symbole/wolf-at.png);
    margin-right: 10px;
    vertical-align: -20px
}

.icon figure,
.slider-wrapper figure,
.wolf-header figure,
.galerie .ce_image figure {
    margin: 0
}

.icon img {
    display: block;
    margin: 0 auto
}

.iconbox {
    text-align: center
}

.info a,
.info a:link,
.info a:hover {
    color: #fff;
    text-decoration: none
}

.kontaktdaten {
    background: #D9D9D9;
    display: flex
}

.kontaktdaten .image_container {
    padding-top: .5rem
}

.kontaktdaten p {
    margin-bottom: 0
}

.leistungen-symbole {
    background: #D9D9D980;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: center;
    margin: 5% 0;
    padding: 3% 15%;
    position: relative;
    text-align: center
}

.leistungen-symbole div.block {
    margin: 2%;
    min-height: 250px;
    position: relative;
    text-align: center;
    width: 100%;
    z-index: 10
}

.leistungen-symbole div.block h3 {
    color: #e4003a;
    font-size: 1.6rem;
    font-weight: 600
}

.leistungen-symbole div.block p {
    font-size: 1.6rem
}

.leistungen-symbole.with-headline {
    margin: 0 -15px 5%
}

.leistungen-symbole:before {
    background-image: url(/files/wolf-kopiersysteme-2026/img/emblem.png);
    background-position: right 0 top 10px;
    background-repeat: no-repeat;
    background-size: contain;
    bottom: 0;
    content: "";
    left: 0;
    opacity: .5;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 1
}

.unsere-partner {
    margin: 35% 0;
    overflow: visible;
    position: relative
}

.unsere-partner div.block {
    background: #D9D9D980;
    padding: 25% 10% 10%;
}

.unsere-partner div.block img {
    margin: 3% 0;
}

.unsere-partner div.block p {
    font-size: 1.6rem
}

.unsere-partner div.top-claimer {
    background: #e4003a;
    border-bottom-right-radius: 100px;
    display: flex;
    height: 126px;
    left: 0;
    padding: 7% 10% 1% 19%;
    position: absolute;
    text-align: left;
    top: -50px;
    width: 70%
}

.unsere-partner div.top-claimer p {
    color: #fff;
    font-size: 2rem;
    font-weight: 700
}

.mailBildlink img {
    margin-right: 190px
}

.mod_article p.info {
    font-size: 1rem;
    margin: 0 auto;
    width: 6rem
}

.multiselect {
    font-size: 1.66rem;
    margin-bottom: .5rem;
    margin-top: 0;
    width: 100%
}

.name {
    color: #e4003a;
    font-family: FFNettoStdBold;
    font-size: 2.353rem
}

.partnerLogo {
    height: 7rem;
    width: auto
}

.partnerLogo.first {
    border-left: 0
}

.partnerLogo.last {
    margin-top: 5rem
}

.slider-control .slider-menu {
    display: none
}

.slider-control .slider-menu b.active {
    color: #e4003a;
    opacity: .68
}

.slider-control a {
    color: #e4003a;
    font-size: 4rem;
    font-weight: 700;
    margin-top: -500px;
    text-decoration: none;
}

.submit {
    width: 60px
}

.telefonNr:hover {
    background: #D9D9D9;
    color: #e4003a
}

.telefonNr:link,
.telefonNr:active {
    background: #e4003a;
    border-bottom-right-radius: 22px;
    color: #fff;
    display: inline-block;
    font-family: FFNettoStdBold;
    margin-top: 50px;
    padding: 10px 50px;
    text-decoration: none;
    font-size: 1.2rem;
}

.widget-explanation {
    float: left;
    max-width: 50%
}

.widget-explanation p {
    font-size: 1.66rem
}

.widget-submit {
    float: right;
    max-width: 50%
}


footer {
    background: #1d1d1b;
    overflow: hidden
}

#footers .row {
    flex-direction: column;
}

#footers .footer-emblem {
    bottom: -30px;
    height: auto;
    left: -107px;
    opacity: 30%;
    position: absolute;
    width: 200px;
}

#footers .footer-kontakt {
    position: relative;
    padding: 40px 60px 0;
}

#footers .footer-kontakt a {
    color: #fff
}

#footers .footer-kontakt a:hover {
    color: #e4003a;
    text-decoration: underline
}

#footers .footer-kontakt h3 {
    color: #e4003a;
    font-family: FFNettoStdBold;
    font-size: 2em;
    font-weight: 700
}

#footers .footer-kontakt p {
    color: #fff;
    margin: 25px 0;
    font-size: 1.6rem;
}


#footers .mod_customnav {
    padding: 25px 0 20px 60px;
}

#footers .mod_customnav ul {
    display: block;
    list-style-type: none;
    margin: 0;
    padding: 0
}

#footers .mod_customnav li {
    line-height: 3em;
    width: auto;
    clear: both;
    margin-right: 0;
}

#footers .mod_customnav li.last {
    margin-right: 0
}

#footers .mod_customnav .active,
#footers .mod_customnav .trail {
    color: #e4003a;
    font-weight: 700
}

#footers .mod_customnav a,
#footers .mod_customnav strong {
    color: #fff;
    font-family: FFNettoStdBold;
    font-size: 1.6rem;
    line-height: 3.5rem;
    display: block;
    font-weight: 400;
    text-decoration: none;
}

#footers .mod_customnav a:hover,
#footers .mod_customnav a:focus {
    color: #e4003a;
    text-decoration: none
}

#footers .footer-terminanfrage {
    display: flex;
    padding: 10% 0 10% 60px;
}

#footers .footer-terminanfrage-box {
    display: block;
    margin: auto 0;
    width: 80%;

}

#footers .footer-terminanfrage-box a {
    background: #e4003a;
    border-bottom-right-radius: 22px;
    color: #fff;
    display: inline-block;
    padding: 15px 20px;
    z-index: 999;
    position: relative;
    font-size: 1.4rem;
}

#footers .footer-terminanfrage-box a:after {
    content: ' \2192'
}

#footers .footer-terminanfrage-box a:hover {
    background: #D9D9D9;
    color: #e4003a
}


@media (min-width: 576px) {
    #mainNavi.responsive {
        margin-top: 126px
    }

    .einleitung.schmal {
        margin: 0 auto;
        max-width: 1240px
    }

    .galerie .kontaktdaten li {
        font-size: 1.7rem
    }

    .galerie .kontaktdaten li.telefon {
        margin-left: 48px;
        margin-top: 15px
    }

    .galerie .kontaktdaten li.titel {
        margin-left: 48px;
        margin-top: -15px
    }

    .galerie .kontaktdaten ul li.person::before {
        content: url(../../media/symbole/wolf-at.png);
        margin-right: 10px;
        vertical-align: -10px
    }

    .haupttext {
        max-width: 1416px
    }

    .haupttext .einleitung p {
        font-family: FFNettoStdLight;
        margin: 0 auto;
        max-width: 1416px
    }

    .haupttext p {
        font-family: FFNettoStdLight;
        margin: 0 auto;
        max-width: 1270px
    }

    .headerText {
        color: #000;
        float: right;
        margin: 150px 15% 0 0
    }

    .highlight img {
        filter: brightness(0) saturate(100%) invert(9%) sepia(90%) saturate(7151%) hue-rotate(340deg) brightness(95%) contrast(102%)
    }

    .mod_article .adresseKontakt p {
        font-size: 1.7059rem
    }

    .mod_article .kontaktdaten p {
        font-size: 1.5rem
    }

    .mod_article p {
        font-size: 1.75rem
    }

    .mod_article.claimbox p {
        font-size: 2.941em;
        line-height: 3.529rem
    }

    .mod_article.kontaktbox p {
        font-size: 2.941em
    }

    .noHeader {
        margin-top: 175px
    }

    .pin {
        text-align: right
    }

    .underline {
        text-decoration: underline
    }

    .wolf-header {
        margin: 0 -15px
    }

    html {
        font-size: 14px
    }
}

@media (min-width: 768px) {
    #header {
        padding-top: 1rem
    }

    #mainNavi.responsive {
        margin-top: 100px;
        padding-left: 0;
        position: fixed;
    }

    .wolf-header {
        margin: 0;
    }

    .slider-wrapper, .wolf-header, .wolf-header-pic img {
        height: 400px;
    }

    .headerBox {
        height: 400px;
    }

    .headerText {
        margin: 0 15% 0 0;
    }

    .wolf-header .headerBox .emblem {
        top: 70px;
    }

    .wolf-header .headerBox .emblem img {
        max-width: 340px;
        width: 340px;
    }

    .content-slider, .wolf-header .headerText {
        top: -222px;
        left: 125px;
    }

    .nachhaltigkeit .wolf-header .headerText {
        top: 180px;
    }

    .new-content-article.mod_article {
        width: 80%;
        margin: 6% 10%;
    }

    .mod_article p {
        font-size: 1.25rem
    }

    .leistungen-symbole {
        flex-direction: row;
    }

    .leistungen-symbole div.block {
        width: 46%;
    }

    .unsere-partner div.top-claimer {
        width: 45%;
        height: 180px;
    }

    .kundenstimmen-inner h3 {
        font-size: 3rem;
        width: 50%;
        margin: 5% auto 0;
    }

    .teaser-headline {
        text-align: center;
        margin: 3% 0 8%;
    }

    .tm_group {
        align-items: center;
        justify-content: center;
    }

    .tm_group .tm_teaser {
        width: 52%;
    }

    .tm_group .tm_teaser .tm_teaser_content {
        height: 420px;
    }

    .tm_group .tm_teaser .tm_teaser_content h3 {
        height: 70px;
    }

    footer {
        display: inline-block
    }

    #footers .row {
        flex-direction: row;
    }

    #footers .footer-emblem {
        bottom: auto;
        top: 40px;
        width: 400px;
    }

    #footers .mod_customnav {
        padding: 100px 0 20px 60px;
    }
}

@media (min-width: 992px) {
    #header {
        box-shadow: 0 4px 7px 0 #00000040;
    }

    #header .mod_navigation {
        overflow: visible;
        padding: 40px 100px 0 0;
        display: block;
    }

    #header .mod_navigation .active,
    #header .mod_navigation .trail {
        color: #e4003a;
        font-family: FFNettoStdBold;
        font-weight: 800
    }

    #header .mod_navigation a,
    #header .mod_navigation strong {
        color: #e4003a;
        display: block;
        font-family: FFNettoStdRegular;
        text-decoration: none;
        font-size: 1.3rem;
    }

    #header .mod_navigation a:hover,
    #header .mod_navigation a:focus {
        color: #e4003a;
        text-decoration: none
    }

    #header .mod_navigation li {
        display: block;
        float: left;
        margin-right: 2.8235rem;
        position: relative;
        width: auto
    }

    #header .mod_navigation li.last {
        margin-right: 0
    }

    #header .mod_navigation ul {
        display: block;
        float: right;
        list-style-type: none;
        margin: 0;
        padding: 0
    }

    #header .mod_navigation ul li li:hover ul {
        display: block;
        margin-left: 200px;
        margin-top: -35px
    }

    #header .mod_navigation ul li:hover ul {
        display: block
    }

    #header .mod_navigation ul ul {
        background: #FFF;
        box-shadow: 0 4px 4px 0 #00000040;
        display: none;
        left: -20px;
        padding: 10px 20px;
        position: absolute
    }

    #header .mod_navigation ul ul li {
        margin-top: 30px
    }

    #header .mod_navigation ul.level_1 > li.submenu:hover > a:after {
        content: ' \25B2'
    }

    #header .mod_navigation ul.level_1 > li.submenu > a:after {
        content: ' \25BC'
    }

    #mainNavi,
    #header .mod_navigation ul li:hover ul ul {
        display: none
    }

    .headerBox {
        height: 400px;
    }

    .telefonNr:link, .telefonNr:active {
        margin-top: 30px;
    }

    .slider-wrapper,
    .wolf-header,
    .wolf-header-pic img {
        height: 400px;
    }

    .wolf-header .headerBox .emblem {
        position: absolute;
        top: 107px;
    }

    .wolf-header .headerBox .emblem img {
        width: 300px;
    }

    .content-slider, .wolf-header .headerText {
        position: relative;
        top: 29px;
        left: 149px;
        width: 53%;
    }

    .nachhaltigkeit .wolf-header .headerText {
        top: 90px;
    }

    .content-slider h1,
    .wolf-header h1 {
        margin-top: 90px;
        font-size: 3.2rem;
    }

    .content-slider p,
    .wolf-header p {
        font-size: 1.706rem;
        line-height: 2.118rem
    }

    .content-slider .name,
    .wolf-header .name,
    .content-slider .fs-40,
    .wolf-header .fs-40 {
        font-size: 2rem !important
    }

    .headerText {
        margin: 100px 30% 0 0;
    }

    .content-slider h1,
    .wolf-header h1 {
        font-size: 4rem;
        margin-top: 45px !important
    }

    .content-slider img,
    .wolf-header img {
        max-width: 730px
    }

    .wolf-header .headerBox .header-action-button {
        top: 24px;
    }

    .galerie .kontaktdaten li {
        font-size: 1.7rem
    }

    .galerie .kontaktdaten li.telefon {
        margin-left: 48px;
        margin-top: 15px
    }

    .galerie .kontaktdaten li.titel {
        margin-left: 48px;
        margin-top: -15px
    }

    .galerie .kontaktdaten ul li.person::before {
        content: url(../../media/symbole/wolf-at.png);
        margin-right: 10px;
        vertical-align: -10px
    }

    .galerie .mailBildlink {
        text-align: left !important
    }

    .galerie div.team:hover + div,
    div.kontaktdaten:hover {
        display: flex;
        height: 100%;
        position: absolute;
        top: 0;
        width: 100%
    }

    .mailBildlink img {
        margin-left: 46px
    }

    .new-content-article.mod_article {
        width: 65%
    }

    .mod_article p.info {
        font-size: 1rem;
        margin: 0 auto;
        width: 6rem
    }

    .noHeader {
        margin-top: 200px
    }

    .tm_group {
        flex-direction: row;
    }


    .kundenstimmen-inner {
        border-bottom-left-radius: 300px;
        padding: 50px;
        position: absolute;
        right: 0;
        width: 980px
    }

    .kundenstimmen-inner .carousel {
        margin: 0 auto 32px;
        max-width: 700px;
    }

    .slide {
        aspect-ratio: 16 / 9;
        display: grid;
        flex: 0 0 100%;
        place-items: center;
        width: 400px
    }

    .slide-item .slide-item-content {
        font-size: 1rem
    }

    .slide-item .slide-item-inner {
        padding: 60px 60px 40px;
    }

    .slide-item h4 {
        margin-top: 40px;
    }

    .slide-item img {
        height: 180px;
        margin-top: 10px;
        width: 180px
    }

    .slide-item-image {
        border-radius: 100px;
        height: 200px;
        left: 50%;
        margin-left: -100px;
        top: 40px;
        width: 200px
    }

    .slide-item-inner-comment-end {
        bottom: 70px;
        right: 30px
    }

    .slide-item-inner-comment-start {
        left: 40px;
        top: 20px
    }

    .slide-item-inner-comment-start,
    .slide-item-inner-comment-end {
        font-size: 2rem;
        position: absolute
    }

    .arrow.left {
        left: 7%
    }

    .arrow.right {
        right: 8%
    }

    .partnerLogo {
        border-right: 1px solid #e4003a;
        height: 100px;
        padding: 0 1rem;
        width: auto
    }

    .partnerLogo.first {
        border-left: 1px solid #e4003a
    }

    .produktbild {
        height: 6rem;
        width: auto
    }

    .top-claimer.slide-left {
        -moz-transform: translate3d(-100px, 0px, 0px);
        -moz-transition: all 500ms linear;
        -ms-transform: translate(-100px, 0px);
        -o-transform: translate(-100px, 0px);
        -o-transition: all 500ms linear;
        -webkit-transform: translate3d(-100px, 0px, 0px);
        -webkit-transition: all 500ms linear;
        opacity: 0;
        transform: translate3d(-100px, 0px, 0px);
        transition: all 500ms linear
    }

    .top-claimer.slide-left.in-view {
        -moz-transform: translate3d(0px, 0px, 0px);
        -ms-transform: translate(0px, 0px);
        -o-transform: translate(0px, 0px);
        -webkit-transform: translate3d(0px, 0px, 0px);
        opacity: 1;
        transform: translate3d(0px, 0px, 0px)
    }

    .leistungen-symbole {
        border-bottom-right-radius: 300px;
        flex-direction: row;
        margin: 5% -15px;
    }

    .leistungen-symbole div.block {
        width: 20%;
    }

    .leistungen-symbole div.block h3 {
        font-size: 1.3rem;
    }

    .leistungen-symbole div.block p {
        font-size: 1.2rem
    }

    .unsere-partner {
        margin: 5% -15px;
    }

    .unsere-partner div.top-claimer {
        width: 20%;
        height: 160px;
        padding: 2% 10% 1% 13%;
    }

    .unsere-partner div.block {
        padding: 3% 0 1% 25%;
    }

    .unsere-partner div.block img {
        height: 100px
    }

    .tm_group .tm_teaser {
        background: #D9D9D980;
        min-height: 400px;
        width: 30%;
        margin: 0 5% 10% 0;
    }

    .tm_group .tm_teaser .tm_teaser_content {
        height: 337px;
    }

    .tm_group .tm_teaser .tm_teaser_content a {
        margin: 50px 0 20px;
        padding: 10px 50px;
        position: absolute;
    }

    .tm_group .tm_teaser .tm_teaser_content h3 {
        height: 80px
    }

    .tm_group .tm_teaser .tm_teaser_content p {
        font-size: 1.3rem;
    }

    #footers .footer-emblem {
        bottom: -30px;
        left: -50px;
        position: relative;
        width: 280px
    }

    #footers .footer-kontakt {
        padding-top: 40px
    }

    #footers .mod_customnav ul {
        margin: 0 0 0 100px;
    }

    #footers .footer-kontakt p {
        font-size: 1.2rem;
    }

    #footers .mod_customnav a,
    #footers .mod_customnav strong {
        font-size: 1.2rem;
        line-height: 3rem;
    }

}

@media (min-width: 1200px) {

    .logo {
        max-width: 136px;
    }


    .telefonNr:link, .telefonNr:active {
        margin-top: 27px;
    }

    .content-slider img,
    .wolf-header img {
        max-width: 930px
    }

    .slider-wrapper, .wolf-header, .wolf-header-pic img {
        height: 650px;
    }

    .content-slider p, .wolf-header p {
        display: block;
    }

    .headerBox {
        height: 650px;
    }

    .wolf-header .headerBox .emblem {
        left: -122px;
    }

    .wolf-header .headerBox .emblem img {
        max-width: 550px;
        width: 550px;
    }

    .content-slider, .wolf-header .headerText {
        top: 73px;
    }

    .nachhaltigkeit .wolf-header .headerText {
        top: 150px;
    }

    .galerie .kontaktdaten li {
        font-size: 1.25rem
    }

    .galerie .kontaktdaten li.telefon {
        margin-left: 48px;
        margin-top: 15px
    }

    .galerie .kontaktdaten li.titel {
        margin-left: 48px;
        margin-top: -15px
    }

    .galerie .kontaktdaten ul li.person::before {
        content: url(../../media/symbole/wolf-at.png);
        margin-right: 10px;
        vertical-align: -10px
    }

    .galerie .mailBildlink {
        text-align: left !important
    }

    .galerie div.team:hover + div,
    div.kontaktdaten:hover {
        border-bottom-right-radius: 30px;
        display: flex;
        height: 100%;
        position: absolute;
        top: 0;
        width: 100%
    }

    .mailBildlink img {
        margin-left: 46px
    }

    .slider-control {
        height: 0
    }

    .slider-control .slider-menu {
        top: -100px
    }

    .slider-control .slider-menu b {
        font-size: 5rem;
        letter-spacing: -.5rem
    }

    .slider-control a,
    .kontaktdaten {
        display: none
    }

    .two-column {
        flex-direction: row;
    }
}

@media (min-width: 1400px) {


    .galerie .kontaktdaten li {
        font-size: 1.7rem
    }

    .galerie .kontaktdaten li.telefon {
        margin-left: 48px;
        margin-top: 15px
    }

    .galerie .kontaktdaten li.titel {
        margin-left: 48px;
        margin-top: -15px
    }

    .galerie .kontaktdaten ul li.person::before {
        content: url(../../media/symbole/wolf-at.png);
        margin-right: 10px;
        vertical-align: -10px
    }

    .galerie .mailBildlink {
        text-align: left !important
    }

    .kleingedruckt p {
        font-size: 1.4rem
    }

    .kontaktdaten {
        display: none
    }

    .mailBildlink img {
        margin-left: 46px
    }

    .mod_article .kontaktdaten p {
        font-size: 1rem
    }

    .mod_article p {
        font-size: 1.4rem
    }

    li.person {
        margin-top: 2rem
    }
}