/*
You can type here custom CSS code, which will be loaded both on your admin and front-end pages. Please make sure to not override layout properties (positions and sizes), as they can interfere with the sliders built-in responsive functionality. Here are few example targets to help you get started:
*/

.ls-container { /* Slider container */

}

.ls-layers { /* Layers wrapper */

}

.ls-3d-box div { /* Sides of 3D transition objects */

}

.custom-carousel {
  display: none;
}
.custom-carousel.active {
  display: block;
}

.carousel-button {
  background-color: #e0e0e0 !important;
  color: #000 !important;
  transition: all 0.3s ease;
  border-radius: 5px;
  padding: 10px 20px;
  border: none;
  cursor: pointer;
}

.carousel-button.active {
  background-color: #ffc107 !important; /* amarillo */
  color: #fff !important;
}