/* ====================================================================================================================
   GLOBAL ANIMATIONS
==================================================================================================================== */

.no-animation,
.no-animation::before,
.no-animation::after {
    transition: none !important;
}


/* keyframes */
@keyframes popIn {
    from {
        opacity: 0;
        transform: scale(2);
    }

    to {
        opacity: 1;
        transform: scale(1);
    }
}

@keyframes fadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}


/* effect animations */
.pop-in {
    animation: popIn 2.5s forwards;    /* forwards keeps the final state */
}

.fade-in {
    animation: fadeIn 0.75s ease-in forwards;
}

.animation.fadeInUp {
    opacity: 0;
    transform: translateY(80px);
    will-change: opacity, transform;
}

.animate.fadeInUp {
    opacity: 1;
    transform: translateY(0);
}

.animate.fadeInUp,
.animate.fadeInUp2col {
    transition: opacity .5s cubic-bezier(.165, .84, .44, 1), transform 1.25s cubic-bezier(.165, .84, .44, 1);
}

.animate.fadeInUp2x {
    transition: opacity .5s cubic-bezier(.165, .84, .44, 1) .3s, transform 1.25s cubic-bezier(.165, .84, .44, 1) .3s, padding .3s ease;
}

.swiper-slide-active .animate.fadeInUp {
    transition: opacity .5s cubic-bezier(.165, .84, .44, 1) .2s, transform 1.25s cubic-bezier(.165, .84, .44, 1) .2s, padding .3s ease;
}

.swiper-slide-active .animate.fadeInUp2x {
    transition: opacity .5s cubic-bezier(.165, .84, .44, 1) .5s, transform 1.25s cubic-bezier(.165, .84, .44, 1) .5s, padding .3s ease;
}


/* card animations */
.clickable-parent .bottomUp {
    bottom: 0rem;
    transition: bottom .3s ease;    /* will-change: bottom; */
}

.clickable-parent:hover .bottomUp {
    bottom: 2rem;
}


/* marquee */
.marquee {
    animation: marquee 32s linear infinite;
}
@keyframes marquee {
    0% { transform: translate(0); }
    100% { transform: translate(-50%); }
}