.flip-card{display:flex;align-items:center;justify-content:center;perspective:500px}.content{position:absolute;width:100%;height:100%;transition:transform 1s;transform-style:preserve-3d}.flip-card:hover .content{transform:rotateY(180deg);transition:transform .5s}.front-text,.back-text{position:absolute;height:100%;width:100%;backface-visibility:hidden;display:flex;align-items:center;flex-direction:column;text-align:center;padding:10px}.back-text{transform:rotateY(180deg);justify-content:center}@media(max-width:767px){.flip-card{margin:20px 0}.front-text{padding:10px 0}.back-text{padding:0}}