I am trying to create a div w/ a non-transparent table head and a td transparent content area. The code I have works in IE but not Firefox. Firefox picks up the transparency. Does anyone have any suggest?

<div id="msgBrd" style="width: 250px; border: 2px solid black;">
<table style="width: 100%; font-size:x-small; font-family:Arial, Helvetica, sans-serif;" cellpadding="0" cellspacing="0">
<tr style="background-image: url('slcHdrBkg.gif'); color:white; font-weight:bold; vertical-align:">
<td style="padding: 3px;">
<span id="camMsg" style="font-weight: bold; font-size:small;">Title Here</span>
</td>
<td align="right" style="padding: 3px;">
<span style="font-weight: lighter">[close]</span> &nbsp;<img alt="close" src="x.gif" width="15" height="15" />&nbsp;
</td>
</tr>
<tr>
<td colspan="2" style="width: 250px; border: 2px solid black; background-color:#666666; filter:alpha(opacity=40); -moz-opacity:.40; opacity:.40;">
<div style="z-index: 100; position:relative; margin:5px;">
Content Area
</div>
</td>
</tr>
</table>
</div>