/* @group Example
------------------------------------ */

.banner-cta {
    position: relative;
}

.banner-cta .absolute-row {
    position: absolute;
    top: 50%;
    left: 50%;
    translate: -50% -50%;
}

.banner-cta .absolute-row .bp-button {
    margin: auto;
}

.banner-cta .bp-column {
    text-align: center;
}



@media only screen and (min-width : 961px) {
    .banner-cta .bg .bp-multimedia {
        height: 32.2rem;
    }
}

@media only screen and (min-width : 961px) and (max-width : 1440px) {}

@media only screen and (min-width : 0) and (max-width : 960px) {
    .banner-cta .bg .bp-multimedia {
        height: 66.36vw;
    }
}

/* @end */


/* Animations
------------------------------------ */
:where(#wrapper) .banner-cta {
    opacity: 0;
    --duration: 1s;
}

:where(#wrapper) .banner-cta.animateActive {
    animation: fadeUp var(--duration) forwards;
    animation-delay: var(--delay, 0);
    --delay: 0.3s;
}