﻿@keyframes slide-in-bottom {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0) translateX(-50%);
        opacity: 0;
    }

    100% {
        -webkit-transform: translateY(0);
        transform: translateY(-50%) translateX(-50%);
        opacity: 1;
    }
}


@keyframes scale-out-hor-left {
    0% {
        -webkit-transform: scaleX(1);
        transform: scaleX(1);
        -webkit-transform-origin: 0 0;
        transform-origin: 0 0;
        opacity: 1;
    }

    100% {
        -webkit-transform: scaleX(0);
        transform: scaleX(0);
        -webkit-transform-origin: 0 0;
        transform-origin: 0 0;
        opacity: 1;
    }
}

@keyframes slide-in-bottom {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0) translateX(-50%);
        opacity: 0;
    }

    100% {
        -webkit-transform: translateY(0);
        transform: translateY(-50%) translateX(-50%);
        opacity: 1;
    }
}

@-webkit-keyframes slide-in-elliptic-bottom-fwd {
    0% {
        -webkit-transform: translateY(600px) rotateX(30deg) scale(0);
        transform: translateY(600px) rotateX(30deg) scale(0);
        -webkit-transform-origin: 50% 100%;
        transform-origin: 50% 100%;
        opacity: 0;
    }

    100% {
        -webkit-transform: translateY(0) rotateX(0) scale(1);
        transform: translateY(0) rotateX(0) scale(1);
        -webkit-transform-origin: 50% -1400px;
        transform-origin: 50% -1400px;
        opacity: 1;
    }
}


@keyframes slide-in-elliptic-bottom-fwd {
    0% {
        -webkit-transform: translateY(600px) rotateX(30deg) scale(0);
        transform: translateY(600px) rotateX(30deg) scale(0);
        -webkit-transform-origin: 50% 100%;
        transform-origin: 50% 100%;
        opacity: 0;
    }

    100% {
        -webkit-transform: translateY(0) rotateX(0) scale(1);
        transform: translateY(0) rotateX(0) scale(1);
        -webkit-transform-origin: 50% -1400px;
        transform-origin: 50% -1400px;
        opacity: 1;
    }
}

@keyframes text-focus-in {
    0% {
        -webkit-filter: blur(12px);
        filter: blur(12px);
        opacity: 0;
    }

    100% {
        -webkit-filter: blur(0px);
        filter: blur(0px);
        opacity: 1;
    }
}

@keyframes removeAnim {
    0% {
        opacity: 1;
        transform: translateX(0);
    }

    100% {
        opacity: 0;
        transform: translateX(50px);
        display: none;
    }
}

@keyframes pulse {
    0%, 100% {
        background-color: #dc3545;
    }

    50% {
        background-color: transparent;
    }
}

