@media only screen and (max-width: 1650px){
    section.agentur .image-wrapper{
        transform: translateX(-100px);
    }

}

@media only screen and (max-width: 1400px){
    section.agentur .offsetimg,
    section.ordertermine .offsetimg-left {
        position: absolute;
        top: 230px;
        left: 125px;
    }
}

@media only screen and (max-width: 1200px){
    section.agentur .image-wrapper{
        transform: translateX(0px);
    }

    section.agentur .offsetimg,
    section.ordertermine .offsetimg-left,
    section.ordertermine .offsetimg-left-2{
        left: 45px;
        top: 115px;
    }

    section.agentur a:first-of-type img:first-of-type,
    section.ordertermine .image-wrapper a:first-of-type img:first-of-type{
        transform: translate(-50px,-80px);
    }
}

@media only screen and (max-width: 990.98px){

    section.agentur .offsetimg{
        position: static;
        transform: scale( 1.2 );
    }

    section.agentur a:first-of-type img:first-of-type{
        transform: translate(-40px,0px) scale(1.2);
    }

    section.ordertermine .image-wrapper{
        margin-top: 70px;
        margin-bottom: 110px;
    }

    section.ordertermine .offsetimg-left{
        position: static;
        transform: translatey(-255px) translatex(35px);
        margin-bottom: -225px;
    }

    section.ordertermine .image-wrapper a:first-of-type img:first-of-type{
        margin-top: -5px;
        transform: translate(-60px,-120px) scale(0.8);
    }

    section.ordertermine .offsetimg-left-2 {
        left: 45px;
        top: 60px;
        transform: scale(0.8);
      }

    section.ordertermine .brand img{
        width: 100%;
        max-width: 100%;
    }

    section.ordertermine .brand{
        margin-bottom: 40px;
    }

    section.contact .adi{
        margin-left: 0px;
    }

    section.contact .row > .col-12:not(.desc){
        margin-top: 55px;
    }

    section.agentur, section.brands, section.ordertermine{
        padding: 135px 0;
    }

    section.contact{
        padding: 135px 0 35px 0;
    }

    section.ordertermine .brand:last-child{
        margin-bottom: 0px;
    }

}

@media only screen and (max-width: 767.98px) {
    :root{
        --hamburger-width: 4px;
    }

    section.ordertermine .image-wrapper a:first-of-type img:first-of-type{
        transform: translate(-54px,-120px) scale(1);
    }

    section.ordertermine .offsetimg-left-2 {
        transform: scale(1);
        left: 43px;
    }

    section.ordertermine .image-wrapper{
        margin-top: 125px;
        margin-bottom: 160px;
    }

    header {
        height: 106px;
        transition: 0.5s ease-in-out;
    }

    header .container{
        width: 100%;
        max-width: 100%;
    }

    header.scroll nav a:hover{
        background-color: transparent;
    }

    header.scroll nav a:hover{
        color: #efefef;
    }

    header nav{
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        margin: auto;
        display: flex;
        align-items: center;
        justify-content: center;
        transition: .0s .15s ease-in-out;
    }

    header.active nav{
        opacity: 1;
        visibility: visible;
        pointer-events: all;
        transition: .5s .25s ease-in-out;
    }

    header .hamburger{
        display: block;
        position: absolute;
        right: 30px;
        width: 45px;
        height: 30px;
        top: 38px;
        padding: 0px;
        cursor: pointer;
        transition: .25s ease-in-out;
    }

    header .hamburger span::before,
    header .hamburger span::after,
    header .hamburger::before{
        content: '';
        position: absolute;
        left: 0;
        width: 100%;
        height: var(--hamburger-width);
        background-color: #000;
        transition: top 0.25s 0.25s ease-in-out, bottom 0.25s 0.25s ease-in-out, width 0.25s 0.25s ease-in-out, height 0.25s 0.25s ease-in-out, transform 0.25s ease-in-out;
    }

    header .hamburger::before{
        margin: auto;
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
    }

    header .hamburger span{
        height: 100%;
    }

    header .hamburger span::before{
        top: 0;
    }

    header .hamburger span::after{
        bottom: 0;
    }

    header.active .hamburger span::before,
    header.active .hamburger span::after,
    header.active .hamburger::before{
        transition: top 0.25s ease-in-out, bottom 0.25s ease-in-out, width 0.25s ease-in-out, height 0.25s ease-in-out, transform 0.25s 0.25s ease-in-out;
    }

    header.active .hamburger::before{
        width: 0%;
        height: 1px;
    }

    header.active .hamburger span::before{
        top: calc(50% - (var(--hamburger-width) / 2) - 2px);
        transform: rotate(45deg);
    }

    header.active .hamburger span::after{
        bottom: calc(50% + (var(--hamburger-width) / 2) - 2px);
        transform: rotate(-45deg);
    }

    header.active{
        background-color: #d5c7b7;
        height: 100%;
    }

    section.agentur .image-wrapper{
        margin-top: 50px;
        margin-bottom: 176px;
    }

    section.agentur .offsetimg{
        position: absolute;
        transform: scale( 1 );
        top: 155px;
    }

    section.agentur a:first-of-type img:first-of-type{
        margin-top: -5px;
        transform: translate(-60px,0px) scale(1);
    }

    section.brands .brand{
        margin-top: 30px;
        margin-left: 0;
    }

    section.brands .row.h-100{
        justify-content: center;
    }

    section.brandes .brand:first-child{
        margin-top: 0px;
    }

    section.ordertermine .brand{
        margin-bottom: 60px;
    }

    section.ordertermine .brand .flexcenterleft{
        align-items: center;
        justify-content: center;
    }

    section.ordertermine .brand img{
        width: 200px;
        max-width: 100%;
    }


}

@media only screen and (max-width: 650px){

    section.agentur .image-wrapper {
        margin-top: 35px;
        margin-bottom: 136px;
    }

    section.ordertermine .image-wrapper{
        margin-bottom: 100px;
    }

    section.ordertermine .image-wrapper a:first-of-type img:first-of-type{
        transform: translate(-60px,-120px) scale(0.8);
    }

    section.ordertermine .offsetimg-left-2 {
        transform: scale(0.8);
    }

    section.agentur a:first-of-type img:first-of-type,
    section.agentur a:last-of-type img:last-of-type {
        margin-top: 0px;
        transform: translate(-52px,0px) scale(0.8);
    }

    section.agentur a:last-of-type img:last-of-type {
        transform: translate(-3px,0px) scale(0.8);
    }

@media only screen and (max-width: 574.98px){

    .whatsapplink img {
        width:50px;
        height:50px;
      }

    header ul {
        flex-direction: column;
    }

    header ul li {
        display: flex;
        align-items:center;
        justify-content: flex-start;
    }

    header nav a, header nav a:link, header nav a:active, header nav a:focus{
        padding: 15px;
    }
}

@media only screen and (max-width: 380px){
    section.ordertermine .offsetimg-left-2{
        top: -25px;
    }

    section.ordertermine .image-wrapper{
        margin-bottom: 30px;
    }

    section.agentur .offsetimg{
        top: 82px;
    }

    section.agentur{
        padding-bottom: 80px;
    }
}