.modal-slider {
  overflow: hidden;

  &__wrapper {
    position: relative;

    @include media-breakpoint-only(lg) {
      // Wrapper width equal to 'xl' bp - to correlate with js width calculations for swiper elements
      width: 540px;
      margin: auto;
    }
  }

  &__btn-prev,
  &__btn-next {
    @include button-slider;

    @include media-breakpoint-down(sm) {
      display: none;
    }
  }

  &__btn-prev {
    left: 0;

    @include media-breakpoint-only(md) {
      left: -45px;
    }

    @include media-breakpoint-up(lg) {
      left: -60px;
    }
  }

  &__btn-next {
    right: 0;

    @include media-breakpoint-only(md) {
      right: -45px;
    }

    @include media-breakpoint-up(lg) {
      right: -60px;
    }
  }

  .swiper-slide {
    height: auto;
    margin-right: 30px;
  }
}