/* partie positionnement et déco
ul a { 
	display:block; 
	color: #fff; 
	text-decoration:none;
}
 */
ul > li,
ul > li li {
	position: relative;
	display:block;
	
}
/* (presque) fin de la partie positionnement/déco */
/* dans cette déclaration, on fixe le max-height */
ul ul {
	position: absolute;
	top: 5em; left: 0;
	max-height:0em;	
	margin: 0; padding: 0;
	background-color: #fff;
	background-color:white; 
	overflow: hidden;
	transition: 1s max-height 0.3s;
	border-radius: 0 0 8px 8px;
}
/* ici on change la valeur de max-height au :hover */
ul > li:hover ul {
	/* à adapter, le minimum est le meilleur mais voyez large 😉 */
	max-height: 13em;
}