@import url('as24-rebrand-root.css');

body.as24rebrand {
    -webkit-font-smoothing: antialiased;
}

/** Navigation header **/
.as24rebrand #primary-menu ul li a {
    color: var(--link);
    --primary-color: var(--link);
    align-items: center;
    display: flex;
    height: 80px;
    line-height: 24px;
    font-size: 16px;
    font-weight: normal;
    text-transform: none;
}

#primary-menu ul li a svg.menu-icon {
    display: none;
}

.as24rebrand #primary-menu ul li a svg.menu-icon {
    display: block;
    width: 16px;
    height: 16px;
    --primary-color: var(--link);
}

.as24rebrand #primary-menu ul ul {
    background-color: var(--background);
    border-color: var(--background);
    border-top-color: var(--navigation);
}

.as24rebrand #primary-menu > ul > li:hover a, .as24rebrand #top-user a:not(.btn):hover {
    color: var(--dark-text);

    &:hover {
        color: var(--navigation-text-hover);
    }
}

.as24rebrand#header #primary-menu .make-flyout .make-column ul > li > a,
.as24rebrand #primary-menu > ul > ul > li:hover,
.as24rebrand #primary-menu ul ul li:hover > a,
.as24rebrand #primary-menu > li.sub-menu li:hover,
.as24rebrand #primary-menu div a.last-item:hover {
    background-color: var(--navigation-hover);
    color: var(--navigation-text-hover) !important
}

.as24rebrand #primary-menu ul ul li:hover > a {
    padding-left: 18px;
}

.as24rebrand #top-user > a:hover, .as24rebrand #primary-menu > ul > li.current a {
    color: var(--navigation-text-hover);
}

.as24rebrand .linkred {
    color: var(--navigation);
}

.as24rebrand #primary-menu a.last-item.text-right {
    text-align: center;
    display: block;
}

.as24rebrand ::selection {
    background-color: var(--primary);
    color: var(--bright-text);
    text-shadow: none;
}

.as24rebrand #top-user > a span {
    display: flex;
    margin-right: 3px;
}

.as24rebrand #top-user > a {
    display: inline-block;
    position: relative;
    color: var(--link);
    font-size: 16px;
    letter-spacing: 0;
    text-transform: none;
    font-weight: normal;
}

.as24rebrand #top-user span.badge.favCount {
    font-size: 12px;
    display: flex;
    height: 16px;
    padding: 0 5px;
    background-color: var(--primary);
    align-items: center;
}

@media (max-width: 1199px) {
    .as24rebrand #top-user span.badge.favCount {
        width: 13px;
        height: 12px;
        font-size: 10px;
        padding: 0 4px;
        bottom: -3px;
    }
}

.as24rebrand #top-user span.account-not-login svg {
    margin-left: 3px;
}

.as24rebrand #top-user.top-user-open .top-user-content {
    border-top-color: var(--primary);
}

.as24rebrand .top-user-content .btn-danger {
    background-color: var(--primary);
    border-color: var(--primary);
    color: var(--bright-text);
}

.as24rebrand #top-user button:hover {
    background-color: var(--primary-hover);
    border-color: var(--primary);
    color: var(--bright-text);
}

.as24rebrand .blog-content {
    .ratgeberindex-articleimg::before,
    .footer-articleimg::before,
    .sidebar-articleimg::before {
        background: linear-gradient(transparent 40%, var(--secondary) 65%);
    }

    .text-box h3 span {
        color: var(--dark-text) !important;
    }

    .text-box h2 span {
        color: var(--dark-text) !important;
    }
}

.as24rebrand #logo img {
    width: 135px;
    height: 40px;
    margin-top: 20px;
}

/** Navigation header end **/

/** Navigation footer  **/

.as24rebrand #footer .footer__section ul > li > a {
    color: var(--link);
    --primary-color: var(--link);
}

.as24rebrand #footer .footer__section ul > li > a:hover {
    color: var(--link-hover);
    --primary-color: var(--link-hover);
}

