index.css

header {
    display: flex;
    align-items: center;
    justify-content: space-around;
    background-color: lightblue;
    padding:20px;

}

header img {
    border-radius: 50%;
    width:300px;
    height:300px;
}

header h1 {
    font-weight: bold;
    font-family:Verdana, Geneva, Tahoma, sans-serif;

}

nav {
    background-color: blueviolet;
    height: 30px;
    display: flex;
    align-items: center;
}

nav ul {
    display: flex;
    list-style: none;
    margin: 0;
    padding: 0;
    width: 100%;
    justify-content: center;            /* Centraliza os itens no container */
}

nav ul li {
    height:30px;
    width: 100%;
    background-color: rgb(0, 0, 0);  /* Cor de fundo dos itens */
    color: rgb(46, 228, 22);         /* Cor do texto dos itens */
    margin: 0;                         /* Remove a margem para garantir que o fundo ocupe a largura */
    padding: 10px 20px;                /* Adiciona espaçamento interno */
    display: flex;                     /* Faz com que o item se comporte como um container flexível */
    justify-content: center;           /* Centraliza o conteúdo dentro do item */
    align-items: center;                /* Alinha verticalmente o conteúdo */
}