.flip-card {
    width:100%;
    height:100%;
}
.flip-card--inner {
    position:relative;
    text-align:center;
    -webkit-transition:-webkit-transform 0.8s;
    transition:-webkit-transform 0.8s;
    transition:transform 0.8s;
    transition:transform 0.8s, -webkit-transform 0.8s;
    -webkit-transform-style:preserve-3d;
    transform-style:preserve-3d;
    top:0;
    left:0;
    min-height: 35em;
}
.flip-card:hover .flip-card--inner{
    -webkit-transform:rotateY(180deg);
    transform:rotateY(180deg);
}
.flip-card--front,
.flip-card--back {
    position:absolute;
    width:100%;
    height:100%;
    top:0;
    left:0;
    -webkit-backface-visibility:hidden;
    backface-visibility:hidden;
}
.flip-card--front{
    color:black;
}
.flip-card--back {
    -webkit-transform:rotateY(180deg);
    transform:rotateY(180deg);
}