Всем привет. Никак не могу понять как сделать верхнее меню шапки шириной равной желтой ширине сайта, но чтобы серый фон меню так и оставался во всю ширину экрана. Подскажите пожалуйста, всю голову уже сломал
header {
display: flex;
align-items: center;justify-content: space-around;
height: 60px;
background: #eee;
}
.main { height: 100vh;
width: 70%;
background: #f7c244;
margin: 0 auto;}
<header>
<a href="/">LOGO</a>
<a href="#">Ссылка</a>
<a href="#">Ссылка</a>
<a href="#">Ссылка</a>
<a href="#">Ссылка</a>
<a href="#">Ссылка</a>
<a href="#">Войти</a>
<a href="#">Регистрация</a>
</header>
<div class="main"></div>