 
@keyframes fade-in {
    0% {
        opacity: 0;
        transform: translateY(12px)
    }

    to {
        opacity: 1;
        transform: translateY(0)
    }
}

@keyframes shake {
    0%,to {
        transform: translate(0)
    }

    20% {
        transform: translate(-4px)
    }

    40% {
        transform: translate(4px)
    }

    60% {
        transform: translate(-3px)
    }

    80% {
        transform: translate(2px)
    }
}

@keyframes slide-up {
    0% {
        opacity: 0;
        transform: translateY(100%)
    }

    to {
        opacity: 1;
        transform: translateY(0)
    }
}

@keyframes slideInRight {
    0% {
        opacity: 0;
        transform: translate(100px)scale(.95)
    }

    to {
        opacity: 1;
        transform: translate(0)scale(1)
    }
}

@keyframes slideDown {
    0% {
        opacity: 0;
        max-height: 0
    }

    to {
        opacity: 1;
        max-height: 500px
    }
}

@keyframes slideUp {
    0% {
        opacity: 0;
        transform: translateY(100%)
    }

    to {
        opacity: 1;
        transform: translateY(0)
    }
}

@keyframes fadeIn {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

@keyframes slide-logos {
    0% {
        transform: translate(0)
    }

    to {
        transform: translate(-50%)
    }
}

@keyframes scroll-up {
    0% {
        transform: translateY(0)
    }

    to {
        transform: translateY(-50%)
    }
}

@keyframes scroll-down {
    0% {
        transform: translateY(-50%)
    }

    to {
        transform: translateY(0)
    }
}

.animate-fade-in {
    animation: .6s ease-out both fade-in
}

.animate-slide-logos {
    will-change: transform;
    animation: 30s linear infinite slide-logos
}

.animate-scroll-up {
    will-change: transform;
    animation: 25s linear infinite scroll-up
}

.animate-scroll-down {
    will-change: transform;
    animation: 25s linear infinite scroll-down
}

@keyframes announcement-shimmer {
    0%,80% {
        transform: translate(-100%)rotate(15deg)
    }

    to {
        transform: translate(200%)rotate(15deg)
    }
}
 

