/*
*  Main Slider Block Styles
*/

span.main-slider__first-title,
span.main-slider__second-title {
  display: block;
}

span.main-slider__second-title {
  padding-top: 1.1rem;
  min-height: 99px;
}

.main-slider__btn span {
  border: solid 2px #ffffff;
  justify-content: center;
}



.main-slider__text {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: start;
  height: 65rem;
  max-height: 65rem;
  position: relative;
  z-index: 20;
}

.main-slider__inner {
  display: block;
  height: 100%;
}


img.slider-image.active {
  display: block;
  visibility: visible;
  height: auto;
  max-height: unset;
  opacity: 1;
  left: 0;
  transition: left 0.8s cubic-bezier(0.39, 0.58, 0.57, 1);
  position: absolute;
}


img.slider-image {
  display: block;
  width: auto;
  height: auto;
  position: relative;
  top: 30px;
  left: 120%;
  max-width: 500px;
  object-fit: cover;
  visibility: hidden;
  opacity: 0;
  transition: left 0.8s cubic-bezier(0.39, 0.58, 0.57, 1);
}

.main-slider__image {
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  z-index: 30;
  left: 660px;
  top: 50px;
}

.main-slider__btn {
  display: block;
  width: 100%;
  text-align: center;
  padding-top: 6rem;
}
.main-slider__btn a {
  width: 100%;
}
span.slider-count {
  display: inline-block;
  width: 30px;
  height: 30px;
  border-bottom: solid 2px #ffffff;
  position: relative;
  bottom: 10px;
  cursor: pointer;
}

span.slider-count.active {
  border-bottom: solid 2px #009fe3;
}



span.prev-img,
span.next-img {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 60px;
  height: 60px;
  font-size: 50px;
  cursor: pointer;
}

.main-slider__controls {
  position: relative;
  margin-top: 130px;
}

.main-slider__text-title.active {
  display: block;
  position: relative;
  opacity: 1;
  visibility: visible;
  transition: opacity 1.5s ease;
}

.main-slider__text-title {
  position: absolute;
  opacity: 0;
  visibility: hidden;
  width: 50%;
  top: 80px;
}

.main-slider__controls-wrapper {
  display: flex;
  align-items: flex-end;
  max-width: 20rem;
  justify-content: space-between;
}

.main-slider__image-wrapper {
  display: block;
  width: 100%;
  overflow: hidden;
}

.main-slider__text:after {
  content: '';
  display: block;
  width: 100vw;
  height: 100%;
  position: absolute;
  background: #e0e0e0;
  z-index: -1;
  left: 80%;
}

.category__link  {
  width: 100%;
}



@media screen and (max-width: 1350px) {
  span.main-slider__second-title.avenir-demi.h2-size {
    font-size: 2.8rem;
  }

  .main-slider__text {
    height: 45vw;
    max-height: 66.1rem;
  }
  .main-slider__image {
    max-width: 68vw;
    left: 60rem;
  }
  img.slider-image {
    left: -25px;
    width: 400px;
    top: 25px;
  }
  .main-slider__text-title {
    top: 80px;
  }
  .main-slider__controls {
    margin-top: 100px;
  }
  .main-slider__text-title {
    width: 40%;
  }
  .main-slider__btn {
    padding-top: 3rem;
  }
}


@media screen and (max-width: 1023px) {

  span.main-slider__second-title.avenir-demi.h2-size {
    font-size: 2.8rem;
  }
  .main-slider__text {
    height: 45vw;
    max-height: 66.1rem;
  }
  .main-slider__image {
    max-width: 68vw;
    left: 60rem;
  }
  img.slider-image {
    left: 0px;
    width: 400px;
    top: 25px;
  }
  .main-slider__text:after {
    content: none;
  }
  img.slider-image.active {
    left: 40px;
  }
  .main-slider__inner.container {
    padding: 0 40px;
  }
  .main-slider__controls {
    left: -10px;
     margin-top: 105px;
  }
 

}