/** Navigation footer end **/

/** MAGAZIN HEADER **/
.as24rebrand .gridlove-main-nav li > a {
    color: var(--dark-text);
    text-transform: none;
    line-height: 24px;
    font-size: 16px;
    font-weight: normal;
}

.as24rebrand .gridlove-main-nav .sub-menu li {
    padding: 10px 18px 10px;
}

.as24rebrand .gridlove-main-nav .sub-menu > li:first-child a,
.as24rebrand .gridlove-main-nav .sub-menu > li:last-child a,
.as24rebrand .gridlove-main-nav .sub-menu li a {
    padding: 0;
}

.as24rebrand .gridlove-main-nav .sub-menu > li:first-child a {
    padding-top: 10px;
}

.as24rebrand .gridlove-main-nav .sub-menu > li:last-child a {
    padding-bottom: 10px;
}

.as24rebrand .gridlove-main-nav .sub-menu li:hover {
    background-color: var(--navigation-hover);
    border-color: var(--navigation);
    color: var(--navigation-text-hover);
    font-weight: normal;
}

.as24rebrand .gridlove-main-nav .sub-menu > li:last-child > a:hover,
.as24rebrand .gridlove-main-nav .sub-menu > li:first-child > a:hover,
.as24rebrand .gridlove-main-nav .sub-menu li:hover a {
    color: var(--navigation-text-hover);
    padding-left: 20px;
}

.as24rebrand .gridlove-cat{
    background-color: var(--secondary);
}

.as24rebrand #cta_159517 .cf-cta-container-overlay[data-variant-id="209203"] {
    background-color: var(--secondary) !important;
}

.as24rebrand .logo {
    width: 200px;
    height: 60px;
}

.as24rebrand .logo-mini {
    height: 60px;
}

@media (max-width: 767px) {
    .as24rebrand .logo-mini {
        height: 40px;
    }
}
/*********************************************************/

.as24rebrand {
    p.head1, p.head2, p.head3, p.head4, p.head5, p.head6, h1, h2, h3, h4, h5, h6 {
        color: #444;
    }
}

.as24rebrand .text-box h2 span {
    color: #444 !important;
}

/* links, black CTAs */
.as24rebrand button.btn-link, .as24rebrand button.finance-details,
.as24rebrand .sidenav > .ui-tabs-active > a, .as24rebrand .video-trigger-li,
.as24rebrand .product-title h3 a, .as24rebrand .product-title .head3 a,
.as24rebrand .blog-content .toc_list li a,
.as24rebrand ul.nav.nav-pills.nav-flow li a {
    color: var(--secondary);

    &.group-types-link p.group-types-head {
        color: black;
    }

    &:hover {
        color: var(--secondary-hover);

        &.group-types-link p.group-types-head {
            color: black;
        }
    }

    &:active {
        color: var(--secondary-focus);

        &.group-types-link p.group-types-head {
            color: black;
        }
    }
}

.as24rebrand .group-types-box a:hover {
    border-color: var(--secondary);
}

.as24rebrand a.linkred {
    color: var(--secondary);

    &:hover {
        color: var(--secondary-hover);
    }

    &:active, &:focus {
        color: var(--secondary-focus);
    }
}

.as24rebrand .section-tab-large ul.tab-large li a {
    color: var(--secondary);

    &:hover {
        color: var(--secondary-hover);
    }

    &:active, &:focus {
        color: var(--secondary-focus);
    }
}

.as24rebrand ul.nav.nav-pills.nav-flow li.active a {
    border-bottom-color: var(--primary);
}

ul.nav.nav-pills.nav-flow li.active a .badge {
    background-color: var(--primary);
}

.as24rebrand #top-user .message-notification-badge:after,
#top-user .message-notification-badge-menu:after {
    background-color: var(--primary);
    border-color: var(--primary);
}

.as24rebrand #top-user .top-user-content .top-user-nav ul li:hover>a {
    background-color: var(--navigation-hover);
    color: var(--navigation-text-hover)!important;
}

