.up-down {
  animation: up-down 1s ease-in-out infinite alternate;
}

.up-down-2 {
  animation: up-down 1.5s ease-in-out infinite alternate;
}

@keyframes up-down {
  0% {
    transform: translateY(0);
  }

  100% {
    transform: translateY(-15px);
  }
}

.shadow-effect:hover {
  backdrop-filter: blur(10px);
  box-shadow: 0 8px 32px 0 #e961e3;
  transition: all 0.5s ease-in-out;
}

.shadow-effect.gray:hover {
  backdrop-filter: blur(10px);
  box-shadow: 0 8px 32px 0 #67768d;

  transition: all 0.5s ease-in-out;
}

.shake:hover {
  animation: shake 0.82s cubic-bezier(0.36, 0.07, 0.19, 0.97) both;
  transform: translate3d(0, 0, 0);
  backface-visibility: hidden;
  perspective: 1000px;
}

@keyframes shake {

  10%,
  90% {
    transform: translate3d(-1px, 0, 0);
  }

  20%,
  80% {
    transform: translate3d(2px, 0, 0);
  }

  30%,
  50%,
  70% {
    transform: translate3d(-4px, 0, 0);
  }

  40%,
  60% {
    transform: translate3d(4px, 0, 0);
  }
}

.scale-image:hover img {
  transform: scale(1.1);
  transition: transform 0.25s;
  overflow: hidden;
}

.zoom-out {
  animation: zoom-out 0.5s ease-in-out;
}

@keyframes zoom-out {
  0% {
    transform: scale(1);
  }

  100% {
    transform: scale(1.1);
  }
}

.glass-effect {
  position: relative;
  display: block;
  overflow: hidden;
}

.glass-effect:after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  overflow: hidden;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg,
      transparent,
      rgba(255, 255, 255, 0.4),
      transparent);

  transition: 0.5s;
  transition-delay: 0.3s;
}

.glass-effect:hover:after {
  left: 100%;
}

@keyframes zoom-in {
  0% {
    opacity: 0;
    transform: translate(-50%, -50%) scale(1, 1);
    background: linear-gradient(132.8deg, var(--primary) 3.21%, #70379A 88.64%);
  }

  50% {
    opacity: 0.5;
    transform: translate(-50%, -50%) scale(1.3, 1.3);
    background: linear-gradient(132.8deg, var(--primary) 3.21%, #70379A 88.64%);
  }

  100% {
    opacity: 0;
    transform: translate(-50%, -50%) scale(1.3, 1.3);
  }
}