/* Home Page Main/Hero Banner Slider */
.slider {
  max-height: 680px !important;
  cursor: pointer;
  overflow-y: hidden;
}

.slider img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.slider .slick-dots {
  opacity: 0.25;
  transition: all calc(0.618s * 0.618);
}

.slider:hover .slick-dots,
.slider:focus .slick-dots,
.slider:active .slick-dots {
  opacity: 1;
}

.slick-dots {
  bottom: 3rem !important;
}

.slick-dots {
  cursor: pointer;
  position: relative !important;
}

.slick-dots li button {
  position: absolute;
  bottom: -5.5px;
  left: -4.5px;
  border-radius: 50%;
}

.slick-dots li {
  margin: 0 1rem;
  padding: 0 0 5px;
}

.slick-dots .slick-active {
  border: 5px solid rgba(10, 10, 10, 0.35) !important;
  border-radius: 50%;
  margin: 0 1rem 0 calc(1rem - 4.5px);
  padding: 0 0 5px;
  bottom: -5.5px;
}

.slick-dots li button::before {
  font-size: 16px !important;
  color: #6bc7b3 !important;
  opacity: 0.5;
}

.slick-dots li.slick-active button::before {
  font-size: 16px !important;
  color: #6bc7b3 !important;
  opacity: 1 !important;
}

@media only screen and (max-width: 860px) {
  .slider {
    margin-top: 110px !important;
  }

  .slider,
  .slider img.img-responsive {
    height: 100%;
    max-height: 215px;
    object-fit: cover;
  }
}