.owl-carousel {
  .owl-dots button.owl-dot {
    background: $fifth-color;
    box-shadow: $fifth-color 0 0 0 3px;

    &.active {
      background: $quaternary-color;
      box-shadow: $quaternary-color 0 0 0 3px;
    }

    &:hover {
      background: $quaternary-color;
      box-shadow: $quaternary-color 0 0 0 3px;
    }
  }

  .owl-nav button {

    &.owl-prev:before,
    &.owl-next:before {
      background-color: $fifth-color;
      box-shadow: inset $fifth-color 0 0 0 3px;
      color: white;
    }

    &.owl-prev:hover:before,
    &.owl-next:hover:before {
      color: $quaternary-color;
    }
  }

  .owl-item .item {
    padding-bottom: 0;
  }
}

@media (max-width: 580px) {
  .hero-main .hero-cont .content-header-container.float-left {
    margin-top: -108px;
  }
}

.hero-main .owl-carousel.image-slider .slide-item {
  height: 50vh;
}

@media (min-width: 480px) and (max-width: 768px) {
  .news .content-on-image-bottom .content {
    padding: 12px !important;
    bottom: -56px !important;
  }
}

@media (min-width: 769px) and (max-width: 1200px) {
  .news .content-on-image-bottom .content {
    padding: 12px !important;
    bottom: -65px !important;
  }
}

@media (max-width: 479px) {
  .news .content-on-image-bottom .content {
    bottom: -77px !important;
  }

  .card .content .title h3,
  .card .content .title .h3 {
    padding-bottom: 1px;
  }
}