@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=El+Messiri:wght@400;500;600;700&display=swap');



/*Обнуление*/
* {
    padding: 0;
    margin: 0;
    border: 0;
}

*,
*:before,
*:after {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

:focus,
:active {
    outline: none;
}

a:focus,
a:active {
    outline: none;
}

nav,
footer,
header,
aside {
    display: block;
}


body {
    height: 100%;
    width: 100%;
    font-size: 100%;
    line-height: 1;
    -ms-text-size-adjust: 100%;
    -moz-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
}

input,
button,
textarea {
    font-family: inherit;
}

input::-ms-clear {
    display: none;
}

button {
    cursor: pointer;
}

button::-moz-focus-inner {
    padding: 0;
    border: 0;
}

a,
a:visited {
    text-decoration: none;
}

img {
    vertical-align: top;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-size: inherit;
    font-weight: 500;
}


body {
    position: relative;
    font-family: 'Montserrat', sans-serif;
    font-size: 2.08vh;
    color: #000000;
}


h3 {
    font-style: normal;
    font-weight: normal;

    font-size: 2.49vh;
    line-height: 105.6%;
    color: #000000;
}

h4 {
    font-style: normal;
    font-weight: normal;
  
    font-size: 2.28vh;
    line-height: 105.6%;
    text-align: center;
    color: #000000;
}

h5 {
    font-style: normal;
    font-weight: normal;
 
    font-size: 1.66vh;
    line-height: 130%;
    color: #000000;
}

p {
    font-style: normal;
    font-weight: 300;
  
    font-size: 2.08vh;
    line-height: 150%;
    color: rgba(0, 0, 0, 0.85);
}

a.btn {
    background: #9AC6AD;

   
    border-radius: 0.72vh;

    font-weight: 600;

   
    font-size: 2.49vh;

    line-height: 83.8%;
    display: flex;
    align-items: center;
    text-align: center;
    color: #FFFFFF;
   
    padding: 2.185vh 3.333vw 2.49vh 3.333vw;

    transition: all .2s ease-in;
}

a.btn:hover {
   
    -webkit-box-shadow: 0px 0px 0px 0.31vh rgba(255, 255, 255, .7) inset;
    -moz-box-shadow: 0px 0px 0px 0.31vh rgba(255, 255, 255, .7) inset;
    box-shadow: 0px 0px 0px 0.31vh rgba(255, 255, 255, .7) inset;

    transition: all .2s ease-in;
}

a.btn-more {
    border: 0.1vh solid #9AC6AD;
    border-radius: 0.72vh;
    background: none;
    color: #9AC6AD;
    transition: all .2s ease-in;
}

a.btn-more:hover {

    -webkit-box-shadow: 0px 0px 0px 0.31vh #9AC6AD inset;
    -moz-box-shadow: 0px 0px 0px 0.31vh #9AC6AD inset;
    box-shadow: 0px 0px 0px 0.31vh #9AC6AD inset;

    transition: all .2s ease-in;
}

.product-title {
    font-weight: normal;
  
    font-size: 2.49vh;
    line-height: 130%;
    text-transform: uppercase;
    color: #000000;
  

    width: 100%;

    margin-bottom: 6.76vh;
    margin-left: 1.92vw;
    max-width: 100%;

    width: 100%;
    overflow: hidden;
    word-wrap: break-word;
}

.container {
    max-width: 83.854vw;
    width: 100%;
    margin: 0 auto;
}


.card-title {
    font-weight: normal;
    font-size: 2.289vh;
    line-height: 130%;
    text-transform: uppercase;
    text-align: center;
  
    margin-bottom: 2.70vh;
    word-break: break-word;

    
    max-height: 8, 51vh;
  
    height: 8.51vh;


    overflow: hidden;
    word-wrap: break-word;

}

.small-card-title {
    font-size: 2.08vh;
    line-height: 120%;
    font-weight: normal;
    text-transform: uppercase;
    text-align: center;
    word-break: break-word;
    overflow: hidden;
}

.block__title {
    font-family: El Messiri;
    font-style: normal;
    font-weight: normal;
    font-size: 7.49vh;
    line-height: 105.6%;
    text-align: center;
    letter-spacing: -0.03em;
    text-transform: uppercase;
    color: #373737;

   
    margin-bottom: 6.555vh;
}


.poster__title {
    font-weight: 300;
    font-size: 5.20vh;
    line-height: 105.6%;
    text-align: center;
    letter-spacing: -0.03em;
}

.price__block {
    font-weight: bold;
    font-size: 3.12vh;
    line-height: 130%;

    display: flex;
    align-items: center;
    justify-content: center;

    max-width: 10.416vw;
    width: 100%;

    
    margin-bottom: 3.329vh;

}

.discount {
    text-decoration-line: line-through;
    color: #636363;
   
    margin-right: 0.83vw;
}

.sale {
    color: #9AC6AD;
}


/* header */

.head {
    display: flex;
    align-items: center;
    justify-content: space-between;

    padding: 2.60vh 0 3.64vh 0;
}

.telephone {
    display: flex;
    align-items: center;
 
    font-size: 2.289vh;
  
    line-height: 2.809vh;
    color: #373737;
}

.telephone:hover {
    color: #98CBA1;
    transition: all .2s linear;
}

.telephone:hover svg{
    fill: #98CBA1;
    transition: all .2s linear;
}

.telephone svg {
  
    margin-right: 0.52vw;
    fill: #373737;
    transition: all .2s linear;
 
    width: 0.98vw;
 
    height: 1.97vh;
}

.head_logo svg {
    fill: #373737;
    width: 5.72vw;
    height: 8.07vh;
}


.head_buttons {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    max-width: 7.083vw;
    width: 100%;
    justify-content: space-between;
}

a.search svg, a.user svg, a.trash svg {
    stroke: #373737;
    transition: all .2s linear;
  
    width: 1.09vw;
  
    height: 2.18vh;
}

a.search:hover svg,
a.user:hover svg,
a.trash:hover svg {
    stroke: #98CBA1;
    transition: all .2s linear;
}


.trash {
    display: flex;
    background: none;
    font-weight: 500;

    font-size: 1.87vh;
    line-height: 2.289vh;
    color: #373737;
}

.trash svg {
    margin-right: 0.36vw;
}

/* head menu */

.head_menu_block {
    background: #373737;
}

.head_menu {
    font-weight: bold;
   
    font-size: 1.71vh;
    
    line-height: 2.08vh;

  
    padding: 2.289vh 0 2.08vh 0;
}

.head_menu ul li {
    list-style: none;
}

.head_menu ul {
    margin: 0;
    padding: 0;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.menu__item a {
    color: #fff;
    text-decoration: none;
    text-transform: uppercase;
    transition: all .2s ease-out;
}

.menu__item a:hover {
    color: #ababab;
   transition: all .2s ease-in;
}

.menu__item a:active {
    color: #98CBA1;
   transition: all .2s ease-in;
}

/* banner */

.main__banner {
    position: relative;
    background: url(../img/woman.png) no-repeat;
    background-size: cover;
    display: flex;
    justify-content: flex-end;
    flex-wrap: wrap;

  
    padding-right: 7.083vw;

    padding-bottom: 4.63vh;
}

.banner__logo {
    position: absolute;
    
    bottom: 11.966vh;
    
    left: 20.83vw;
   
    max-width: 25vw;
   
    max-height: 13.7vh;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.banner__logo img {
   
    margin-bottom: 1.248vh;
    width: 100%;
    object-fit: contain;
  
    max-width: 18.49vw;
}

.banner__logo p {
    font-weight: normal;
  
    font-size: 2.705vh;
    line-height: 105.6%;
   
    letter-spacing: 1.1vw;
    color: #272727;
    text-transform: uppercase;
}

/* items small */


.items-sm__block {

    display: flex;
    flex-wrap: wrap;

   
    max-width: 44.270vw;

    justify-content: space-between;
}

.items-sm__block a {
    color: #000000;
}

.item-sm-wrap {

    position: relative;

   
    max-width: 14.062vw;

   
    height: 29.03vh;

  
    padding-top: 6.139vh;

    width: 100%;
}

.item-sm-inner {


    height: 22.89vh;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end;

    text-align: center;

    background: linear-gradient(270deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 253, 253, 0.2) 100%);

   
    box-shadow: 0px 0.64vh 3.20vh rgba(0, 0, 0, 0.1);

    backdrop-filter: blur(20px);
    border-radius: 2.40vh;

    padding: 0 0.9375vw 3.121vh 0.9375vw;

}


.item-sm-img {
    position: absolute;
   
    top: -3.24vh;
    object-fit: contain;
   
    max-width: 5.2vw;
    width: 100%;
    height: 100%;
    transform: translate(15%, 0);

    max-height: 16.2vh;
}

/* posters */

.posters {
    padding-top: 15vh;
    padding-bottom: 16.6vh;
}

.posters__block {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.poster-item {

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;


    max-width: 26.5vw;

    width: 100%;

    height: 60.1vh;

    border: 0.093vh solid rgba(240, 240, 240, 0.8);

    border-radius: 1.389vh;

    font-weight: 300;
    font-size: 4.63vh;
    line-height: 105.6%;

    text-align: center;
    letter-spacing: -0.03em;
}

.poster-item:first-child {
    background: linear-gradient(180deg, #F7ECE8 0%, #E3C3B6 100%);
    opacity: 0.7;
}

.poster-item:nth-child(2) {
    background: linear-gradient(180deg, #D0EBD5 0%, #98CBA1 100%);
    opacity: 0.4;
}

.poster-item:last-child {
    background: linear-gradient(180deg, #EDDFCB 0%, #DBC3A0 100%);
    opacity: 0.4;
}


/* actions */

.actions {
    padding-bottom: 16.667vh;
}

.cards__block {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.card-item {
    max-width: 26.5625vw;
    width: 100%;

    height: 86.99vh;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end;

    padding: 3.95vh 2.81vw 9.36vh 2.81vw;

    overflow: hidden;

    margin-bottom: 5.20vh;

    border-radius: 1.56vh;

    transition: all .2s ease-in;
}


.card-item:hover {
    cursor: pointer;
    background: linear-gradient(180deg, rgba(248, 248, 248, 0.64) 0%, #F7F7F7 100%);
    transition: all .2s ease-in;
}

.card-image {

    margin-bottom: 5.5vh;
    border-radius: 1.38vh;
    overflow: hidden;
    height: 100%;
}

.card-image img {
    object-fit: contain;
    width: 100%;
    height: 100%;
}


/* novelities */

.novelties {
    background: rgba(255, 249, 247, 0.5);
   
    padding-top: 7.96vh;

    padding-bottom: 8.61vh;
}


.novelties .card-item:hover {
    cursor: pointer;
    background: linear-gradient(180deg, rgba(255, 249, 247, 0.9) 0%, rgba(255, 248, 246, 0.9) 100%);
    transition: all .2s ease-in;
}


/* sets */

.sets {
    padding-top: 7.96vh;
}

/* footer */

footer {
    background: #373737;
    padding: 7.7vh 0 7.7vh 0;
    margin-top: 9.81vh;
}

footer .telephone {
    color: #fff;
    margin-bottom: 2.4vh;
}

.footer_wrapper {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
}


.footer_logo svg {
    fill: #fff;
    width: 100%;
    height: 100%;
}

.footer_contacts {
    max-width: 15.625vw;
    width: 100%;
    display: flex;
    flex-direction: column;

    align-items: flex-end;
}

.footer_contacts .telephone svg {
fill: #FFFFFF;
}

.footer_contacts .telephone:hover svg {
    fill: #98CBA1;
    }

.footer_contacts p {
    font-weight: normal;

    font-size: 1.66vh;
    line-height: 150%;
    text-align: right;
    color: #FFFFFF;
}

.footer_menu ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;

    max-width: 39.06vw;
}

.f_menu-item {

    margin-bottom: 2.40vh;
    list-style: none;
    flex: 0 1 50%;
}

.f_menu-item a {
    font-weight: normal;
   
  

    font-size: 1.66vh;
    line-height: 2.03vh;

    display: flex;
    align-items: center;
    text-transform: uppercase;
    color: #FFFFFF;
    transition: all .2s ease-out;
}


.f_menu-item a:hover {
    color: #ababab;
   transition: all .2s ease-in;
}

.f_menu-item a:active {
    color: #98CBA1;
   transition: all .2s ease-in;
}

footer .btn_subscribe {
    margin-bottom: 2.40vh;
}

.btn_subscribe {

    max-width: 13.69vw;
    width: 100%;

    display: flex;
    align-items: center;

    text-align: center;

    padding: 1.38vh 0.78vw;
    border: 0.5px solid #9AC6AD;

    font-weight: normal;

    font-size: 1.24vh;
    line-height: 83.8%;

    color: rgba(255, 255, 255, 0.7);

    transition: all .2s linear;
}

.btn_subscribe:hover {
    background: #98CBA1;
    transition: all .2s linear;
}

.btn_subscribe svg {
    margin-left: 1.35vw;

    width: 1.61vw;

    height: 0.4vh;
}


/* catalog */

.page_wrapper {
    display: flex;
    flex-wrap: wrap;
    padding-top: 5.2vh;
}

.leftside {
    max-width: 26.7vw;

    width: 100%;

    margin-right: 2.08vw;
}

.categories_block {
    background: linear-gradient(270deg, rgba(238, 238, 238, 0.2) 0%, rgba(233, 232, 232, 0.2) 100%);

   
    border: 0.1vh solid rgba(154, 198, 173, 0.3);

    box-sizing: border-box;

    box-shadow: 0px 0.41vh 2.08vh rgba(0, 0, 0, 0.1);

    backdrop-filter: blur(20px);

    border-radius: 1.56vh;

    padding: 5.93vh 1.97vw 3.32vh 1.97vw;

    margin-bottom: 5.82vh;
}

.cat_item {
    list-style: none;
    text-transform: uppercase;
    font-weight: normal;

    font-size: 2.08vh;

    line-height: 120%;

    margin-bottom: 2.6vh;
}

.cat_item a {
    color: #000;
}

.cat_item a:hover {
    color: #9AC6AD;
}

.cat_item a:active {
    color: #9AC6AD;
}

.posters_side {
    display: flex;
    flex-direction: column;
    align-items: center;
    flex-wrap: wrap;
}

.posters_side .poster-item {
    max-width: 20.3vw;
    max-height: 51.9vh;
    margin-bottom: 5.2vh;
}

.content {
    max-width: 45.57vw;

    width: 100%;
}

.catalog_item {
    display: flex;
    align-items: center;

    max-width: 43vw;

    width: 100%;
    margin-bottom: 9.36vh;
}

.catalog_item-img {
    max-width: 12.5vw;
    width: 12.5vw;

    display: flex;
    justify-content: center;
    overflow: hidden;
}

.catalog_item-img img {
    vertical-align: top;


    max-height: 21.85vh;
    max-width: 12.5vw;

    height: 100%;
    width: 100%;
    object-fit: contain;
}

.cat_title {
    text-transform: uppercase;
    overflow: hidden;

    max-width: 30.2vw;

    word-break: break-word;
    width: 100%;
}

.cat_ml {
    font-size: 1.87vh;

    text-transform: uppercase;
    color: #000000;
    opacity: 0.5;

    max-width: 7.81vw;

    width: 100%;
    overflow: hidden;
    word-break: break-all;
}

.catalog_item .price__block {
    margin-top: 2.6vh;

    justify-content: flex-start;
}

.cat_but {
    display: flex;
}

.cat_but .btn {
    max-width: 11.45vw;

    width: 100%;
    text-align: center;
    justify-content: center;

    margin-right: 1.04vw;
}

/* catalog item page */

.maybe_block {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.maybe_side h4 {
    padding-top: 6.03vh;
    margin-bottom: 9.05vh;
}

.maybe_card {
    max-width: 15.9vw;
    max-height: 41.9vh;

    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;

    margin-bottom: 11.9vh;
}

.maybe_card .price__block {
    margin-bottom: 1.87vh;
}

.maybe_card a.btn {
    justify-content: center;
}

.maybe_card-img {
   
    max-width: 11.35vw;
    max-height: 20.2vh;

    overflow: hidden;

    margin-bottom: 3.12vh;

    width: 100%;
    height: 100%;
}

.maybe_card-img img {

    max-width: 11.35vw;
    max-height: 20.2vh;

    width: 100%;
    object-fit: contain;
}

.maybe_card-name {
    text-align: center;

    font-size: 1.87vh;

    overflow: hidden;
    word-wrap: break-word;

    max-width: 14.58vw;

    width: 100%;
}

.maybe_card-ml {
    text-align: center;

    font-size: 1.66vh;

    color: #000000;
    opacity: 0.5;
    overflow: hidden;
    word-wrap: break-word;

    max-width: 14.58vw;

    width: 100%;

    margin-bottom: 1vh;
}


/* */

.products {
    margin-bottom:  7.80vh;
}

.products-images {
    display: flex;
    align-items: center;
    position: relative;

    margin-right: 4.16vw;
}

.products-slider {
    max-width: 12.5vw;
    width: 12.5vw;
    height: 21.85vh;
}

.product-item {
    max-width: 12.5vw;
    width: 12.5vw;

    display: flex;
    justify-content: center;
    overflow: hidden;
}

.product-item img {
    max-width: 12.5vw;
    max-height: 21.85vh;

    height: 100%;
    width: 100%;
    object-fit: contain;
}

.slick-list {
    padding: 0 !important;
}

.product-slider_small {
    max-width: 6.5vw;
    width: 6.5vw;
    height: 18.1vh;
    
}

.product-small-item {
    max-height: 8.32vh;
    max-width: 6.5vw;
    height: 100%;
    width: 100% !important;
    object-fit: contain;
    border: 0.1vh solid #F6F6F6;
    border-radius: 0.7vh;
    margin-bottom: 1.45vh;
    display: flex !important;
    justify-content: center;
    padding: 7px 0 7px 0;
}

.product-small-item.slick-current {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.64) 0%, #F7F7F7 100%);
    border: 0.1vh solid #9AC6AD;
    transition: all .2s linear;
}

.product-small-item:hover {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.64) 0%, #F7F7F7 100%);
    border: 0.1vh solid #9AC6AD;

    cursor: pointer;
    transition: all .2s linear;
}

.product-small-item img {
    /* max-width: 60px;
    max-height: 64px; */

    max-width: 3.125vw;
    max-height: 6.659vh;

    height: 100%;
    width: 100%;
    object-fit: contain;
}

.products_wrap {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

.product_ml {
    font-size: 1.87vh;

    line-height: 130%;
    text-transform: uppercase;
    color: rgba(0, 0, 0, 0.8);

    margin-bottom: 3.12vh;
}

.products .price__block {
    margin-bottom: 4.57vh;
}

.products_btns {
    display: flex;
    align-items: center;
}

.products_btns .btn {
    margin-right:  1.35vw;
}

a.btn-favourites svg {
    width:  1.4vw;
    height: 2.39vh;
}

.btn-favourites {
    stroke: #9AC6AD;
    fill: #fff;
    transition: all .2s linear;
}

.btn-favourites:hover {
    fill: #9AC6AD;
    transition: all .2s linear;
}


.products_article {
    padding-left: 2.6vw;
}

.products_article p {
    margin-bottom: 4.68vh;
    overflow: hidden;
    word-break: break-all;
}

.art-title {
    margin-bottom: 1vh;
    overflow: hidden;
    word-break: break-all;
}

.art-num {
    margin-bottom: 2vh;
    overflow: hidden;
    word-break: break-all;
}

ul.composition {
    font-style: normal;
    font-weight: 300;

    font-size: 2vh;

    line-height: 159.5%;
    color: rgba(0, 0, 0, 0.85);

    margin-bottom: 4.68vh;
}


ul.composition li {
    list-style: none;
}

ul.composition li::before {
    content: '•';
    margin-right: 1.04vw;
}


/* spoiler */

.spoiler {
    margin-bottom: 4.68vh;
}

.spoiler_name {
    display: flex;
    margin-bottom: 0.5vh;

    font-weight: normal;

    font-size: 2.49vh;

    line-height: 105.6%;
}

.spoiler_name:hover {
    cursor: pointer;
}

.spoiler_name.spoiler_opened span::before {
    transform: rotate(45deg);
    transition: all .2s ease-in;
}

.spoiler_name.spoiler_opened span::after {
    transform: rotate(-45deg);
    transition: all .2s ease-in;
}

.spoiler_name span {
    position: relative;

    margin-left: 1.3vw;
}

.spoiler_name span::before,
.spoiler_name span::after {
    content: '';

    width: 0.52vw;
    height: 0.1vh;

    background: #000;
    position: absolute;

    top: 1.45vh;

    transition: all .2s ease-out;
}

.spoiler_name span::before {
    transform: rotate(-45deg);
    left: 0.36vw;
}

.spoiler_name span::after {
    transform: rotate(45deg);
    left: 0;
}


.spoiler_text {
    display: none;
}


