#mainCarousel{
    margin-top: 70px;
}
/* Altura específica para el carrusel principal */

/* Establece una altura grande para el carrusel */
#mainCarousel .carousel-inner .carousel-item::before 
{ content: ''; 
position: absolute; 
top: 0; left: 0; 
width: 100%; height: 100%; 
background-size: cover; /* Asegura que el fondo cubra el contenedor */ 
background-repeat: no-repeat; /* Evita que la imagen de fondo se repita */ 
opacity: 0.3; /* Ajusta la opacidad de la imagen de fondo */ 
z-index: 1; /* Asegura que el pseudo-elemento esté detrás de la imagen principal */ 
}

#mainCarousel .carousel-item img {
    width: 100%;
    height: 100%;
    object-fit: contain; /* Ajusta para que la imagen se vea completa dentro del contenedor */
    object-position: center;
  }
#mainCarousel .carousel-fade .carousel-item {
    transition: opacity 0.65s ease-in-out; /* Personaliza la duración del fundido si es necesario */
  }
  
/* Media query para dispositivos móviles */ 
@media (max-width: 768px) 
{ #mainCarousel .carousel-container 
{ margin-top: 100px; /* Ajusta este valor según sea necesario para evitar solapamiento */ } }