Ordre des divs ou bug opacity

Salut,
voila il y a un truc que ne comprend pas avec mes divs.
j'explique :

HTML :

<div id="fine">
<div id="headerA"></div>
<div id="logo"><div id ="rond1"></div></div>
</div>

et le CSS

#fine {
width:970px;
height:170px;
margin: 0px auto 0;

}

#logo {
margin-left:30px;
margin-top:-82px;


}
#rond1 {
width:70px;
height:70px;

background-color: #FFFFFF;

-moz-border-radius: 35px;


}
#headerA {
width:970px;
height:170px;

background-color: #000000;
opacity:0.8;




}

voila, mon probleme est que mon div "rond1" est systématiquement en dessous de "headerA".
J'ai beau changer l'ordre dans le HTML et le CSS, ca ne résoud pas mon problème, qui viendrait du "opacity"
si quelqu'un a une idée ce serait cool.

Merci