@keyframes flip-enter {
  from {
    transform: perspective(400px) rotate3d(1, 0, 0, 60deg);
  }
  70% {
    transform: perspective(400px) rotate3d(1, 0, 0, -15deg);
  }
  to {
    transform: perspective(400px);
  }
}
.flip-enter {
  animation: flip-enter both ease-in;
  backface-visibility: visible !important;
}

@keyframes flip-leave {
  from {
    transform: perspective(400px);
  }
  30% {
    transform: perspective(400px) rotate3d(1, 0, 0, -15deg);
  }
  to {
    transform: perspective(400px) rotate3d(1, 0, 0, 45deg);
  }
}
.flip-leave {
  animation: flip-leave both;
  backface-visibility: visible !important;
}