Centralizar menu

HTML

<div>
    <ul class="menu">
        <li><a href="#">Home</a></li>
        <li><a href="#">Sobre</a></li>
        <li><a href="#">Fotos</a></li>
        <li><a href="#">Localização</a></li>
        <li><a href="#">Contato</a></li>
    </ul>
</div>

CSS

*{ margin: 0;padding: 0; }
ul.menu li{
    display:flex;
    flex-direction:row;
    justify-content:center;
    align-items:center;
}
}
ul.menu li a{
    background-color: #3d7bb3;
    border-radius: 6px;
    padding: 6px 10px;
    color: #fff;
}
ul.menu li a:hover{
    background-color: #8BBADC;
}