/* ---------- ANIMATIONS ---------- */

@keyframes upDownLarge {
    0% {
        transform: translateY(-15px);
        -webkit-transform: translateY(-15px);
        -moz-transform: translateY(-15px);
        -ms-transform: translateY(-15px);
        -o-transform: translateY(-15px);
    }

    50% {
        transform: translateY(-5px);
        -webkit-transform: translateY(-5px);
        -moz-transform: translateY(-5px);
        -ms-transform: translateY(-5px);
        -o-transform: translateY(-5px);
    }

    100% {
        transform: translateY(-15px);
        -webkit-transform: translateY(-15px);
        -moz-transform: translateY(-15px);
        -ms-transform: translateY(-15px);
        -o-transform: translateY(-15px);
    }
}

@keyframes ring {
    0% {
        width: 30px;
        height: 30px;
        opacity: 0.8;
    }

    100% {
        width: 80px;
        height: 80px;
        opacity: 0;
    }
}

@keyframes BgOpacity {
    0% {
        opacity: 0;
    } 20% {
        opacity: 1;
    } 100% {
        opacity: 1;
    }
}