/* ===========================
   MCubic Cube Loader
=========================== */

#page-loader{
    position:fixed;
    inset:0;
    background:#081321;
    z-index:999999;
    display:flex;
    justify-content:center;
    align-items:center;
    transition:.5s;
}

.loader-content{
    text-align:center;
    color:#fff;
}

.loader-logo{
    width:180px;
    margin-top:40px;
    margin-bottom:15px;
}

.loader-content h5{
    font-weight:500;
    color:#cfd8dc;
}

.cube{
    width:70px;
    height:70px;
    position:relative;
    transform-style:preserve-3d;
    animation:spinCube 3s infinite linear;
    margin:auto;
}

.face{
    position:absolute;
    width:70px;
    height:70px;
    background:linear-gradient(135deg,#0d6efd,#19d3ff);
    border:2px solid rgba(255,255,255,.25);
    box-shadow:0 0 25px rgba(25,211,255,.6);
}

.front{ transform:translateZ(35px); }
.back{ transform:rotateY(180deg) translateZ(35px); }
.right{ transform:rotateY(90deg) translateZ(35px); }
.left{ transform:rotateY(-90deg) translateZ(35px); }
.top{ transform:rotateX(90deg) translateZ(35px); }
.bottom{ transform:rotateX(-90deg) translateZ(35px); }

@keyframes spinCube{

    0%{
        transform:rotateX(0deg) rotateY(0deg);
    }

    100%{
        transform:rotateX(360deg) rotateY(360deg);
    }

}