Css problem - can you help please?

I am currently working on my first css layout and i have hit a small problem. I have a container div which holds all the other divs - these being three divs that hold images and a further div that holds text over my central div. The problem is that when i test the page in firefox, there is a gap between the top and middle images but it looks fine in internet explorer. I am going to post the file so you can see the problem. To me it is unfixable but i’m sure someone with css knowledge will spot my mistake at once.