body{margin:0;background:#6a1d47}.center{-webkit-transform:translate(-50%, -50%);-ms-transform:translate(-50%, -50%);transform:translate(-50%, -50%);left:50%;top:50%;position:absolute}.card{-webkit-transform-style:preserve-3d;transform-style:preserve-3d;display:block;width:240px;height:400px;-webkit-transition:240ms ease;-o-transition:240ms ease;transition:240ms ease}.card:after{-webkit-transition:240ms ease;-o-transition:240ms ease;transition:240ms ease;background-image:url(shadow.png);background-size:cover;width:100%;height:100%;position:absolute;top:50%;left:50%;content:'';-webkit-transform:translate(-60%, -50%);-ms-transform:translate(-60%, -50%);transform:translate(-60%, -50%);z-index:-10;opacity:0}.card *{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.card img{width:inherit;display:inline-block}.card:hover{-webkit-transform:rotateY(15deg) rotateX(2deg);transform:rotateY(15deg) rotateX(2deg)}.card:hover:after{opacity:0.25}.card.flipped{-webkit-transform:rotateY(180deg)!important;transform:rotateY(180deg)!important}.card.flipped:after{display:none}.back,.front{position:absolute;height:100%;width:100%;text-align:center;-webkit-backface-visibility:hidden;backface-visibility:hidden;overflow:hidden}.back{-webkit-transform:rotateY(180deg);transform:rotateY(180deg)}.back-overlay{position:absolute;margin:32px;color:#ffffff;max-height:100%}