.as24rebrand .lead-note-edit {
    color: var(--primary);
}

.as24rebrand #message-header .message-title-sub a {
    color: var(--link);
}

.as24rebrand #message-header .message-title-sub a:hover {
    color: var(--link-hover);
}

.as24rebrand .attachment-message.fileuploader-input a {
    color: var(--primary);
}

.as24rebrand .attachment-message.fileuploader-input a:hover {
    color: var(--primary-hover);
}

.as24rebrand .my-leads-detail .btn-primary {
    background-color: var(--primary);
}

.as24rebrand .my-leads-detail .btn-primary:hover {
    background-color: var(--primary-hover);
    border-color: var(--primary-hover);
}

.as24rebrand a.btn.btn-primary.complain-btn {
    background-color: var(--tertiary);
    border-color: var(--tertiary);
    text-decoration: none!important;
    color: var(--secondary)
}

.as24rebrand a.btn.btn-primary.complain-btn:hover {
    background-color: var(--tertiary-hover);
    border-color: var(--tertiary-hover);
    color: var(--secondary)
}

.as24rebrand .complain-dialog a {
    color: var(--primary);
}

.as24rebrand .complain-dialog a:hover {
    color: var(--primary-hover);
}

.as24rebrand .messages-thread .panel-default.message-right>.panel-heading,
.as24rebrand .messages-thread .panel-default.message-right>.panel-body,
.as24rebrand .messages-thread .panel-default.message-right {
    border-color: var(--light-background);
    background-color: var(--light-background);
    color: var(--secondary)
}

.as24rebrand .switch-field input:checked+label {
    background-color: var(--secondary) !important;
}

.as24rebrand .nav-wizard > li.active > a:hover:after {
    border-left-color: var(--secondary-hover);
}

.as24rebrand .nav.nav-wizard.ad-draft a {
    color: var(--primary);
}

.as24rebrand ul.nav.nav-wizard.ad-draft li.active a .badge {
    background-color: var(--primary);
}

.as24rebrand ul.nav.nav-wizard.ad-draft li.active a {
    color: var(--bright-text)
}

.as24rebrand .btn.btn-sm.btn-primary, .as24rebrand .btn.btn-primary {
    background: var(--primary);
    background-color: var(--primary);
    border-color: var(--primary);
    color: white;
}

.as24rebrand .btn.btn-sm.btn-primary:hover, .as24rebrand .btn.btn-primary:hover {
    background: var(--primary-hover);
    border-color: var(--primary-hover);
}

.as24rebrand .row.ad__error-container a, .as24rebrand .sideinfo-box a {
    color: var(--link);
    text-decoration: underline !important;
}

.as24rebrand .row.ad__error-container a:hover, .as24rebrand .sideinfo-box a:hover {
    color: var(--link-hover);
}

.as24rebrand .group-types-box .group-types-head {
    color: var(--dark-text);
}

.as24rebrand .price-stroke {
    background-image: url('/res/v3/image/general/price-bg.png');
    background-size: 98% 85%;
    background-repeat: no-repeat;
    background-position: 50%;
    padding: 0 10px;
    color: #000!important;
    font-weight: 600;
}

/* primary button (ocean) */
.as24rebrand .btn.btn-success, .as24rebrand .button, .as24rebrand .btn-danger,
.as24rebrand .choose-input .content-box #dealerSupport,
.as24rebrand .fileuploader-input-button {
    background: var(--primary) !important;
    background-color: var(--primary) !important;
    border-color: var(--primary);
    border-radius: 16px !important;
    text-decoration: none !important;
    text-transform: none !important;
    color: white;

    &:hover {
        background: var(--primary-hover) !important;
        background-color: var(--primary-hover) !important;
        border-color: var(--primary-hover);
        color: white !important;
    }

    &:active, &:focus {
        background: var(--primary-focus) !important;
        background-color: var(--primary-focus) !important;
        border-color: var(--primary-focus);
        color: white !important;
    }
}

