Modular Page Background Image Display

Hello,

I'm using the Hadron v3 theme, which is based on the Quark2 theme.

I've created a modular page and am using the “Hero” class to embed an image in the background.

However, the image isn't displaying correctly; even with the “hero-fullscreen” class, I can only see part of the image.

How can I make the image align flush at the bottom and fade out at the top?

Here is the original image