.spielerinnen-flex {
  display: flex;
  flex-wrap: wrap;
  margin: -1rem;
}

.spielerin {
  flex: 0 1 16rem;
  margin: 1rem;

  perspective: 1000px;
}

.spielerin img {
  width: 100%;
}

.spielerin {
  background-color: transparent;
  height: 22rem;
  perspective: 1000px;
}

.spielerin-inner {
  position: relative;
  width: 100%;
  height: 100%;
  transition: transform 0.8s;
  transform-style: preserve-3d;
}

.spielerin:hover .spielerin-inner {
  transform: rotateY(180deg);
}

.spielerin-front, .spielerin-back {
  position: absolute;
  width: 100%;
  height: 100%;
  -webkit-backface-visibility: hidden; /* Safari */
  backface-visibility: hidden;
  border-radius: 10px;
  overflow: hidden;
}

.spielerin-back {
  background: rgb(214,32,50);
  background: -moz-linear-gradient(90deg, rgba(214,32,50,1) 0%, rgba(217,104,38,1) 100%);
  background: -webkit-linear-gradient(90deg, rgba(214,32,50,1) 0%, rgba(217,104,38,1) 100%);
  background: linear-gradient(90deg, rgba(214,32,50,1) 0%, rgba(217,104,38,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#d62032",endColorstr="#d96826",GradientType=1);
  color: #fff;
  padding: 1rem;
  transform: rotateY(180deg);
  overflow: auto;
}

.spielerin-back h3 {
  margin-bottom: .5rem;
  color: #fff;
}