.card-container{position:relative;height:400px;perspective:1000px}.card{position:relative;width:100%;height:100%;text-align:center;transition:transform .8s;transform-style:preserve-3d;cursor:pointer}.card.flipped{transform:rotateY(180deg)}.card-back,.card-front{position:absolute;width:100%;height:100%;-webkit-backface-visibility:hidden;backface-visibility:hidden;border-radius:.75rem;overflow:hidden}.card-front{background-color:#fff}.card-back{background-color:#000;box-shadow:0 0 10px 0 #8c0ff3;transform:rotateY(180deg)}.card-back *,.card-front *{transform-style:preserve-3d}.card:hover{transform:scale(1.02);transition:transform .2s ease}.card.flipped:hover{transform:rotateY(180deg) scale(1.02)}