.vertical-carousel {
  width: 100%;
  height: 660px;
  position: relative;
  overflow-x: visible;
}
.vertical-carousel .product-box {
  border: 5px solid transparent;
  border-radius: 50%;
  background: 
    linear-gradient(#fff, #fff) padding-box,
    linear-gradient(37deg, #124676 5.16%, #286393 12.33%, #4283B3 22.19%, #549ACB 31.16%, #5FA8D9 40.12%, #63ADDE 47.3%, #7D9FCF 52.67%, #A58BBA 61.64%, #C47BA9 70.6%, #DA709D 79.57%, #E76996 87.64%, #EC6794 94.81%) border-box; /* Border gradient */
  width: 504px;
  height: 504px;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 0 30px rgba(0, 0, 0, 0.05);
  position: relative;
  margin: auto;
}

.vertical-carousel .product-box::before{
  content: '';
  background: linear-gradient(#BCDAEE, #fff);
  width: 95%;
  height: 95%;
  border-radius: 50%;
  position: absolute;
}

.vertical-carousel .product-box img{
  z-index: 99;
  width: 211px;
  height: 377px;
  object-fit: contain;
}

.vertical-carousel .swiper-slide::after{
  content: '';
  height: 104px;
  width: 4px;
  background: #6FA5D4;
  position: absolute;
  left: 0;
  right: 0;
  margin: auto;
}

.vertical-carousel .swiper-button-next:after, .vertical-carousel .swiper-rtl .swiper-button-prev:after, .vertical-carousel .swiper-button-prev:after, .vertical-carousel .swiper-rtl .swiper-button-next:after{
  display: none;
}

.vertical-carousel .custom-nav{
  width: 54px!important;
  right: -36px;
  left: unset;
}

.vertical-carousel .swiper-button-prev{
  top: 37%;
}


.vertical-carousel .swiper-pagination {
  position: absolute;
  right: 0;
  bottom: 136px !important;
  border-radius: 50px;
  border: 1px solid #969696;
  left: unset;
  padding: 14px 12px;
  width: 74px;
  height: 74px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 28px;
  font-weight: 300;
  color: #224674;
  font-family: "Arial Nova", Sans-serif;
}


@media only screen and (max-width: 991px){
  .vertical-carousel .product-box {
    width: 304px;
    height: 304px;
  }
  .vertical-carousel {
    height: 404px;
  }
  .vertical-carousel .product-box img{
    width: 128px;
  }
  .vertical-carousel .custom-nav{
    width: 40px!important;
  }
  .vertical-carousel .swiper-pagination{
    width: 50px;
    height: 50px;
    font-size: 20px;
    bottom: 112px !important;
  }
  .vertical-carousel .swiper-slide::after{
    height: 68px;
  }
}

@media only screen and (max-width: 767px){
  .vertical-carousel .swiper-pagination{
    bottom: 60px!important;
  }
  .vertical-carousel .swiper-button-prev {
    top: 21px;
  }
  .vertical-carousel .custom-nav {
    width: 36px !important;
  }
  .vertical-carousel .swiper-button-prev {
    top: 18px;
  }
  .vertical-carousel .swiper-button-next {
    top: 63px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px)  {
  .vertical-carousel .product-box {
    width: 404px;
    height: 404px;
  }
  .vertical-carousel {
    height: 560px;
  }
  .vertical-carousel .product-box img{
    width: 160px;
  }
}


@media only screen and (max-width: 1240px){
  .vertical-carousel .custom-nav{
    right: 0px;
  }
}