Boa noite gente,
Gostaria de tirar uma dúvida a respeito do não funcionamento do meu Hover. Gostaria de quando passasse o mouse por cima dos botões houvesse a troca de cor e o padding, mas não está funcionando. Fica como se não tivesse utilizando nada, apenas o botão.
GitHub com o Portfolio onde possuo a dúvida: https://github.com/amandaamendoeira
Agradeço desde já,
**No index: **
<div class="apresentacao__links">
<h2 class="apresentacao__links__subtitulo">Acesse minhas redes:</h2>
<a class="apresentacao__links__navegacao" href="https://github.com/">
<img class="tamanho__imagem" src="./assets/github.png">
GitHub</a>
<a class="apresentacao__links__navegacao" href="https://www.linkedin.com/">
<img class="tamanho__imagem" src="./assets/linkedin.png">LinkedIn</a>
<a class="apresentacao__links__navegacao" href="https://www.instagram.com/">
<img class="tamanho__imagem" src="./assets/instagram.png">
Instagram</a>
</div>
E no style.css:
:root {
--cor-primaria: #2c2b2b;
--cor-secundaria: #FFFBF5;
--cor-terciaria: #c183b2;
--cor-hover: #e262b1;
--fonte-primaria: 'Krona One', sans-serif;
--fonte-secundaria: 'Montserrat', sans-serif;
}
.apresentacao__links__navegacao {
display: flex;
justify-content: center;
gap: 16px;
border: 2px solid var(--cor-terciaria);
width: 60%;
text-align: center;
border-radius: 8px;
font-size: 1.5rem;
font-weight: 600;
padding: 21.5px 0;
text-decoration: none;
color: #F6F6F6;
font-family: var(--fonte-secundaria);
.apresentacao__links__link:hover {
background-color: var(--cor-hover);
padding: 3%;
}
