/* carousel */

.geneus-carousel {
  padding-bottom: 2rem;
}
.geneus-carousel .carousel-indicators {
  position: inherit;
  display: inline-flex;
  margin: 0px;
}
.geneus-carousel .carousel-footer {
  display: flex;
  align-items: center;
  justify-content: center;
  padding-top: 1rem;
}
.geneus-carousel .carousel-control-next, 
.geneus-carousel .carousel-control-prev {
  position: inherit;
  display: inline-flex;
  width: auto;
  margin: 10px 20px;
}

.geneus-carousel .carousel-indicators [data-bs-target] {
  background-color: var(--color-primary-base);
  width: 10px;
  height: 10px;
  border-radius: 100%;
  border: none;
  margin-left: 6px;
  margin-right: 6px;
}
.geneus-carousel .carousel-indicators [data-bs-target].active{
  background-color: var(--color-primary-base);
  width: 32px;
  height: 10px;
  border-radius: 10px;
  border: none;
}
.geneus-carousel .carousel-control-prev, 
.geneus-carousel .carousel-control-next {
  color: var(--color-primary-base);
  font-size: 1.2rem;
}

.owl-prev {
  color: var(--color-primary-base)!important;
  font-size: 1.2rem!important;

}
.owl-next {
  color: var(--color-primary-base)!important;
  font-size: 1.2rem!important;
}

.owl-next:hover,.owl-prev:hover {
  background: none !important;
}
.owl-next :hover,.owl-prev :hover{
  color: var(--color-primary-500)
}
.owl-dot :hover {
  background-color: var(--color-primary-500);
}
.owl-offres-dots {
  background-color: initial !important;
}

.owl-dot {
  background-color: var(--color-primary-base) !important;
  width: 10px;
  height: 10px;
  border-radius: 100%;
  border: none;
  cursor: pointer;
  margin-left: 6px;
  margin-right: 6px;
  opacity: .5;
  border-radius: 30px!important;
}

.owl-dot.active {
  background-color: var(--color-primary-base) !important;
  border-radius: 10px;
  height: 10px;
  width: 32px;
  opacity: 1;
  border: none;
  border-radius: 30px!important;
}

.owl-dot:hover {
  background-color: var(--color-primary-500) !important;
}

 /* `sm` applies to x-small devices (portrait phones, less than 576px) */
 @media (max-width: 575.98px) {

   .geneus-carousel {
     padding-bottom: 1rem;
   }
 }