/* region Fonts & Globales */

@import url('https://fonts.googleapis.com/css2?family=Merriweather+Sans:ital,wght@0,300..800;1,300..800&display=swap');

body, h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6, .d1, .d2, .d3, .d4, .d5, .d6 {
    font-family: 'Merriweather Sans', sans-serif;
}

.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
    text-transform: uppercase;
    font-weight: 900 !important;
}

.container {
    max-width: 1450px;
}

.dzm-is-italic {
    font-style: italic;
}

.dzm-box-shadow {
    box-shadow: 0px 10px 30px 0px rgba(0, 0, 0, 0.08);
}

.z-2 {
    z-index: 2;
}

hr + hr {
    display: none;
}

.consent-btn-helper {
    gap: 8px;
}

/* endregion */


/* region Topbar */

.topbar-wrapper {
    position: relative;
    z-index: 1020;
    flex-direction: row-reverse;
}

.dzm-niu-topbar a:hover {
    color: var(--primary);
}

/* endregion */


/* region Header & Navigation */

header .search-wrapper .niu-input-group {
    background: #F7F7F8 !important;
    border: none;
}

header nav .nav-item .nav-link {
    text-transform: uppercase;
    font-weight: 600;
    font-size: 1rem;
}

#mainNavigation .nav-item .nav-link {
    font-weight: 900 !important;
    font-size: 13px;
}

header.niu-header::before {
    content: '';
    position: absolute;
    top: 25px;
    left: 0px;
    width: 290px;
    height: 162px;
    display: block;
    pointer-events: none;
    background-image: url(/media/image/storage/opc/Sonstiges/ramair-flag.png);
    background-size: cover;
    background-position: center;
    transform: scaleX(-1);
}

.dzm-niu-nav-bottom-bar {
    position: relative;
    z-index: 1;
}

@media screen and (min-width: 1440px) {
    #search {
        max-width: 700px !important;
    }
}

/* endregion */


/* region Fahrzeugsuche */

#ram-autosuche-start {
    overflow: hidden;
}

#ram-autosuche-start::after {
    content: '';
    display: block;
    position: absolute;
    height: 200px;
    width: 200px;
    background-image: url(/media/image/storage/opc/Icons/pipercross-icon-gray.svg);
    background-size: contain;
    opacity: 0.08;
    pointer-events: none;
    top: -60px;
    right: -30px;
}

#ram-autosuche-start::before {
    content: '';
    position: absolute;
    right: 0;
    top: 0;
    left: unset;
    width: 290px;
    height: 162px;
    display: block;
    pointer-events: none;
    background-image: url(/media/image/storage/opc/Sonstiges/ramair-flag.png);
    background-size: cover;
    background-position: center;
    transform: scaleX(1);
}

#ram-autosuche-start #s360-vehicle-search-filter {
    flex-direction: column;
    gap: 8px;
}

#ram-autosuche-start #s360-vehicle-search-filter .input-group input {
    width: 100%;
}

#ram-autosuche-start .s360-vehicle-search-hsn-tsn-help-wrapper button,
#ram-autosuche-start .s360-vehicle-search-hsn-tsn-help-wrapper {
    width: 100%;
}

#ram-autosuche-start .dzm-hl-wrapper {
    padding: 0 40px;
}

#s360-vehicle-search-filter-box-category-switch {
    display: none !important;
}

#s360-vehicle-search-filter {
    padding: 0 40px;
}

#s360-vehicle-search-filter .col-xl-2,
#s360-vehicle-search-filter .col-xl-1 {
    width: 100% !important;
    max-width: 100% !important;
}

#s360-vehicle-search-filter .form-control {
    border-radius: 3px;
}

#s360-vehicle-search-filter .input-group {
    gap: 8px;
}

#s360-vehicle-search-filter-box-category-switch button[data-category="auto"] {
    border-radius: 3px 0 0 3px;
}

#s360-vehicle-search-filter-box-category-switch button[data-category="motorrad"] {
    border-radius: 0 3px 3px 0;
}

#s360-vehicle-search-filter-box-category-switch .btn.active svg {
    fill: white;
}

#s360-vehicle-search-filter select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    position: relative;
}

.s360-vehicle-search-select-wrapper {
    position: relative;
}

.s360-vehicle-search-select-wrapper::after {
    content: '\F282';
    display: inline-block;
    font-size: 10px;
    position: absolute;
    font-family: 'bootstrap-icons';
    right: 20px;
    top: calc(50% - 7px);
    pointer-events: none;
}

.s360-vehicle-search-hsn-tsn-help-modal {
    width: 45px;
    border-radius: 3px !important;
}

.s360-vehicle-search-hsn-tsn-help-modal .modal-header .close {
    color: white;
}

.s360-vehicle-search-hsn-tsn-help-modal:hover {
    color: white;
}

@media screen and (max-width: 465px) {
    .s360-vehicle-search-hsn-tsn-help-wrapper button {
        width: 100% !important;
    }

    .s360-vehicle-search-hsn-tsn-help-wrapper {
        width: 100%;
    }
}

@media screen and (min-width: 991px) {
    #ram-autosuche-start {
        margin-top: -330px !important;
    }
}

