@import url(http://fonts.googleapis.com/css?family=Open+Sans);
/* Si quisiera establecer otra fuente alternativa:
@import url('https://fonts.googleapis.com/css?family=Lacquer&display=swap');
*/

body {
    /* Color rojo de fondo de la p�gina original
    background: #6d0e11; */
    background: #fff;
}


h1 {
    /* Para establecer la fuente en el literal "Galer�a de Carteles", se necesita la sgte l�nea, y el import
       de la primera l�nea de este archivo: @import url(http://fonts.googleapis.com/css?family=Open+Sans); */
    font-family: 'Open Sans', sans-serif;
    /* Fuente alternativa:
    font-family: 'Lacquer', sans-serif;
    */
}


.slider {
    /* Para establecer la fuente del texto "A�o 20XX" justo encima de la foto del cartel, se necesita la sgte l�nea, y el import
       de la primera l�nea de este archivo: @import url(http://fonts.googleapis.com/css?family=Open+Sans); */
    font-family: 'Open Sans', sans-serif;
    /* Fuente alternativa:
    font-family: 'Lacquer', sans-serif;
    */


    width: 95%;
    margin: auto;
    overflow: hidden;

}


.slider ul {
    display: flex;
    padding: 0;


    /* Para 4 feretros:
    width: 400%;
    animation: cambio 20s infinite; */

    /* Para 10 feretros:
    width: 1000%;
    animation: cambio 50s infinite; */

    /* Para 52 feretros:
    width: 5200%;
    animation: cambio 206s infinite;*/

   /* Para 54 feretros: */
    width: 5400%;
    animation: cambio 206s infinite;

    /* Para cualquier n� de pines, para que cuando llegue a la �ltima imagen regrese hacia la anterior y no vaya bruscamente a la 1�*/
    animation-direction: alternate;
}


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


.slider img {
    width: 35%;
    /* Las 2 sgtes lineas para que se centre la imagen*/
    display:block;
    margin:auto;
}


@keyframes cambio {
   /* Para 4 pines, tiene que etener en en .slider ul {
                                                       width: 400%;
                                                       animation: cambio 20s infinite;
   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%;}
   */


   /* Para 52 feretros, tiene que etener en en .slider ul {
                                                           width: 5200%;
                                                           animation: cambio 206s infinite;*/
    /*
    0.00%  {margin-left: 0;}
    33.33%  {margin-left: 0;}

    36.94%  {margin-left: -100%;}
    63.40%  {margin-left: -100%;}

    64.88%  {margin-left: -200%;}
    100.00%  {margin-left: -200%;}
    */



    0.00%  {margin-left: 0;}
    1.38%  {margin-left: 0;}

    1.86%  {margin-left: -100%;}
    3.24%  {margin-left: -100%;}

    3.72%  {margin-left: -200%;}
    5.10%  {margin-left: -200%;}

    5.58%  {margin-left: -300%;}
    6.96%  {margin-left: -300%;}

    7.44%  {margin-left: -400%;}
    8.82%  {margin-left: -400%;}

    9.30% {margin-left: -500%;}
   10.68% {margin-left: -500%;}

   11.16% {margin-left: -600%;}
   12.54% {margin-left: -600%;}

   13.02% {margin-left: -700%;}
   14.40% {margin-left: -700%;}

   14.88% {margin-left: -800%;}
   16.66% {margin-left: -800%;}

   16.74% {margin-left: -900%;}
   18.12% {margin-left: -900%;}





   18.60% {margin-left: -1000%;}
   19.98% {margin-left: -1000%;}

   20.46% {margin-left: -1100%;}
   21.84% {margin-left: -1100%;}

   22.32% {margin-left: -1200%;}
   23.70% {margin-left: -1200%;}

   24.18% {margin-left: -1300%;}
   25.56% {margin-left: -1300%;}

   26.04% {margin-left: -1400%;}
   27.42% {margin-left: -1400%;}

   27.90% {margin-left: -1500%;}
   29.28% {margin-left: -1500%;}

   29.76% {margin-left: -1600%;}
   31.14% {margin-left: -1600%;}

   31.62% {margin-left: -1700%;}
   33.00% {margin-left: -1700%;}

   33.48% {margin-left: -1800%;}
   34.86% {margin-left: -1800%;}

   35.34% {margin-left: -1900%;}
   36.72% {margin-left: -1900%;}





   37.20% {margin-left: -2000%;}
   38.58% {margin-left: -2000%;}

   39.06% {margin-left: -2100%;}
   40.44% {margin-left: -2100%;}

   40.92% {margin-left: -2200%;}
   42.30% {margin-left: -2200%;}

   42.78% {margin-left: -2300%;}
   44.16% {margin-left: -2300%;}

   44.64% {margin-left: -2400%;}
   46.02% {margin-left: -2400%;}

   46.50% {margin-left: -2500%;}
   47.88% {margin-left: -2500%;}

   48.36% {margin-left: -2600%;}
   49.74% {margin-left: -2600%;}

   50.22% {margin-left: -2700%;}
   51.60% {margin-left: -2700%;}

   52.08% {margin-left: -2800%;}
   53.46% {margin-left: -2800%;}

   53.94% {margin-left: -2900%;}
   55.32% {margin-left: -2900%;}





   55.80% {margin-left: -3000%;}
   57.18% {margin-left: -3000%;}

   57.66% {margin-left: -3100%;}
   59.04% {margin-left: -3100%;}

   59.52% {margin-left: -3200%;}
   60.90% {margin-left: -3200%;}

   61.38% {margin-left: -3300%;}
   62.76% {margin-left: -3300%;}

   63.24% {margin-left: -3400%;}
   64.62% {margin-left: -3400%;}

   65.10% {margin-left: -3500%;}
   66.48% {margin-left: -3500%;}

   66.96% {margin-left: -3600%;}
   68.34% {margin-left: -3600%;}

   68.82% {margin-left: -3700%;}
   70.20% {margin-left: -3700%;}

   70.68% {margin-left: -3800%;}
   72.06% {margin-left: -3800%;}

   72.54% {margin-left: -3900%;}
   73.92% {margin-left: -3900%;}





   74.40% {margin-left: -4000%;}
   75.78% {margin-left: -4000%;}

   76.26% {margin-left: -4100%;}
   77.64% {margin-left: -4100%;}

   78.12% {margin-left: -4200%;}
   79.50% {margin-left: -4200%;}

   79.98% {margin-left: -4300%;}
   81.36% {margin-left: -4300%;}

   81.84% {margin-left: -4400%;}
   83.22% {margin-left: -4400%;}

   83.70% {margin-left: -4500%;}
   85.08% {margin-left: -4500%;}

   85.56% {margin-left: -4600%;}
   86.94% {margin-left: -4600%;}

   87.42% {margin-left: -4700%;}
   88.80% {margin-left: -4700%;}

   89.28% {margin-left: -4800%;}
   90.66% {margin-left: -4800%;}

   91.14% {margin-left: -4900%;}
   92.52% {margin-left: -4900%;}




   93.00% {margin-left: -5000%;}
   94.38% {margin-left: -5000%;}

   94.86% {margin-left: -5100%;}
   96.24% {margin-left: -5100%;}

   96.72% {margin-left: -5200%;}
   98.10% {margin-left: -5200%;}

   98.58% {margin-left: -5300%;}
   100%   {margin-left: -5300%;}
}


/* Nuevo para responsivar las fotos verticales de los sliders  */
@media (min-width:480px) {
    .slider {
        width: 90%;
    }
}


@media (min-width:768px) {
   .slider {
        /*width: auto;*/
         width: 50%;
    }
}


@media (min-width:1024px) {
   .slider {
        /*width: auto;*/
	width: 50%;
    }
}