/*============================================================================================
   Start Hero css
==============================================================================================*/
.hero.style-3 .pg-inner .swiper-pagination {
  bottom: 16px;
}
@media (min-width: 768px) {
  .hero.style-3 .intro-wrapper .col-md-8 {
    max-width: 68%;
    flex: 0 0 68%;
  }
  .hero.style-3 .intro-wrapper .col-md-4 {
    max-width: 32%;
    flex: 0 0 32%;
  }
}
.hero.style-3 .intro-wrapper .swiper-pagination .swiper-pagination-bullet {
  background-color: #fff;
  border-color: #fff;
  opacity: 0.5;
}
.hero.style-3
  .intro-wrapper
  .swiper-pagination
  .swiper-pagination-bullet.swiper-pagination-bullet-active {
  width: 1.8rem;
  opacity: 1;
}
@media (min-width: 992px) {
  .hero.style-3 .intro-wrapper {
    margin: 2rem 0 0 30rem;
  }
}
@media (max-width: 767px) {
  .hero.style-3 .sidebar-banner-catg {
    margin-top: 16px;
  }
  .hero.style-3 .sidebar-banner-catg .mb-3 {
    margin: 0 !important;
  }
}

/*============================================================================================
     End Hero css
  ==============================================================================================*/