@keyframes typing {
  from {
    width: 0;
    height: 100vh !important;
    min-height: 100vh !important;
  }
  to {
    width: 100%;
    height: 100vh !important;
    min-height: 100vh !important;
  }
}

@keyframes scale {
  from {
    scale: 3.5;
  }
  to {
    scale: 1;
  }
}

@keyframes scaleMobile {
  from {
    transform: translateY(-15rem);
    scale: 1.5;
  }
  to {
    scale: 1;
  }
}

/* @keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
} */

/* New */
@keyframes fadeIn {
  from {
    opacity: 0;
    transform: scale(0.9);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}

.red-sticker,
.yellow-sticker,
.blue-sticker {
  animation: fadeIn 1s ease-in-out;
}

@keyframes lemon {
  from {
    scale: 1.2;
    bottom: 0;
  }
  to {
    scale: 1;
    bottom: 7.8rem;
  }
}




@keyframes typoFadePosition {
  0% {
    z-index: -1;
    opacity: 0;
    translate: 0 45vh;
    scale: 0.2;
  }
  50% {
    z-index: -1;
    opacity: 1;
    translate: 0 45vh;
    scale: 0.2;
  }
  80% {
    z-index: -1;
    opacity: 1;
    translate: 0 45vh;
    scale: 0.2;
  }
  100% {
    z-index: -1;
    opacity: 1;
    translate: 0 0vh;
    scale: 1;
  }
}

@keyframes typoFadePositionMobile {
  0% {
    z-index: -1;
    opacity: 0;
    translate: 0 45vh;
    scale: 0.5;
  }
  50% {
    z-index: -1;
    opacity: 1;
    translate: 0 45vh;
    scale: 0.5;
  }
  80% {
    z-index: -1;
    opacity: 1;
    translate: 0 45vh;
    scale: 0.5;
  }
  100% {
    z-index: -1;
    opacity: 1;
    translate: 0 0vh;
    scale: 1;
  }
}
