JSFiddle - React, Tailwind, and code Playground

HTML

<!-- HEADER -->

  <header>
    <div class="headerBox">
      <div class="container">
        <nav>
          <ul class="clearfix">
            <li><a href="index.html" class="name"><span>Company name</span></a></li>
            <li><a href="account.html" class="account"><span>Account</span></a></li>
          </ul>
        </nav>
      </div>
    </div>
  </header>

  <!-- PAGE TITLE -->

  <div class="clearfix">
    <section class="page-title">
      <div class="container">
        <h1>Page Title</h1>
      </div>
    </section>
  </div>

  <!-- NAVIGATION BAR -->

  <div class="navigationBox">
    <div class="container">
      <ul class="clearfix">
        <li><a href="menu-option-1.html" class="menu-item"><span>Menu Option 1</span></a></li>
        <li><a href="menu-option-2.html" class="menu-item"><span>Menu Option 2</span></a></li>
      </ul>
    </div>
  </div>

CSS

/* HEADER */

.clearfix::after {
  content: "";
  clear: both;
  display: table;
}

header .headerBox {
  background-color: #000000;
  width: 100%;
  min-height: 50px;
}

.container {
  width: auto;
  margin-left: 10%;
  margin-right: 10%;
}

header .name {
  font-family: 'Helvetica', sans-serif;
  font-weight: normal;
  color: #ffffff;
  float: left;
  margin-top: 10px;
}

header .account {
  font-family: 'Helvetica', sans-serif;
  font-weight: normal;
  color: #ffffff;
  float: right;
  margin-top: 10px;
}

/* PAGE TITLE */

.page-title {
  width: 100%;
  color: #000000;
  font-family: 'Helvetica', sans-serif;
  font-weight: normal;
  text-decoration: none;
  font-size: 35px;
  float: left;
  padding: 0 0 0 0;
  margin: 80px 0 80px 0;
  background-color:green;
  color:white;
}

/* NAVIGATION BAR */

.navigationBox {
  background-color: rgba(80, 120, 180,1);
  width: 100%;
  height: 32px;
}

.menu-item {
  color: #000000;
  font-family: 'Helvetica', sans-serif;
  font-weight: 300;
  text-decoration: none;
  font-size: 16px;
  float: left;
  padding: 0 0 0 0;
  margin: 0 120px 0 0;
}

ul {
  margin: 0 0 0 0;
  padding: 0 0 0 0;
}

li {
  display: inline;
  margin: 0 0 0 0;
  padding: 0 0 0 0;
}