/* ____________________ОБГОРКА________________ */

.wrapper {
    min-height: 100%;
    display: flex;
    flex-direction: column;
     overflow: hidden; 
    margin: 0px auto;
}

.main {
    flex: 1 1 auto;
}

.container {
    max-width: 1818px;
    margin: 0 auto;
    padding: 0px 15px;
    box-sizing: content-box;
}


.container--right {
   
    padding-left: calc((100% - 1848px)/2 + 15px);
    
}
.container--left {
   
    padding-right: calc((100% - 1848px)/2 + 15px);
    
}

/*-------------------BURGER---------------------*/

.header__burger {
    display: none;
    position: relative;
    width: 30px;
    height: 20px;
    z-index: 3;
    right: 1.666em;
}


.header__burger::before,
.header__burger::after {
    content: '';
    background-color: #44C697;
    position: absolute;
    width: 100%;
    height: 2px;
    left: 0;
    transition: all 0.2s ease 0s;
}
.header__burger span {
    background-color: #44C697;
    position: absolute;
    width: 100%;
    height: 2px;
    left: 0;
    top: 9px;
}
.header__burger::before {
    top: 0;
}
.header__burger::after{
    bottom: 0;
}
.header__burger.burger__active:before {
    transform: rotate(45deg);
    top: 9px;
}
.header__burger.burger__active:after {
    transform: rotate(-45deg);
    bottom: 9px;
}
.header__burger.burger__active span {
 transform: scale(0);
}
body.lock {
    overflow: hidden;
}
/* ------------------------------------------------------ */


.header {
    background: #FFFFFF;
    text-transform: uppercase;
    padding: 0.83em 0;

}

.header__nav-top {
    padding-bottom: 0.55em;
    border-bottom: 1px solid rgba(30, 46, 54, 0.6);
}
.header .container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    column-gap: 0.8333em;
    flex-wrap: wrap;
}
.contacts {
    display: flex
}
.header__contacts {
    column-gap: 2.777em;
    align-items: center;


}
.contacts__soc-networks {
    display: flex;
    column-gap: 0.2777em;
    text-transform: none;
    align-items: center;
}
.soc-networks__icons {
    display: flex;
    column-gap: 0.2777em;
}
.fa-brands.fa-telegram, .fa-brands.fa-facebook-f, .fa-brands.fa-instagram {
    width: 2em;
    height: 2em;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 0.111em transparent;
}
.soc-networks__icons {
    transition: all 0.3s ease-in;
}
.soc-networks__icons a:hover {
    color: #44C697;
}

.soc-networks__icons a:focus {
   outline:0.0555em solid rgb(36, 119, 87);
    box-shadow: 0.5555em solid #44C697;
}


.contact__telephones {
    padding: 0.2777em 0 0.2777em 0px; 
    position: relative;
    border-bottom: 0.1111em solid transparent;
    transition: all 0.3s ease-in;
    align-items: center;
    display: flex;
}
.contact__telephones::before {
    content: url('../img/header/smartphone.svg');
    bottom: 0px;
    left: -25px;
    position: absolute;

}
.contact__telephones__arrow {
    position: relative;
    right: 0.1111em;
    transition: 0.3s;
}
.contact__telephones:hover .contact__telephones__arrow {
    transform: translateY(0.1111em);
}
.contact__telephones.active .contact__telephones__arrow {
    transform: rotate(180deg);
}
.contact__telephones--hover {
    display: none;
    background: #fff;
    transition:color 0.3s;
    border-bottom: 0.11111em solid transparent;
    flex-direction: column;
    row-gap: 0.5em;
    position: absolute;
    top: 1.94444em;
    left: 0;
    padding-bottom: 20px;
    z-index:  100;
}
.contact__telephones__telephone {
    border-bottom: 0.1111em solid transparent;
    transition: color 0.3s;
}
.contact__telephones:hover .contact__telephones__telephone--active {
     color: #44C697;
}
.mouse .contact__telephones:hover .contact__telephones--hover{
    display: flex;     
    
}

.mouse .contact__telephones__telephone:focus {
    border-bottom: 0.1111em solid #44C697
}

.contact__telephones__telephone--hover:hover {
     color: #44C697
}

.active .contact__telephones--hover{
    display: flex;     
    flex-direction: column;
    row-gap: 0.5em;
    position: absolute;
    top: 1.94444em;
    lef: 0;    
}
.active .contact__telephones__arrow {
    transform: rotate(180deg);
}

