The shadows are 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 (+ padding etc). This brings the footer into view but makes #wrap start 234px above the top of the viewport.
This is fixed by adding a top border of 234px to #main to soak up the negative space and bring everything back to an even keel.