p {
   color: white;
}

html {
   margin: 0;
   padding: 0;
   width: 100%;
   height: 100%;
   color: #f5f7fa: 
}

body {
   background-image: url("../img/herobanner.png");
   margin: 0;
   padding: 0;
   /* 1. Prevents the image from tiling/repeating */
    background-repeat: no-repeat;

    /* 2. Forces the image to stretch/shrink to completely fill the container */
    background-size: cover;

    /* 3. Keeps the image centered so it crops evenly on different screens */
    background-position: center;

    /* Optional: Keeps the background fixed in place while scrolling */
    background-attachment: fixed;
}



.nav_bar ul {
   margin: 0;
   position: fixed;
   top: 0;
   width: 100%;
   list-style-type: none;
   margin: 0;
   overflow: hidden;
   background-color: white;
}

.nav_bar ul li {
   float: left;
} 

.nav_item {
   display: block;
   color: #043b62;
   text-align: center;
   padding: 18px 16px;
   text-decoration: none;
   font-size: 14px;
}

.nav_item:hover {
   color: #00b4e5;
}

.logo {
   height: 54px;
   width: auto;
   padding: 0;
}

/* HEX for dark blue:   #043b62   */
/* HEX for light blue:  #00b4e5   */
/* HEX for medium blue: #008fbe   */
/* HEX for white: #f5f7fa   */