JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1"/>
    <link rel="stylesheet" href="css/normalize.css"/>
    <link rel="stylesheet" href="css/style.css"/>
    <title></title>
</head>
<body>

<Header>
    <img id="logo" src="img/caseywoelfle.svg" alt="Logo"/>
    <nav class="clearfix">
        <ul class="clearfix">
            <li><a href="index.html">home</a></li>
            <li><a href="about.html">about me</a></li>
            <li><a href="portfolio.html">portfolio</a></li>
            <li><a href="contact.html">contact</a></li>
        </ul>
        <a href="#" id="pull">Menu</a>
    </nav>
</Header>

<div id="homepage">

    <div id="banner">
        <img id="bannerLogo" src="img/caseywoelfle.svg" alt=""/>

        <p id="wd">web development</p>

        <a id="fomLink" style="display:block" href="about.html">

            <div id="fom">
                <p>find out more</p>
            </div>
        </a>

</div>

<footer>

</footer>

</body>
</html>

CSS

header {
  height: 70px;
  width: 100%;
  background: url("../img/header.svg");
  background-size: cover; }

  header #logo {
    float: left;
    display: inline-block;
    margin: 10px 0 0 50px;
    width: 112px;
    height: 50%; }

  header nav {
    float: right;
    margin-right: 50px;
    display: inline-block;
    height: 70px;
    width: 435px; }

    header nav a#pull {
      display: none; }

    header nav ul {
      padding: 0;
      margin: 0 auto;
      width: 600px;
      height: 70px; }

      header nav ul li {
        line-height: 70px;
        margin: 0 15px;
        display: inline;
        list-style: none; }

        header nav ul li a {
          text-decoration: none;
          text-transform: capitalize;
          font-family: Helvetica;
          font-size: 20px;
          color: #ffffff;
          line-height: 35px; }

@media screen and (max-width: 584px) {
  header {
    height: 200px; }

    header #logo {
      display: block; }

    header nav {
      width: 100%;
      height: 80px;
      margin: auto; }

      header nav ul {
        width: 100%;
        display: block;
        height: auto;
        margin: auto; } 
    }