XF 2.2 How to add "floating effect" to node blocks?

[gogo]

For example, I would like change the following blocks:



to something like this:



Note that it's not a zoom in effect, contents in the blocks do not move or zoom. It's only some shadows are added to the blocks to make it look like raising from background.

I can do the grids with the help of an add-on. But how do I make the mouse-over effect like that? That is the block looks floating a bit whenever I put mouse over it.

The website is: https://www.neogaf.com/

 

[Old Nick]

Maybe you can apply box-shadow settings to the blocks with something like that... Adjust the settings of the box-shadow as desired

.block {
    box-shadow: 1px 1px 5px #555;
}
.block:hover {
    box-shadow: 1px 1px 12px #555;
}