I think that it happens because there isn’t enough content on the page to push below the viewport. So one solution would be to add more content.
That’s the default behaviour of HTML elements; to expand height to fit the content.
You could add this rule to your CSS
html {
background-color: #717171;
}
That should make the white area the same color as the footer so that it won’t appear to be there.
Thanks Martcol!
I will try to figure more content for the page but I did update the CSS so at least it’s the same gray color and not a big white gap!