/* partie positionnement et d�co */
@font-face
{
	font-family:'myTahoma';
	src:url('fonts/tahoma.ttf');
}
#menu a {   
    display:block;   
    color: white;
    text-decoration:none;
	font-family:Trebuchet MS, myTahoma;
}  
#menu > li,  
#menu > li li {  
    position: relative;  
    display:inline-block;  
    width: 130px;  
    padding:8px;  
    background-color: #777;  
    background-image: linear-gradient(#aaa, #888 50%, #777 50%,#999);  
} 
#menu >li>a
{
	text-align:center;
}
#menu > li li { background: transparent none; }  
#menu > li li a { color: rgb(100,100,100); }  
#menu > li li:hover { background: orange; }  
#menu > li:first-child {  
    border-right: 1px solid #777;  
    border-radius: 0 0 0 8px;
	margin-left:-25px;/*Margin pour compenser une marge invisible*/
}  
#menu > li + li {  
    border-left: 1px solid #aaa;  
    border-right: 1px solid #777;  
}  
#menu > li:last-child {  
    border-right:0;  
    border-left: 1px solid #aaa;  
    border-radius: 0 0 8px 0 ;
} 
#menu > li
{
	margin-left:-5px;
	
}
#menu > li:hover {  
    background-color: #999;
    background-image: linear-gradient(#ccc, #aaa 50%, #999 50%,#bbb);  
}  
/* (presque) fin de la partie positionnement/d�co */  
/* dans cette d�claration, on fixe le max-height */  
#menu ul {  
    position: absolute;  
    top: 2.3em; left:0;  
    max-height:0em;   
    margin:0; padding:0; margin-top: -2px; 
    background-color:#ddd;  
    background-image: linear-gradient(#fff,#ddd);  
    overflow:hidden;  
    transition: 1s max-height 0.3s;  
    border-radius: 0 0 8px 8px;  
}  
/* ici on change la valeur de max-height au :hover */  
#menu > li:hover ul {  
    /* need an adaptation, lower is better, but see it large   */  
    max-height:30em;  
}