/* secondary button (black) */
.as24rebrand a.btn.btn-primary,
.as24rebrand .choose-input .half-content-box .eingabe-button {
    background: var(--secondary);
    border-color: var(--secondary);
    color: white;
    border-radius: var(--button-border-radius) !important;

    &:hover {
        background: var(--secondary-hover);
        border-color: var(--secondary-hover);
        color: white;
    }

    &:active, &:focus {
        background: var(--secondary-focus);
        border-color: var(--secondary-focus);
        color: white;
    }
}

/* primary outline button (ocean) */
.as24rebrand .btn.btn-border {
    border-color: var(--primary);
    color: white;

    &:hover {
        border-color: var(--primary-hover);
        color: white;
    }

    &:active {
        border-color: var(--primary-focus);
        color: white;
    }
}

.as24rebrand .section .btn.btn-border {
    border-color: var(--primary);
    color: var(--primary);

    &:hover {
        border-color: var(--primary-hover);
        color: var(--primary-hover);
    }

    &:active {
        border-color: var(--primary-focus);
        color: var(--primary-focus);
    }
}

.as24rebrand .content-intern .switch-field input:checked + label {
    background: var(--secondary);
    background-color: var(--secondary);
}

.as24rebrand .gridlove-header-middle a:hover {
    color: var(--secondary);
}

.as24rebrand {
    .nav-wizard > li.active > a, .nav-wizard > li.active > a:hover, .nav-wizard > li.active > a:focus {
        background-color: var(--secondary-hover);
    }

    .nav-wizard > li.active > a:after {
        border-left-color: var(--primary);
    }
}

.as24rebrand .btn-default {
    color: #444;
}

.as24rebrand .product-pricetag {
    background-color: var(--primary);
}

.as24rebrand .label-primary.label-p {
    border: 1px solid var(--primary);
}

.as24rebrand .label-primary {
    background-color: var(--primary);
}

.as24rebrand .nav-wizard > li.active > a, .nav-wizard > li.active > a:hover, .nav-wizard > li.active > a:focus {
    background-color: var(--secondary)
}

.as24rebrand .nav-wizard > li.active > a:after {
    border-left-color: var(--secondary)
}

.as24rebrand .heading-block .head4 {
    color: var(--primary-hover) !important;
}

.as24rebrand .bottom-content-box .banner {
    border-color: var(--light-background);
    background-color: var(--lightest-background)
}

.favorite-label__hearth-icon {
    color: #666;
    --primary-color: #666;
    --st0-color: #676767;
    --st1-color: #686868;
    --st2-color: #8a8a8a;
    --st3-color: #7a7a7a;
    --st4-color: #fff;
    --st5-color: #727272;
    --st6-color: #8a8a8a;
    --st7-color: #676767;
}

/* takeover landingpage */
.as24rebrand .takeover-template {
    .searchbox-head h1, .searchbox-head h2, .teaserbox h3 {
        color: var(--bright-text);
    }
}

.as24rebrand .categorybox .btn-default.active {
    border-color: var(--primary);
    color: var(--primary);
}

.as24rebrand .dropdown>.select.no-label>.selection, .as24rebrand .dropdown .select>.popup>ul>li {
    color: var(--dark-text);
}

.as24rebrand .teaser-list .box_blue {
    background-color: var(--primary);
    opacity: 0.9;
}

.as24rebrand .rebrand-sec-white {
    background-color: white;
    color: var(--bright-text);
}

.as24rebrand .rebrand-sec-white .text {
    color: var(--dark-text);
}

.as24rebrand a.list-group-item .list-group-item-heading {
    color: var(--dark-text)!important;
}

.as24rebrand .text-link {
    color: var(--link);
}

.as24rebrand .text-link:hover {
    color: var(--link-hover);
}

.as24rebrand .teaserbox.box_blue {
    background-color: var(--primary);
    opacity: 0.9;
}

.as24rebrand .teaserbox.box_blue h3 {
    color: var(--bright-text);
}

