body {
    margin: 0;
    padding: 0;
    font-family: Arial, sans-serif;
    overflow-x: hidden;
    background-color: #000; /* Cambia el fondo de toda la página a negro */
}

.slider {
    width: calc(150px * 6 + 20px * 5); /* Ancho para mostrar 6 imágenes de 150px cada una más el margen entre ellas */
    overflow: hidden;
    margin: auto;
    display: flex;
    align-items: center; /* Centra el contenedor de imágenes verticalmente */
    height: 115px; /* Ajusta esta altura según el tamaño máximo de tus imágenes */
}

.slider-container {
    display: flex;
    animation: slide-animation 30s linear infinite; /* Ajusta la duración según la velocidad deseada */
}

.slide {
    min-width: 150px;
    margin-right: 20px; /* Agrega un margen de 20px entre las imágenes */
    display: flex; /* Hace que cada slide sea un contenedor flex */
    align-items: center; /* Centra el contenido (imagen) verticalmente */
    justify-content: center; /* Centra horizontalmente si la imagen no ocupa todo el ancho */
}

.slide img {
    max-height: 100%; /* Asegura que la imagen no sea más alta que su contenedor */
    width: auto; /* Mantiene la proporción de la imagen */
    display: block;
}
