.tracking-out-contract {
  -webkit-animation: tracking-out-contract 0.6s cubic-bezier(0.55, 0.085, 0.68, 0.53) both;
  animation: tracking-out-contract 0.6s cubic-bezier(0.55, 0.085, 0.68, 0.53) both;
}

@-webkit-keyframes tracking-out-contract {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 1;
  }
  100% {
    letter-spacing: -0.5em;
    opacity: 0;
  }
}
@keyframes tracking-out-contract {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 1;
  }
  100% {
    letter-spacing: -0.5em;
    opacity: 0;
  }
}

.exit .scale-in-ver-center {
  overflow: hidden;
  -webkit-animation: scale-out-ver-center 0.8s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
  animation: scale-out-ver-center 0.8s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}

.exit .scale-in-ver-center-2 {
  overflow: hidden;
  -webkit-animation: scale-out-ver-center 0.8s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
  animation: scale-out-ver-center 0.8s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}

@-webkit-keyframes scale-out-ver-center {
  0% {
    -webkit-transform: scaleY(1);
    transform: scaleY(1);
    opacity: 1;
    visibility: visible;
  }
  100% {
    -webkit-transform: scaleY(0);
    transform: scaleY(0);
    opacity: 0;
    visibility: hidden;
  }
}

@keyframes scale-out-ver-center {
  0% {
    -webkit-transform: scaleY(1);
    transform: scaleY(1);
    opacity: 1;
    visibility: visible;
  }
  100% {
    -webkit-transform: scaleY(0);
    transform: scaleY(0);
    opacity: 0;
    visibility: hidden;
  }
}

.exit .fade-in-up {
  animation: fadeOutDown 0.6s ease-out both;
  -webkit-animation: fadeOutDown 0.6s ease-out both;
}

@keyframes fadeOutDown {
  from {
    opacity: 1;
    transform: translate3d(0, 0, 0); /* Start an der aktuellen Position */
    visibility: visible;
  }
  to {
    opacity: 0;
    transform: translate3d(0, 40px, 0); /* nach unten verschieben */
    visibility: hidden;
  }
}

.exit .tracking-in-expand {
  -webkit-animation: tracking-out-collapse 0.6s cubic-bezier(0.215, 0.610, 0.355, 1.000) both;
  animation: tracking-out-collapse 0.6s cubic-bezier(0.215, 0.610, 0.355, 1.000) both;
}

@-webkit-keyframes tracking-out-collapse {
  0% {
    letter-spacing: normal;
    opacity: 1;
    visibility: visible;
  }
  40% {
    opacity: 0.6;
  }
  100% {
    letter-spacing: -0.5em;
    opacity: 0;
    visibility: hidden;
  }
}

@keyframes tracking-out-collapse {
  0% {
    letter-spacing: normal;
    opacity: 1;
    visibility: visible;
  }
  40% {
    opacity: 0.6;
  }
  100% {
    letter-spacing: -0.5em;
    opacity: 0;
    visibility: hidden;
  }
}


.exit .fade-and-scale {
  animation: scale-out-ver-center-3 0.6s ease-out both;
  -webkit-animation: scale-out-ver-center-3 0.6s ease-out both;
}

/* Dann die eigentliche Scale-Animation */
@keyframes scale-out-ver-center-3 {
  0%   {
    transform: scaleY(1);
    opacity: 1;
  }
  100% {
    transform: scaleY(0.5);
    opacity: 0;
  }
}

@keyframes fade-in-right {
  from {
    opacity: 0;
    transform: translate3d(0, 0, 0); /* Start weiter unten */
    visibility: hidden;
  }
  to {
    opacity: 1;
    transform: translate3d(-120px, 0, 0);
    visibility: visible;
  }
}

.exit .fade-in-right {
  animation: fade-in-right 0.6s ease-out forwards;
}


.exit .zoom-in {
  --webkit-animation: zoom-in-1 0.7s ease-out both;
  animation: zoom-in-1 0.7s ease-out both;
}
@keyframes zoom-in-1 {
  0% {
    transform: scale(1);
    opacity: 1;
  }
  100% {
    transform: scale(0);
    opacity: 0;
  }
}