The problem is not with the footer. You have this CSS that forces a height of 1100px on the #wrapper
and #subwrapper
elements, which is why it seems like there's something "below" the footer.
#wrapper{
position: absolute;
left: 0px;
top: 240px;
width: 100%;
height: 1100px; /* This is making the page longer than it should be.*/
background: #85bb99;
z-index: -5;
}
#wrapper #subwrapper {
background: url('/themeimages/pattern-cutout.png');
opacity: 0.2;
width: 100%;
height: 1100px; /* Same thing here */
}
It looks like you're using these elements as a background image. You can fix it by trying this CSS instead:
#wrapper{
position: fixed; /* Use fixed positioning so it'll always be displayed */
left: 0px;
width: 100%;
height: 100%; /* Set a height of 100% */
background: #85bb99;
z-index: -5;
}
#wrapper #subwrapper {
background: url('/themeimages/pattern-cutout.png');
opacity: 0.2;
width: 100%;
height: 100%; /* Set a height of 100% */
}