.overlay-loader {
    display: none;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1000;
}

.overlay-loader .loader-background {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: rgba(0, 0, 0, 0.6); /* Полупрозрачный затемненный фон */
}

.overlay-loader .loader-icon {
    position: absolute;
    width: 10vw;
    height: 10vw;
    top: 50%;
    left: 50%;
    margin: -5vw 0 0 -5vw; /* Положение шестеренки по центру */
    color: #FFF;
}

/* Анимация вращения шестеренки */
.overlay-loader .loader-icon.spinning-cog {
    animation: spinning-cog 2.0s infinite linear; /* Постоянная скорость вращения */
}

/*  */
/* Прелоадер в правом окне */
/*  */

.window-preloader {
    display: none;
    width: 10vw;
    height: 10vw;
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -5vw 0 0 -5vw; /* Положение шестеренки по центру */
    animation: spinning-cog 2.0s infinite linear; /* Анимация вращения */
}

@keyframes spinning-cog {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

@media screen and (max-width: 768px) {
    .overlay-loader .loader-icon {
        width: 14vw;
        height: 14vw;
        margin: -7vw 0 0 -7vw; /* Положение шестеренки по центру */
    }
}

@media screen and (max-width: 480px) {
    .overlay-loader .loader-icon {
        width: 20vw;
        height: 20vw;
        margin: -10vw 0 0 -10vw; /* Положение шестеренки по центру */
    }
}