:root {

  --base  : 380px;

  --ancho : calc(var(--base) * 1);/*numero de imagenes a lo ancho*/

}

* {

  margin     : 0;padding:0;

  box-sizing : border-box;

}



.contenidito {

  max-width        : var(--ancho);

  width            : 96%;

  margin           :-50% 0 0 80%;

  background-color : rgba(0,0,0,0.1);

}

.sliders {

  max-width : var(--ancho);

  height    : calc(var(--ancho) / (16 / 18) );/*numero de imagenes a lo largo*/

  outline   : 3px solid #bb3438;

  position  : relative;

  margin    : auto;

  overflow  : hidden;

  background-color: #000;

}

.show {

  position    : absolute;

  top         : 0;

  left        : 0;

  line-height : 0;

  display     : table;

  width       : 100%;

  height      : 400%;

  animation   : ani 16s ease-out infinite alternate;

}

/*

 .show:hover {

  cursor               : pointer;

  animation-play-state : paused;

}  */

img {

  max-width : 100%; /* 24.84% en FF */

  height    : auto;

  opacity   : 1;

  /* display   : table-cell; */  /* para FF */

}



@keyframes ani {

  0%,20%   { top: 0; opacity: 1;}

  25%      { top: 0; }

  26%      { opacity: 0; }

  27%,47%  { top: -100%; opacity: 1;}

  52%      { top: -100%; }

  53%      { opacity: 0; }

  54%,74%  { top: -200%; opacity: 1;}

  79%      { top: -200%; }

  80%      { opacity: 0;}

  81%,100% { top: -300%; opacity: 1;}

  /*106%      { top: -300%; }

  107%      { opacity: 0;}

  108%,127% { top: -400%; opacity: 2;}*/

}