body { 
background-color: #c4b2a6;
 font-family: Verdana, Calibri, sans-serif;
 margin: 0;
 padding: 0; 
} 
/* MENU PRINCIPAL */
 nav {
 width: 100%;
 background-color: #000000  /* #ffadbc;  rose pastel clair */
 }
 nav > ul { 
margin: 0;
 padding: 0;
 }
 nav li { 
list-style-type: none;
 }
 nav > ul > li {
 float: left;
 position: relative;
 }
 nav > ul::after { 
content: "";
 display: table;
 clear: both;
 } 
nav a { 
display: inline-block;
 text-decoration: none;
 }
 nav > ul > li > a {
 padding: 20px 30px;
 color: #FFF;
 } 
/* SOUS-MENU */ 
.submenu { 
display: none;
 }
 nav li:hover .submenu {
 display: inline-block;
 position: absolute; 
top: 100%;
 left: 0;
 padding: 0;
 z-index: 100000;
 } 
.submenu li {
 border-bottom: 1px solid #CCC;
 }
 .submenu li a {
 padding: 15px 30px; 
font-size: 13px;
 color: #222538;  /* bleu tres foncé bleu nuit anthracite */
width: 270px;
 } 
/* MENU MOBILE */
 .menu-mobile {
 display: none;
 }
 nav input[type=checkbox] {
 display: none;
 } 
nav input[type=checkbox]:checked ~ ul {
 display: block;
 }
 /* RESPONSIVE */
 @media screen and (max-width: 1200px) {
 .menu-mobile { display: block;
 color: #fff;              /* blanc pur*/
 background-color: rgba(29,197,151,0.97); /* vert turquoise vif */
text-align: center; 
padding: 12px 0; 
cursor: pointer;
 z-index: 1000000;
 position: relative;
 }
 nav ul {
 display: none;
 width: 100%;
 } 
nav ul li, nav ul li a { 
width: 100%;
 text-align: center;
 }
 nav ul li a, nav ul li:hover a {
 padding: 10px 0;
 }
 nav li:hover .submenu {
 display: block; position: static;
 } 
}