the mystery of the excess padding

This is odd. look at this in IE, and move your mouse over the 'more info' button:

http://ab-twtc2004001.ginger.assanka.com/

If you're seeing the same as me, the space between 'coming soon' and the image is reasonable, but suddenly disappears when you mouse over the button, making the content overlap the header (which is a background image).

The CSS for the hover effect couldn't be simpler:

a.btn_moreinfo:hover {
	background: rgb(23,130,179) url('/lib/inc/imagetext/11125525525500808111510/mtbdro/more+info') no-repeat 50% 30%;
}

This wouldn't seem to me to be causing the problem, but it does trigger it. Incidentally, and possibly related, in order to make the padding a reasonable size in the first place, in IE, I had to do this:

.footer {
	padding: 80px 15px 10px 15px;
	margin: 0;
	color: white;
	clear: both;
}
* html .footer {
	padding: 40px 15px 10px 15px;
}

In Mozilla, the padding is correctly rendered as 80px, but IE doubles it and ends up with 160px, so the second selector gives IE a value which is half what I need, so it can double it and end up with the required 80px.

I get the feeling this is at the root of my problem, and it's an ugly hack in the first place, so any suggestions?

Andrew