/* animation für den grünen Verlauf und für die links hover effect */
.gradient {
  background-size: 300% 300%;
  background-image: linear-gradient(
    45deg,
    #45a49d 8.65%,
    #40b8a2 40.66%,
    #75d6ad 78.96%
  );
  -webkit-animation: 11s gradient infinite;
  animation: 11s gradient infinite;
  box-shadow: 0px 4px 4px rgba(54, 128, 123, 0.37);
}
.activeGradient:hover {
  -webkit-animation: 2s activeGradient linear infinite;
  animation: 2s activeGradient linear infinite;
  text-shadow: 2px 2px 30px #fff;
  transition: 2s;
}
@-webkit-keyframes gradient {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}
@keyframes gradient {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}
@-webkit-keyframes activeGradient {
  0% {
    opacity: 1;
    text-shadow: transparent;
  }
  50% {
    opacity: 0.1;
  }
  100% {
    opacity: 1;
    text-shadow: 2px 2px 20px var(--white);
  }
}

@keyframes activeGradient {
  0% {
    opacity: 1;
    text-shadow: transparent;
  }
  50% {
    opacity: 0.1;
  }
  100% {
    opacity: 1;
    text-shadow: 2px 2px 20px var(--white);
  }
}
