.heroes.swiper {
  width: 100%;
}
.heroes.swiper .swiper-button-prev,
.heroes.swiper .swiper-button-next {
  height: auto;
  width: auto;
  top: 75%;
}
@media (min-width: 768px) {
  .heroes.swiper .swiper-button-prev,
  .heroes.swiper .swiper-button-next {
    height: auto;
    width: auto;
    top: 50%;
  }
}
.heroes.swiper .swiper-button-prev:after,
.heroes.swiper .swiper-button-next:after {
  display: none;
}
.heroes.swiper .swiper-button-prev svg,
.heroes.swiper .swiper-button-next svg {
  height: 30px;
  fill: var(--color-navy);
}
@media (min-width: 768px) {
  .heroes.swiper .swiper-button-prev svg,
  .heroes.swiper .swiper-button-next svg {
    fill: var(--color-white);
  }
}
@media (min-width: 992px) {
  .heroes.swiper {
    height: 600px;
  }
  .heroes.swiper .swiper-button-next {
    right: 60px;
  }
  .heroes.swiper .swiper-button-prev {
    left: 60px;
  }
}