.fadein {
  animation: kf-fadein var(--animation-time) forwards;
}

@keyframes kf-fadein {
  0% {
    padding-top: 1rem;
    opacity: 0;
  }

  100% {
    padding-top: 0;
    opacity: 1;
  }
}

.blowover {
  display: block;
  animation: kf-blowover var(--animation-time) forwards;
}

@keyframes kf-blowover {
  0% {
    transform: scale(1);
  }

  100% {
    transform: scale(5);
    opacity: 0;
  }
}

.blowout {
  display: block;
  animation: kf-blowout var(--animation-time) forwards;
}

@keyframes kf-blowout {
  0% {
    transform: scale(1);
  }

  100% {
    transform: scale(0);
    opacity: 0;
  }
}