.cooper-slider {
    background: #f3f3f3;
    height: var(--cooper-slider-height, 420px);
    max-width: var(--cooper-slider-max-width, 100%);
    overflow: hidden;
    position: relative;
    width: 100%;
}

.cooper-slider-auto-height {
    aspect-ratio: var(--cooper-slider-aspect-ratio, 16 / 9);
    height: auto;
}

.cooper-slider-auto-height .cooper-slider-track,
.cooper-slider-auto-height .cooper-slider-slide,
.cooper-slider-auto-height picture,
.cooper-slider-auto-height img {
    height: auto;
}

.cooper-slider-auto-height .cooper-slider-slide {
    min-height: 0;
}

.cooper-slider-auto-height img {
    object-fit: contain;
}

.cooper-slider-track,
.cooper-slider-slide {
    height: 100%;
    width: 100%;
}

.cooper-slider-slide {
    inset: 0;
    opacity: 0;
    pointer-events: none;
    position: absolute;
    transition: opacity var(--cooper-slider-transition, 600ms) ease;
}

.cooper-slider-slide.is-active {
    opacity: 1;
    pointer-events: auto;
    position: relative;
}

.cooper-slider picture,
.cooper-slider img {
    display: block;
    height: 100%;
    width: 100%;
}

.cooper-slider img {
    object-fit: var(--cooper-slider-image-fit, contain);
    object-position: center;
}

.cooper-slider-slide-link {
    inset: 0;
    position: absolute;
    z-index: 1;
}

.cooper-slider-extra-images {
    inset: 0;
    pointer-events: none;
    position: absolute;
    z-index: 2;
}

.cooper-slider-extra-image {
    display: block;
    height: auto !important;
    pointer-events: none;
    position: absolute;
    transform: translate(-50%, -50%);
}

.cooper-slider-extra-image picture {
    display: block;
    height: auto !important;
    width: 100%;
}

.cooper-slider-extra-image img {
    display: block;
    height: auto !important;
    object-fit: contain;
    width: 100%;
}

.cooper-slider-layer-buttons {
    inset: 0;
    pointer-events: none;
    position: absolute;
}

.cooper-slider-layer-button {
    pointer-events: auto;
    z-index: 1;
}

.cooper-slider-buttons {
    inset: 0;
    pointer-events: none;
    position: absolute;
    z-index: 3;
}

.cooper-slider-button {
    align-items: center;
    border-color: var(--btn-border-color, #000);
    border-radius: var(--btn-border-radius, 0);
    border-style: solid;
    border-width: var(--btn-border-width, 1px);
    display: inline-flex;
    font-family: "New Order", Arial, sans-serif;
    font-size: var(--btn-font-size, 18px);
    font-weight: var(--btn-font-weight, 400);
    justify-content: center;
    left: var(--btn-x, 18%);
    line-height: 1.05;
    min-height: var(--btn-min-height, 62px);
    min-width: var(--btn-min-width, 160px);
    padding: 0 28px;
    pointer-events: auto;
    position: absolute;
    text-align: center;
    text-decoration: none;
    top: var(--btn-y, 70%);
    transform: translate(-50%, -50%);
    z-index: 3;
}

.cooper-slider-button-yellow {
    background: var(--btn-bg, #ffcc00);
    color: var(--btn-color, #000);
}

.cooper-slider-button-black {
    background: var(--btn-bg, #000);
    color: var(--btn-color, #fff);
}

.cooper-slider-button-outline {
    background: var(--btn-bg, transparent);
    color: var(--btn-color, #000);
}

.cooper-slider-dots {
    bottom: 18px;
    display: flex;
    gap: 8px;
    left: 50%;
    position: absolute;
    transform: translateX(-50%);
    z-index: 4;
}

.cooper-slider-dots button {
    background: rgba(0, 0, 0, .25);
    border: 0;
    border-radius: 0;
    cursor: pointer;
    height: 9px;
    padding: 0;
    width: 9px;
}

.cooper-slider-dots button.is-active {
    background: #000;
    width: 24px;
}

@media (max-width: 1200px) {
    .cooper-slider {
        aspect-ratio: var(--cooper-slider-aspect-ratio, 16 / 9);
        height: auto !important;
        overflow: visible;
    }

    .cooper-slider-auto-height {
        aspect-ratio: var(--cooper-slider-aspect-ratio, 16 / 9);
        height: auto !important;
    }

    .cooper-slider img {
        object-fit: contain !important;
    }

    .cooper-slider-buttons {
        inset: 0;
        position: absolute;
    }

    .cooper-slider-button {
        font-size: var(--cooper-button-mobile-font-size, 12px) !important;
        left: var(--cooper-button-mobile-left, 50%) !important;
        min-height: var(--cooper-button-mobile-height, 30px) !important;
        min-width: var(--cooper-button-mobile-width, 112px) !important;
        padding: 0 10px;
        position: absolute;
        top: var(--cooper-button-mobile-top, 78%) !important;
        transform: translate(-50%, -50%);
        width: auto;
    }

    .cooper-slider-extra-image {
        left: var(--cooper-extra-mobile-left, 50%) !important;
        top: var(--cooper-extra-mobile-top, 50%) !important;
        width: var(--cooper-extra-mobile-width, 28%) !important;
    }
}

@media (max-width: 767px) {
    .cooper-slider,
    .cooper-slider-auto-height {
        aspect-ratio: var(--cooper-slider-mobile-aspect-ratio, var(--cooper-slider-aspect-ratio, 16 / 9));
    }
}