Decidi personalizar o menu queu eu acabei adiantando no codigo:<br><br>**html:**<br> ````<br> <header class="menu"><br> <nav><br> <ul><br> <li><a href="#" rel="nofollow">In

Personalizacao do meu menu hover | HTML e CSS: cabeçalho, footer e variáveis CSS

Decidi personalizar o menu queu eu acabei adiantando no codigo:

html:

<header class="menu">
   <nav>
     <ul>
       <li><a href="#">Inicio</a></li>
       <li><a href="#">Produtos</a></li>
       <li><a href="#">Especialidades</a></li>
     </ul>
   </nav>
 </header>

css

/*header*/
.menu nav ul {
   justify-content: center;
   display: flex;             
   list-style: none; 
   padding: 0;
   margin: 0;
   gap: 20px;                  
 }

 .menu nav li{
   list-style: none;
 }

 .menu nav a {
   display: inline-block;
   text-decoration: none;
   padding: 10px 18px;
   border-radius: 5px;
   color: #6A5952;
   background-color: transparent;
   transition: color 0.3s ease;
 }

 .menu nav a:hover {
   color: var(--marrom-link);
 }