Flip Box Block

Flip Box Block options:

• Position – set the block position to left, center or right. This option is available at the top block options panel.
• Rotate – choose in which direction will the flip box rotate. Choose from left, right, up, down.
• Max. width – you can set a maximum width to your flip box.
• Min. height – you can set a minumum height to your flip box.
• Class – add a custom CSS class to your flip box.
• ID – add a custom CSS ID to your flip box.
• Style – add an inline CSS style to your flip box.

Each Flip Box Block has two Flip Box Card Blocks – one visible and one hidden (which is visible on mouse hover).

Flip Box Card Block options:

• Top padding – add top padding using any CSS-compatible padding value.
• Right padding – add right padding using any CSS-compatible padding value.
• Bottom padding – add bottom padding using any CSS-compatible padding value.
• Left padding – add left padding using any CSS-compatible padding value.
• Text align – set text alignment to left, center or right.
• Vertical align – choose the vertical alignment of the flip box card’s content from top, center and bottom.
• Text color – set the text color of the card’s content.
• Border width – set the card’s border width in pixels.
• Border color – set the card’s border color.
• Background color – set the card’s background color.
• Background hover color – set the card’s background hover color.
• Background image – add a background image. Use an image from your WordPress Media Library or upload a file from your computer.
• Parallax effect – you can add a parallax effect to your block.
• Background size – set the card’s background size. Choose from auto, cover, contain, or add a custom value.
• Custom background size – set a custom card background size using any CSS-compatible background-size value.
• Repeat background – you can choose to repeat the background image, to repeat just horizontally or just vertically, or not to repeat at all.
• Background position – set your background position using one of the available position values.
• Background gradient – you can set the background colors to gradient.
• Background gradient color – set the background gradient color of your card.
• Background color position – set the card’s background color position.
• Background gradient color position – set the card’s background gradient color position.
• Background gradient type – set the background gradient type from linear and radial.
• Background gradient angle – set the background gradient angle using 0-360 degrees. This option is available with the linear gradient type.
• Background gradient position – set the background gradient position. This option is available with the radial gradient type.
• Use shadow – enable or disable card’s shadow.
• Shadow color – set the color of the shadow.
• Shadow blur – set the blur of the shadow.
• Horizontal offset – set the horizontal offset of the shadow.
• Vertical offset – set the vertical offset of the shadow.
• Class – add a custom CSS class to your flip box card.
• ID – add a custom CSS ID to your flip box card.
• Style – add an inline CSS style to your flip box card.

You can add any content or any other block to each card.