background de <p> no se superpone

[cronosmen]

Buenas compañeros, estoy teniendo una dificultas, estoy haciendo que un <p> salga por encima de una imágen, este <p> tiene un background, el texto si que sale, pero el background de <p> no se super pone, pongo una imágen explicativa, mas vale una imágen que mil palabras:



Este es mi css

Código CSS:

/*transfondo de la imágen*/
#contenedor #banner_rotator {
    clear:both;
    margin:0;
    padding:0;
    margin-top:5px;
    float:left;
    width:600px;
    height:245px;
    background:url('../img/bg_banner_rotator.png');
    background-repeat:no-repeat;
}
 
/*Imagen del mes*/
#contenedor #banner_rotator img.img_mes{
    margin:0;
    padding-left:4px;
    padding-top:5px;
    width:592px;
    height:231px;
}
 
/*Texto de la imágen del mes con el fondo azul */
#contenedor #banner_rotator p.img_mes_dos {
    z-index:100;
    margin-top:-40px;
    margin-left:60px;
    padding:11px;
    background:url('../img/bg_imagen_mes.png');
    background-repeat:no-repeat;
    width:184px;
    height:54px;
    color:white;
}