/* ================= LOADING ================= */

#loading{
    position:fixed;
    top:0;
    left:0;
    width:100%;
    height:100vh;
    background:transparent;
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    z-index:99999;
    transition:opacity .5s ease, visibility .5s ease;
}

.loader{
    width:80px;
    height:80px;
    border:8px solid #333;
    border-top:8px solid #00ff88;
    border-radius:50%;
    animation:girar 1s linear infinite;
    margin-bottom:20px;
}

.texto-loading{
    font-size:20px;
    letter-spacing:2px;
    color:#fff;
    animation:pulsar 1.5s infinite;
}

@keyframes girar{

    100%{
        transform:rotate(360deg);
    }

}

@keyframes pulsar{

    0%{
        opacity:0.3;
    }

    50%{
        opacity:1;
    }

    100%{
        opacity:0.3;
    }

}