@charset "UTF-8";

/*
    Filename: splash_style.css
    Author: Gabriel Beltran
    Date: 6/22/2022
    Purpose:
*/

#splashscreen
{
    background: #252525;
    position: fixed;
    width: 100%;
    height: 100%;
    opacity: 0;
    animation: fade-out 4s;
    z-index: 1000;
}

#splashscreen #copyright
{
    --size: 190px;
    position: absolute;
    top: 95%;
    left: 50%;
    transform:  translate(-50%, -50%);
    width: var(--size);
}


#splashscreen #icon
{
    --size: 400px;
    transform:  scale(1.0,1.0);
    width: var(--size);
    animation: zoom-in 2s;
    animation-delay: 2s;
}

#elementSplash
{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

/*ANIMATION*/
@keyframes zoom-in
{
    50% {
        transform: scale(1.0,1.0) ;
    }

    60% {
        transform: scale(0.5,0.5) ;
    }

    100% {
        transform: scale(20.0,20.0) ;
    }
}

@keyframes fade-out
{
    0%, 85% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

@keyframes disable_div
{
    0%, 99% {
        display:block;
    }

    100% {
        display: none;
    }
}