.loading { 
    width: 100%; 
    height: 100%; 
    position: fixed; 
    display: flex;
    opacity: 0.7; 
    background-color: #181818; 
    z-index: 99; 
    /*
    text-align: center; 
    text-align: center;
    align-items: center;
    */
} 

.loading-image {
    position: fixed; 
    border: 16px solid #000000; /* #f3f3f3; */
    border-radius: 50%;
    border-top: 16px solid #4c4c4c; /* #3498db; */
    width: 30px;
    height: 30px;
    -webkit-animation: spin 2s linear infinite; /* Safari */
    animation: spin 2s linear infinite;
    top: 50%;
    left: 50%;
    transform:translate(-50%, -50%);
}

/* Safari */
@-webkit-keyframes spin {
    0% { -webkit-transform:translate(-50px, -50px) rotate(0deg); }
    100% { -webkit-transform:translate(-50%, -50%) rotate(360deg); }
}

@keyframes spin {
    0% { transform:translate(-50%, -50%) rotate(0deg); }
    100% { transform:translate(-50%, -50%) rotate(360deg); }
}