How to Create a Unique Overlapping Effect with Background Images

When designing a website, sometimes it is difficult to find the right balance of creativity. You don’t want your design to be too “over the top” but you don’t want to underwhelm your audience either. A great way to add a subtle, yet creative, aspect to your design is with what I call the image overlapping effect (a creative name I know).This overlapping effect makes image icons appear to be elevated when overlapping another element on the page, like a sticker holding a piece of paper to the wall or sealing an envelope. The trick is to position background images on different layers (like sections, rows, and modules) to allow a box shadow to divide the image in half and appear to be elevated at the center.This design works really well for blurb image icons and will also work for adding an image to the side of text module.Article: https://www.elegantthemes.com/blog/divi-resources/how-to-create-a-unique-overlapping-effect-with-background-images