.promo-banner {
    --button-space: 15px;
    --button-size: 28px;
    --content-width: var(--wd-max-width);
    position: relative;
    overflow: hidden;
    border-radius: var(--wd-brd-radius);
    transform: translate3d(0, 0, 0)
}

    .promo-banner .banner-image :is(img,picture,video) {
        width: 100%;
        height: var(--wd-img-height);
        object-fit: cover;
        object-position: inherit
    }

    .promo-banner .banner-image[style^="height"] :is(img,picture) {
        height: 100%
    }

    .promo-banner .wrapper-content-banner {
        z-index: 2;
        display: flex;
        overflow: hidden;
        padding: 30px;
        border-radius: var(--wd-brd-radius);
        transform: translate3d(0, 0, 0);
        align-content: flex-start;
        flex-direction: column;
        justify-content: flex-end;
    }

    .promo-banner .content-banner {
        --wd-tags-mb: 10px;
        position: relative;
        width: 100%;
        max-width: var(--content-width)
    }

    .promo-banner :is(.banner-subtitle,.banner-title,.banner-inner):not(:first-child) {
        margin-top: 7px
    }

    .promo-banner .banner-title {
        display: block;
        margin-bottom: 0;
        line-height: 1.3
    }

    .promo-banner .banner-inner p:first-child:empty {
        display: none
    }

    .promo-banner .wd-countdown-timer {
        margin-top: 10px
    }

    .promo-banner .banner-btn-wrapper {
        margin-top: var(--button-space)
    }

    .promo-banner.wd-with-link .wrapper-content-banner {
        pointer-events: none
    }

    .promo-banner.wd-with-link:hover .btn {
        pointer-events: auto
    }

.wd-bg-position-top {
    background-position: center top;
    object-position: center top
}

.wd-bg-position-bottom {
    background-position: center bottom;
    object-position: center bottom
}

.wd-bg-position-left {
    background-position: left center;
    object-position: left center
}

.wd-bg-position-right {
    background-position: right center;
    object-position: right center
}

.wd-bg-position-center {
    background-position: center;
    object-position: center
}

.banner-increased-padding .wrapper-content-banner {
    padding: 7%
}

@media (max-width: 1024px) {
    .banner-subtitle:is(.wd-fontsize-s,.wd-fontsize-m) {
        font-size: 14px
    }

    .banner-title:is(.wd-fontsize-xl,.wd-font-size-xxl) {
        font-size: 22px
    }
}

@media (max-width: 768.98px) {
    .banner-btn-wrapper :is(.btn-size-default,.btn-size-large,.btn-size-extra-large) {
        padding: 5px 14px;
        min-height: 36px;
        font-size: 12px
    }

    .banner-btn-wrapper .btn-style-link {
        padding: 0;
        min-height: unset
    }
}

@media (max-width: 767px) {
    .promo-banner .banner-subtitle {
        font-size: 3vw
    }

    .promo-banner .banner-title {
        font-size: 5vw
    }
}