The full length image background is applied to the #wrap div, which is itself positioned after the header. It is 100% high and therefore goes below the fold.

The header and footer are a fixed height and therefore #wrap has a negative top margin equal to the header and footer height. This brings the footer into view but makes #wrap start above the top of the viewport.

This is fixed by adding a top border to #main to soak up the negative space and bring everything back to an even keel.

Left Column