Bottom position footer in Gantry

Hi.
In Gantry (with Grav), if I want to fixed footer section in bottom of page (without sticky effect), I have to configure in css this:

 #g-footer {
    position: absolute;
    bottom: 0;
    width: 100%;
    z-index: 999;
}

But the last section before footer (in Hydrogen Theme this is Subfeature Section), appears behind the footer section. You can see in the screenshot:

However, without this css code, the footer and the last section keep their spacing:
.

I would like the footer to always appear at the bottom of the page, but without being fixed. There are pages with little content, in which the footer does not appear at the end, and they seem ugly. (Look at the image below)

I would like it to appear like this:

How can I get this without the footer section hiding the previous one?

Thanks in advance.

I use Grav with the same theme, and what to do something similar.

But I cannot seem to find the correct custom.scss file to add this to. Where should it be placed?

Hi.

The custom.scss file is in:

user/data/gantry5/themes/yourtheme/scss

Replace "yourtheme" to your theme name (g5_hydrogen, g5_hydrogen_child, etc)

Thank you so much for getting back to me, I realize it's an "old thread".

I could have sworn that's where I've placed it, and not having it work. But, of course, just because I asked the question here, it does work now. Thank you again.

It isn't an old thread.

Have you read the gantry 5 documentation about this?

https://docs.gantry.org/gantry5/tutorials/adding-a-custom-style-sheet

You'll need to import _dependencies.scss into your custom.scss at first:

@import "dependencies";

It works fine how I indicated you.