/*
*  Weitere Logo-Anpassung in  logo.css
*
*
*/
.koehler-logo, #navigation-offcanvas-header .logo {
    background-image: url(/typo3conf/ext/koehler_hk/Resources/Public/Images/HKoehlerGroupLogo.svg);
    height: 100%;
    background-size: auto 40px;
    background-position: left bottom;
    width: calc(100% - 70px);
    margin: 0 0 0 20px;
}


#koehler-azubi-special,
#koehler-azubi-special-button {
    border-radius: 6px !important;
    color: white;
    font-family: 'Ubuntu Condensed', sans-serif;
    left: calc(50% + 20px);
    overflow: hidden;
    position: absolute !important;
    text-align: center;
    top: -48px;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
}

#koehler-karriere-special,
#koehler-karriere-special-button {
    border-radius: 6px !important;
    color: white;
    font-family: 'Ubuntu Condensed', sans-serif;
    left: calc(50% + 20px + 152px + 20px);
    overflow: hidden;
    position: absolute !important;
    text-align: left;
    top: -48px;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
}

@media (max-width: 991.98px) {

    #koehler-azubi-special,
    #koehler-azubi-special-button,
    #koehler-karriere-special,
    #koehler-karriere-special-button {
        top: 15px;
    }
}

@media (max-width: 767.98px) {
    #navigation-offcanvas-buttons #koehler-azubi-special-button {
        left: 50%;
        transform: translateX(calc(-100% - 10px));
    }

    #navigation-offcanvas-buttons #koehler-karriere-special-button {
        left: 50%;
        transform: translateX(calc(0% + 10px));
    }
}

@media (min-width: 992px) and (max-width: 1439.98px) {

    #koehler-azubi-special,
    #koehler-azubi-special-button,
    #koehler-karriere-special,
    #koehler-karriere-special-button {
        top: -58px;
    }

    #koehler-karriere-special,
    #koehler-karriere-special-button {
        left: calc(50% + 20px + 146px);
    }
}

@media (min-width: 1240px) {

    #koehler-azubi-special,
    #koehler-azubi-special-button,
    #koehler-karriere-special,
    #koehler-karriere-special-button {
        left: calc(40%);
        transform: translateX(calc(-100% - 10px));
    }

    #koehler-karriere-special,
    #koehler-karriere-special-button {
        transform: translateX(0%)
    }
}

@media (min-width: 1240px) and (max-width: 1439.98px) {
    #koehler-azubi-special>a>span {
        display: none;
    }

    #koehler-karriere-special>a>svg {
        width: 28px !important;
    }

    #koehler-karriere-special>a>span>span {
        display: none;
    }
}

@media (max-width: 767.98px) {
    #navigation-offcanvas + #navigation-offcanvas-buttons {
        left: -25px;
        top: 46px;
        transform: translateX(0%) scale(.75);
    }
}