Menu tem texto com CSS

Galera, boa noite!

Bom, estou montando um layout e quero colocar estes links abaixo do meu menu principal.

.menu2 li { list-style: none;
 display: inline;
}

.menu2 li a {

 padding: 10px 15px;
 text-decoration: none;
 color: #fff;
 padding: 0px 30px 0px opx;
 top: 377px;
 font:"Letter Gothic Std"

}

.menu2 li a:hover {

 color: #000;
 text-decoration: none;
}

.menu2 li a:active {

 color: #000;

}

<nav class="menu2">
 <ul>
 <li><a href="#">LOCAIS</a></li>
 <li><a href="#">TRABALHOS / DESIGN</a></li>
 <li><a href="#">PATROCINIOS</a></li>
 <li><a href="#">TRANSMISÃO AO VIVO</a></li>
 <li><a href="#">INSPIRAÇÕES</a></li>
 </ul>
</nav>

Deve fica assim

LOCAIS TRABALHOS / DESIGN PATROCINIOS TRANSMISÃO AO VIVO INSPIRAÇÕES

Bom, cada menu tem 30px de espaçamento, está a topo:377px e distancia das laterais de 356 px. Pretendo deixar branco com um hover preto.

1º Poderiam ajudar a corrigir este code?

2º Busco também ideias para um possível efeito no mesmo, talvez um brilho dourado que passa na mesma quando seleciona.

Bom, oque vcs acham?