.card-wrap {
  transition-timing-function: cubic-bezier(0.43, 0.38, 0, 1);
  cursor: pointer;
  transition: 0.3s;
  perspective: 400px;
}
.card-wrap:hover {
  transform: scale(1.05) !important;
}
.card-wrap .card {
  transition-timing-function: cubic-bezier(0.43, 0.38, 0, 1);
  transition: 0.3s;
  position: relative;
  aspect-ratio: 7/12;
  width: 290px; /* Adjust the width of the cards */
  height: auto; /* Adjust the height of the cards */
  box-shadow: 0 0 15px 0 rgba(0, 0, 0, 0.3);
  transform-style: preserve-3d;

}
.card-wrap .card.flipped {
  transform: rotateY(180deg);
}
.card-wrap .card > div {
  border-radius: 7px;
  width: 100%;
  height: 100%;
  position: absolute;
  backface-visibility: hidden;
  background-size: contain;
}
.card-wrap .card .inner {
  transform: rotateY(180deg);
  background-color: #90809f;
  opacity: 1;
}
.card-wrap .card .outer {
  background-color: #333;
  background-image: url("/img/reverse_2.jpg");
  transition: 0.3s;
}
@media (max-width: 768px) {

.card-spot {max-width: 33%;}
.card-wrap .card{width: 30vw;}
.cards {gap:1vw;}
}
/*# sourceMappingURL=card.css.map */