Where does the excess 20px come from?

Question

I'm developing a website from the ground up and there seems to be an extra twenty (or so) pixels that are displaying at the very bottom of the webpage. Instead of ending at the last element, the page continues and shows the body background. I've tried using Firebug and have fiddled with about every element in the css file, but can't find what is causing the excess pixels to show.

Any help on figuring this out is very much appreciated.

Screenshot of Problem:

Answer 1

its coming from here:

.main-wrap {
    margin-bottom: 20px;
}