@media screen and (max-width: 850px) {


  img.slider-image.active {
    left: 0;
  }
  .main-slider__text-title,
  img.slider-image {
    position: absolute;
  }

  .main-slider__text-title.active,
  img.slider-image.active {
    position: relative;
  }

  .main-slider__inner.container {
    padding-left: 5rem;
    padding-right: 5rem;
  }
  .btn-padding-wide {
    padding: 2rem 3rem;
  }
  .main-slider__text-title.active h2,
  .main-slider__text-title.active h1 {
    min-height: 82px;
  }
  span.main-slider__second-title.avenir-demi.h2-size {
    font-size: 2.4rem;
  }
  .recommend-products__inner .first-product__stickers {
    left: -1rem;
    top: -1.5rem;
  }
  .main-slider.b-blue {
    height: auto;
  }
  .main-slider__text {
    height: auto;
    position: relative;
    bottom: 0;
    padding-top: 4rem;
  }
  .main-slider__inner {
    display: flex;
    flex-direction: column-reverse;
    height: auto;
    position: relative;
  }
  .main-slider__text-title {
    top: 0;
  }
  .main-slider__image {
    width: 100%;
    height: 100%;
    display: block;
    position: relative;
    left: 0;
    margin: 0;
    padding: 0;
    max-width: unset;
  }
  img.slider-image {
    left: 0px;
    width: 100%;
    top: 0;
  }
  .main-slider__text:after {
    content: none;
  }
.main-slider__controls {
  position: relative;
  margin-top: 40px;
}

  .main-slider__controls-wrapper {
    display: flex;
    width: 15rem;
    align-items: flex-end;
    justify-content: flex-end;
    position: absolute;
    right: 15px;
    bottom: -25px;
  }

  .main-slider__image {
    max-height: unset;
  }
    .main-slider__text-title {
    width: 70%;
  }
  .main-slider__controls {
    display: block;
    position: absolute;
    z-index: 40;
    left: 0;
    bottom: 0px;
    width: 100%;
  }
}

@media screen and (max-width: 550px) {
  .main-slider__text-title {
    width: 100%;
  }

  .btn-padding-wide {
    padding: 2rem 3rem;
  }
  .main-slider__text-title.active h2,
  .main-slider__text-title.active h1 {
    min-height: 82px;
  }
  span.main-slider__second-title.avenir-demi.h2-size {
    font-size: 2.4rem;
  }
  .recommend-products__inner .first-product__stickers {
    left: -1rem;
    top: -1.5rem;
  }
  .main-slider.b-blue {
    height: auto;
  }
  .main-slider__text {
    height: auto;
    position: relative;
    bottom: 0;
    padding-top: 4rem;
  }
  .main-slider__inner {
    display: flex;
    flex-direction: column-reverse;
    height: auto;
    padding: 20px 15px !important;
    position: relative;
  }
  .main-slider__text-title {
    bottom: 0;
  }
  .main-slider__image {
    width: 100%;
    height: 100%;
    display: block;
    position: relative;
    left: 0;
    margin: 0;
    padding: 0;
    max-width: unset;
  }
  img.slider-image {
    left: 0px;
    width: auto;
    top: 0;
  }
  .main-slider__text:after {
    content: none;
  }
  .main-slider__controls {
    display: block;
    position: absolute;
    z-index: 40;
    left: 0;
    bottom: -80px;
    width: 100%;
  }

  .main-slider__controls-wrapper {
    display: flex;
    width: 15rem;
    align-items: flex-end;
    justify-content: flex-end;
    position: absolute;
    right: 15px;
    bottom: 0px;
  }
  .main-slider__btn {
  padding-top: 1em;
}
span.main-slider__second-title.avenir-demi.h2-size {
  min-height: auto;
  line-height: 151%;
}
 .main-slider.b-blue {
    height: auto;
    padding-bottom: 5em;
  }
  .main-slider__text-title.active, img.slider-image.active {
    width: 100%;
  }
}

@media screen and (max-width: 460px) {
  .button-base-style {
    font-size: 1.2rem;
  }

  .main-slider__controls-wrapper {
    right: 0;
  }
 
}