/* stylelint-disable selector-class-pattern */

.g-observe,
.g-observe-after {
  transition: all 0.5s ease-in-out;
  transition-delay: 200ms;
}

.g-observe.a-delay--1x,
.g-observe-after.a-delay--1x {
  transition-delay: 300ms;
}

.g-observe.a-delay--2x,
.g-observe-after.a-delay--2x {
  transition-delay: 400ms;
}

.g-observe.a-delay--3x,
.g-observe-after.a-delay--3x {
  transition-delay: 500ms;
}

.g-observe-after.a-from-left {
  transform: translate3d(-5rem, 0, 0);
  opacity: 0;
}

.g-observe-after.a-from-right {
  transform: translate3d(5rem, 0, 0);
  opacity: 0;
}

.g-observe-after.a-from-bottom {
  transform: translate3d(0, 5rem, 0);
  opacity: 0;
}

.g-observe-after.a-from-left.was-in-view,
.g-observe-after.a-from-right.was-in-view,
.g-observe-after.a-from-bottom.was-in-view {
  transform: translate3d(0, 0, 0);
  opacity: 1;
}

.g-observe-after.a-from-left-rotate {
  transform: translate3d(-5rem, 0, 0) rotate3d(0, 0, 1, -10deg);
  transform-origin: bottom right;
  opacity: 0;
}

.g-observe-after.a-from-right-rotate {
  transform: translate3d(5rem, 0, 0) rotate3d(0, 0, 1, 10deg);
  transform-origin: bottom left;
  opacity: 0;
}

.g-observe-after.a-from-left-rotate.was-in-view,
.g-observe-after.a-from-right-rotate.was-in-view {
  transform: translate3d(0, 0, 0) rotate3d(0, 0, 1, 0deg);
  opacity: 1;
}

.g-observe.a-zoom-in-slow {
  transform: scale(1);
  transition: all 30s linear;
}

.g-observe.a-zoom-in-slow.was-in-view {
  transform: scale(1.5);
}

.g-observe.a-zoom-in-fast {
  transform: scale(0.5);
  opacity: 0;
}

.g-observe.a-zoom-in-fast.was-in-view {
  transform: scale(1);
  opacity: 1;
}

.g-observe.a-parallax-vertical > div,
.g-observe.a-parallax-vertical > div > picture {
  display: flex;
  overflow: hidden;
  align-items: center;
  justify-content: center;
  width: 100%;
}

.g-observe.a-parallax-vertical > div img {
  object-fit: cover;
  object-position: center center;
  width: 100%;
  height: max(100%, 100vh);
  transform: translate3d(0, 0, 0);
}