.as24rebrand .teaserbox .listbox a {
    color: var(--link);
    text-decoration: underline!important;
}

.as24rebrand .teaserbox .listbox a:hover {
    color: var(--link-hover);
}

.as24rebrand .svg-manufabox a {
    color: var(--link);
}

.as24rebrand .svg-manufabox a:hover {
    color: var(--link-hover);
}

.as24rebrand .testimonial .flex-control-nav li a {
    background-color: var(--primary);
}

.as24rebrand .group-types-head {
    color: var(--dark-text);
}

/* LM-Cockpit */
body.cockpit.as24rebrand #primary-menu ul li.current a {
    border-bottom-color: var(--primary);
}

body.cockpit.as24rebrand .favorite-label__hearth-icon, body.cockpit [data-profile-icon-inactive] {
    color: #fff;
    --primary-color: #fff;
    --st0-color: #fff;
    --st1-color: #fff;
    --st2-color: #fff;
    --st3-color: #fff;
    --st4-color: #fff;
    --st5-color: #fff;
    --st6-color: #fff;
    --st7-color: #fff;
}

.as24rebrand label.themed-checkbox:not(.inversed)>input:checked:not(:indeterminate)+span.check-mark,
.as24rebrand label.themed-checkbox>input:indeterminate+span.check-mark {
    background-color: var(--primary);
}

.as24rebrand .ad-multi-selection-panel .text-container {
    color: var(--dark-text);
}

.as24rebrand .ad-multi-selection-panel .panel-container button {
    color: var(--primary);
    border-color: var(--primary);
}

/* Magazin, FAQ and co */

/*
 * links
 */
.as24rebrand {
    div#toc_container p.toc_title a, div#toc_container ul.toc_list a,
    .entry-content p a, .widget_text a, .entry-content ul a, .entry-content ol a, .gridlove-text-module-content p a, p#breadcrumbs a {
        color: var(--link);
        text-decoration: underline !important;
        border-bottom: none;

        &:hover {
            color: var(--link-hover);
            border-bottom: none;
        }

        &:active, &:focus {
            color: var(--link-focus);
            border-bottom: none;
        }
    }

    .blog-content a:not(.btn) {
        color: var(--highlighted-link);
        text-decoration: underline !important;
        border-bottom: none;

        &:hover {
            color: var(--highlighted-link-hover);
            border-bottom: none;
        }

        &:active, &:focus {
            color: var(--highlighted-link-focus);
            border-bottom: none;
        }
    }
}

/*
 * primary button
 */
.as24rebrand {
    .gridlove-load-more a, .gridlove-pagination .gridlove-next a, .gridlove-pagination .gridlove-prev a, .gridlove-pagination .next, .gridlove-pagination .prev, .gridlove-infinite-scroll a, .double-bounce1, .double-bounce2, .gridlove-link-pages > span, .module-actions ul.page-numbers span.page-numbers,
    .wp-block-button__link {
        background: var(--primary) !important;
        background-color: var(--primary) !important;
        border-color: var(--primary);
        color: white;
        border-radius: 5000px !important;
        padding-left: 40px;
        padding-right: 40px;

        &:hover {
            background: var(--primary-hover) !important;
            background-color: var(--primary-hover) !important;
            border-color: var(--primary-hover);
            color: white !important;
        }

        &:active, &:focus {
            background: var(--primary-focus) !important;
            background-color: var(--primary-focus) !important;
            border-color: var(--primary-focus);
            color: white !important;
        }
    }

    /* colors only */
    .submit, .gridlove-button, .mks_autor_link_wrap a, .mks_read_more a, input[type="submit"], button[type="submit"], .gridlove-cat, .gridlove-pill, .gridlove-button-search, body div.wpforms-container-full .wpforms-form input[type=submit], body div.wpforms-container-full .wpforms-form button[type=submit], body div.wpforms-container-full .wpforms-form .wpforms-page-button {
        background: var(--primary) !important;
        background-color: var(--primary) !important;
        border-color: var(--primary);
        color: white;

        &:hover {
            background: var(--primary-hover) !important;
            background-color: var(--primary-hover) !important;
            border-color: var(--primary-hover);
            color: white !important;
        }

        &:active, &:focus {
            background: var(--primary-focus) !important;
            background-color: var(--primary-focus) !important;
            border-color: var(--primary-focus);
            color: white !important;
        }
    }
}

