Template:Scratchpad/Style.css

.flip-card {
width: 160px;
height: auto;
background: var(--color-surface-1);
border: 1px solid #ffffff1a;
/* perspective: 400px; */
}

.flip-card-inner {
position: relative;
width: 100%;
height: 100%;
transition: transform 0.8s;
/* transform-style: preserve-3d; */
}

.flip-card:hover .flip-card-inner {
/* transform: rotateY(180deg); */
}

.flip-card-front, .flip-card-back {
position: absolute;
width: 100%;
height: 100%;
/* -webkit-backface-visibility: hidden; */
/* backface-visibility: hidden; */
}

.flip-card-front {
color: #cff;
font-weight: 700;
font-size: 1.25em;
}

.flip-card-back {
background-color: var(--color-surface-2);
font-size: 0.8em;
/* transform: rotateY(180deg); */
}