/* This is the CSS for the Horizontal Nav bar */
nav {
    text-align: center;
    margin: 20px 0;
    padding: 5px;
    background-color: rgb(13, 11, 104);
}
nav ul {
    list-style-type: none;
        height: auto;
        background: white;
}

nav ul li {  
    display: inline-block; 
    margin-right: 0.5em;
}

nav ul li a {
    padding: 0.25em 1em;
    text-decoration: none; /* no underline */
    background-color: #509ae4; /* pale bluish white */
    color: #000002; /* dark blue */
    border: 2px solid black;
    
   
}
/*Now add :hover and :focus pseudo-classes so the menu items change color when users point or tab to them:*/
nav ul li a:hover, nav ul li a:focus {
    color: rgb(14, 56, 245);
    background-color: white;
    font-weight: bold;
}
/*You might also need to adjust the style of the nav itself to make the menu fit better, but that's up to you. */
        
   /*Now center the menu  */   
nav ul li a {
    width:100%;
    margin: 0 auto;

}