.error {
  font-size: large;
  text-align: center;
  text-decoration: underline;
  text-decoration-color: red;
  text-decoration-style: wavy;
}

#timeline {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.vr {
  height: 75px;
  border-left: 4px dotted #593C8F;
}

footer {
  height: 80px;
}

.ferns {
  height: 35vw;
  position: fixed;
  margin: auto;

  pointer-events: none;

  z-index: 2;
}

.top-left {
  top: -20vw;
  left: -20vw;
  animation: from-top 3s ease-in-out,
    from-left 3s ease-in-out;

  transform: rotate(90deg);
}

.top-right {
  top: -20vw;
  right: -20vw;
  animation: from-top 3s ease-in-out,
    from-right 3s ease-in-out;

  transform: rotate(180deg);
}

.bottom-left {
  bottom: -20vw;
  left: -20vw;
  animation: from-bottom 3s ease-in-out,
    from-left 3s ease-in-out;
}

.bottom-right {
  bottom: -20vw;
  right: -20vw;
  animation: from-bottom 3s ease-in-out,
    from-right 3s ease-in-out;

  transform: rotate(270deg);
}