.nav-menu {
    display: flex

}
.header__nav-menu {
    column-gap: 0.8333em;
    top: -100%;

}
.nav-menu__item {
    transition: 0.2s ;
}
.nav-menu__item:hover {
    color:  #44C697;
}
.nav-menu__item a {
    transition: opacity 0.2s;
}
.mouse .nav-menu__item a:focus {
    padding-bottom: 0.1111em;
   border-bottom: 0.1666em solid #44C697;
   opacity: 0.7;

}

.nav-menu__item--active a {
    padding-bottom: 0.1111em;
    border-bottom: 0.1666em solid #44C697;
}
.header__nav-bottom {
    padding-top: 0.83333em;
}

.menu-assortment {
    display: flex;

}
.header__menu-assortment {
    column-gap: 0.83333em;

}
.menu-assortment__item {
    transition: 0.3s;
    border-bottom: 0.1111em solid transparent;
    display: flex;
    column-gap:0.2777em;
    position: relative;
}
.menu-assortment__item a{
    transition: 0.3s;
    border-bottom: 0.1111em solid transparent;
    
}

.menu-assortment__item:hover {
    color:#44C697 ;

}
.mouse .menu-assortment__item a:focus {
    border-bottom:  0.1111em solid #44c697;
    opacity: 0.7;
}
.fa-chevron-down {
    transition: 0.3s;
}
.mouse .header__menu-assortment .fa-chevron-down:hover{
    transform: translateY( 0.1111em);
}
.menu-assortment--hover {
    display: none;
    position: absolute;
    left: 0;
    top: 1.1111em;
    padding-top: 1.666em;
    z-index: 100;
    width: 7.777em;


}
.menu-assortment--hover li { 
    background: #44c697;
    color: #fff;
    padding: 1.1111em 1.1111em;
    transition: 0.2s;
    box-shadow: 0 0 15px #fff;
}
.mouse .menu-assortment--hover li:hover { 
    color: #000;
}


.mouse .menu-assortment__item:hover .menu-assortment--hover{
    display: block;
}
.mouse .menu__open .menu-assortment__item:hover .menu-assortment--hover{
    display: block;
    padding-top: 0px;
}
.open .menu-assortment--hover{
    display: block;
}

.open .fa-chevron-down {
    transform: rotate(180deg);
}
.menu-assortment__item__open {
    cursor: pointer;
    display: block;
}

.logo {
    transition: 0.3s;
}
.logo:hover {
    opacity: 0.7;
}
.header_logo  {
    width: 20em
 
 }
.header_logo img {
   width: 100%

}
.assortment {
    display: none;
    transition: 0.3s;
    position: relative;
    cursor: pointer;
}
.assortment:hover {
    opacity: 0.5;
}

.menu__open .menu-assortment__open {
    transform: rotate(180deg);
}
.menu__open .header__menu-assortment {
    display: flex;
    position: absolute;
    top: 110%;
    left: 15px;
    background: #fff;
    
}
.menu-assortment__item.open {
    flex-wrap: wrap;
}
.menu__open .header {
    position: relative;
}
.menu__open .main {
    padding-top: 0;
}

/*-------------BUTTON----------------*/
.header__buttons {
    display: flex;
    column-gap: 1.666em;
    align-items: center;

}
.basket__btn {
    transition: 0.3s;
    border:  0.1111em solid transparent;
    position: relative;
    padding: 0.5em 0;
    display: flex;
    align-items: center;
    column-gap: 0.27777em;
    padding-left: 1.95em;
    background: url('../img/header/shopping-cart.svg') 0 0.2777em/1.6666em no-repeat;
}


.basket__btn:hover {
    color: #44C697;
    
}
.basket__btn:focus {
    border:  0.1111em dotted #44C697;
}
.btn {
    background: #44C697;
    border-radius: 0.16666em;
    color: #ffffff;
    padding: 0.7777em 2.5555em;
    transition: all 0.3s ease-in-out;
    border:  0.1111em solid transparent;
}
.header__btn {

}
.btn:focus {
    background: #ffffff;
    color: #44C697;
    border:  0.1111em solid #44C697;
}
.btn:hover {
    opacity: 0.7;
    border:  0.1111em solid rgb(40, 67, 57);
}


/*--------------FOOTER---------------*/
.footer {
    background: #1E2E36;
    color: #fff;
    position: relative;
}
.footer .container--right {
    display: flex;
    position: relative;
}
.footer__content {
    display: flex;
    flex-direction: column;
    padding: 2.7777em 3.11111em 0.7222em 0px;
    width: 43.333em;
}
.footer_logo {
    max-width: 20em;
    margin-bottom: 2.7777em;
    
}
.footer_logo img {
    width: 100%;
}

