.txt-loading {
  border-radius: 25px;
  display: block;
  font-size: 72px;
  margin: auto;
  text-align: center;
}
.txt-loading::after {
  animation: loading steps(1, end) 3s;
  animation-fill-mode: forwards;
  background-color: var(--bg-white);
  color: var(--color-lightblack);
  content: "";
  display: flex;
  flex-direction: column;
  font-family: "Shrikhand", cursive;
  justify-content: center;
  min-height: 100svh;
  position: fixed;
  width: 100%;
  z-index: 3;
}

@keyframes loading {
  0% {
    content: ". . .";
  }
  25% {
    content: "Oh . .";
  }
  50% {
    content: "Oh My .";
  }
  75% {
    content: "Oh My Food";
  }
  100% {
    content: "";
    background-color: transparent;
    display: none;
    min-height: 0px;
    position: relative;
    z-index: 0;
  }
}