.flip-container {
    height: 150px;
    width: 100%;
    perspective: 1000px;
    position: relative;
    left: -2px;
}

.flipper {
    position: relative;
    transition: transform 0.6s;
    transform-style: preserve-3d;
}

.front, .back {
    position: absolute;
    width: 100%;
    height: 100%;
    backface-visibility: hidden;
    _display: flex;
    _justify-content: center;
    align-items: center;
    _border: 1px solid #ddd;
    _border-radius: 8px;
}

.front {
    z-index: 2;
}

.back {
    transform: rotateY(180deg);
}

.flipped {
    transform: rotateY(180deg);
}