/* MAIN ICONE */
.log{display:inline-block;
	border-radius:10px 10px;
width:40px;margin:10px;}
.mainmenu{
}
/* 
	merci a r baudet
	raphaelbeaudet.fr/creer-un-menu-responsive-uniquement-en-html-css/
*/
#toggle
{
	display:none;
}
nav
{
	width:80%; margin:0 auto;
}
nav.cl-effect-8 {
}
header{height:60px;margin:0 auto;
	width:95%;
}
#toggle:checked + .mainmenu {
	display: flex;
}
.mainmenu{
	display: flex;
	/*justify-content: space-around;*/
	align-items: center;
	z-index:10;
}
nav a {
	position: relative;
	display: inline-block;
	margin: 15px 5px;
	outline: none;
	color: #111;
	background-color:#424251;
	text-decoration: none;
	text-transform: uppercase;
	letter-spacing: 1px;
	z-index:50;
}
nav a:hover,
nav a:focus {
	outline: none;
}
nav a.active{background-color:#999;}
label, #toggle {
	display: none;
}


@media screen and (max-width:520px) {
	.cl-effect-8 a {
		padding: 10px 20px;
		margin: 3px 5px;
	}
	img.log{display: none;}
	label
	{
		/*c est ceci le burgermenu ...... label!! */
		width: 30px;
		display: flex;
		justify-content: center;
		align-items: center;
		margin: 0 auto;
		/* font-size: 30px; */
		color: white;
		cursor: grab;
	}
	/* smallscreens : cacher barres et afficher tooglle  */
	/* body{background-color:black;} */
	/*display NO MENU : cacher le menu normal */
	.mainmenu{
		display: none;
		flex-direction: column;
	}
	nav a{
		display:flex;width:50%;
		/* background-color:black; */
	}
}