.container {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  /*margin-bottom: 25%;*/
}

.card {
  perspective: 1000px;
  height: 271px;
  width: 186px;
  position: relative;
  margin: 5px;
  margin-bottom: 2%;
}

.card img {
  width: 100%;
}

.card .back {
  position: absolute;
  transform: rotateY(0deg);
  backface-visibility: hidden;
  transition: transform 0.4s linear;
}

.card .front {
  position: absolute;
  transform: rotateY(180deg);
  backface-visibility: hidden;
  transition: transform 0.4s linear;
}

/*.card:hover  .back{
	transform:  rotateY(-180deg);
	cursor:pointer;
}
.card:hover  .front{
	transform:  rotateY(0deg);
	cursor:pointer;
}*/
.card.flip {
  transform: rotateY(0deg);
}

.card.flip .front {
  transform: none;
}

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

/*.footer{
	text-align: center;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: row;
	color: white;}*/
@media screen and (min-width: 600px) and (max-width: 900px) {
  .container {
    display: none;
  }
}
@media screen and (max-width: 574px) {
  .container {
    display: none;
  }
}/*# sourceMappingURL=numbercards.css.map */