/* Animación para que las imágenes aparezcan progresivamente en móvil */

@keyframes animated__picture {
  from {
    opacity: 0;
    scale: 25%;
  }

  to {
    opacity: 1;
    scale: 100%;
  }
}

.animated__picture {
  position: relative;
}

@media (width <= 992px) {
  .animated__picture {
    animation-fill-mode: both;
    animation-name: animated__picture;
    animation-range: entry 10% cover 30%;
    animation-timeline: --image;
    height: auto;
    view-timeline-axis: block;
    view-timeline-name: --image;
    width: 100%;
  }
}