/* 1) Estilizando o cabeçalho */
.cabecalho {
background-color: #000000;
padding: 24px;
}
.cabecalho__menu {
display: flex;
justify-content: center;
gap: 32px;
}
.cabecalho__menu__link {
font-family: 'Montserrat', sans-serif;
font-size: 18px;
color: white;
text-decoration: none;
padding: 8px 16px;
transition: color 0.3s ease;
}
.cabecalho__menu__link:hover {
color: #22D4FD;
}
/* 2) Ajuste do padding da apresentação */
.apresentacao {
padding: 5%;
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
gap: 80px;
}
/* 3) Comentado o height que atrapalhava o layout /
/ body {
height: 100vh;
} */
body {
margin: 0;
font-family: 'Montserrat', sans-serif;
background-color: #000000;
color: white;
}
/* Estilos dos links com ícones (Github, LinkedIn, Twitch) */
.apresentacao__links__link {
display: flex;
justify-content: center;
align-items: center;
gap: 16px;
padding: 16px 24px;
text-decoration: none;
font-family: 'Montserrat', sans-serif;
font-weight: 600;
background-color: #000000;
color: white;
border-radius: 8px;
transition: all 0.3s ease;
}
.apresentacao__links__link:hover {
border: 2px solid #0000FF;
background-color: #272727;
cursor: pointer;
}
/* Rodapé personalizado */
.rodape {
background-color: #22D4FD;
color: #000000;
text-align: center;
font-family: 'Montserrat', sans-serif;
font-size: 24px;
font-weight: 400;
padding: 24px;
}