style.css\

header {
    background: pink;
    /* review centering things with css */
    text-align: center;
}


nav ul {
    /* temporary css that clarifies how the nav ul element works  */
    border: 1px solid magenta;
    /* removes the dots in the list for the navbar */
    list-style: none;
    /* uses flexbox for the element and puts it on the same horizintal line */
    display: flex;
    /* Makes it so the navbar doesn't have space on the left and right side */
    padding: 0;
    /*
    Don't use "justify-content: space-between;" or witdh...
    because there could be multiple navbar links and it won't work.
    The solution is to use margin in the  navbar links
    */
}

.searchform{
    /* uses flexbox and puts the word search + the search form and the search button on one horizintal line */
    display: flex;

}

nav li {
    /* temporary css that clarifies how the  element works   */
    border: 2px dotted orange;
    /* add margin to the left and right side */
    margin: 0, 10em;
}

nav a, .searchform {
    /* temporary css that clarifies how the elements works  */
    border: 3px solid green;
    /* Makes  text bigger to better align with the navbar*/
    font-size: 1.35rem;
}