.card-container-3 {
    perspective: 1000px;
    width: 200px;
    height: 300px;
}
.card-3 {
    position: relative;
    width: 100%;
    height: 100%;
    transform-style: preserve-3d;
    transition: transform 0.6s;
}
.card-3.flip-3 {
    transform: rotateY(180deg);
}
.card-3 .front-3, .card-3 .back-3 {
    position: absolute;
    width: 100%;
    height: 100%;
    backface-visibility: hidden;
}
.card-3 .front-3 {
   
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
}
.card-3 .back-3 {
    background-color: #f1f1f1;
    color: black;
    display: flex;
    align-items: center;
    justify-content: center;
    transform: rotateY(180deg);
}
.flip-button-3 {
    margin-top: 20px;
}