Texto bug no Mozilla/Chrome

Texto no IE e no Chrome/Mozilla ficam em posições diferentes, no IE fica como eu quero que fique, nos outros navegadores buga.

Code ta pela metade, só pra terem uma ideia de como to fazendo

CSS

#clientefull{
	width:260px;
	margin-left:25px;
	height:450px;
	float:left;
}
#titulocliente{
	height:25px;
	width:190px;
	background-color:#36C;
	margin-left: 25px;
	position: relative;
	text-align: center;
	color: #FFF;
	font-family: Verdana, Geneva, sans-serif;
	top:40px;
	font-size: 20px;
	padding:4px;
}
#cliente{
	width:260px;
	height:200px;
	background-image:url(images/balon.png);
	position:relative;
	top:40px;}
#opnio{
	width:200px;
	height:100px;
	margin-left:auto;
	margin-right:auto;
	margin-top:24px;
	color: #FFF;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 19px;
	text-align: center;
}

HTML

<div id="clientefull">
 <div id="titulocliente">Opnião do<span class="italic"> Cliente</span></div>
 <div id="cliente">
 <div id="opnio">Ótimo,simples e objetivo,satisfação total,trabalho concluido com rapidez e eficiencia!</div></div>
</div>
</div>

direita IE // Esquerda Chrome

é isso, espero que tenham intendido.