.footer-container {
    display: flex;
    width: 100%;
    text-align: left;
    justify-content: space-between;
    align-items: center;
    height: auto;
    padding-bottom: 4vw;
    background: rgb(0, 60, 100);
}

.footer-text-container {
    width: 100%;
}

.footer-text, .footer-text-data {
    font-family: "Arial";
    text-align: left;
    color: #fff;
    font-size: 18px;
    padding-left: 1%;
    padding-right: 1%;
}

.footer-text-data {
    margin: 0;
    padding-top: 2vw;
    padding-bottom: 2vw;
    background: rgb(0, 60, 100);
    text-align: center;
}

.footer-href-instruction {
    text-decoration: none;
    font-family: "Arial";
    color: rgb(36, 167, 255);
    font-size: 18px;
    cursor: pointer;
    transition: color 0.3s;
    
}

.footer-href-instruction:hover {
    color: #fff;
}

.gear-container-left, .gear-container-right, .gear-container-left-top, .gear-container-right-top {
    display: flex;
    flex-direction: column;
    align-items: center; /* Выровнять по вертикали */
    gap: 12vh; /* Расстояние между шестеренками */
}

.gear-container-left-top, .gear-container-right-top {
    gap: 0;
}

.gear-container-left {
    margin-left: 2.2%;
}

.gear-container-right {
    margin-right: 2.2%;
}

.big-white-gear, .medium-blue-gear, .small-white-gear {
    animation: spin 6.0s infinite linear;
}

.big-white-gear {
    height: 6.5vw;
    width: 6.5vw;
}

.medium-blue-gear {
    height: 5.5vw;
    width: 5.5vw;
}

.small-white-gear {
    height: 4.5vw;
    width: 4.5vw;
    animation: spin-reverse 6.0s infinite linear;
    margin-top: -0.3vw;
}

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

@keyframes spin-reverse {
    from {
        transform: rotate(22.5deg);
    }
    to {
        transform: rotate(-337.5deg);
    }
}

@media screen and (max-width: 768px) {
    .footer-container {
        padding-bottom: 6vw;
    }
    .footer-text-data {
        padding-top: 3vw;
        padding-bottom: 3vw;
        padding-left: 3%;
        padding-right: 3%;
        font-size: 14px;
    }
    .footer-text, .footer-href-instruction {
        font-size: 14px;
    }
    .footer-href-instruction:hover {
        color: rgb(36, 167, 255);
    }
    .gear-container-left {
        margin-left: 3%;
    }
    
    .gear-container-right {
        margin-right: 3%;
    }
}

@media screen and (max-width: 480px) {
    .footer-container {
        padding-bottom: 7vw;
    }
    .footer-text-data {
        padding-top: 3.5vw;
        padding-bottom: 3.5vw;
        padding-left: 4%;
        padding-right: 4%;
        font-size: 12px;
    }
    .footer-text, .footer-href-instruction {
        font-size: 12px;
    }
    .footer-href-instruction:hover {
        color: rgb(36, 167, 255);
    }
    .gear-container-left {
        margin-left: 5%;
    }
    .gear-container-right {
        margin-right: 5%;
    }
}