/* ***** de moi ***** */

#quoi, .conteneur-nav {
	display: inline-block;
	margin: 0.2rem 1rem;
	padding: 0.2rem;
	font-size: 2rem;
	}

#quoi {	/*
	border: solid 5px blue;	*/
	}

#menu, .conteneur-nav {
	float: right;
	}

.sousmenu {	/*
	margin: 1rem;	*/
	}
/* **** Fin de moi ***** */

/*Reset CSS*/
/* *****
*{
    margin: 0px;
    padding: 0px;
    font-family: Avenir, serif;
}
 */
 
nav{
    width: 100%;
    margin: 0 auto;
    background-color: white;
    position: sticky;
    top: 0px;
}
	/*
.conteneur-nav{	
    position: absolute;
    width: 100%;
    margin: 0px;
    padding: 0px;
    font-family: Avenir, serif;
}
	*/
nav input[type=checkbox]{
    display: none;
}

nav label{
    display: inline-block;
    width: 100%;
    padding: 10px 0px;
    text-align: center;
    background-color: gold;
}

nav ul{
    display: none;
    list-style-type: none;
    background-color: #666;
}


nav input[type=checkbox]:checked + ul{
    display: flex;
    flex-flow : column wrap;
    padding: 0px;
}

nav ul li{
    flex: 1 1 auto;
    text-align: center;
}
/*
nav > div > ul > li > a, .deroulant{
    color: white;
}
* */
/*
nav a{
    display: block;
    text-decoration: none;		
}
*/
nav ul > li > a{
    color: white;
}


nav li a {
    padding: 10px 0px;
}

.sous{
    display: flex;
    flex-flow: column wrap;
    z-index: 1000;
}

.sous li{
    flex: 2 2 auto;
    text-align: left;
}
.sous a{
    padding: 6px;
    background-color: #877;	/*
    border-bottom: none;	*/
}
/*
@media screen and (min-width: 980px){
	#quoi, .conteneur-nav {
		display: block;
		margin: 0.2rem;
		padding: 0.2rem;
		}

    .conteneur-nav{
        position: static;
        float: none;
        background: aqua;
    }

    nav label, nav input{
        display: none;
    }
    
	nav input[type=checkbox]:checked + ul, nav ul{
        display: flex;
        flex-flow: row wrap;
        background-color: aqua;
    }

    nav ul li{
        position: relative;
    }
    nav > div > ul > li > a{
        color: black;
    }
    nav a{
        border-bottom: 2px solid transparent;
    }
    nav a:hover{
        color: orange;
        border-bottom: 2px solid gold;
    }
    
    .sous{
        display: none;
        box-shadow: 0px 1px 2px #CCC;
        background-color: white;
        position: absolute;
        width: 100%;
    }
 
    nav > div > ul li:hover .sous{
        display: flex;
        flex-flow: column wrap;
    }
 
    .sous a{
        border-bottom: none;
        background-color: white;
    }

    .sous a:hover{
        border-bottom: none;
        background-color: RGBa(200,200,200,0.1);
    }
    .deroulant > a::after{
        content:" ▼";
        font-size: 12px;
    }
}
* */
/*
.conteneur-contenu{
  margin: 50px 20px;
  height: 1500px;
}
*/