#footer-menu {
    background-color: #373B3C;
}

#footer-menu .loading {
    visibility: hidden;
    max-height: 30vh;
    overflow: hidden;
}

#footer-menu * {
    padding: 0;
    margin: 0;
    font-family: "Open Sans", sans-serif;
    color: var(--white-color);
    text-decoration: none;
}

#footer-menu ul li {
    list-style-type: none;
    background: none;
    padding: 0;
    margin: 0;
}

#footer-menu button {
    margin: 0;
    padding: 0;
    -webkit-appearance: auto;
    -moz-appearance: auto;
    appearance: auto;
    -webkit-writing-mode: horizontal-tb !important;
    text-rendering: auto;
    letter-spacing: normal;
    word-spacing: normal;
    text-indent: 0;
    text-shadow: none;
    text-align: inherit;
    cursor: default;
    background: none;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    border: none;
    outline: none;
}

#footer-menu *[class*="--mw-1140"] {
    max-width: 1170px;
    padding: 35px 15px 50px;
    margin: auto;
}

#footer-menu .grid-container {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 1fr 15px 1fr 15px 1fr 15px 1fr;
    grid-template-columns: repeat(4, 1fr);
    gap: 15px 15px;
    -ms-grid-rows: auto 15px auto;
        grid-template-areas: 
    "products support about userful-links" 
    "social-block social-block social-block social-block";
}

#footer-menu .grid-container > div:nth-child(1) {
    -ms-grid-row: 1;
    -ms-grid-column: 1;
    grid-area: products;
}

#footer-menu .grid-container > div:nth-child(2) {
    -ms-grid-row: 1;
    -ms-grid-column: 3;
    grid-area: support;
}

#footer-menu .grid-container > div:nth-child(3) {
    -ms-grid-row: 1;
    -ms-grid-column: 5;
    grid-area: about;
}

#footer-menu .grid-container > div:nth-child(4) {
    -ms-grid-row: 1;
    -ms-grid-column: 7;
    grid-area: userful-links;
}

#footer-menu .accordion__button {
    border-bottom: 1px solid #8A8987;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    width: 100%;
    text-transform: uppercase;
    font-weight: 600;
    font-size: 18px;
    line-height: 36px;
    color: #8A8987;
}

#footer-menu a.accordion__button {
    cursor: pointer;
}

#footer-menu .links-list {
    padding: 6px;
    font-weight: normal;
    font-size: 16px;
    line-height: 2.25;
    white-space: nowrap;
}

#footer-menu .social-block {
    -ms-grid-row: 3;
    -ms-grid-column: 1;
    -ms-grid-column-span: 7;
    grid-area: social-block;
    margin-top: 32px;
    -ms-grid-row-align: center;
        align-self: center;
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 258px 35px 1fr;
    grid-template-columns: 258px 1fr;
    gap: calc(15px*2/3) 35px;
        grid-template-areas: "logo terms-n-copy";
}

#footer-menu .custom-logo-link {
    -ms-grid-row: 1;
    -ms-grid-column: 1;
    grid-area: logo;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}

#footer-menu .logo img {
    margin: auto;
    display: block;
    width: 160px;
    height: auto;
}

#footer-menu .terms-n-copy {
    -ms-grid-row: 1;
    -ms-grid-column: 3;
    grid-area: terms-n-copy;
    display: -ms-grid;
    display: grid;
    -ms-flex-line-pack: center;
        align-content: center;
    font-size: 12px;
}

#footer-menu .terms-n-copy__links {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    gap: 0 8px;
    white-space: nowrap;
    text-decoration: underline;
}

#footer-menu .copy {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    gap: 0 10px;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    line-height: 1.8;
}

