header.html

<header>
  <nav class="navbar navbar-expand-md navbar-light">
    <div class="navbar-container">
      <div class="logo-button-container">
        <a class="navbar-brand" href="index.html">
          <img src="images/logo.png" alt="image" class="logo">
        </a>
        <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
          <span class="navbar-toggler-icon"></span>
        </button>
      </div>
      <div class="container-header">
        <div class="collapse navbar-collapse" id="navbarNav">
          <div class="menu-items navbar-nav">
            <div class="menu-items navbar-nav">
              <a href="index.html" class="menu-item nav-link">Home</a>
              <a href="temp.html" class="menu-item nav-link">Global Temperatures</a>
              <a href="https://earth.org/water-scarcity-in-africa/" class="menu-item nav-link">Water Scarcity</a>
              <a href="https://bluepump.com/" class="menu-item nav-link">BluePump</a>
          </div>
        </div>
      </div>
    </div>
  </nav>
</header>