.swiper-container {
  position: relative; }

.screenshot-frame {
  position: absolute;
  top: 12px;
  left: 50%;
  -webkit-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -o-transform: translateX(-50%);
  transform: translateX(-50%);
  /* width: 310px;
  height: 100%; */
  z-index: 5; }
  .screenshot-frame img {
    border-radius: 10px; 
     width: 340px;
  height: 700px;
  }

.swiper-slide {
  width: 310px;
  height: auto;
  -webkit-box-shadow: 4px 5px 18px 0px rgba(110, 112, 113, 0.32);
  -moz-box-shadow: 4px 5px 18px 0px rgba(110, 112, 113, 0.32);
  box-shadow: 4px 5px 18px 0px rgba(110, 112, 113, 0.32);
  margin-top: 30px;
  margin-bottom: 30px; }

.swiper-slide img {
  width: 100%; 
}

.swiper-slide-active.swiper-slide {
  border-radius: 10px;
  overflow: hidden; }

.swiper-pagination {
  bottom: 0 !important;
  padding-top: 42px;
  position: relative;
  z-index: 99; }

.swiper-pagination .swiper-pagination-bullet {
    width: 16px;
    height: 16px;
    border: 2px solid #B525FF;
    background: none;
    opacity: 1; 
  
  }

.swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
       background: linear-gradient(45deg, #B525FF, #22D2FE);
}

 @media only screen and (min-width: 576px) and (max-width: 767px) {


}