@keyframes blink {
  0%,
  15%,
  50% {
    opacity: 0;
  }

  25%,
  5% {
    opacity: 0.5;
  }

  10%,
  100%,
  75% {
    opacity: 1;
  }

  20% {
    opacity: 0.1;
  }
}

.blink {
  animation: 2s infinite blink;
}

@keyframes slideUp {
  0%,
  100% {
    transform: translateY(0);
  }

  50% {
    transform: translateY(-5px);
  }
}

.slideUp {
  animation: 2s infinite slideUp;
}

@keyframes slideRight {
  0% {
    transform: translateX(-100%);
  }

  100% {
    transform: translateX(0);
  }
}

.animateRight {
  animation: 2s 1 slideRight;
}

@keyframes slideLeft {
  0% {
    transform: translateX(100%);
  }

  100% {
    transform: translateX(0);
  }
}

.animateLeft {
  animation: 2s 1 slideLeft;
}
/* Welcome animation */

#spin {
  color: #4232cd;
}
#spin:after {
  content: "";
  animation: spin 2s linear infinite;
}
@keyframes spin {
  0% {
    content: "You’re welcome.";
  }
  10% {
    content: "You’re welcome.";
  }
  20% {
    content: "Je vous en prie.";
  }
  30% {
    content: "Gern geschehen.";
  }
  40% {
    content: "आपका स्वागत है।";
  }
  50% {
    content: "どういたしまして";
  }
  60% {
    content: "பரவாயில்லை.";
  }
  70% {
    content: "Пожалуйста.";
  }
  80% {
    content: "천만에요";
  }
  90% {
    content: "பரவாயில்லை.";
  }
}

.linear-wipe:hover {
  background: linear-gradient(
    to right,
    #7953cd 20%,
    #00affa 30%,
    #0190cd 70%,
    #764ada 80%
  );
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  -webkit-text-fill-color: transparent;
  background-size: 500% auto;
  animation: textShine 5s ease-in-out infinite alternate;
}

@keyframes textShine {
  0% {
    background-position: 0% 50%;
  }
  100% {
    background-position: 100% 50%;
  }
}
/* animation end */

.fade-in-fast {
  opacity: 0;
  animation: fadeIn 1s ease-in forwards;
}

.fade-in-slow {
  opacity: 0;
  animation: fadeIn 1.1s ease-in forwards;
}

.fade-in-xSlow {
  opacity: 0;
  animation: fadeIn 1.2s ease-in forwards;
}

@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(60px);
  }
  to {
    opacity: 1;
  }
}