<div id="styles">
header {
    width: 100%; /* use the total page width */
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: lavenderblush;
    padding: 5px; /* add some padding */
    border: solid; /* add a black border */
}

nav {
    width: 100%; /* use the total page width */
    display: flex;
    justify-content: space-around; /* distribute the items evenly */
    background-color: lavenderblush;
    padding: 5px; /* add some padding */
    border: 1px solid black;
}

.nav-item {
    width: 18%;
    text-align: center; /* center the text */
    padding: 5px; /* add some padding */
    border: 2px solid black;
    background-color: lemonchiffon;
    padding: 5px; /* add some padding */
}