@media screen and (max-width: 991px) {
    #ram-autosuche-start {
        margin-top: -130px !important;
    }

    #s360-vehicle-search-filter .col-4 {
        max-width: 100% !important;
    }
}

@media screen and (max-width: 1299px) {
    #s360-vehicle-search-filter .col-4 {
        max-width: 100% !important;
        flex: 0 0 100% !important;
    }

    #s360-vehicle-search-filter strong {
        margin-bottom: 15px;
        white-space: nowrap;
    }
}

/* horizontal */

/*#fahrzeugsuche-horizontal, .fahrzeugsuche-horizontal {
    z-index: 1;
    position: relative;
    margin: 0 2rem;
    box-shadow: 0 4px 30px rgb(0 0 0 / 12%);
    transition: box-shadow .3s ease, transform .3s ease;

    &:hover {
        box-shadow: 0 2px 15px rgb(0 0 0 / 10%) !important;
        transform: translateY(-2px);
        transition: box-shadow .3s ease, transform .3s ease;
    }

    &:before {
        content: 'Fahrzeugsuche';
        font-size: .75rem;
        font-weight: 600;
        color: #fff;
        position: absolute;
        top: -25px;
        padding: 0 1.25rem;
        left: 2rem;
        width: max-content;
        height: 24px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        z-index: 1;
        background: var(--primary);
        border-radius: 3px 3px 0 0;
    }

    .form-control {
        height: 2rem;
        padding: 0 .75rem;
        font-size: 0.85rem;
    }

    .input-group {
        align-items: center;
    }

    .s360-vehicle-search-hsn-tsn-help-modal {
        height: 2rem;
        width: unset;
        padding: 0 0.25rem;
    }

    #s360-vehicle-search-filter {
        padding: 1rem 2.25rem;
        color: #212121;

        .btn {
            border-color: #d8d8d8 !important;
            color: #757575 !important;
        }
    }
}*/

/* endregion */


/* region Search Bar */

#ram-search-bar {
    max-width: 1620px;
    border-radius: 50px;
    background: #FFF;
    box-shadow: 0px 10px 30px 0px rgba(0, 0, 0, 0.05);
    padding: 25px 45px;
    margin-top: 25px;
}

#ram-searchbar-cat {
    max-width: 1620px;
    border-radius: 50px;
    background: #FFF;
    box-shadow: 0px 10px 30px 0px rgba(0, 0, 0, 0.05);
    padding: 25px 45px;
    margin-top: -46px;
    z-index: 2;
    overflow: hidden;
}

#ram-searchbar-cat::before {
    content: '';
    position: absolute;
    right: 0;
    top: 0;
    left: unset;
    width: 290px;
    height: 162px;
    display: block;
    pointer-events: none;
    background-image: url(/media/image/storage/opc/Sonstiges/ramair-flag.png);
    background-size: cover;
    background-position: center;
    transform: scaleX(1);
}

#s360-garage-widget .btn {
    padding: 0;
}

@media screen and (max-width: 991px) {
    #ram-searchbar-cat {
        margin-top: -35px;
        padding: 25px 0;
    }
}

/* endregion */


/* region Startseite */

.dzm-hero-tag:hover {
    color: #fff !important;
    background-color: var(--secondary) !important;
    transition: all 0.3s ease;
    cursor: pointer;
}

.ram-cat-hero {
    position: relative;
}

.ram-cat-hero::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #00000063;
    pointer-events: none;
    z-index: 1;
}

.ram-cat-title {
    text-transform: uppercase;
    font-weight: 900;
}

.index-news-wrapper .blog-header {
    display: none;
}

.ra-category-slider {
    img {
        mix-blend-mode: darken;
    }
}

/* endregion */


/* region Kategorieseite */

.ribbon {
    padding: .25rem .5rem;
    font-size: .5rem;
}

/* endregion */


/* region Produktseite */

.product-info .niu-sticky-top {
    top: 15px;
}

.footnote-vat a {
    color: var(--primary) !important;
}

.niu-special-price .percent {
    background-color: #d10f33;
}

.dzm-notice-bordered {
    border-right: 1px solid #e5e5e5;
    border-left: 1px solid #e5e5e5;
    padding: 1rem 1.5rem;
}

.niu-custom-boxes-container {

    margin-top:1rem !important;

    .niu-cb-card {
        .h4 {
            font-size: 1rem;
        }

        i {
            font-size: 1rem !important;
        }
    }
}

.dzm-notice-clean {
    padding:6px 0;
}

/* endregion */


/* region Produktboxen */

.productbox-title > a {
    font-weight: 400;
    font-size: .9rem;
}

.productbox-inner {
    padding: 10px 20px 40px 20px;
    border-radius: 10px;
}

/* endregion */


/* region ABE / StVZO */

.stvzo-abe-icon {
    max-width: 32px;
}

.stvzo-abe-style-1 {
    color: #02A067;
}

.stvzo-abe-style-2 {
    color: #D10F33;
}

.stvzo-abe-style-5 {
    color: #00309A;
}

