Transparent Text Box Client

The first problem I have encountered whilst creating my clients website is with the transparent text box on the homepage. I have put in a temporary solution where I have literally used an image of the semi transparent box with the wooden flooring behind it, but I would like to find a way to have a properly transparent box.

It currently looks like this;


You can see that is isn't correctly aligned. Most people when browsing the site would not notice it, and would probably be distracted by the text. I searched around online and found this tutorial; http://www.w3schools.com/Css/css_image_transparency.asp. It shows how to alter the opacity of an image to make it transparent, but the same principles can be applied to a div box. I had a go at implementing a similar code for div's and came up with this;


Now when I look at this div on a page in Chrome it comes out as below and you can see there are no longer problems with alignment of the background. I suspect however that there would be problems when this is viewed in IE.