.PreloadBackground {
    position: fixed;
    width: 100%;
    height: 100%;
    z-index: 800;
    background-color: #000000;
    opacity: 0.74;
    transition: all 0.9s ease-out;
    z-index: 999;
}


.Preload {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: auto;
    height: auto;
}

.Preload span {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    margin: 0px 5px;
    position: relative;
    background-color: var(--mainColor);
    animation: preload 4s ease infinite;
}

    .Preload span:first-child {
    }

        .Preload span:first-child::before {
        }

    .Preload span:nth-child(2) {
        animation-delay: 0.5s;
    }

        .Preload span:nth-child(2)::before {
            animation-delay: 0.5s;
        }

    .Preload span:nth-child(3) {
        animation-delay: 1.0s;
    }

        .Preload span:nth-child(3)::before {
            animation-delay: 1.0s;
        }


    .Preload span:last-child {
        animation-delay: 1.5s;
    }

        .Preload span:last-child::before {
            animation-delay: 1.5s;
        }