1) Axe 90% of your comments, they could be tripping rendering bugs in IE should the comments end up between two floats - in fact I'm seeing the double-render bug here in IE6.
Not only are you plagued with "Oh, no ****" comments like:
<!-- FOOTER -->
Useless pointless comment.
The placement of the "end of" ones are more likely tripping the rendering bugs I'm seeing here in 6. You don't need to say "end of", that's what </div> MEANS... So just move it BEFORE the element close - and toss the CSS sigils in so you know if it's closing a class or ID.
<!-- #footer --></div>
Dropping the opening comments as useless and replacing the closing comments with the style I showed above will at least eliminate the IE6 problems... As to 7... I'm not sure what's going on, but:
... are a good idea for image URL's.
When you have 18k of markup to deliver 676 BYTES of content on the page, you've got an overcomplicated mess that most developers would have to dump two thirds of which on the cutting room floor before even TRYING to fix it - though that kind of goes without saying with all that jquery animated nonsense and half a megabyte page sizes.