@import './variables/index.scss';

.swiper {
  &-slide {
    img {
      width: 100%;
    }
  }
  &-pagination {
    position: static;
    margin-bottom: 16px;

    @media (min-width: 560px) {
      margin-bottom: 30px;
    }

    @media (min-width: 900px) {
      margin-bottom: 16px;
    }

    .swiper-pagination-bullet {
      color: $light-blue;
      font-family: $font-family-atak-light-italic;
      @media (min-width: 560px) and (max-width: 899px) {
        font-size: 24px;
        line-height: 29px;
      }
    }
    .swiper-pagination-bullet-active {
      color: $main-blue;
      font-family: $font-family-atak-black-italic;
      @media (min-width: 560px) and (max-width: 899px) {
        font-size: 24px;
        line-height: 29px;
      }
    }
  }

  &-next {
    cursor: pointer;
  }
}