.box,.card{width:200px;height:200px;border:1px solid}@keyframes flip{0%{transform:rotateY(0deg)}to{transform:rotateY(180deg)}}@keyframes flipbook{0%{transform:rotateY(0deg)}to{transform:rotateY(1turn)}}.card{perspective:1000px;transform-style:preserve-3d}.card .front{background:beige}.card .back{background:bisque}.card .back,.card .front{backface-visibility:hidden;position:absolute;top:0;left:0;width:100%;height:100%;transition:transform 1s}.card.flipped .back{transform:rotateY(180deg)}.card.flipped .front{transform:rotateY(0deg)}