{#
.carousel-wrapper::after {
  background-color: var(--color-blue-200);
  content: "";
  display: block;
  height: 30px;
  width: 80%;
  margin-top: 0px;
  position: relative;
  border-radius: var(--bs-border-radius);
  left: 10%;
  right: 10%;
  }
#}

.carousel-indicators { margin-bottom: -1rem;  }

.carousel-indicators.tabs-4 { 
  margin-left: 8%;
  margin-right: 8%;
  }

.carousel-indicators.tabs-5 { 
  margin-left: 3%;
  margin-right: 3%;
  }

@media (max-width: 768px) {
  /* override carousel indicator margins at small sizes */
  .carousel-indicators {
    margin-left: 5%;
    margin-right: 5%;
    }
  }



.carousel-indicators .fat-carousel-button {
  background: var(--color-blue);
  transition: all .6s ease;
  padding: 1rem;
  opacity: 1;
  box-shadow: 0 3px 7px 0 rgba(0 0 0 / .15);
  }

  .carousel-indicators .fat-carousel-button.active {
    background: var(--color-purple);
    box-shadow: 0 5px 10px 0 rgba(0 0 0 / .35);
    }

@media (min-width: 768px) {

  .carousel-indicators .fat-carousel-button {
    width: 20vw;
    height: 30px;
    margin: 0 5px;
    text-indent: 0;
    }
  
  .carousel-indicators .fat-carousel-button.active {
    padding: 1rem 3rem;
    }

}

@media (min-width: 992px) {

  .carousel-indicators .fat-carousel-button { height: 80px; }
  
}
  
.carousel-item {
  min-height: 500px;
  background: #fff;
  }