Css3 hover et effet sur autre bloc

Bonjour à toutes et à tous

Je doit réaliser un site en xml. J'ai fait un design comme maquette en html et css.
Le problème c'est que lorsque le menu déroulant se déplie il devient invisible car le logo xml est de la même couleur
je voudrais que lorsque la souris passe sur la navigation le bloc en dessous contenant le logo xml fasse une rotation de sorte à laisser la place au menu déroulant.
j'ai tester la rotation en l'applicant sur le bloc même où il y a le logo et ça fonctionne.
voici le code :

#bloc_header-down:hover {
	transition: background 2s, transform 2s;
	-moz-transition: background 2s, -moz-transform 2s;
	-webkit-transition: background 2s, -webkit-transform 2s;
	-o-transition: background 2s, -o-transform 2s;
	-moz-transform: rotate(50deg);
	-webkit-transform: rotate(50deg);
	-o-transform: rotate(50deg);
	transform: rotate(50deg);
}

mais lorsque je fais

nav ul li:hover + #bloc_header-down {
	transition: background 2s, transform 2s;
	-moz-transition: background 2s, -moz-transform 2s;
	-webkit-transition: background 2s, -webkit-transform 2s;
	-o-transition: background 2s, -o-transform 2s;
	-moz-transform: rotate(50deg);
	-webkit-transform: rotate(50deg);
	-o-transform: rotate(50deg);
	transform: rotate(50deg);
}

cela ne fonctionne pas...bon je maîtrise pas encore css3 à merveille
voici un lien
http://essai-xml.franceserv.com/index.html

merci de vos réponse et bon week end