#scrolly {
  position: relative;
}

.step {
  inset: 0;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  z-index: 0;
  transition: opacity 0.8s ease, visibility 0s linear 0.8s;
}

.step.is-active {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  z-index: 20;
  transition: opacity 0.8s ease;
}

#chat-img {
  transform: translateX(80px);
  opacity: 0;
  transition:
    transform 1s ease,
    opacity 1s ease;
}

/* cuando el step está activo */
.step.is-active #chat-img {
  transform: translateX(0);
  opacity: 1;
}

#bg-texture {
    background-image:linear-gradient(rgba(255,255,255, 0.8), rgba(255, 255, 255, 0.8)), url(../static/img/bg-image/textureBg.svg);
}
