/* Caja del carrusel */
#carrusel-caja {
    -moz-animation: automatizacion 30s infinite linear; /* Cambiado de 15s a 30s */
    -o-animation: automatizacion 30s infinite linear; 
    -webkit-animation: automatizacion 30s infinite linear; 
    animation: automatizacion 30s infinite linear; 
    -webkit-transition: all 0.75s ease;
    -moz-transition: all 0.75s ease;
    -ms-transition: all 0.75s ease;
    -o-transition: all 0.75s ease;
    transition: all 0.75s ease;
    width: 300%;
    display: flex;
}
#carrusel-contenido {
    margin: 10em;
    overflow: hidden;
    text-align: center;
}
.imagenes{
    height: 500px;
    width: 100%;
}
.carrusel-elemento {
    float: left;
    width: 8.333%;
    height: 5%;
}
@-moz-keyframes automatizacion {
    0% {
        margin-left: 0;
    }
    30% {
        margin-left: 0;
    }
    35% {
        margin-left: -100%;
    }
    65% {
        margin-left: -100%;
    }
    70% {
        margin-left: -200%;
    }
    95% {
        margin-left: -200%;
    }
    100% {
        margin-left: 0;
    }
}
@-webkit-keyframes automatizacion {
    0% {
        margin-left: 0;
    }
    30% {
        margin-left: 0;
    }
    35% {
        margin-left: -100%;
    }
    65% {
        margin-left: -100%;
    }
    70% {
        margin-left: -200%;
    }
    95% {
        margin-left: -200%;
    }
    100% {
        margin-left: 0;
    }
}
@keyframes automatizacion {
    0% {
        margin-left: 0;
    }
    30% {
        margin-left: 0;
    }
    35% {
        margin-left: -100%;
    }
    65% {
        margin-left: -100%;
    }
    70% {
        margin-left: -200%;
    }
    95% {
        margin-left: -200%;
    }
    100% {
        margin-left: 0;
    }
}
*/


/*


.slider {
	width: 95%;
	margin: auto;
	overflow: hidden;
}

.slider ul {
	display: flex;
	padding: 0;
	width: 10000%;
	
	animation: cambio 20s infinite alternate linear;
}

.slider li {
	width: 20em;
	list-style: none;
}



@keyframes cambio {
	0% {margin-left: 0;}
	20% {margin-left: 0;}
	
	25% {margin-left: -100%;}
	45% {margin-left: -100%;}
	
	50% {margin-left: -200%;}
	70% {margin-left: -200%;}
	
	75% {margin-left: -300%;}
	100% {margin-left: -300%;}
}
*/
    /*
@keyframes cambio {
	0% {margin-left: 0;}
	20% {margin-left: 0;}
	
	25% {margin-left: -200%;}
	45% {margin-left: -200%;}
	
	50% {margin-left: -400%;}
	70% {margin-left: -400%;}
	
	75% {margin-left: -600%;}
	100% {margin-left: -600%;}

	
	
}
}
/*

.slider {
	width: 98%;
	margin: auto;
    overflow: hidden;
}
.slider ul {
	display: flex;
	padding: 0;
width: 10000%;

animation: cambio 180s infinite alternate linear;	
}



.slider li {
	
	list-style: none;
}
.slider img {
	width: 100%;
}

@keyframes cambio {
	0% {margin-left: 0%;}
	1% {margin-left: 0%;}
    
    2% {margin-left: -100%;}
	3% {margin-left: -100%;}
	
    4% {margin-left: -200%;}
	5% {margin-left: -200%;}

	
	6% {margin-left: -300%;}
    7% {margin-left: -300%;}
	
	8% {margin-left: -400%;}
	9% {margin-left: -400%;}


	
   10% {margin-left: -500%;}
    11% {margin-left: -500%;}

    12%{margin-left: -600%;}
	13% {margin-left: -600%;}

    14%{margin-left: -700%;}
	15%{margin-left: -700%;}

16%{margin-left: -800%;}
	17%{margin-left: -800%;}

    18% {margin-left: -900%;}
    19% {margin-left: -900%;}

    20%{margin-left: -1000%;}
	21% {margin-left: -1000%;}

    22%{margin-left: -1100%;}
	23%{margin-left: -1100%;}

  
    24%{margin-left: -1200%;}
	25%{margin-left: -1200%;}

    26%{margin-left: -1300%}
	27%{margin-left: -1300%;}

    28%{margin-left: -1100%;}
	29%{margin-left: -1100%;}

    30%{margin-left: -1200%;}
	31%{margin-left: -1200%}

    32%{margin-left: -1300;}
	33%{margin-left: -1300%;}

    34%{margin-left: -1400%;}
	35%{margin-left: -1400%;}

}
/*

}
@media  (max-width: 600px){
   .slider img{
    width: 10em;
   } 
    }

@media (max-width:900px){
   .slider img{width: 15em;}
}

*/
html{
    
        margin: 0;  
}
/* .body {
    
background: #401111;
   display: flex;
    height: 100vh;
    justify-content: center;
    align-items: center;
    height: 13em;

  }*/
  .slide {
    height: auto; /* Permitir que la altura del slide se ajuste automáticamente según el contenido */
    display: flex; /* Utilizar flexbox para alinear verticalmente las imágenes */
    align-items: center; /* Centrar verticalmente las imágenes dentro del slide */
}

  @-webkit-keyframes scroll {
    0% {
      -webkit-transform: translateX(0);
              transform: translateX(0);
    }
    100% {
      -webkit-transform: translateX(calc(-300px * 28));
              transform: translateX(calc(-300px * 28));
    }
  }
  
  @keyframes scroll {
    0% {
      -webkit-transform: translateX(0);
              transform: translateX(0);
    }
    100% {
      -webkit-transform: translateX(calc(-300px * 28));
              transform: translateX(calc(-300px * 28));
    }
  }
  .slider {
   /* background: white;
   */
    /*box-shadow: 0 10px 20px -5px rgba(0, 0, 0, .125);*/
    height: 300px;
    margin: auto;
    overflow: hidden;
    position: relative;
    width: 95%;
    overflow: hidden; /* Asegura que el contenido que se sale del contenedor no sea visible */
  }
  .slider::before, .slider::after {
    background: linear-gradient(to right, white 0%, rgba(255, 255, 255, 0) 100%);
    content: "";
    height: 180px;
    position: absolute;
    width: 200px;
    z-index: 2;
  }
  .slider::after {
    right: 0;
    top: 0;
    -webkit-transform: rotateZ(180deg);
            transform: rotateZ(180deg);
  }
  .slider::before {
    left: 0;
    top: 0;
  }
  .slider .slide-track {
    -webkit-animation: scroll 40s linear infinite;
            animation: scroll 40s linear infinite;
    display: flex;
    width: calc(500px * 20);
    height: 150px;
  }
  .slider .slide {
   /* height: 50px;*/
  /*  width: 200px;*/
  }
  
  .slider-item {
       height: 200px;
  }
}
}

  

 @media (max-width: 768px) {
  
 .slider::before, .slider::after {
    background: linear-gradient(to right, white 0%, rgba(255, 255, 255, 0) 8%);
 }
}