.header {
    grid-row: 1/2;
}
.account-menu{
    img {
        position: relative;
        top: 10px;
    }
}
.main-menu {
    display: flex;
    justify-content: center;
    margin: 0 320px;
    border-bottom: white solid 1px;
    font-size: 1.75rem;

    ul {
        margin: 80px 0 0 0;
        padding: 0 0 15px 0;
    }

    li {
        display: inline-block;
        list-style: none;
        padding: 0 15px;
    }

    svg {
        fill: white;
        cursor: pointer;
    }

    a {
        text-decoration: none;
        color: white;
    }

    a:hover {
        text-decoration: none;
        color: white;
    }

    a:active {
        text-decoration: none;
        color: white;
    }
}

.select-lang {
    display: inline-flex;
    position: relative;
    overflow: hidden;
    width: 60px;
    height: auto;

    select {
        cursor: pointer;
        color: white;
        background-color: black;
        border: 0;
        font-size: 1.75rem;
        appearance: none;
        -webkit-appearance: none;
        -moz-appearance: none;
    }

    option {
        width: 100%;
        margin: 7px;
        color: black;
        background-color: white;
        font-size: 1rem;
        font-family: "Inter", sans-serif;
        font-optical-sizing: auto;
        font-weight: normal;
        font-style: normal;
        text-align: center;
    }
}

.click-stripes {
    cursor: pointer;
    width: 45px;
    height: 31px;
    position: relative;
    right: 25px;
    top: 100px;

    .items {
        width: 100%;
        height: 5px;
        background: white;
    }

    .items:nth-child(1) {
        position: absolute;
        top: auto;
    }

    .items:nth-child(2) {
        position: absolute;
        top: 12.5px;
    }

    .items:nth-child(3) {
        position: absolute;
        top: 26px;
    }
}

.click-block {
    font-family: "Inter", sans-serif;
    border-right: 2px solid black;
    position: fixed;
    top: 0;
    right: 0;
    display: flex;
    flex-direction: column;
    width: 508px;
    height: 1080px;
    background: white;
    color: black;
    /* Начальное состояние: за границей справа */
    transform: translateX(100%);
    opacity: 0;
    transition: transform 0.5s ease, opacity 0.5s ease;
    z-index: 1000;

    a {
        text-decoration: none;
        color: black;
    }

    a:hover {
        text-decoration: none;
        color: black;
    }

    a:active {
        text-decoration: none;
        color: black;
    }

    svg {
        fill: none;
        cursor: pointer;
    }
}

/* Активное состояние: показ и перемещение позиции */
.click-block.fixed-top {
    position: fixed;
    top: 0;
    left: 0;
    transform: translateX(0);
    opacity: 1;
}

.list-items {
    margin: 110px 45px 0 45px;
    border-top: 2px black solid;
    display: flex;
    flex-direction: column;

    .items:nth-child(2) {
        ul {
            padding: 70px 0 0 0;
            margin: 0;

            li {
                display: block;
                padding: 15px 0;
            }
        }

        display: flex;
        flex-direction: column;
    }

    /*.items:nth-child(3){*/
    /*    border-top: 2px black solid;*/
    /*    margin: 70px 0 0 0;*/
    /*    height: 190px;*/
    /*    display: flex;*/
    /*    align-items: baseline;*/
    /*    ul{*/
    /*        padding: 25px 0 0 0;*/
    /*        margin: 0;*/
    /*    }*/
    /*}*/
}

/*desktop*/
@media (1024px <= width <= 1600px) {
    .main-menu {
        margin: 0 80px;
    }
}

/*tablet*/
@media (750px <= width <= 1024px) {
    .main-menu {
        margin: 0;

        li {
            padding: 0 10px;
        }

        a {
            img {
                width: 38px;
                height: auto;
            }
        }
    }

    .click-stripes {
        width: 38px;
    }

    @media (950px >= width) {
        .main-menu {
            margin: 0;
            padding: 0 60px;

            li {
                padding: 0 10px;
            }

            a {
                img {
                    width: 38px;
                    height: auto;
                }
            }
        }

        .click-stripes {
            width: 38px;
        }
    }
}

@media (width <= 890px) {
    .about-menu, .services-menu, .rates-menu, .reviews-menu, .contacts-menu, .language-menu{
        font-size: 1.6rem;
    }
    .main-menu {
        li {
            padding: 0 5px;
        }
    }
}

/*mobile*/
@media (350px <= width <= 750px) {
    .click-block{
        width: 300px;
    }
    .main-menu {
        margin: 0;
        padding: 0 40px;
        justify-content: space-between;

        ul {
            margin: 40px 0 0 0;
            padding: 0 0 15px 0;
        }

        a {
            img {
                width: 35px;
                height: auto;
            }
        }

        ul {
            margin: 10px 0 15px 0;
            padding: 0;

            .about-menu,
            .services-menu,
            .rates-menu,
            .reviews-menu,
            .contacts-menu {
                display: none;
            }
        }
    }

    .click-stripes {
        width: 35px;
        top: 20px;
        left: 20px;
    }

    @media (width <= 550px) {
        .header{
            grid-row: 1/2;
            position: fixed;         /* фиксируем */
            top: 0;                  /* прижимаем к верху */
            left: 0;
            width: 100%;             /* растягиваем по ширине окна */
            z-index: 1000;           /* чтобы было поверх всего */
            background-color: black;
        }
        .main-menu {
            padding: 0 20px;
        }

        .click-block {
            width: 250px;
            height: 100%;
        }

        .list-items {
            margin: 67px 45px 0 45px;
            .items:nth-child(2) {
                ul {
                    padding: 40px 0;
                }
            }
        }
    }
}