@media (max-width: 1100px) {
    #footer-menu .header .accordion__button {
        line-height: 50px;
        cursor: pointer;
    }

    #footer-menu .social-block {
        -ms-grid-column-align: center;
            justify-self: center;
    }

    #footer-menu .links-list {
        max-height: 0;
        overflow: hidden;
        -webkit-transition: 700ms ease-in-out;
        transition: 700ms ease-in-out;
        margin-top: 6px;
        display: none;
    }

    #footer-menu .accordion--active {
        background: hsla(0,0%,100%,.03);
        margin-bottom: 4px;
    }

    #footer-menu .accordion__button {
        padding: 6px;
        cursor: pointer;
    }

    #footer-menu .accordion__button--active {
        background: hsla(0,0%,100%,.07);
    }

    #footer-menu .accordion__button--active:after {
        -webkit-transform: rotate(180deg);
            -ms-transform: rotate(180deg);
                transform: rotate(180deg);
    }

    #footer-menu .accordion__button::after {
        content: "";
        width: 24px;
        height: 24px;
        -webkit-transition: 900ms;
        transition: 900ms;
        -webkit-mask-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgZmlsbD0ibm9uZSI+PHBhdGggZmlsbD0iIzAwMCIgZD0ibTEyLjAyMyAxNi45NyA4LjMtOC40YTEgMSAwIDAgMCAwLTEuMyAxIDEgMCAwIDAtMS4zIDBsLTcgNy03LTdhMSAxIDAgMCAwLTEuMyAwIDEgMSAwIDAgMCAwIDEuNHoiLz48L3N2Zz4=);
        mask-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgZmlsbD0ibm9uZSI+PHBhdGggZmlsbD0iIzAwMCIgZD0ibTEyLjAyMyAxNi45NyA4LjMtOC40YTEgMSAwIDAgMCAwLTEuMyAxIDEgMCAwIDAtMS4zIDBsLTcgNy03LTdhMSAxIDAgMCAwLTEuMyAwIDEgMSAwIDAgMCAwIDEuNHoiLz48L3N2Zz4=);
        background-color: #8A8987;
    }

    #footer-menu .social-block {
        -ms-grid-columns: auto 35px auto;
        grid-template-columns: auto auto;
        gap: 15px 35px;
            grid-template-areas: "logo terms-n-copy";
    }

    #footer-menu .grid-container {
        display: -ms-grid;
        display: grid;
        -ms-grid-columns: 1fr 15px 1fr;
        grid-template-columns: 1fr 1fr;
        -ms-grid-rows: auto 0 auto 0 auto 0 auto;
        grid-template-rows: auto auto auto auto;
        gap: 0 15px;
            grid-template-areas:
        "products support"
        "userful-links about"
        "social-block social-block"
    }

    #footer-menu .grid-container > div:nth-child(1) {
        -ms-grid-row: 1;
        -ms-grid-column: 1
    }

    #footer-menu .grid-container > div:nth-child(2) {
        -ms-grid-row: 1;
        -ms-grid-column: 3
    }

    #footer-menu .grid-container > div:nth-child(3) {
        -ms-grid-row: 3;
        -ms-grid-column: 3
    }

    #footer-menu .grid-container > div:nth-child(4) {
        -ms-grid-row: 3;
        -ms-grid-column: 1
    }

    #footer-menu .social-block {
        -ms-grid-row: 5;
        -ms-grid-column: 1;
        -ms-grid-column-span: 3
    }

    #footer-menu .custom-logo-link {
        -ms-grid-row: 1;
        -ms-grid-column: 1;
    }

    #footer-menu .terms-n-copy {
        -ms-grid-row: 1;
        -ms-grid-column: 3;
    }
}

@media (max-width: 600px) {
    #footer-menu .grid-container {
        -ms-grid-columns: 100%;
        grid-template-columns: 100%;
        grid-template-rows: repeat(auto-fit, -webkit-max-content);
        grid-template-rows: repeat(auto-fit, max-content);
            grid-template-areas: "products" "support" "about" "userful-links" "social-block";
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        gap: 0;
    }

    #footer-menu .social-block {
        -ms-grid-columns: auto;
        grid-template-columns: auto;
        gap: 15px;
        -ms-grid-rows: auto 15px auto;
            grid-template-areas: "logo" "terms-n-copy";
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
    }

    #footer-menu .terms-n-copy__links {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        line-height: 2.8;
    }
    #footer-menu .grid-container > div:nth-child(1) {
        -ms-grid-row: 1;
        -ms-grid-column: 1;
    }
    #footer-menu .grid-container > div:nth-child(2) {
        -ms-grid-row: 3;
        -ms-grid-column: 1;
    }
    #footer-menu .grid-container > div:nth-child(3) {
        -ms-grid-row: 5;
        -ms-grid-column: 1;
    }
    #footer-menu .grid-container > div:nth-child(4) {
        -ms-grid-row: 7;
        -ms-grid-column: 1;
    }
    #footer-menu .social-block {
        -ms-grid-row: 9;
        -ms-grid-column: 1;
        -ms-grid-column-span: 1;
    }

    #footer-menu .custom-logo-link {
        -ms-grid-row: 1;
        -ms-grid-column: 1;
    }

    #footer-menu .terms-n-copy {
        -ms-grid-row: 3;
        -ms-grid-column: 1;
    }
}