.footer__content__row {
    display: flex;
    margin-bottom: 4.61111em;
    flex: 1 1 auto;
}
.footer__menu-assortment {
    display: flex;
    flex-direction: column;
    grid-row-gap: 0.83333em;
    margin-right: 3.0555em;
    text-transform: uppercase;
}

.footer .menu-assortment__item, .footer .nav-menu__item {} {

}
.footer .menu-assortment__item::before, .footer .nav-menu__item::before {
    content:"—";
    color: #44C697;
    margin-right: 0.27777em;
   

}


.footer .menu-assortment__item:hover:before {
    color: #fff;
   
}
.footer .nav-menu__item:hover::before {
    color: #fff;
    
}
.footer__nav-menu {
    display: flex;
    flex-direction: column;
    grid-row-gap: 0.83333em;
    margin-right: 4.83333em;
    text-transform: uppercase;
    
}
.footer .nav-menu__item {
    width: 13.8em;
}

.footer__contacts {
    display: flex;
    flex-direction: column;
    grid-row-gap: 0.83333em;
    width: 12.222em;
}
.contacts {}
.contacts__adress {

    font-weight: 400;
}
.contacts__adress::before {
    content:url('../img/footer/adress.svg');
    margin-right: 0.555em;
    width: 1.333em;    
}
.contacts__schedule {
    font-weight: 400;
}
.contacts__schedule::before {

    content:url('../img/footer/grafic.svg');
    margin-right: 0.555em;
    width: 1.333em;    
}
.footer .contact__telephones {
    margin-bottom: 1.6666em;
    display: flex;
    flex-direction: column;
    grid-row-gap: 0.27777em;
    color: #44C697 ;
    margin-left: 27px;
    padding: 0;
    align-items: flex-start;
    
}
.footer .contact__telephones:before {
    content: url(../img/footer/telephone.svg);
    top: 0;
    width: 1.333em;
    margin-right: 0.555em;
}

.footer .contact__telephones__telephone {
    transition: 0.3s;
    border-bottom:  0.1111em solid transparent;
}
.footer .contact__telephones__telephone:hover {
    color: #fff;
}
.footer .contact__telephones__telephone:focus {
    opacity: 0.6;
}



.footer .contacts__soc-networks {
    flex-direction: column;
    gap: 0.27777em;
    align-items: flex-start;
    font-weight: 400;

}
.footer__content__row--bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    column-gap: 1.1111em;
    font-weight: 400;
    
}
.copiright--left {}
.copiright--right {}
.copiright--right::before {
     content:url('../img/footer/copiright.svg');
     margin-right: 0.27777em;
   

}
.footer__img {
    width: 59.375vw;
    object-fit: cover;
    
}
.scrol-up {
    color: #fff;
    width: 50px;
    height: 50px;
    display: none;
    /* display: flex; */
    align-items: center;
    justify-content: center;
    background: #44C697;
    box-shadow: 0px 4px 12px rgb(130 130 130 / 20%);
    border-radius: 50%;
    position: absolute;
    top: -10px;
    left: 45px;

}
.show.scrol-up {
    display: flex;
    z-index: 100;
   
}
/* ------------------------SLIDER--------------------------------- */


