.sw__slider-fs-mode {
  position: absolute;
  top: 25px;
  right: 25px;
  z-index: 10;
  width: 40px;
  height: 40px;
  background: #F0FAFF;
  border-radius: 100%;
  cursor: pointer;
  -webkit-transition: all .2s ease;
  transition: all .2s ease;
}

.fs--slider-button:after,
.sw__slider-fs-mode:after,
.sw__slider-fs-mode:before {
  content: '';
  -webkit-transition: all .2s ease
}

.sw__slider-controls--fake-button {
  display: none;
  position: absolute;
  z-index: 1;
  top: 0;
  left: 0;
  height: calc(100% - 80px);
  width: 30%;
  cursor: pointer
}

.sw__slider-controls--fake-button-next {
  left: auto;
  right: 0
}

.fn--fs-slider .fancybox-skin {
  background: 0 0;
  box-shadow: none
}

.sw__slider-fs-mode:after,
.sw__slider-fs-mode:before {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  height: 20px;
  width: 20px;
  background: url(/assets/static/misc/slider/icoFS.svg);
  transition: all .2s ease
}

.sw__slider-fs-mode:before {
  height: 42px;
  width: 42px;
  border-radius: 100%;
  background: #F0FAFF;
  opacity: 0
}

.sw__slider-fs-mode:hover,
.sw__slider-fs-mode:hover:before {
  background: #F0FAFF;
}

.sw__slider-fs-mode:hover:before {
  opacity: 1
}

.fs--slider {
  position: relative;
  display: -webkit-box !important;
  display: -webkit-flex !important;
  display: -ms-flexbox !important;
  display: flex !important;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  height: calc(100vh - 10px);
  padding: 50px 0;
  overflow-y: auto
}

.swiper-slide--fs-img img {
  display: block;
  margin: 0 auto
}

.swiper-slide--fs-thumb {
  width: 100px;
  height: 65px;
  margin: 0 7px;
  border-radius: 3px;
  background-position: 50%;
  background-size: cover;
  opacity: .34;
  -webkit-transition: opacity .2s ease;
  transition: opacity .2s ease;
  cursor: pointer
}

.swiper-slide--fs-thumb:hover {
  opacity: .82
}

.swiper-slide--fs-thumb.is-active {
  opacity: 1
}

.swiper-slide--fs-desc {
  margin: 12px 0 0;
  font-size: 13px;
  text-align: center
}

.fs--slider {
  /* width: calc(100vw - 400px); */
/*  width: 1800px; */
  max-width: 96%;
  margin: 0 auto
}

.fs--slider > div {
  max-width: 100%
}

.fs--slider-button {
  top: 0;
  height: calc(100% - 30px);
  width: 30%
}

.fs--slider-button:after {
  position: absolute;
  top: 50%;
  right: 50px;
  height: 40px;
  width: 40px;
  border-radius: 100%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  background: url(/assets/static/misc/slider/ctrl-right.svg), #F0FAFF;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  opacity: 0;
  transition: all .2s ease
}

.fs--slider-button.swiper-button-next:after {
  left: auto;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%)
}

.fs--slider-button.swiper-button-prev {
  left: 0;
  -webkit-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  transform: rotate(180deg)
}

.fs--slider-button.swiper-button-next {
  right: 0
}

.sw__slider--fs-main:hover .fs--slider-button:after {
  opacity: .82
}

.fs--slider-button.swiper-button-disabled {
  display: none
}

.hs-portal__variants-wrap,
.sw__slider--fs-main {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox
}

.fs--slider-button:hover:after {
  opacity: 1 !important
}

.sw__slider--fs-main {
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  margin: 0 0 25px
}

.sw__slider--fs-thumbs {
  bottom: 0;
  left: 0;
  right: 0
}

.sw__slider--fs-thumbs > div {
  max-width: calc(100vw - 50px);
  margin: 0 auto;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center
}

@media (max-width: 1800px) {
  .fs--slider {
   /* width: 900px */
  }
}

@media (max-width: 1350px) {
  .fs--slider {
    padding: 20px 0
  }

  .sw__slider--fs-main {
    margin-top: 2.5%
  }

  .swiper-slide--fs-img {
    position: relative
  }

  .swiper-slide--fs-thumb {
    width: 50px;
    height: 32px
  }
}

@media (max-width: 639px) {
  .sw__slider-fs-mode {
    display: none;
  }
}

@media (min-width: 1920px) {
  .sw__slider-fs-mode {
    top: 2rem;
    right: 2rem;
    width: 2.9rem;
    height: 2.9rem;   
  } 

  .sw__slider-controls--fake-button {
       height: calc(100% - 5.7rem);
  } 

  .sw__slider-fs-mode:after,
  .sw__slider-fs-mode:before {   
    height: 1.43rem;
    width: 1.43rem;
background-repeat: no-repeat;
    background-size: contain;    
  }

  .sw__slider-fs-mode:before {
    height: 3rem;
    width: 3rem;    
  }

  .fs--slider {    
    height: calc(100vh - 0.71rem);
    padding: 3.57rem 0;
  }
  
  .swiper-slide--fs-thumb {
    width: 7.14rem;
    height: 4.64rem;
    margin: 0 0.5rem;
    border-radius: 0.21rem;   
  } 

  .swiper-slide--fs-desc {
    margin: 0.86rem 0 0;
    font-size: 0.93rem;
  }

  .fs--slider-button {
    height: calc(100% - 2.14rem);
  }

  .fs--slider-button:after {    
    right: 3.57rem;
    height: 2.9rem;
    width: 2.9rem;    
background-size: 1.14rem
  }

  .sw__slider--fs-main {    
    margin: 0 0 2rem
  }

  .sw__slider--fs-thumbs > div {
    max-width: calc(100vw - 3.57rem);   
  }

}
