body {
    font-family: 'Oxygen', sans-serif;
    font-size: 16px;
    font-weight: 300;
    margin: 0;
    
}

/* Header Stuff Here*/
header {
    background-color: #eaeaea;
    padding: 1rem 2%;   
}

header h1 {
    margin: 0;
    color: #024873;
}

header p {
    margin: 0;
    color: #024873;
    letter-spacing: .5px;
}

/* nav stuff goes here */
nav {
    background-color: #f2b705;   
    
    
}
nav ul{
   list-style-type: none; 
    padding: 0 2%;
    margin: 0;
    display: flex;
    
}


/* Wayfinding You could just do nav a below if you choose */
/* use padding and NOT margin to make sure the entire block is clickable and NOT just the text */

nav ul li a {
    font-size: 1.1rem;
    text-decoration: none;
    color: #024873;
    font-weight: 700;
    display: block;
    padding: .83rem 2rem;
}

nav li.active a {
    background-color: #024873;
    color: #f2b705;    
}

nav a:hover {
    color: #fff;
}


/* stuff for the main */
main {
    padding: 1rem 2%; 
}

main h1 {
  color: #b40412;  
}

main h2 {
  color: #024873;  
    margin-bottom: .2rem;
}

main p {
    color: #2f3133;
    margin: 0 0 .3rem 0;
}

main ol {
    padding: .5rem 3%;
    background-color: #efefef;
}

main dl dt {
    color: #b40412;
    font-weight: 700;
}

main dl dd {
    color: #024873;
    font-size: .9rem;
}

main ul {
    list-style-type: circle;
}

/* to control the distance between two lines of the same paragraph, use line height. to control the distance between two separate items in the list use margin-bottom */

main ul li {
    line-height: 125%;
    margin-bottom: .5rem;
    font-size: .9rem;
}

/* to change the padding do NOT use px but instead divide the pixel number you want by the set font size and that will give you the rem number */

/* border radius rounds the corners really rounded would be good for a button though */

main address {
    font-style: normal;
    background-color: #f2b705;
    padding: .5rem;
    width: 12.5rem;
    border: 1px solid #024873;
    border-radius: 5px;
}

main a {
    color: #024873;
    
}

main a:hover {
    color: rgb(239,0,24);
  }

/* footer stuff here */

footer {
    background-color: #eaeaea;
    text-align: center;
    color: #024873;
    padding: 1rem 0;
    font-size: .8rem;
}

footer a {
  color: #024873;  
    
}