.stvzo-abe-style-3,
.stvzo-abe-style-4,
.stvzo-abe-style-6,
.stvzo-abe-style-7,
.stvzo-abe-style-8,
.stvzo-abe-style-9, 
.stvzo-abe-style-11 {
    color: #0071B9;
}

.stvzo-abe-style-10 {
    color: #ffa300;
}

.stvzo-abe-container {
    padding: 6px 12px;
    border-radius: 4px 4px 0 0;
    border:1px solid #f1efef;
}

#product-offer:has(.stvzo-abe-container) .product-info-inner {
    border-radius: 0 0 8px 8px !important;
    border-top:none;
}

.stvzo-abe-content, .s360-restriction {
    font-size: 14px !important;
    font-weight: 400;
}

.stvzo-abe-container:has(.stvzo-abe-style-1) {
    background: #02a06703;
}

.stvzo-abe-container:has(.stvzo-abe-style-2), .s360-restriction {
    background: rgba(209, 15, 51, .02);
}

.stvzo-abe-container:has(.stvzo-abe-style-3, .stvzo-abe-style-4, .stvzo-abe-style-6, .stvzo-abe-style-7) {
    background: rgba(0, 113, 185, 0.06);
}

.stvzo-abe-container:has(.stvzo-abe-style-5), .stvzo-abe-container:has(.stvzo-abe-style-9) {
    background: rgba(0, 48, 154, 0.06);
}

.stvzo-abe-container:has(.stvzo-abe-style-11) {
    background: #f4f6ff;
}


.s360-restriction {
    padding: 6px 12px;
    border-radius: 4px 4px 0 0;
    margin-bottom: .5rem;

    svg {
        max-width: 20px;
        margin-right: .5rem;
    }
}

/* endregion */


/* region Slider (Splide) */

.dzm-ps-track-xs {
    padding: 15px 0 !important;
}

.dzm-ps-item-wrapper.m-3 {
    margin: 0 !important;
}

@media screen and (max-width: 465px) {
    .splide__arrow--next {
        right: -1rem !important;
    }

    .splide__arrow--prev {
        left: -1rem !important;
    }
}

@media screen and (min-width: 1250px) {
    .splide__arrow--next {
        right: -2.5rem !important;
    }

    .splide__arrow--prev {
        left: -2.5rem !important;
    }
}

/* endregion */


/* region Customer Service */

.ram-cs {
    display: block;
    margin: 0 auto;
}

.product-offer .ram-cs {
    max-height: 20px;
    display: inline-block;
    transform: translateY(-1px);
}

.product-offer .dzm-csup-trigger-wrapper i {
    display: none;
}

.dzm-csup-trigger-wrapper {
    transition: background-color .2s ease;
}

.dzm-csup-trigger-wrapper:hover {
    background-color: rgb(133 121 121 / 12%) !important;
    transition: background-color 0.3s ease;
}

.dzm-csup-trigger-wrapper:hover .dzm-csup-trigger-content {
    color: unset !important;
}

/* endregion */


/* region Sales Booster */

[data-dzm-pb-info-text] {
    margin-top: 10px;
    font-size: .8rem;
}

/* endregion */


/* region Versandhinweis */

.dzm-ctd-wrapper.dzm-notice-full {
    background-color: #e42313;
    color: white !important;
    border-radius: 3px;
    margin-top: 15px;
}

/* endregion */


/* region Sidebar */

.niu-sidebar-content-container {
    position: relative;
}

.niu-sidebar-content-container::before {
    content: '';
    position: absolute;
    right: -64px;
    top: 0;
    width: 290px;
    height: 162px;
    display: block;
    pointer-events: none;
    background-image: url(/media/image/storage/opc/Sonstiges/ramair-flag.png);
    background-size: cover;
    background-position: center;
    transform: scaleX(1) rotate(-90deg);
}

@media screen and (max-width: 991px) {
    .niu-sidebar-content-container::before {
        display: none;
    }
}

.niu-sidebar-head-small {
    container-name: niu-sidebar-head-small;
}

@container niu-sidebar-head-small (max-width: 480px) {
    .h1 {
        font-size: 1rem !important;
    }
}

/* endregion */


/* region Footer */

#footer .box-custom .btn-link {
    color: var(--primary);
}

#footer .box-custom .btn-link:hover {
    color: var(--secondary);
}

.niu-footer-topbar-icon {
    z-index: 0;
}

.productlist-filter-headline {
    font-size: 1rem;
    font-weight: 600;
    border-color: #e3e3e3;
}
#footer {
    .trusted-stars-service-widget .wrapper {
        justify-content: start;
    }

    .niu_subfooter_rating_box {
        display: flex;
        margin-left:-1rem;
    }
}


/* endregion */


/* region Trusted Shops */

#trusted-shops-widget-ramair {
    z-index: 3;
}

/* endregion */

/* region Paypal Plugin */

#productDetails-ppc-paypal-standalone-button {
    max-width: 100%;
    flex:100%;
}

:host .ec-widget:has(.badges) {
    width: 100%;
}

easycredit-widget {
    max-width: 100%;
    display: block;
    margin-top:1rem !important;
}

#tab-matching-vehicles {
    opacity: 100% !important;
}