/* ***CSS BEGIN*** default_menu (Ne pas modifier cette ligne) */
/* CSS Document */

/********************************************************
 * Designed by Chami webmaster@chami.eu
 * Menu d�roulant
 *
 * Template : default_menu
 * positionnement avec flexbox : https://openclassrooms.com/fr/courses/1603881-apprenez-a-creer-votre-site-web-avec-html5-et-css3/3298561-faites-votre-mise-en-page-avec-flexbox
https://la-cascade.io/flexbox-guide-complet/
https://developer.mozilla.org/fr/docs/Web/CSS/S%C3%A9lecteurs_CSS
 ****************** Template : default ******************/

.navH .default_menu {
	flex-direction: row;
}
.navV .default_menu {
	flex-direction: column;
	align-items: flex-start;
}
.navV .default_menu:first-child {
	margin-top: 2em;
}
/* propriétés communes */
.default_menu {
	display: flex;
	align-items: center;
	justify-content: flex-start;
}
.default_menu li  {								/* tous les 'li' */
	list-style: none;								/* pas de puce */
	padding: .15em .8em;
	width: auto;										/* largeur des boutons */
}
.default_menu li a {
	text-decoration: none;					/* pas de soulignement */
	display: block;									/* �tendre la s�lection à tout le 'li' */
}
/* �l�ments du menu horizontal */
.default_menu > li {							/* les 'li' qui ont pour parent default_menu */
	position: relative;
	background-image: linear-gradient(#aaa, #888 50%, #777 50%,#999);
}
/* sous menus */
.default_menu ul {												/* les 'ul' du conteneur 'menu' (les menus verticaux) */ 
	position: absolute;							/* positionné par rapport au parent positionné en relatif */
	top: 1.5em; left: 0;						/* déplacé sous le menu horizontal */
	margin: 0; padding: 0;
	max-height: 0em;								/* pour qu'ils n'apparaissent pas */
	overflow: hidden;
	background-image: linear-gradient(#eee,#aaa);
	border-radius: 0 0 8px 8px;
	transition: 0.6s max-height 0.2s;
	z-index: 1000;
}
/* ici on change la valeur de max-height au :hover. Elle passe de 0 � la valeur indiqu�e */
.default_menu > li:hover ul {					/* 'li survol�' dont le parent est nav */
	max-height: 13em;										/* � adapter, le minimum est le mieux mais voyez large 😉 */
}
.navH .default_menu > li:first-child {			/* les premiers 'li' de parent 'menu' (premier élément du menu horizontal) */
	border-right: 1px solid #777;				/* Une bordure � droite */
	border-radius: 8px 0 0 8px;					/* coins arrondis � gauche */
	margin-left: 1.5em;
}
.navH .default_menu > li + li {										/* les 'li' placés directement derri�re un li dont le parent est '.default_menu' */
	border-left: 2px solid #bbb;
	border-right: 1px solid #777;
}
.navH .default_menu > li:last-child {							/* le dernier 'li' de parent 'default_menu' (dernier élément du menu horizontal) */
	border-right: 0;
	border-left: 2px solid #bbb;				/* Une bordure à gauche */
	border-radius: 0 8px 8px 0 ;				/* coins arrondis à droite */
}
.navV .default_menu > li {
	border-radius: 8px;					/* coins arrondis partout */
	margin-left: .5em;
}
.default_menu > li > a {											/* les 'li' qui ont pour parent nav */
	color: white;
}
.default_menu > li li a { 			/* les 'li a' contenus dans un li dont le parent a l'id 'menu' (les liens des menus verticaux) */
	color: #522; 
	font-size: 80%; 
}							
.default_menu > li:hover {										/* survol des 'li' du menu horizontal */
	background-image: linear-gradient(#888, #aaa 50%, #999 50%,#777);
}
.default_menu > li li:hover { background-color: #ffe6cc; }	/* survol des 'li' des menus verticaux */
		/* ================================ */
		
@media only screen and (max-device-width:1000px) {
}
@media only screen and (max-device-width:400px) {
}
@media only screen and (max-width:1000px) {
}
@media only screen and (max-width:480px) {
	#canvas .navH {
		display: block;
	}
	#roWrap .navV {
		display: none;
	}
}

/* ***CSS END*** (Ne pas modifier cette ligne) */