<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="preconnect" href="<https://fonts.gstatic.com>" crossorigin>
    <link href="<https://fonts.googleapis.com/css2?family=Montserrat&display=swap>" rel="stylesheet">
    <title>Menu simple responsive</title>
</head>
<body>
    <style>

*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
html{
    font-family: 'Montserrat', sans-serif;
}
body{
    background-color: #2e424d;
}

.header{
    display: flex;
    align-items: center;
    justify-content: center;

/* -------------------Logo--------------------- */

}
.logo{
    height: 200px;
    width: 200px;
    border: solid 4px red;
    margin: 2em;
}

/* -------------------------Menu---------------------------- */

.menu{
    display: flex;
    text-decoration: none;
    list-style: none;
}

.header-nav{
    text-align: center;
    margin: 10px 20px 20px 20px;
    overflow: hidden;
    filter: drop-shadow(0px 0px 9px #3B508B);
}

.header-nav a {
    display: block;
    float: none;
	float: left;
	width: 200px;
	padding: 5px 5px;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	color: black;
	text-decoration: none;
	background-color: rgba(255, 255, 255, 0.2);
    margin: 5px;
    list-style: none;
    font-size: 1.5em;
}
    
    
    .header-nav a:hover {
        background-color: white;
    }

/* ----------------responsive-------------------- */

	@media (max-width: 768px){
		.header{
            display: flex;
            flex-wrap: wrap;
        }
	}
    </style>
   <header>
    
    <div class="header">
        <div class="logo">

        </div>
        <div>
            <nav class="header-nav">
                <ul>
                  <li class="menu"><a href="#">Accueil</a></li>
                  <li class="menu"><a href="#">Menu</a></li>
                  <li class="menu"><a href="#">Contact</a></li>
                </ul>
              </nav>
        </div>
       </div>

   </header>
</body>
</html>