#render .owl-carousel .owl-nav {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: 100%;
  pointer-events: none;
  display: flex;
  justify-content: space-between;
  padding: 0 40px;
}

#render .owl-carousel .owl-nav button {
  border: none;
  outline: none;
  pointer-events: all;
  width: 60px;
}

#render .owl-carousel .owl-nav button img {
  width: 100%;
}

#render .owl-carousel .owl-nav button:nth-child(2) {
  transform: rotate(180deg);
}

#render .owl-carousel .item {
  position: relative;
  opacity: 0.4;
  transition: 0.8s;
  height: 44vw;
  min-height: 300px;
}

#render .owl-carousel .item img {
  object-fit: cover;
  width: 100%;
  height: 100%;
}

#render .owl-carousel .owl-stage-outer .owl-stage .owl-item.active {
  opacity: 1;
}

#render .owl-carousel .owl-stage-outer .owl-stage .owl-item.active .item {
  opacity: 1;
  transition: 0.4s;
}

.owl-dots {
  position: absolute;
  bottom: 15px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  width: max-content;
}

.owl-dots .owl-dot {
  width: 15px;
  height: 15px;
  margin: 5px 10px;
  border-radius: 15px; /* Para dots cuadrados establecer a 0 */
  border: 2px solid var(--primary-color); /* Color del borde de los dots */
}

.owl-dots .owl-dot.active {
  background: var(--primary-color); /* Color de fondo del dot activo */
}

.owl-dots .owl-dot :focus {
  outline: none;
}

#custom-nav.owl-nav button {
  border: none;
  outline: none;
  pointer-events: all;
  width: 60px;
}

/* #custom-nav.owl-nav button img {
  width: 100%;
}

#custom-nav.owl-nav button:nth-child(2) {
  transform: rotate(180deg);
} */

@media (width <= 992px) {
  #render .owl-carousel .owl-nav {
    padding: 0;
  }
  #render .owl-carousel .owl-nav button img {
    width: 70%;
  }
}
