Expand region to fill screen size I have a splash page where the user will choose a language before entering the site. 
This page only needs the header region and a background image (for the #main-wrapper div) that should occupy the rest of the screen size.

I'm using

#main-wrapper {
    background: url('img.jpg') center no-repeat;
    height: 100%;
    width: 100%;
    background-size: cover;
}


But it doesn't fill the available space, only the #main-wrapper div, so I end up with a grey area below the background image, where the footer should be.


Is there a way to make this region expand all the way to the bottom (I don't need the footer in this particular page) without declaring it's height in px?
I want to avoid scrollbars when not necessary, and have the image fill the space when resizing the window or viewed on mobile. 


Is it possible to do this with Bartik theme?

EDIT:

I've already hidden the footer, but that doesn't make the #main-wrapper div reach all the way to the bottom. I still get a blank space below it.
You could style that special page with css to not display the footer (display:none). Drupal delivers a css class in the body tag that identifies the current node, like so .page-node-x, where x is the node id of the page. So you could go like page-node-x .footer.

You could also use a page.tpl override for the specific page where you remove the footer region. Create a copy of page.tpl.php in your themes template folder and name it page--node--x.tpl.php. Remove footer in this file completely.

And as for fullsize background image, maybe this module could be interesting: https://www.drupal.org/project/supersized