@charset "utf-8";

@keyframes rot {
    from{
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

html, body { 
    margin: 0; 
    height: 100%;
}

#loading-screen {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%; 
    width: 100%;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #111; 
}

#loading-screen .icon {
    max-height: 75px;
    transform-origin: center;
    animation-name: rot; 
    animation-duration: 1s; 
    animation-iteration-count: infinite;
}

#render-frame {
    position: fixed;
    width: 100%;
    height: 100%;
    z-index: -1;
    background-color: #151515;
}

#loading {
    position: absolute;
    z-index: 0;
    display: flex; 
    align-items: center;
    justify-content: center;
    height: 100%;
    width: 100%;
}

#loading #icon {
    border: 2px solid white;
    border-radius: 10000;
    border-width: 40px;
}