/* inquiry thanks */
.as24rebrand .inquiry-contact {
    .lmPlus-prop.active {
        span {
            color: var(--primary);
        }

        i {
            color: var(--fourth);
        }
    }
}

.as24rebrand #content.inquiry-thanks {
    .content-wrap {
        background: var(--page-background);
    }

    .row.bgwhite.border-green {
        border-radius: 16px;
        color: var(--dark-text);
        border: 3px solid #E6E6DE;
    }

    h1, h2 {
        color: var(--dark-text);
    }

    a.btn, a.button {
        border-radius: 5000px !important;
    }

    .box {
        border: 3px solid var(--border-white-box);
    }

    .stepper .item__title, .stepper .item__info {
        color: var(--secondary);
    }

    .stepper .item__icon {
        .check {
            background: var(--fourth);
        }

        svg {
            .icon {
                fill: var(--secondary);
            }

            .circle {
                stroke: var(--secondary);
                fill: var(--background);
            }

        }
    }

    .thankyou {
        color: var(--dark-text);
        border: 3px solid var(--border-white-box);

        a:not(.button) {
            color: var(--primary);
        }
    }

    .including-vat, .environmental-small {
        color: var(--dark-text)
    }

    .label-border {
        background-color: var(--highlight-background);
        color: var(--dark-text);
        padding: 6px;
        font-weight: 600;
        border: none;
        font-size: 12px;
    }
}

.as24rebrand {
    .ui-slider .noUi-connect {
        background: var(--primary);
    }
}

.as24rebrand {
    .sidenav {
        .ui-tabs-active {
            a, a:hover {
                color: #666 !important;
                border-left: 5px solid #666 !important;

                .badge {
                    background-color: #666;
                }
            }
        }
    }
}

.as24rebrand .btn.rounded-full {
    border-radius: var(--button-border-radius) !important;
}

#primary-ul > li.lagoon-brush {
    background-image: url('/res/v3/image/general/lagoon-brush.svg');
    background-size: 48px;
    background-repeat: no-repeat;
    background-position: 20px center;

    position: relative;

    &:after {
        display: block;
        position: absolute;
        border-radius: 100%;
        content: '';
        left: 65px;
        top: 8%;
        width: 15px;
        height: 15px;
        background-image: url('/res/v3/image/general/lagoon-percentage.svg');
        background-repeat: no-repeat;
        background-position: center center;
    }
}

@media (min-width: 1301px) {
    #primary-ul > li.lagoon-brush {
        background-size: 125%;
        background-position: center center;

        &:after {
            left: unset;
            right: -5px;
            top: 27%;
        }
    }
}

#primary-ul > li.ocean-brush-percentage {
    background-image: url('/res/v3/image/general/ocean-brush-percentage.svg');
    background-repeat: no-repeat;
    background-position: 16px 8px;
    background-size: 120px;
}

@media (min-width: 1301px) {
    #primary-ul > li.ocean-brush-percentage {
        background-position: center 44%;
        padding: 5px 15px 5px 12px;
    }
}

#primary-ul > li.ocean-brush-percentage a {
    color: #ffffff !important;
}

#primary-ul > li.black-leasing-menu-brush {
    background-image: url('/res/v3/image/campaign/black-leasing/nav-menu-brush.svg');
    background-repeat: no-repeat;
    background-position: 12px 8px;
}

@media (min-width: 1301px) {
    #primary-ul > li.black-leasing-menu-brush {
        background-position: center 46%;
        padding: 0px 15px 0px 12px;
    }
}