footer {
    height: auto;
    box-sizing: border-box;
    background: white;
    padding-top: 45px;
    padding-bottom: 45px;
    --footer-text-color: #161616;
    --footer-header-color: rgb(22, 22, 22);
    color: var(--footer-text-color);
}

footer .row {
    gap: 30px 0;
}

footer a,
footer a:hover,
footer a:active,
footer a:visited {
    color: var(--footer-text-color);
    text-decoration: none;
}

footer h4 {
    color: var(--footer-header-color);
}

footer h4.specOffset {
    margin-top: 10px;
}

footer .fs12 {
    font-size: 12px;
}

footer .logo-red {
    width: 159px;
}

footer ul.nav.socials {
    gap: 5px 20px;
    flex-direction: row;
    flex-wrap: wrap;
}

.icon-social {
    display: inline-block;
    width: 40px;
    height: 40px;
    background-size: 100%;
    background-repeat: no-repeat;
    background-position: center center;
    border-radius: 20px;
}

.icon-social.vk.black {
    background-image: url('/imgs/icons/vk.svg');
}

.icon-social.tg.black {
    background-image: url('/imgs/icons/tg.svg');
}

.icon-social.yt.black {
    background-image: url('/imgs/icons/yt.png');
    background-size: 50px;
}

.icon-social.vkvid.black {
    width: 170px;
    height: 40px;
    background-image: url('/imgs/icons/vkvideo.png');
    background-size: cover;
    background-position: -10px 50%;
}

footer .copyright {
    margin-top: 0;
}

@media screen and (min-width: 640px) {
    footer .row {
        gap: 40px 0;
    }

    footer ul.nav.socials {
        margin-top: 0;
    }

    footer .copyright {
        margin-top: -40px;
    }

}

@media screen and (min-width: 980px) {
    footer {
        padding-top: 75px;
        height: 500px;
    }

    footer .row {
        gap: 50px 0;
    }

    footer .copyright {
        margin-top: 0;
    }

    footer ul.nav {
        padding-left: 0;
        list-style: none;
        display: flex;
        flex-direction: column;
        gap: 10px;
    }

    footer ul.nav.socials {
        margin-top: 26px;
    }
}

