@font-face {
    font-family: 'Inter-Regular';
    src: url('../fonts/Inter-Regular.woff') format('woff'),
    url('../fonts/Inter-Regular-slnt=0.woff2') format('woff'),
    url('../fonts/Inter-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Inter-Medium';
    src: url('../fonts/Inter-Medium.woff') format('woff'),
    url('../fonts/Inter-Medium-slnt=0.woff2') format('woff'),
    url('../fonts/Inter-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'Inter-Bold';
    src: url('../fonts/Inter-Bold.woff') format('woff'),
    url('../fonts/Inter-Bold-slnt=0.woff2') format('woff'),
    url('../fonts/Inter-Bold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: 'Inter-SemiBold';
    src: url('../fonts/Inter-SemiBold.woff') format('woff'),
    url('../fonts/Inter-SemiBold-slnt=0.woff2') format('woff'),
    url('../fonts/Inter-SemiBold.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
}

* {
    font-family: 'Inter-Regular';
    margin: 0;
    padding: 0;
    list-style: none;
    box-sizing: border-box;
    font-weight: normal;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

a {
    text-decoration: none;
    color:#191716
}

textarea {
    resize: none;
    height: 120px;
}

textarea,
input,
input[type="date"] {
    -webkit-appearance: none !important; 
    -moz-appearance: none !important;
    appearance: none !important;
    border-radius: 0 !important;
    -webkit-border-radius:0 !important; 
}

body {
    background-color: #191716;
    position: relative;
    min-height: 100vh;
}

header, main {
    background-color: #ffffff;
}

.container {
    max-width: 1440px;
    padding: 20px 100px;
    margin: 0 auto;
}

header, main, footer {
    margin: 0 auto;
}

* {
    outline: 0 !important;
}

.google {
    color: #ffffff
}

/* input[type="search"]::-webkit-search-cancel-button {
    -webkit-appearance: none;
} */

input[type="search"]::-webkit-search-cancel-button {
    -webkit-appearance: none;
    width: 18px;
    height: 18px;
    background-image: url('../images/icons-close.svg');
    cursor: pointer;
    background-size: contain;
    background-position: center;
}


/*header*/
header {
    position: relative;
    z-index: 3;
}

.country {
    display: flex;
    align-items: center;
    cursor: pointer;
}

.country:hover {
    opacity: .6;
}

.country__icon {
    width: 21px;
}

.country__text {
    padding-left: 2px;
    font-family: 'Inter-Medium', sans-serif;
    font-size: 16px;
    font-stretch: normal;
    font-style: normal;
    letter-spacing: -0.44px;
    color: #191716;
}

.container__country {
    padding-top: 3px;
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
}

.burger__search {
    display: none;
}

.burger__button {
    display: none;
}

.select-box {
    position: relative;
    display: block;
    font-family: 'Inter-Medium';
    font-size: 16px;
    letter-spacing: -0.44px;
    color: #191716;
    padding-right: 20px;
}

.select-box__current, .select-country-box__current {
    position: relative;
    box-shadow: 0 15px 30px -10px rgba(0, 0, 0, 0.1);
    cursor: pointer;
    outline: none;
}

.select-box__current:hover, .select-country-box__current:hover {
    opacity: .6;
}

.select-box__current:focus + .select-box__list .select-box__option {
    cursor: pointer;
}

.select-country-box__current:focus + .select-country-box__list .select-country-box__option {
    cursor: pointer;
}

.select-country-box.visible .select-country-box__icon,
.select-box.visible .select-box__icon {
    -webkit-transform: translateY(-50%) rotate(180deg);
    transform: translateY(-50%) rotate(180deg);
}

.select-box.visible .select-box__list, .select-country-box.visible .select-country-box__list {
    height: auto;
    -webkit-animation-name: none;
    animation-name: none;
    z-index: 3;
}

.select-box__icon, .select-country-box__icon {
    position: absolute;
    top: 50%;
    left: 100%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 16px;
    margin-left: 4px;
    opacity: 0.3;
    -webkit-transition: 0.4s ease;
    transition: 0.4s ease;
}

.select-country-box__icon {
    left: auto;
    right: 0%;
}

.select-box__value, .select-country-box__value {
    display: -webkit-box;
    display: flex;
}

.select-box__input, .select-country-box__input {
    display: none;
}

.select-box__input:checked + .select-box__input-text {
    display: block;
}

.select-country-box__input:checked + .select-country-box__input-text {
    display: block;
}

.select-box__input-text {
    display: none;
    margin: 0;
    font-family: 'Inter-Medium';
    font-size: 16px;
}

.select-box__list {
    position: absolute;
    padding: 0;
    list-style: none;
    height: 0;
    -webkit-animation-name: HideList;
    animation-name: HideList;
    -webkit-animation-duration: 0.5s;
    animation-duration: 0.5s;
    -webkit-animation-delay: 0.5s;
    animation-delay: 0.5s;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    -webkit-animation-timing-function: step-start;
    animation-timing-function: step-start;
    box-shadow: 0 15px 30px -10px rgba(0, 0, 0, 0.1);
    background-color: #ffffff;
}

.container__country .select-box__list {
  padding: 5px 0 20px 0;
  left: -20px;
}

.select-country-box__list {
  max-height: 120px;
  overflow: auto;
  left: 0;
  width: 100%;
}

.select-country-box__list li {
    width: 100%;
}

.select-box__list li, .select-country-box__list li {
    height: 0;
    opacity: 0;
    transition: .3s;
}

.select-box.visible .select-box__list li,
.select-country-box.visible .select-country-box__list li {
    height: 25px;
    opacity: 1;
    transition: .3s;
    cursor: pointer;
}

.select-box__option, .select-country-box__option {
    display: block;
    padding: 5px 20px 0px 20px;
}

.select-box__option:hover,
.select-box__option:focus,
.select-country-box__option:hover,
.select-country-box__option:focus {
    opacity: .6;
}

@-webkit-keyframes HideList {
    from {
        -webkit-transform: scaleY(1);
        transform: scaleY(1);
    }
    to {
        -webkit-transform: scaleY(0);
        transform: scaleY(0);
    }
}

@keyframes HideList {
    from {
        -webkit-transform: scaleY(1);
        transform: scaleY(1);
    }
    to {
        -webkit-transform: scaleY(0);
        transform: scaleY(0);
    }
}

@-webkit-keyframes ShowModal {
    from {
        -webkit-transform: translateY(-100%);
        transform: translateY(-100%);
    }
    to {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
}

@keyframes ShowModal {
    from {
        -webkit-transform: translateY(-100%);
        transform: translateY(-100%);
    }
    to {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
}

@-webkit-keyframes HideModal {
    from {
        -webkit-transform: translateY(-100%);
        transform: translateY(-100%);
    }
    to {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
}

@keyframes HideModal {
    from {
        -webkit-transform: translateY(-100%);
        transform: translateY(-100%);
    }
    to {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
}

.container__nav-bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 28px;
    position: relative;
}

.container__nav-bar a {
    font-family: "Inter-SemiBold";
    font-size: 16px;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: -0.5px;
    color: #191716;
}

.container__nav-bar .nav_icon {
    display: block;
    cursor: pointer;
}

.container__nav-bar .nav_text {
    cursor: pointer;
}

.container__nav-bar .nav-icons {
    display: flex;
}

.container__nav-bar .nav_text:not(:first-of-type) {
    margin-left: 32px;
}

.container__nav-bar .nav_icon:not(:first-child) {
    margin-left: 24px;
}

.container__nav-bar .nav_icon.cart {
    position: relative;
}

.container__nav-bar .nav_icon.cart .cart__counter {
    position: absolute;
    top: 50%;
    left: 50%;
    color: #ffffff;
    font-family: "Inter-Regular";
    font-size: 52%;
    transform: translate(-50%, -50%);
    display: flex;
    align-items: center;
    justify-content: center;
}

.container__nav-bar .logo {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    width: auto;
}

.container__nav-bar a:active {
    opacity: 0.6;
}

@media(hover: hover) and (pointer: fine) {
    .container__nav-bar a:hover {
        opacity: .6;
    }
}

/*modal search*/
.modal-search {
    max-height: 0;
    overflow: hidden;
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    transition: all .4s ease;
    width: 100%;
    background: #ffffff;
    z-index: 2;
    -webkit-box-shadow: 0px 5px 5px -7px rgba(34, 60, 80, 0.6);
    -moz-box-shadow: 0px 5px 5px -7px rgba(34, 60, 80, 0.6);
    box-shadow: 0px 5px 5px -7px rgba(34, 60, 80, 0.6);
}

.modal-search.visible {
    max-height: 5000px;
    transition: all .4s ease;
}

.modal-search .container {
    width: 70%;
    padding: 50px 0 10px;
    text-align: center;
}

.modal-search label {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto;
    padding: 0 10px;
    width: 80%;
    border: 1px solid rgba(0, 0, 0, .2);
}

.modal-search input {
    outline: none;
    flex: 1;
    padding: 5px;
    margin: 3px;
    color: #191716;
    font-size: 16px;
    font-family: 'Inter-Regular';
    border: 0;
}

.container__search-results {
    width: 80%;
    margin: 0 auto;
}

.container__result-info {
    font-family: 'Inter-Regular';
    color: #191716;
    padding: 0 10px;
    font-size: 16px;
}

.search-results__item {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    margin: 25px 0;
    border-bottom: 1px solid #d8d8d8;
    text-align: left;
    padding: 3px 0;
}

.modal-search .item-image {
    display: block;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    width: 10%;
    padding-bottom: 10%;
    cursor: pointer;
}

.modal-search .item-image:hover {
    opacity: .9;
}

.modal-search .item-image:hover + .item-text .item-title {
    opacity: .6;
}

.black-btn {
    width: 200px;
    cursor: pointer;
    outline: none;
    border: none;
    color: #ffffff;
    background: #191716;
    font-size: 16px;
    font-family: 'Inter-Regular';
    padding: 5px 0;
    text-align: center;
}

.search-results__item .item-title {
    font-family: 'Inter-SemiBold';
    font-size: 16px;
    cursor: pointer;
    color: #191716;
}

.search-results__item .item-title:hover {
    opacity: .6;
}

.search-results__item .item-price {
    font-family: 'Inter-Regular';
    padding-top: 3px;
    font-size: 14px;
}

.search-results__item .item-text {
    padding-left: 30px;
}

.black-btn:hover {
    opacity: .8;
}

/*main*/
main {
    padding: 70px 0px 110px;
}

.container__title {
    font-family: "Inter-Bold";
    font-size: 84px;
    letter-spacing: -2.5px;
    text-align: center;
    color: #191716;
    padding: 0px 48px;
}

.container__gallery_wrapper {
    position: relative;
    width: 100%;
    padding-bottom: calc(100% * 0.478);
}

.container__gallery {
    width: 100%;
    padding-bottom: calc(100% * 0.5645);
    background-color: #d8d8d8;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    position: absolute;
    top: 11%;
}

.play {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100px;
    height: 100px;
    background-color: #fffe1c;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
}

.play:hover {
    opacity: .6;
}

.rectangle {
    background-color: #191716;
    overflow: hidden;
}

.rectangle .container {
    padding-bottom: 0px;
}

.rectangle .container_border {
    border-left: 1px solid rgba(255, 255, 255, 0.16);
    border-right: 1px solid rgba(255, 255, 255, 0.16);
    position: relative;
}

.rectangle .container_border:after {
    content: "";
    position: absolute;
    top: 0;
    left: calc(50% - 1px);
    display: block;
    width: 1px;
    height: 100%;
    border-right: 1px solid rgba(255, 255, 255, 0.16);
}

.container__title_white {
    color: #ffffff;
    text-align: left;
    padding: 0;
    padding-top: 21%;
    font-size: 84px;
}

.container__title_white .yellow {
    color: #fffe1c;
    font-family: "Inter-Bold";
    font-size: 84px;
    letter-spacing: -2.5px;
}

.container__philosophy {
    max-width: 553px;
    margin: 0 auto;
    padding: 35px 0 40px;
}

.philosophy__text {
    font-family: "Inter-Regular";
    font-size: 60px;
    line-height: 1.43;
    letter-spacing: -2px;
    color: #ffffff;
}

.philosophy__btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 244px;
    height: 65px;
    color: #ffffff;
    border: solid 1px;
    font-family: 'Inter-Bold';
    font-size: 16px;
    letter-spacing: -0.5px;
    background-color: #191716;
    cursor: pointer;
    margin: 27px 0;
}

.philosophy__btn .underline {
    font-family: 'Inter-SemiBold';
    font-size: 16px;
    letter-spacing: -0.5px;
}

.philosophy__btn:after {
    transform: translateX(5px);
    content: url(../images/icons-arrow.svg);
    margin-left: 7px;
    margin-top: 5px;
    transition: 0.3s ease;
}

.philosophy__btn:hover {
    border: solid 1px #d8d8d8;
    outline: none;
}

.philosophy__btn:hover:after {
    transform: translateX(10px);
    transition: 0.3s ease;
}

.philosophy__btn:hover .underline {
    border-bottom: 1px solid #ffffff;
}

.text-line {
    overflow: hidden;
    margin: 0 -140px;
}

.text-line__text {
    width: 100%;
    opacity: 0.8;
    text-shadow: 1px 0 1px #ffffff, 0 1px 1px #ffffff, -1px 0 1px #ffffff, 0 -1px 1px #ffffff;
    font-family: "Inter-Bold";
    font-size: 120px;
    letter-spacing: -4px;
    color: #191716;
    white-space: nowrap;
    text-overflow: clip;
    padding: 61px 0;
}

.foto-group .container {
    display: flex;
    padding: 0;
    max-width: none;
}

.container__foto {
    position: relative;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    width: 50%;
    padding-bottom: calc(50% * 0.972);
}

.container__foto .foto-text {
    position: absolute;
    left: 48px;
    right: 48px;
    padding-right: 24px;
    text-align: left;
    bottom: 45px;
    font-family: 'Inter-Bold';
    font-size: 32px;
    letter-spacing: -1px;
    color: #ffffff;
    text-transform: uppercase;
    cursor: pointer;
    border-bottom: 1px solid rgba(255, 255, 255, 0);
    
}

.container__foto .foto-text:hover {
    color: #fffe1c;
    border-bottom: 1px solid #fffe1c;
}

.container__foto .foto-text:hover:after {
    content: url(../images/icons-arrow-yellow.svg);
    position: absolute;
    right: 0;
}

.big-foto {
    position: relative;
    width: 100%;
    padding-bottom: calc(100% * 0.75);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}

.big-foto__ui-line {
    position: absolute;
    top: 100%;
    width: 100%;
    transform: translateY(-67.7%);
    padding-bottom: calc(100% * 0.272);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    background-image: url('../images/ui-line.svg');
    z-index: 1;
}

.collections .container {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    flex-wrap: wrap;
    padding: 183px 100px 18px;
}

.collection-item__text {
    font-family: 'Inter-Bold';
    font-size: 32px;
    letter-spacing: -1px;
    color: #191716;
    text-transform: uppercase;
    position: relative;
    cursor: pointer;
    border-bottom: 1px solid rgba(255, 255, 255, 0);
    padding-right: 24px;
    width: 100%;
    padding-top: 32px;
}

.collection-item__text:hover {
    border-bottom: 1px solid #191716;
}

.collection-item__text:hover:after {
    content: url(../images/icons-arrow-dark.svg);
    position: absolute;
    right: 0;
}

.collection-item__foto {
    width: 100%;
    padding-bottom: calc(100% * 1.081);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}

.container__collection-item {
    width: calc((100% - 130px) / 3);
}

/*footer*/

footer {
    background-color: #191716;
    color: #ffffff;
}

footer .container {
    overflow: hidden;
    padding: 84px 120px 70px;
}

footer .columns-wrapper {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}

footer .country {
    display: none;
}

footer .country .country__text {
    color: #ffffff;
}

footer .select-box {
    color: #ffffff;
}

.columns-wrapper__column {
    font-family: "Inter-Regular";
    font-size: 16px;
    letter-spacing: -0.5px;
}

footer .accordion.language {
    display: none;
}

.column__title {
    font-family: "Inter-SemiBold";
    padding: 32px 0 15px;
}

.column__title a {
    cursor: pointer;
}

.columns-wrapper__column li, .columns-wrapper__column li a {
    font-family: "Inter-Regular";
    padding-top: 20px;
    cursor: pointer;
    color: #ffffff;
}

.columns-wrapper__column li:hover, .column__title a:hover {
    opacity: .6;
}

.logo_white {
    width: 96px;
}

.column__title a:not(:first-child) {
    margin-left: 30px;
}

.columns-wrapper__column p {
    opacity: 0.4;
    font-family: 'Inter-Regular';
    font-size: 16px;
    letter-spacing: -0.5px;
    color: #ffffff;
    padding-top: 5px;
}

.columns-wrapper__column p:first-of-type {
    padding-top: 20px;
}

.columns-wrapper__column:last-of-type {
    width: 16.67%;
}

.columns-wrapper__column:first-of-type, .columns-wrapper__column:nth-of-type(3) {
    width: 22%;
}

.columns-wrapper__column:nth-of-type(2) {
    width: 30%;
}

/*modal-region*/
.modal-region {
    position: absolute;
    background-color: #ffffff;
    top: 0;
    transform: translateY(-100%);
    animation-name: ShowModal;
    -webkit-animation-name: ShowModal;
    -webkit-transition: all 0.4s ease;
    transition: all 0.4s ease;
    width: 100%;
    z-index: 3;
    padding-bottom: 163px;
}

.modal-background {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: rgba(25, 23, 22, .8);
    z-index: -1;
    opacity: 0;
    transition: all .4s ease;
}

.modal-background.visible {
    opacity: 1;
    z-index: 1;
    transition: all .4s ease;
}

/* .modal-background.search-bg {
    top: 121px;
} */
.modal-background.filter-bg {
    top: 212px;
}

.modal-region.visible {
    transform: translateY(0);
    -webkit-transition: all 0.4s;
    transition: all 0.4s;
    animation-name: HideModal;
    -webkit-animation-name: HideModal;
    overflow: auto;
}

.modal-region .modal-region__background-lines {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    padding-top: 0;
    padding-bottom: 0;
    z-index: -1;
}

.background-line:last-of-type {
    width: 20.01%;
}

.background-line:first-of-type {
    width: 18.41%;
}

.background-line:nth-of-type(2), .background-line:nth-of-type(3), .background-line:nth-of-type(4) {
    width: 20.4%;
}

.background-line {
    height: 100%;
}

.background-line:not(:last-child) {
    border-right: 1px solid rgba(25, 23, 22, .2);
}

.modal-region__main {
    display: flex;
    padding-top: 32px;
}

.modal-region__main .region__title {
    font-family: 'Inter-SemiBold';
    color: #191716;
    letter-spacing: -0.5px;
}

.modal-region__main .region:last-of-type {
    width: 20.01%;
}

.modal-region__main .region:first-of-type {
    width: 18.41%;
}

.modal-region__main .region:nth-of-type(2), .modal-region__main .region:nth-of-type(3), .modal-region__main .region:nth-of-type(4) {
    width: 20.4%;
}

.modal-region__main .region:not(:first-of-type) {
    padding-left: 25px;
}

.modal-region__main ul li {
    font-size: 16px;
    font-family: 'Inter-Regular';
    line-height: 1.4;
    color: #191716;
    letter-spacing: -0.5px;
    padding-top: 17.5px;
    cursor: pointer;
}

.modal-region__main ul li:hover {
    opacity: .6;
}

.modal-region__main ul li:first-of-type {
    padding-top: 25px;
}

.modal-region__header {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    padding-top: 40px;
}

.modal-region__header .close-btn {
    cursor: pointer;
    position: absolute;
    right: 0;
    text-align: center;
}

.modal-region__header .title {
    font-family: 'Inter-Bold';
    font-size: 32px;
    color: #191716;
    text-transform: uppercase;
    padding-top: 32px;
    letter-spacing: -1px;
}

.modal-region__header .close-btn:hover {
    opacity: .6;
}

.modal-region__header .close-btn p {
    font-family: 'Inter-Bold';
    font-size: 16px;
    color: #191716;
    letter-spacing: -0.5px;
}

.modal-region__header .close-btn img {
    width: 32px;
    height: 32px;
}

/*product page*/

main.products-page,
main.privacy-page,
main.return-page {
    padding: 30px 0px 70px;
}

.sticky {
    position: sticky;
    top: -1px;
    background: #ffffff;
    z-index: 2;
    border-top: 1px solid #d8d8d8;
    border-bottom: 1px solid #d8d8d8;
}

.filter .container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-top: 0;
    padding-bottom: 0;
}

.filter-title {
    padding: 10px 0;
    width: 85%;
    letter-spacing: -0.44px;
    font-size: 16px;
}

.filter-title .bold {
    font-family: 'Inter-SemiBold';
}

.filter-title .regular {
    font-family: 'Inter-Regular';
}

.filter-btn {
    background-color: #ffffff;
    outline: none;
    border: none;
    display: flex;
    align-items: center;
    justify-content: center;
    border-left: 1px solid #d8d8d8;
    padding: 10px 0;
    width: 15%;
    cursor: pointer;
}

.filter-btn div {
    border-bottom: 1px solid transparent;
    max-width: calc(100% - 30px);
}

.filter-btn:hover div {
    border-bottom: 1px solid #191716;
}

.filter-btn div {
    font-family: 'Inter-Regular';
    font-size: 16px;
}

.filter-btn svg {
    width: 20px;
    height: 20px;
    margin: 8px;
}

.modal-filter {
    position: absolute;
    background: #ffffff;
    width: 100%;
    max-height: 0;
    border-top: 1px solid #d8d8d8;
    box-shadow: 0 15px 30px -10px rgba(0, 0, 0, 0.1);
    overflow: hidden;
    transition: all .4s ease;
    z-index: 9;
}

.modal-filter.visible {
    max-height: 2000px;
    transition: all .4s ease;
}

.modal-filter__main-item .title {
    letter-spacing: -0.44px;
    font-family: 'Inter-SemiBold';
    font-size: 16px;
}

.modal-filter__main-item fieldset {
    padding-top: 20px;
    display: flex;
    flex-direction: row;
}

.modal-filter__main-item fieldset label,
.one-product-page .size-form div label {
    letter-spacing: -0.44px;
    font-family: 'Inter-Regular';
    cursor: pointer;
    margin: 10px;
    font-size: 16px;
}

.modal-filter__main-item fieldset label:hover,
.one-product-page .size-form div label:hover {
    opacity: .6;
}

.modal-filter__main-item.collection fieldset,
.modal-filter__main-item.product_type fieldset {
    flex-direction: column;
}

.modal-filter__main-item.collection label,
.modal-filter__main-item.product_type label {
    width: auto;
}

.modal-filter__main-item.size fieldset label,
.one-product-page .size-form div label {
    border: 1px solid #d8d8d8;
    width: 35px;
    height: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.modal-filter__main-item.collection fieldset div,
.modal-filter__main-item.product_type fieldset div {
    padding: 10px 0 10px 0;
    margin: 0;
}

.modal-filter__main-item.color fieldset label {
    border: 0;
}

.modal-filter__main fieldset {
    outline: none;
    border: none;
}

.modal-filter__main input {
    display: none;
}

.modal-filter__main-item.collection input:checked + label,
.modal-filter__main-item.product_type input:checked + label {
    text-decoration: underline;
}

.modal-filter__main-item.color input:checked + label,
.modal-filter__main-item.size input:checked + label {
    box-shadow: 0px 1px 0px #191716;
}

.modal-filter__main {
    display: flex;
    align-items: stretch;
    justify-content: space-between;
    width: 100%;
}

.modal-filter__main-item {
    width: calc((100% - 50px) / 3);
    padding: 40px 0 40px 20px;
}

.modal-filter__main-item:not(:first-of-type) {
    border-left: 1px solid #d8d8d8;
}

.hide-filter-btn {
    width: 100%;
    background-color: #ffffff;
    color: #191716;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 0px;
    cursor: pointer;
    outline: none;
    padding: 10px 0;
    border-top: 1px solid #d8d8d8;
}

.hide-filter-btn span {
    font-family: 'Inter-Regular';
    font-size: 16px;
}

.hide-filter-btn:hover span {
    box-shadow: 0px 1px 0px #191716;
}

.hide-filter-btn img {
    transform: rotate(180deg);
}

.products .container {
    text-align: center;
}

.products-info__btn {
    font-family: 'Inter-Regular';
    letter-spacing: -0.44px;
    margin-top: 30px;
    font-size: 16px;
    text-align: center;
    cursor: pointer;
    outline: none;
    border: none;
    color: #ffffff;
    background: #191716;
    padding: 5px 40px;
}

.products-info__btn:hover {
    opacity: .6;
}

.container__products-wrapper {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    flex-wrap: wrap;
}

.product-card {
    width: calc((100% - 50px) / 3);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    margin-top: 25px;
}

.product-card:not(:nth-of-type(3n + 1)) {
    margin-left: 25px;
}

.product-card__image {
    display: block;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    width: 100%;
    padding-bottom: 100%;
    background-color: #d8d8d8;
}

.product-card__image:hover {
    opacity: .9;
}

.product-card__image:hover + .product-card__title {
    opacity: .6;
}

.modal-filter__background {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: rgba(25, 23, 22, .8);
    display: none;
    z-index: 1;
}

.product-card__title {
    font-family: 'Inter-SemiBold';
    padding-top: 10px;
    font-size: 16px;
    cursor: pointer;
    color: #191716;
    white-space: nowrap;
}

.product-card__title:hover {
    opacity: .6;
}

.product-card__price {
    font-family: 'Inter-Regular';
    font-size: 14px;
    padding-top: 3px;
}

/* one-product-page */
main.one-product-page {
    padding: 30px 0px 70px;
}

.one-product .container__product-block {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.one-product .right-column > div:not(:first-of-type) {
    margin-top: 32px;
}

.one-product .left-column {
    width: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

.one-product .right-column {
    width: 45%;
}

.left-column .photo {
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    width: 100%;
    padding-bottom: calc(100% * 1.18);
}

.container__one-name, .container__one-price {
    font-size: 16px;
    font-family: 'Inter-SemiBold';
}

.addition-price {
    font-size: 16px;
    font-family: 'Inter-Regular';
}

.colors-form label {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    border: 1px solid #d8d8d8;
    flex-basis: calc(50% - 5px);
    margin: 5px;
    padding: 20px;
    cursor: pointer;
}

.colors-form .text {
    font-size: 14px;
    font-family: 'Inter-Regular';
}

.colors-form label:hover {
    opacity: .6;
}

.one-product-info .title {
    font-size: 18px;
    font-family: 'Inter-SemiBold';
    overflow: hidden;
    word-break: break-word;
}

.one-product-info p {
    font-size: 14px;
    font-family: 'Inter-Regular';
    padding-top: 7px;
}

.colors-form label:nth-of-type(2n+1) {
    margin-left: 0;
}

.colors-form label:nth-of-type(2n) {
    margin-right: 0;
}

.colors-form input {
    display: none;
}

.colors-form, .size-form {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    padding-top: 10px;
}

.color-form-div {
    flex-basis: calc(50% - 5px);
    margin: 10px 0 0 0;
    cursor: pointer;
}

.size-form {
    justify-content: flex-start;
}

.color-form-div label {
    width: 100%;
}

.color-bg {
    width: 20px;
    height: 20px;
    display: block;
    box-shadow: inset 0px 1px 2px rgba(146, 146, 146, .6);
}

.one-product-page .size-form div input {
    display: none;
}

.colors-form input:checked + label,
.one-product-page .size-form div input:checked + label {
    border: 1px solid #fffe1c;
}

.one-product .info-text p {
    font-size: 10px;
    font-family: 'Inter-Regular';
    padding-top: 3px;
}

.one-product-page .cart-block__title {
    padding: 32px 0 24px;
}

.one-product .info-text p:first-of-type {
    font-size: 13px;
    font-family: 'Inter-Medium';
}

.one-product .colors__title,
.one-product .size__title {
    font-family: 'inter-SemiBold';
    font-size: 16px;
}

.one-product-page .size-form div label {
    margin: 10px 20px 0 0;
}

.one-product .addition__price {
    font-family: 'inter-SemiBold';
    font-size: 32px;
}

.addition {
    border: 1px solid #d8d8d8;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    flex-direction: column;
    padding: 5%;
}

.addition__buttons {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    width: 100%;
    padding-top: 20px;
}

.addition__buttons .black-btn {
    width: calc(96% - 24px);
}

.addition__buttons .cart {
    margin-left: 4%;
    cursor: pointer;
}

.addition__buttons .cart:hover {
    opacity: .6;
}

.container__cart-block {
    padding: 50px 0 64px;
}

.container__foto-block {
    padding-top: 50px;
}

.cart-block__main {
    background-color: #FAFAFA;
    display: flex;
    justify-content: center;
    align-items: center;
}

.cart-product {
    width: 15%;
    padding-bottom: calc(15% * 2.18);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    margin: 0 15px;
    position: relative;
    text-align: center;
}

.cart-product__name {
    position: absolute;
    top: calc(100% + 20px);
    width: 100%;
    font-size: 14px;
    font-family: 'Inter-Regular';
}

.block-title {
    font-family: 'Inter-Regular';
    font-size: 32px;
    text-align: center;
    padding: 0px;
}

.block-title .bold {
    font-family: 'inter-SemiBold';
}

.cart-block__product-image {
    width: 100%;
    padding-bottom: calc(100% * 0.75);
    background-size: cover;
    background-position: center;
}

.cart-block__product-image.first-image {
    margin-top: 20px;
}

/* cart */
main.cart-page {
    padding: 30px 0px 70px;
}

main.cart-page section .container {
    width: 100%;
    overflow: hidden;
}

main.cart-page section .container:after {
    content: "";
    height: 1px;
    width: 100%;
    background-color: #d8d8d8;
    display: block;
    margin-top: 32px;
}

main.cart-page section.subtotal .container:after,
main.cart-page section.total .container:after,
main.cart-page section.shipping-adress .container:after  {
    margin-left: calc(20% + 32px);
    width: calc(80% - 32px);
}

.cart-page .cart-info {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

.cart-page .info-text,
.privacy-page .info-text,
.return-page .info-text {
    text-align: center;
    padding-top: 24px;
    font-family: 'Inter-Regular';
    font-size: 16px;
}

.return-page .info-text {
  text-align: left;
}

.info-text_number {
  font-size: 32px;
  font-family: 'inter-SemiBold';
}

.amount-info .amount-info__main {
    display: flex;
    justify-content: flex-start;
    align-items: center;
}

.amount-info .photo {
    display: block;
    width: 20%;
    padding-bottom: calc(20% * 0.9);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.amount-info .photo:hover {
    opacity: .9;
}

.amount-info .photo:hover + .info-wrapper .title {
    opacity: .6;
}

.amount-info .info-wrapper {
    width: 80%;
    display: flex;
    justify-content: space-between;
    padding-left: 32px;
    align-items: baseline;
}

.amount-info .remove-btn,
.welcome .welcome-btn,
.order-page .show-order {
    font-size: 14px;
    font-family: "Inter-Regular";
    color: #191716;
    cursor: pointer;
    border-bottom: 1px solid transparent;
    margin: 10px 0;
}

.amount-info .remove-btn:hover,
.welcome .welcome-btn:hover,
.order-main__form .agreement a:hover,
.account-info__form .agreement a:hover,
.order-page .show-order:hover {
    border-bottom: 1px solid #191716;
}

.info-wrapper .title {
    font-family: "Inter-SemiBold";
    font-size: 16px;
    max-width: 50%;
    overflow: hidden;
    word-break: break-word;
    color: #191716;
    cursor: pointer;
}

.info-wrapper .title:hover {
    opacity: .6;
}

.info-wrapper .amount {
    display: flex;
    align-items: center;
    justify-content: center;
}

.info-wrapper .characteristics p,
.shipping-adress .adress {
    padding-top: 3px;
    font-size: 14px;
    font-family: "Inter-Regular";
    color: #191716;
}

.total-price .price {
    font-family: "Inter-SemiBold";
    font-size: 16px;
}

.amount .number {
    font-family: "Inter-SemiBold";
    font-size: 16px;
    max-width: 120px;
    overflow: hidden;
    word-wrap: break-word;
    padding: 5px;
    min-width: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #d8d8d8;
}

.amount .plus, .amount .minus {
    margin: 5px;
    cursor: pointer;
    width: 10px;
    height: 10px;
}

.amount .plus:hover, .amount .minus:hover {
    opacity: .6;
}

.subtotal .subtotal__item, .total .total__main,
.shipping-adress__main, .purchase_buttons__main {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    padding-left: calc(20% + 32px);
}

.subtotal__item p,
.shipping-adress__main .title {
    font-size: 16px;
    font-family: "Inter-SemiBold";
}

.subtotal .subtotal__item:not(:first-of-type) {
    padding-top: 24px;
}

.total__main div {
    font-family: "Inter-SemiBold";
    font-size: 16px;
}

.total .container {
    display: flex;
    flex-direction: column;
}

.total .black-btn {
    margin-top: 24px;
    align-self: flex-end;
}

.purchase_buttons .purchase_buttons__main {
  display: flex;
  align-items: stretch;
  justify-content: space-between;
}

.purchase_buttons .black-btn {
  flex: 200px 0 1;
}

.purchase_buttons .black-btn:not(:first-of-type) {
  margin-left: 5px;
  display: flex;
  justify-content: center;
  align-items: center;
}

main.cart-page section.purchase_buttons .container:after {
  display: none;
}

/*order page*/
main.order-page {
    padding: 30px 0px 70px;
}

.order-page .top-bar .container {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.order-page .container:after {
    content: '';
    display: block;
    width: 100%;
    height: 1px;
    background-color: #d8d8d8;
    margin-top: 32px;
}

.order-page .order-main .title,
.support-page .title {
    font-family: 'Inter-SemiBold';
    font-size: 24px;
    color: #191716;
    padding-top: 10px;
    letter-spacing: -0.5px;
}

.order-page .order-main .subtitle,
.account-info .subtitle {
    font-family: 'Inter-SemiBold';
    font-size: 16px;
    color: #191716;
    padding: 24px 0;
}

.order-page .container .show-order {
    margin: 24px 0 0;
}

.order-main__form,
.account-info__form {
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    justify-content: center;
}

.order-main__form .input-with-description,
.account-info__form .input-with-description,
.support-form .input-with-description {
    padding: 0;
    margin: 0;
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.order-main__form .input-with-description__desc,
.account-info__form .input-with-description__desc,
.support-form .input-with-description__desc {
    min-width: 280px;
    max-width: 560px;
    width: 50%;
    padding-left: 24px;
    font-family: 'Inter-Regular';
    font-size: 12px;
    color: #191716;
    max-height: 58px;
    letter-spacing: -0.44px;
    overflow: hidden;
}

.account-info__form .input-with-description__desc {
  min-width: 170px;
}

.order-form__input, .account-info__input,
.order-main__form textarea,
.account-info__form textarea,
.support-form__input,
.support-form textarea {
    width: 50%;
    min-width: 280px;
    max-width: 560px;
    color: #191716;
    font-family: 'Inter-Regular';
    letter-spacing: -0.44px;
    font-size: 16px;
    transition: all .4 ease;
}

.order-main__form textarea,
.account-info__form textarea,
.support-form textarea {
    padding: 8px;
    border: 1px solid #d8d8d8;
}

.order-main__form input:not([type="checkbox"]),
.account-info__form input:not([type="checkbox"]),
.support-form input:not([type="checkbox"])  {
    width: 100%;
    border: 1px solid #d8d8d8;
    padding: 18px 14px;
    font-size: 16px;
}

.agreement {
    font-family: 'Inter-Regular';
    letter-spacing: -0.44px;
    font-size: 14px;
    color: #191716;
    margin-top: 32px;
    text-align: left;
}

.agreement #agreement-checkbox {
    display: none;
}

.agreement [for="agreement-checkbox"] {
    cursor: pointer;
	  position: relative;
    border: 1px solid #d8d8d8;
	  width: 12px;
    height: 12px;
    display: inline-block;
    margin-right: 7px;
}

.agreement a {
    font-family: 'Inter-SemiBold';
    cursor: pointer;
    border-bottom: 1px solid transparent;
}

#agreement-checkbox:checked + [for="agreement-checkbox"]:after {
	position: absolute;
	content: '';
    display: block;
    top: 0;
    left: 0;
    width: 12px;
    height: 12px;
    background-color: #191716;
}

.pay-btns__wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 50%;
    min-width: 280px;
    max-width: 560px;
}

.pay-btns button {
    font-family: 'Inter-SemiBold';
    letter-spacing: -0.44px;
    font-size: 16px;
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 32px;
    width: 160px;
    min-width: 90px;
}

.pay-btns button:not(:last-of-type) {
    margin-right: 12px;
}

.order-main__form  input::placeholder,
.account-info__form  input::placeholder,
.support-form  input::placeholder  {
    color: #8a8989;
}

.order-main__form .city-wrapper,
.account-info__form .city-wrapper {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 50%;
    min-width: 280px;
    max-width: 560px;
}

.order-main__form .city-wrapper .order-form__input,
.account-info__form .city-wrapper .account-info__input {
    width: calc((100% - 10px) / 2);
    min-width: 135px;
    max-width: 275px;
}

.order-main__form .select-country-box,
.account-info__form .select-country-box {
    padding: 18px 14px;
    width: 50%;
    min-width: 280px;
    max-width: 560px;
    font-family: 'Inter-Regular';
    font-size: 16px;
    color: #191716;
    margin: 5px 0;
    border: 1px solid #d8d8d8;
    position: relative;
    display: block;
    letter-spacing: -0.44px;
}

.order-page .pay-btns .container:after {
    display: none;
}

/* registration */
section.registration {
    height: 100vh;
    background-color: #ffffff;
}

input[type=password],
input.password {
    -webkit-text-security: square !important;
    -moz-text-security: square !important;
    -o-text-security: square !important;
    text-security: square !important;
}

.registration .container {
    width: 100%;
    display: flex;
    padding: 0;
    height: 100%;
    max-width: none;
    justify-content: center;
}

.registration .registration-block {
    width: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

.registration .title {
    font-family: 'Inter-SemiBold';
    font-size: 24px;
    letter-spacing: -0.5px;
    padding: 54px 0 16px;
}

.registration .bg-white {
    background-color: #ffffff;
}

.bg-grey {
    background-color: rgba(24, 22, 22, 0.1);
}

.registration .black-btn,
.transaction .black-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 65px;
    padding: 0;
    margin: 26px 0 0 0;
}

.registration .black-btn:last-of-type {
  margin-bottom: 26px;
}

.registration-block__header,
.registration-block__help {
    text-align: left;
    width: 360px;
}

.registration-block__main {
    width: 100%;
}

.registration .black-btn:after,
.transaction .black-btn:after {
    transform: translateX(5px);
    content: url(../images/icons-arrow.svg);
    margin-left: 5px;
    margin-top: 5px;
    transition: 0.3s ease;
}

.registration .black-btn:hover:after,
.transaction .black-btn:hover:after {
    transform: translateX(10px);
    transition: 0.3s ease;
}

.registration form {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 360px;
    margin: 0 auto;
}

.registration .form-fields {
    width: 100%;
    text-align: center;
}

.registration .form-fields input {
    width: 100%;
    padding: 18px 14px;
    font-family: 'Inter-Regular';
    letter-spacing: -0.44px;
    font-size: 16px;
    color: #191716;
    border: 1px solid #d8d8d8;  
}

.registration .form-fields__input,
.order-form__input,
.account-info__input,
.support-form__input {
    position: relative;
    margin: 8px 0;
}

.registration .form-fields__input {
    margin-top: 16px;
}

.registration .placeholder,
.order-form__input .placeholder,
.account-info__input .placeholder,
.support-form__input .placeholder {
    color: #8a8989;
    position: absolute;
    top: 19px;
    left: 14px;
    width: calc(100% - 28px);
    background-color: #ffffff;
    transition: all .3s;
    font-size: 16px;
    text-align: left;
}

.registration .form-fields [type="date"] {
  display: block;
  min-height: 57px;
  -webkit-appearance: textfield;
  -moz-appearance: textfield;
  background-color: #ffffff;
}


.registration .form-fields__input input.up,
.order-form__input input.up,
.account-info__input input.up,
.support-form__input input.up {
    padding: 28px 14px 10px;
}

.registration .form-fields__input input.up + .placeholder,
.order-form__input input.up + .placeholder,
.account-info__input input.up + .placeholder,
.support-form__input input.up + .placeholder  {
    top: 8px;
    transition: all .3s;
    font-size: 12px;
}

.registration-block__help {
    padding-top: 25px;
    margin: 0 auto;
}

.registration-block__help p {
    padding-top: 7px;
    font-family: 'Inter-Regular';
    font-size: 16px;
    color: #191716;
}

.registration-block__help p a {
    cursor: pointer;
    border-bottom: 1px solid #191716;
}

.registration-block__help p a:hover {
    opacity: .7;
}

.registration-block.bg-grey .logo {
    width: 284px;
}

.registration-block.bg-grey p {
    font-family: 'Inter-SemiBold';
    letter-spacing: -0.5px;
    font-size: 24px;
    margin-top: 40px;
    width: 284px;
    text-align: center;
}

.transaction {
  height: 100vh;
  background-color: #ffffff;
}

.transaction .container {
  height: 100%;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  max-width: none;
}

.transaction__wrapper,
.transaction__main {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.transaction__main {
  background-color: #ffffff;
  padding: 20px 32px 32px;
  margin-top: 40px;
  max-width: 504px;
}

.transaction__header {
  margin-top: 24px;
}

.transaction__main .title {
  font-family: 'Inter-SemiBold';
  font-size: 24px;
  padding-top: 14px;
  color: #191716;
  letter-spacing: -0.5px;
  text-align: center;
}

.transaction__main p,
.transaction__footer  {
  font-family: 'Inter-Regular';
  font-size: 16px;
  color: #191716;
  padding-top: 14px;
  text-align: center;
}

.transaction__footer {
  font-size: 14px;
}

/*account page*/
.account-page .container {
  display: flex;
  align-items: stretch;
  justify-content: flex-start;
  height: 100%;
  min-height: calc(100vh - 120px);
}

.account-menu {
  width: 20%;
  border-right: 1px solid #d8d8d8;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  flex-direction: column;
  padding-top: 40px;
  padding-bottom: 32px;
}

.account-info {
  padding-left: 32px;
  padding-top: 40px;
  padding-bottom: 32px;
  width: 80%;
  flex: auto 1 1;
  display: flex;
  flex-direction: column;
  justify-content: stretch;
}

.account-menu__wrapper {
  width: 100%;
  border-bottom: 1px solid #d8d8d8;
}

.account-menu__email,
.account-info__title {
  font-family: 'Inter-SemiBold';
  font-size: 18px;
  color: #191716;
  letter-spacing: -0.5px;
}

.account-menu__email {
  padding-left: 12px;
  padding-right: 5px;
  word-wrap: break-word;
}

.account-menu__items {
  padding-top: 24px;
  width: 100%;
}

.account-menu__items span {
  font-family: 'Inter-Regular';
  font-size: 16px;
  color: #191716;
}

.account-menu__items li {
  cursor: pointer;
  padding: 12px 14px;
  width: calc(100% - 10px);
  margin-bottom: 7px;
  height: 52px;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  overflow: hidden;
}

.account-menu__items li a {
  display: flex;
  align-items: center;
}

.account-menu__items li svg {
  color: rgba(24, 22, 22, 0.1);
  width: 24px;
  margin-right: 5px;
}

.account-menu__items li:hover,
.account-menu__items li.active {
  background-color: rgba(24, 22, 22, 0.1);
}

.account-menu__items li:hover svg,
.account-menu__items li.active svg  {
  color: #191716;
}

.select-country-box__input-text {
  font-family: 'Inter-Regular';
  font-size: 16px;
  color: #191716;
  margin: 0;
  letter-spacing: -0.44px;
  display: none;
}

.account-menu button {
  border: 1px solid #d8d8d8;
  background-color: #ffffff;
  font-family: 'Inter-Regular';
  letter-spacing: -0.44px;
  font-size: 16px;
  color: #191716;
  padding: 10px;
  cursor: pointer;
  min-width: 80px;
  height: 52px;
  align-self: center;
}

.account-menu button:hover {
  opacity: .6;
}

main.account-page {
  padding: 30px 0px 70px;
}

.account-info .black-btn {
  margin-top: 24px;
}

.account-info__btn-container,
.support-form__btn-container {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 280px;
  max-width: 560px;
  width: 50%;
}

.account-info__table-item,
.account-info__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.account-info .price-col {
  text-align: right;
  flex: 75px 1 1;
  min-width: 75px;
  margin-left: 20px;
  overflow-wrap: break-word;
  font-family: 'Inter-Regular';
}

.account-info .purchase-col {
  flex: auto 1 1;
  overflow: hidden;
}

.account-info .status-col {
  text-align: left;
  flex: 112px 0 0;
  margin-left: 20px;
}

.status-col__value {
  border: 1px solid #d8d8d8;
  text-align: center;
  padding: 3px 5px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.account-info__header {
  position: relative;
  padding: 24px 0 8px;
}

.account-info__table {
  position: relative;
  flex: auto 1 1;
}

.account-info__outline {
  position: absolute;
  border-bottom: 1px solid #d8d8d8;
  bottom: 0;
  left: -32px;
  width: calc(100% + 32px);
}

.table-item__icon {
  border: 2px solid #191716;
  color:#191716;
  border-radius: 50%;
  width: 32px;
  height: 32px;
  min-width: 32px;
  display: flex;
  justify-content: center;
  align-items: center;
  text-transform: uppercase;
  overflow: hidden;
  white-space: nowrap;
  background-color: #ffffff;
  font-family: 'Inter-SemiBold';
  font-size: 16px;
  color: #191716;
  letter-spacing: -0.44px;
}

.account-info__header * {
  font-family: 'Inter-Regular';
  font-size: 12px;
  color: #191716;
  letter-spacing: -0.44px;
}

.account-info__table-item .purchase-col {
  display: flex;
  align-items: center;
}

.account-info__table-item  .table-item__name {
  padding-left: 20px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.account-info__table-item {
  padding: 24px 0;
  cursor: pointer;
}

.account-info__table-item:hover {
  opacity: .6;
}

.account-info__tabs {
  display: flex;
  align-items: center;
  justify-content: center;
  padding-top: 16px;
}

.account-info__tabs-separator {
  height: 22px;
  border-right: 1px solid #d8d8d8;
}
.account-info__tab.left {
  transform: rotate(180deg)
}

.account-info__tab {
  margin: 8px;
  cursor: pointer;
}

.account-info__tab:hover {
  opacity: .6;
}

.security-form {
  padding-top: 24px;
}

/* support page */

.support-form {
  padding-top: 24px;
}

.support-form__btn-container {
  padding-top: 24px;
}

.support-form textarea {
  margin: 8px 0;
}

/* empty cart*/
.empty-page__container {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  flex: 1 1 0;
}

.empty-page__description {
  padding-top: 16px;
}

.empty-page__container img {
  width: 140px;
}

.modal-search .empty-page__container img {
  width: 100px;
}

.modal-search .empty-page__description p:first-child {
  font-size: 18px;
}

.empty-page__description p {
  color: #191716;
  font-size: 16px;
  font-family: 'Inter-Regular';
  letter-spacing: -0.5px;
  text-align: center;
  padding-top: 8px;
}

.empty-page__description p:first-child {
  font-size: 24px;
}

.empty-page__description a:hover {
  border-bottom: 1px solid #191716;
}

@media (max-width: 1019px) {
    .container {
        padding: 20px 60px;
    }

    footer .container {
        padding: 83px 60px 70px;
    }

    main {
        padding: 50px 0px 40px;
    }

    .modal-search .container {
        width: 80%;
    }

    .modal-region__main ul:not(:first-of-type) {
        padding-left: 15px;
    }

    .container__title, .container__title_white, .container__title_white .yellow {
        font-size: 70px;
    }

    .philosophy__text {
        font-size: 52px;
    }

    .collections .container {
        flex-direction: column;
        padding: 100px 60px 20px;
    }

    .container__collection-item {
        width: 65%;
        margin: 25px auto;
    }

    .columns-wrapper__column:nth-of-type(n) {
        width: auto;
    }

    .text-line {
        margin: 0 -120px;
    }

    .registration-block.bg-grey p {
        width: 264px;
    }

    .registration-block.bg-grey .logo {
        width: 264px;
    }

    .registration form,
    .registration-block__header,
    .registration-block__help {
        width: 340px;
    }

    .account-menu {
      width: 30%;
    }

    .account-info {
      width: 70%;
    }
}

@media (max-width: 767px) {
    header {
        position: sticky;
        top: 0;
    }

    .filter.sticky {
        top: 58px;
    }

    main.products-page,
    main.privacy-page,
    main.return-page,
    main.one-product-page,
    main.cart-page,
    main.order-page {
        padding: 0px 0px 30px;
    }

    .products .container {
        padding-top: 0px;
    }

    .modal-region__main {
        flex-direction: column;
    }

    .modal-region {
        height: auto;
        transform: translateX(-100%);
        bottom: 0;
        position: fixed;
        overflow: auto;
    }

    .modal-search .container {
        display: none;
    }

    .modal-region__background.visible {
        display: block;
    }

    .columns-wrapper__column li {
        font-family: "Inter-Regular";
        padding: 10px 0;
        margin-left: 15px;
        border-bottom: 1px solid #ffffff;
    }

    .modal-region.visible {
        -webkit-transition: all 0.4s;
        transition: all 0.4s;
        transform: translateX(0);
    }

    .modal-region .modal-region__background-lines {
        display: none;
    }

    .modal-region__header .close-btn {
        top: 0;
    }

    .modal-region .title {
        font-size: 20px;
    }

    .modal-region__header .close-btn img {
        width: 16px;
        height: 16px;
    }

    .backgroun {
        display: none;
    }

    .modal-region__main ul {
        padding-left: 0;
    }

    .container {
        padding: 20px 40px;
    }

    .gallery, .rectangle {
        display: none;
    }

    main {
        padding: 0;
    }

    footer .container {
        padding: 53px 20px 50px;
    }

    .text-line {
        margin: 0 -100px;
    }

    .gallery .container__title {
        padding: 0px 30px;
    }

    .rectangle .container {
        padding: 0px 40px;
    }

    .rectangle .container_border {
        padding: 68px 40px 20px;
    }

    .container__title, .container__title_white, .container__title_white .yellow {
        font-size: 60px;
    }

    .philosophy__text {
        font-size: 42px;
    }

    .container__foto .foto-text {
        font-size: 28px;
    }

    .collection-item__text {
        font-size: 24px;
    }

    .foto-group .container {
        flex-direction: column;
    }

    .container__foto {
        width: 100%;
        padding-bottom: calc(100% * 0.972);
    }

    .collections .container {
        padding: 60px 40px 20px;
    }

    .container__collection-item {
        width: 80%;
    }

    .text-line__text {
        padding: 40px 0;
    }

    /*accordion*/
    footer .columns-wrapper {
        flex-direction: column;
    }

    footer input[type=radio] {
        display: none;
    }

    footer input[type=radio]:checked + label {
        color: #d8d8d86b;
    }

    footer label {
        width: 100%;
        display: block;
        cursor: pointer;
    }

    .accordion {
        width: 100%;
    }

    .accordion .column__title {
        position: relative;
        width: 100%;
        border-bottom: 1px solid #ffffff;
        cursor: pointer;
    }

    .accordion .column__title:active {
        opacity: 0.6;
    }
    
    
    @media(hover: hover) and (pointer: fine) {
        .accordion .column__title:hover {
            opacity: .6;
        }
    }

    .accordion .column__title::after {
        content: url('../images/plus-solid.svg');
        right: 0;
        bottom: 15px;
        display: block;
        position: absolute;
        transition: .2s;
    }

    .accordion .column__title[aria-expanded="true"]::after {
        transform: rotate(45deg);
        transition: .2;
    }

    .accordion .column__title:focus {
        opacity: .6;
    }

    .accordion .column__title[aria-expanded="true"] + ul {
        opacity: 1;
        max-height: 20em;
        -webkit-transition: all 200ms linear;
        transition: all 200ms linear;
        will-change: opacity, max-height;
    }

    .accordion ul {
        opacity: 0;
        max-height: 0;
        overflow: hidden;
        -webkit-transition: opacity 200ms linear, max-height 200ms linear;
        transition: opacity 200ms linear, max-height 200ms linear;
        will-change: opacity, max-height;
    }

    footer .accordion.language {
        display: block;
    }

    .modal-region__main .region__title {
        position: relative;
        width: 100%;
        border-bottom: 1px solid #ffffff;
        cursor: pointer;
        padding: 15px 0;
        border-bottom: 1px solid #d8d8d8;
    }

    .modal-region__main .region__title::after {
        content: url('../images/plus-solid-black.svg');
        right: 0;
        bottom: 15px;
        display: block;
        position: absolute;
        transition: .2s;
    }

    .modal-region__main .region__title[aria-expanded="true"]::after {
        transform: rotate(45deg);
        transition: .2;
    }

    .modal-region__main .region__title:hover, .modal-region__main .region__title:focus {
        opacity: .6;
    }

    .modal-region__main .region__title[aria-expanded="true"] + ul {
        opacity: 1;
        max-height: 120em;
        -webkit-transition: all 200ms linear;
        transition: all 200ms linear;
        will-change: opacity, max-height;
    }

    .modal-region__main .region ul {
        opacity: 0;
        max-height: 0;
        overflow: hidden;
        -webkit-transition: opacity 200ms linear, max-height 200ms linear;
        transition: opacity 200ms linear, max-height 200ms linear;
        will-change: opacity, max-height;
        width: 100%;
    }

    .modal-region__main ul li, .modal-region__main ul li:first-of-type {
        padding: 10px 0;
        margin-left: 15px;
        width: 100%;
        border-bottom: 1px solid #d8d8d8;
    }

    .modal-region__main .region:nth-of-type(n) {
        width: 100%
    }

    .modal-region__main .region:nth-of-type(n) {
        padding-left: 10px;
        padding-right: 10px;
    }

    /*burger*/
    body:after {
        background: #ffffff;
        content: '';
        height: 100%;
        left: 0;
        opacity: 0;
        overflow: auto;
        padding: 0;
        position: absolute;
        top: -100%;
        -webkit-transition: all 0.4s ease;
        transition: all 0.4s ease;
        width: 100%;
        z-index: 2;
    }

    body.open-burger {
        overflow: hidden;
    }

    body.open-modal header, body.open-modal main, body.open-modal footer {
        display: none;
    }

    body.open-burger:after {
        opacity: 1;
        top: 0;
        -webkit-transition: all 0.4s ease;
        transition: all 0.4s ease;
    }

    header .container {
        background-color: #ffffff;
        position: relative;
        z-index: 3;
    }

    .container__nav-bar {
        position: static;
    }

    .container__nav-bar .burger .nav_text {
        margin-left: 0px;
        border-bottom: 1px solid #d8d8d8;
        padding: 32px 0 15px;
    }

    .burger__menu {
        width: 100%;
        top: -100%;
        left: 0;
        position: absolute;
        padding: 20px 40px;
        transform: translateY(-100%);
        -webkit-transition: all 0.4s ease;
        transition: all 0.4s ease;
    }

    .open-burger .container__nav-bar .burger .burger__menu {
        display: flex;
        flex-direction: column;
        top: 100%;
        transform: translateY(0);
        -webkit-transition: all 0.4s ease;
        transition: all 0.4s ease;
    }

    .burger__button {
        display: block;
        cursor: pointer;
        width: 20px;
        height: 20px;
    }

    .burger__button:hover {
        opacity: .6;
    }

    .burger__search {
        display: flex;
        width: 100%;
        border: 1px solid #d8d8d8;
        align-items: center;
        padding: 3px;
    }

    .burger__search input {
        outline: none;
        border: none;
        background-color: transparent;
        font-family: 'Inter-Regular';
        font-size: 18px;
        padding: 3px 5px;
        width: 100%;
    }

    .burger__button_top, .burger__button_bottom {
        width: 20px;
        height: 1px;
        background-color: #191716;
        margin: 7px 0;
        transition: .3s;
    }

    .open-burger .burger__button .burger__button_top {
        transform: translateY(10px) rotate(45deg);
        margin: 0;
        transition: .3s;
    }

    .open-burger .burger__button .burger__button_bottom {
        transform: translateY(10px) rotate(-45deg);
        margin: 0;
        transition: .3s;
    }

    header .container__country {
        justify-content: flex-end;
        display: none;
    }

    header .container__nav-bar .logo img {
        width: 100px;
    }

    header .container {
        padding: 15px 40px;
    }

    header .container__nav-bar {
        padding-top: 0px;
    }

    .container__nav-bar .nav_icon.open-search-modal-btn, .container__nav-bar .nav_icon.account {
        display: none;
    }

    footer .country {
        display: flex;
        padding: 15px 0 10px;
    }

    .columns-wrapper__column:nth-of-type(n) {
        width: 100%;
    }


    /*product page*/
    .product-card {
        width: calc((100% - 20px) / 2);
        margin-top: 20px;
    }

    .product-card:not(:nth-of-type(3n + 1)) {
        margin-left: 0;
    }

    .product-card:not(:nth-of-type(2n + 1)) {
        margin-left: 20px;
    }

    .filter-btn {
        width: 30%;
    }

    .filter-title {
        width: 70%;
    }

    .modal-filter__main {
        flex-direction: column;
    }

    .modal-filter__main-item .title {
        position: relative;
        width: 100%;
        border-bottom: 1px solid #ffffff;
        cursor: pointer;
    }

    .modal-filter__main-item .title::after {
        content: url('../images/plus-solid-black.svg');
        right: 0;
        bottom: 0px;
        display: block;
        position: absolute;
        transition: .2s;
    }

    .modal-filter__main-item .title[aria-expanded="true"]::after {
        transform: rotate(45deg);
        transition: .2;
    }

    .modal-filter__main-item .title:hover, .modal-filter__main-item .title:focus {
        opacity: .6;
    }

    .modal-filter__main-item .title[aria-expanded="true"] + fieldset {
        opacity: 1;
        max-height: 16em;
        -webkit-transition: all 200ms linear;
        transition: all 200ms linear;
        will-change: opacity, max-height;
    }

    .modal-filter__main-item {
        width: 100%;
        padding: 20px;
        border-bottom: 1px solid #d8d8d8;
    }

    .modal-filter__main-item fieldset {
        opacity: 0;
        max-height: 0;
        overflow: hidden;
        -webkit-transition: opacity 200ms linear, max-height 200ms linear;
        transition: opacity 200ms linear, max-height 200ms linear;
        will-change: opacity, max-height;
    }

    .modal-filter__main-item:not(:first-of-type) {
        border-left: 0px solid #d8d8d8;
    }

    .modal-filter__main-item fieldset {
        padding-top: 0px;
    }

    .modal-background.filter-bg {
        top: 120px;
    }
    
    .one-product .container__product-block {
        flex-direction: column;
    }

    .one-product .left-column, .one-product .right-column {
        width: 100%;
    }

    .one-product .right-column {
        padding-top: 32px;
    }

    .one-product .container {
        padding: 10px 20px 20px;
    }

    .amount-info .amount-info__main {
        flex-direction: column;
    }

    .amount-info .photo {
        width: 70%;
        padding-bottom: calc(70% * 1.18);
    }

    .amount-info .info-wrapper {
        width: 100%;
        padding-top: 32px;
        padding-left: 0;
    }

    .subtotal .subtotal__item, .total .total__main,
    .shipping-adress__main, .purchase_buttons__main {
        padding-left: 0;
    }

    main.cart-page section.subtotal .container:after,
    main.cart-page section.total .container:after,
    main.cart-page section.shipping-adress .container:after {
        margin-left: 0px;
        width: 100%;
    }

    .order-page .input-with-description,
    .account-page .input-with-description,
    .support-form .input-with-description {
        flex-direction: column;
        width: 100%;
        align-items: flex-start;
    }

    .order-page .input-with-description .input-with-description__desc,
    .account-page .input-with-description .input-with-description__desc,
    .support-form .input-with-description .input-with-description__desc {
        padding-left: 0px;
        margin: 10px 0 18px;
    }

    .pay-btns__wrapper {
        width: 100%;
    }

    .registration-block.bg-grey {
        display: none;
    }

    .registration .container {
        justify-content: center;
        align-items: flex-start;
        background-color: rgba(24, 22, 22, 0.1);
    }

    .registration-block__header {
        margin-top: 53px;
    }

    .registration .title {
        padding: 36px 0 16px;
    }

    .registration .form-fields__input {
        margin-top: 14px;
    }

    .registration .title {
        padding: 36px 0 20px;
    }

    .registration .black-btn {
        margin: 23px 0 0 0;
    }

    .registration .black-btn:last-of-type {
      margin-bottom: 23px;
    }

    .registration-block__help {
        padding-top: 0px;
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
        background-color: rgba(24, 22, 22, 0.1);
    }

    .registration-block__help p {
        width: 340px;
        text-align: left;
    }

    .registration-block.bg-white {
        width: 100%;
    }

    .account-menu {
      border-right: 0px;
      flex-direction: row;
      align-items: flex-end;
      width: 100%;
      padding-top: 0px;
      padding-bottom: 0px;
      position: sticky;
      bottom: 0;
      background-color: #ffff;
      z-index: 1;
    }

    .account-menu__wrapper {
      border-bottom: 0px;
    }

    main.account-page {
      padding: 0px;
    }

    main.account-page .container {
      padding-bottom: 0px;
      min-height: calc(100vh - 50px);
      flex-direction: column-reverse;
    }

    .account-menu__items li svg {
      margin-right: 0px;
    }

    .account-menu__email {
      display: none;
    }

    .account-menu__items {
      display: flex;
      padding-top: 0px;
    }

    .account-menu__items li {
      margin-bottom: 0px;
      padding: 6px 10px;
      justify-content: center;
    }

    .account-menu__items li a {
      flex-direction: column;
    }

    .account-menu button {
      padding: 16px 10px;
    }

    .account-info {
      padding-left: 0px;
      width: 100%;
      padding-top: 10px;
    }

    .account-info__header__outline {
      left: 0px;
      width: 100%;
    }

    .account-info .price-col {
      flex: 65px 0 0;
      margin-left: 10px;
    }

    .account-info__table-item  .table-item__name {
      padding-left: 10px;
    }

    .account-info .status-col {
      flex: 75px 0 0;
      margin-left: 8px;
    }

    .account-info__table-item .table-item__name {
      padding-left: 8px;
    }

    .account-info__table-item {
      padding: 16px 0;
    }

    .account-menu__items span {
      text-align: center;
    }

    .account-menu button {
      margin-left: 8px;
    }

    footer {
      display: none;
    }

    .empty-page .container {
      min-height: calc(100vh - 58px);
    }

    .empty-page__container img {
      width: 100px;
    }

    .account-info__outline {
      left: -40px;
      width: calc(100% + 80px);
    }
}

@media (max-width: 479px) {
    .container {
        padding: 20px 20px;
    }

    header .container {
        padding: 15px 20px;
    }

    .rectangle .container {
        padding: 0px 20px;
    }

    .rectangle .container_border {
        padding: 68px 40px 20px;
    }

    .text-line {
        margin: 0 -80px;
    }

    .container__title, .container__title_white, .container__title_white .yellow {
        font-size: 40px;
    }

    .philosophy__text {
        font-size: 30px;
    }

    .container__philosophy {
        padding: 40px 10px;
    }

    .container__foto .foto-text {
        font-size: 22px;
    }

    .container__collection-item {
        width: 100%;
    }

    .collection-item__text {
        font-size: 20px;
    }

    .collections .container {
        padding: 50px 20px 20px;
    }

    .text-line__text {
        padding: 0 0 25px;
    }

    .burger__menu {
        padding: 20px;
    }

    .one-product-page .cart-block__title {
        font-family: 'Inter-SemiBold';
        letter-spacing: -0.5px;
        font-size: 26px;
        text-align: center;
        padding: 44px 0 24px;
    }

    .cart-product__name {
        display: none;
    }

    .container__cart-block {
        padding: 20px 0 0px;
    }

    .colors-form label {
        padding: 20px;
    }

    .amount .number {
        max-width: 56px;
    }

    .welcome-btn {
        margin: 5px 0;
    }

    .cart-block__product-image.first-image {
        margin-top: 34px;
    }

    .order-block__product .photo {
        display: none;
    }

    .order-block__product .info-wrapper {
        width: 100%;
        padding-left: 0;
    }

    .settings-block__title,
    .settings-block__subtitle,
    .order-block__one-order {
        width: 100%;
    }

    .settings-block__title, .order-block__title {
        font-size: 24px;
    }

    .order-main__form .input-with-description__desc,
    .order-form__input,
    .order-main__form textarea,
    .order-main__form .city-wrapper,
    .order-main__form .select-country-box,
    .account-info__form .input-with-description__desc,
    .account-info__input,
    .account-info__form textarea,
    .account-info__form .city-wrapper,
    .account-info__form .select-country-box,
    .account-info__btn-container,
    .support-form__input,
    .support-form textarea,
    .support-form .input-with-description__desc {
        width: 100%;
    }

    .registration form,
    .registration-block__header,
    .registration-block__help p {
        width: calc(100% - 40px);
        max-width: 340px;
    }

    .transaction__main {
      padding: 20px;
    }

    .account-menu__items span {
      display: none;
    }

    .account-menu__items li,
    .account-menu button {
      height: 43px;
      height: 43px;
      padding: 0px 10px;
      line-height: 43px;
      vertical-align: middle;
    }

    .account-menu button {
      margin-left: 5px;
    }

    .account-info__outline {
      left: -20px;
      width: calc(100% + 40px);
    }
}