#orme #mainImage {
  background-color: var(--orme-bg-primary);
}
#orme #mainImage .bgi {
  opacity: 0;
  animation: orme-hero-im 2.4s cubic-bezier(0.33, 0, 0.2, 1) forwards;
  animation-delay: 0.5s;
}
#orme #mainImage .lgm-wrap,
#orme #mainImage .copytitle {
  opacity: 0;
  animation: orme-hero-copy 1.8s cubic-bezier(0.33, 0, 0.2, 1) forwards;
}
#orme #mainImage .lgm-wrap {
  animation-delay: 2.4s;
}
#orme #mainImage .copytitle {
  animation-delay: 3.2s;
}
#orme #sitehead.orme-header .bt-shop {
  opacity: 0;
  animation: orme-hero-copy 1.8s cubic-bezier(0.33, 0, 0.2, 1) forwards;
  animation-delay: 1.6s;
}
#orme #orme-beginning .motion.upvisible,
#orme #orme-form .motion.upvisible,
#orme #orme-texture .motion.upvisible {
  opacity: 0;
  transform: translate(-0.7em, 1.4em);
  transition: opacity 1.4s cubic-bezier(0.33, 0, 0.2, 1), transform 1.4s cubic-bezier(0.33, 0, 0.2, 1);
}
#orme #orme-beginning .motion.upvisible[data-isvisible=true],
#orme #orme-form .motion.upvisible[data-isvisible=true],
#orme #orme-texture .motion.upvisible[data-isvisible=true] {
  opacity: 1;
  transform: translate(0, 0);
}

@keyframes orme-hero-im {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes orme-hero-copy {
  from {
    opacity: 0;
    transform: translateY(14px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@media (prefers-reduced-motion: reduce) {
  #orme #mainImage .bgi,
  #orme #mainImage .lgm-wrap,
  #orme #mainImage .copytitle,
  #orme #sitehead.orme-header .bt-shop,
  #orme .motion.upvisible {
    animation: none;
    opacity: 1;
    transform: none;
  }
}
@keyframes orme-slidein {
  0%, 32%, 64%, 100% {
    transform: translateX(0);
  }
  18%, 50%, 85% {
    transform: translateX(4%);
  }
}
@keyframes orme-slideanime {
  0%, 18% {
    transform: translateX(0);
  }
  32%, 50% {
    transform: translateX(100%);
  }
  64%, 85% {
    transform: translateX(200%);
  }
  100% {
    transform: translateX(300%);
  }
}

/*# sourceMappingURL=animation.css.map */
