.flip-card {
    perspective: 1000px;
  }
  
  .flip-card-inner {
    transition: transform 0.6s;
    transform-style: preserve-3d;
  }
  
  .flip-card:hover .flip-card-inner
   {
    transform: rotateY(180deg);
    /* animation: flip-card 1s ease-in-out; */
  }
  
  .flip-card-front, .flip-card-back {
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    perspective:1000px
  }

  .flip-card-back {
    transform: rotateY(180deg);
  }

  @media (max-width: 768px) {
    .flip-card:focus .flip-card-inner
    {
     transform: rotateY(180deg);
     /* animation: flip-card 1s ease-in-out; */
   }


  }