CSS for Building A Flipbox In WordPress With Oxygen

flipbox.css

.flipbox {
position: relative;
}

.flipbox__front,
.flipbox__back {
 transition: 0.7s all ease-in-out;
 backface-visibility: hidden;
}

.flipbox__front {
    transform: rotateY(0deg);
      transform-style: preserve-3d;
}

body:not(.ng-scope) .flipbox__back {
    position: absolute;
      transform: rotateY(180deg);
      transform-style: preserve-3d;
}

body:not(.ng-scope) .flipbox:hover .flipbox__front {
    transform: rotateY(-180deg);  
}

body:not(.ng-scope) .flipbox:hover .flipbox__back {
     transform: rotateY(0deg); 
}

.flipbox__front *,
.flipbox__back * {
 transform: translateZ(60px);
 backface-visibility: hidden;
}