.slickslider__text__item{
 
  padding: 5.5555em 1em 6.3em 1em;
  text-align: center;
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.slickslider__text__item .slick-slide {
    width: 100%;
    margin-right: 10px;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.slickslider__title {
    margin-bottom:0.78125em;


}
.slickslider__subtitle {
    margin-bottom: 0.2777em;
    display: block;
}
.slickslider__deskription {
    margin-bottom: 0.8333em;
    display: inline-block;
    text-align: center;
    max-width: 8.694em;
}
.slickslider__btn {
   text-transform: uppercase;
   
    display: inline-block;
}
.slickslider__img.slick-slider {
    width: 100%;
    position: relative;
    z-index: 0;
    
   
}

.slickslider__img__item{
    width: 100%;    
    object-fit: cover;
    background: rgb(199, 237, 215)

    
}
.slickslider__img__item img{
    width: 100%;    
    object-fit: cover;
    min-height: 43.6111em;
    
}
.slider__buttons {
    position: relative;
    z-index: 2;
    top: -4.555em;
    padding-bottom: 1em;
    display: flex;
    flex-direction: column;
    align-items: center;
   
}

.slick-next:hover, .slick-prev:hover,.slick-next:focus, .slick-prev:focus{ 
    background: url('../img/Slider_top/Right.svg')0 0/cover no-repeat;
}
.slick-next, .slick-prev{
   
   width: 30px;
   height: 30px;
   background: url('../img/Slider_top/Left.svg')0 0/cover no-repeat;
   font-size: 0;
   cursor: pointer;
   
    
}
.slick-prev{
   
    z-index: 1;
    transform: rotateY(180deg);
}
.slickslider__text.slick-slider{
    width: 100%;
    position: relative;
    top: 0;

   
}
.slick-list {
    width: 100%;

}
.slickslider__img .slick-track{
    max-height: 785px;
    height: 100%;
}
.slickslider__text .slick-track{
    max-height: 670px;
   
}

.slider__top {
    position: relative;
}
.slider__wrapper--absolute {
    position: absolute;
    top: 0;
    width: 100%;
    max-width: 25.6666em;
    font-size: calc(12px + 6 * ((100vw - 320px)/(1920 - 320)));
    background: #FFFFFF;
   border-left: 0.8333em solid #44C697;
    width: 100%;

}
.slider__counter {
    text-align: center;
    margin-bottom: 5px;
   
}


/* ----------------------------ADVANTAGES-------------------------------------- */

.advantages {
    margin-top: 5.5555em;
    
    

}
.advantages__content {
    position: relative;
}
.title {
    position: relative;
    text-align: center;
    

}
.title::before {
    content: '';
    position: absolute;
    top: 3px;
    z-index: -1;
    width: 0.4166em;
    height: 1.041em;
    background: #44c697;
}
.advantages__title {
    margin-bottom: 1.08333em;
}
.advantages__slider {
    display: flex;
    justify-content: center;
}
.advantages__item {
    max-width: 586px;
    position: relative;
    -webkit-transition: 0.2s;
    -moz-transition: 0.2s;
    transition: 0.2s;
    position: relative;
    margin: 0 auto;
}

.advantages__item:hover .advantages__item__text {
opacity: 1;

}

.advantages__item__img img{
   object-fit: cover;
    width: 100%;
    height: 100%;
    max-width: 526px;
    max-height: 350px;
    

}
.advantages__item__img {
    position: relative;
}
.advantages__item:hover::before {
    content: "";
    position: absolute;
    background-color: rgba(0, 0, 0, 0.3);
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    opacity: 1;
    z-index: 2;
    width: 100%;

}
.advantages__item__content {
    padding:0 1.6em;
    position: absolute;
    color: #fff;
    bottom: -2em;
    transition: 0.2s;

}
.advantages__item__title {
    border-bottom: 0.08333em solid #44C697;
    margin-bottom: 0.5em;
    display: inline-flex;
}
.advantages__item__text {
    opacity: 0;
}
.advantages__item:hover .advantages__item__content{
    transform: translateY(-3.5em);
    z-index: 5;

}
.advantages__item:focus .advantages__item__content{
    transform: translateY(-3.5em);
    z-index: 5;

}
.advantages__slider .slick-slide {
    width: 586px;
    margin-right: 30px;
   
}
.advantages__btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 100%;
    color: #fff;
   
}
.btn__prev, .btn__next{
    position: absolute;
    border: 1px solid #fff;
    border-radius: 50%;
    width: 30px;
    height: 30px;
    text-align: center;
    padding: 4px 0;
    background: transparent;
    transition: 0.3s;
  
}
.btn__prev {
    left: 15px;
}
.btn__next{
   
    right: 15px;
    
 
 }
 .btn__prev:hover, .btn__next:hover, .btn__prev:focus, .btn__next:focus {
    background: #fff;
    color: #1E2E36;
    border: 1px solid #1E2E36;
 }



 /* -------------------PRODUCT-CATEGRIES------------------------------------------- */

 .product-categories {
    margin-top: 5.5555em;
    margin-bottom: 5.5555em;
}
.product-categories .container {
    display: flex;
    flex-direction: column;
}
.product-categories__title {
    margin-bottom: 1.041em;

}
.product-categories__categories {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    align-items: center;
    justify-content: space-around;
    gap: 2em;
    margin-bottom: 4.6666em;

}
.categories {
}
.categories__item {
    display: flex;
    flex-direction: column;
    grid-row-gap: 0.5555em;
    align-items: center;
    border-bottom: 3px solid transparent;
    text-transform: uppercase;
    /* transition: 0.2s; */
    cursor: pointer;
}
.categoriees__icon {
   font-size:  calc(35px + 65 * ((100vw - 320px)/(1920 - 320)));
   transition: color 0.3s;
}

.categories__name span{
   
}
 .categories__item:hover {
    
    border-bottom: 3px solid #44C697;
   
}
 .categories__item:hover .categoriees__icon {
    
   color: #44C697;
   
}


.categories__item--active {
    
    border-bottom: 3px solid #44C697;
}
.categories__item--active .categoriees__icon {
    color: #44c697;
}


.product-categories__products {
    display: flex;
    flex-wrap: wrap;
    column-gap: 30px;
    grid-row-gap: 2.777em;


}
.products {
    margin-bottom: 2.7777em;

}
.products__card {
    flex: 1 1 586px;
    cursor: pointer;
    position: relative;
    transition: 0.3s;
}

.products__img {
    width: 100%;
    object-fit: cover
}
.products__info {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.625em;
    text-transform: uppercase;
}
.products__name {
}
.products__price {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    column-gap: 10px;
}
.price__new {
    color: #FF1B1B;

}
.price__old {
    color: #BCBDBB;
    text-transform: uppercase;
    text-decoration: line-through;
}
.products__card__badge {
   
    color: #fff;
    text-transform: uppercase;
    position: absolute;
    left: 0;
    top: 0.555em;
    display: flex;
    flex-direction: column;
    grid-row-gap: 5px;

}
.badge__new, .badge__hit {
    background: #1E2E36;
    padding: 0.2777em 0.83333em;
    
}
.badge__hit {

}
.badge__action {
    background: #FF1B1B;
    padding: 0.2777em 0.83333em;
}
.mouse .products__card:hover  {
    
    transform: translateY(-15px)
}
.products__card:hover .products__info {
    background: #44c697;
    color: #fff;
}
.products__card:hover .price__new {
    color: #fff;
}
.products__card:hover .price__old {
    color: #fff;
}
.products__card:focus .products__info {
    background: #44c697;
    color: #fff;
}
.products__card:focus .price__new {
    color: #fff;
}
.products__card:focus .price__old {
    color: #fff;
}
.product-categories__btn {
    text-transform: uppercase;
    display: block;
    margin: 0 auto;
}

/*------------------------ABOUT-US------------------*/

.about-us {
    margin-bottom: 5.5555em;
}
.container--right {}
.about-us__title {
     margin-bottom: 1.041em;
}

.about-us__content {
    display: flex;
    padding: 5.555em 0;
    background: url('../img/about-us/Rectangle 174.jpg')top right/contain no-repeat;
}
.about-us__article {
    display: flex;
    flex-direction: column;
    grid-row-gap: 0.8333em;
    background: #fff;
    padding: 2.77777em 1.666em 2.7777em 0;
    border-right: 0.833333em solid #44C697;
    border-radius: 0px 3px 3px 0px;
    max-width: 43.8889em;
    font-weight: 400;   
}
.about-us__article span{
        color: #44C697;
        text-transform: uppercase;
        font-weight: 700;
}


/*-----------------ASK-US-------------------------*/

.ask-us {
     margin-bottom: 5.5555em;
}
.container--left {}
.ask-us__title {
     margin-bottom: 1.041em;
}

.ask-us__content {
    display: flex;
    justify-content: flex-end;
    padding: 5.555em 0 6.5556em 0;
    background: url('../img/ask-us/Rectangle 175.jpg')top left/contain no-repeat

}

.ask-us__form {
    display: flex;
    flex-direction: column;
    grid-row-gap: 1.6666em;
    background: #fff;
    padding: 2.77777em 0 2.7777em 1.666em;
    border-left: 0.833333em solid #44C697;
    border-radius: 0px 3px 3px 0px;
    max-width: 29.4em;
    width: 100%;
    
}
.form__title {}
.form__consultation {
    width: 100%;  
    display: flex;  
    flex-direction: column;
    grid-row-gap: 0.8333em;

    
}
.form__consultation input   {
    background: #FFFFFF;
    padding: 0.833333em;
    border: 1px solid #1E2E36;
    border-radius: 3px;
}
.form__consultation input:focus {
    outline: 2px solid #44C697;
    box-shadow: 0 0 10px  #000;
}

.form__btn {
    text-transform: uppercase;  
}

.ask-us__text {
    font-weight: 400;   
    max-width:20.94444em;
}
.ask-us__text span {
    font-weight: 700;   
}
