 
.fullscreen-bg {
    position: relative; /* Позволяет размещать дочерние элементы относительно блока */
    overflow: hidden; /* Скрывает часть анимированного фона, выходящую за пределы блока */
    width: 100%; /* Ширина блока */
    height: 10vh; /* Высота блока в 100% от высоты окна */
}

.background {
    background-image: url('/images_png/swim.png'); /* Укажите путь к вашему изображению */
    background-size: auto 100%; /* Изображение растягивается, чтобы заполнить весь блок */
    position: absolute; /* Позволяет управлять позицией фона независимо от основного блока */
    top: 0; /* Верхняя граница */
    left: 0; /* Левая граница */
    width: 200%; /* Увеличиваем ширину для анимации */
    height: 100%; /* Высота равна высоте блока */
    animation: moveBackground 12s linear infinite; /* Анимация для движения фона */
}

@keyframes moveBackground {
    0% {
        transform: translateX(0); /* Начальная позиция */
    }
    100% {
        transform: translateX(-50%); /* Перемещаем фон на 50% влево */
    }
}


.fullscreen-bg2 {
    position: relative; /* Позволяет размещать дочерние элементы относительно блока */
    overflow: hidden; /* Скрывает часть анимированного фона, выходящую за пределы блока */
    width: 100%; /* Ширина блока */
    height: 10vh; /* Высота блока в 10% от высоты окна */
}

.background2 {
    background-image: url('/images_png/swim2.png'); /* Укажите путь к вашему изображению */
    background-size: auto 100%; /* Изображение растягивается, чтобы заполнить весь блок */
    position: absolute; /* Позволяет управлять позицией фона независимо от основного блока */
    top: 0; /* Верхняя граница */
    left: 0; /* Левая граница */
    width: 200%; /* Увеличиваем ширину для анимации */
    height: 100%; /* Высота равна высоте блока */
    animation: moveBackground 12s linear infinite; /* Анимация для движения фона */
}

 