JSFiddle - React, Tailwind, and code Playground

HTML

<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <title>Tyler</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link href="https://fonts.googleapis.com/css?family=Indie+Flower" rel="stylesheet">
    <link rel="stylesheet" href="style.css">
  </head>
  <body>
    <header>
      <a href="index.html" class="header-brand">bioxm</a>
      <nav>
        <ul>

          <li><a href="portfolio.html">Portfolio</a></li>
          <li><a href="about.html">About Me</a></li>
          <li><a href="contact.html">Contact</a></li>
        </ul>
        <a href="cases.html" class="header-cases">Cases</a>
      </nav>
    </header>
    <main>
      <section class="index-banner">
        <h2>I AM A FREELANCE WEB<br>DEVELOPER</h2>
        <h1>With specialty in back-end development, functionality, UX design, and Search Engine Optimization</h1>
      </section>
    </main>
    <footer>

    </footer>
  </body>
</html>

CSS

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
    margin:0;
    padding:0;
    border:0;
    outline:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}

body {
    line-height:1;
}

article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section {
    display:block;
}

nav ul {
    list-style:none;
}

blockquote, q {
    quotes:none;
}

blockquote:before, blockquote:after,
q:before, q:after {
    content:'';
    content:none;
}

a {
    margin:0;
    padding:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}

/* change colours to suit your needs */
ins {
    background-color:#ff9;
    color:#000;
    text-decoration:none;
}

/* change colours to suit your needs */
mark {
    background-color:#ff9;
    color:#000;
    font-style:italic;
    font-weight:bold;
}

del {
    text-decoration: line-through;
}

abbr[title], dfn[title] {
    border-bottom:1px dotted;
    cursor:help;
}

table {
    border-collapse:collapse;
    border-spacing:0;
}

/* change border colour to suit your needs */
hr {
    display:block;
    height:1px;
    border:0;
    border-top:1px solid #cccccc;
    margin:1em 0;
    padding:0;
}

input, select {
    vertical-align:middle;
}

/*MY CODE*/

* {
  text-decoration: none;
}

body {
  background-color: #f3f3f3
}

header {
  background-color: white;
  width: 100%;
  height: 100%;
}

header .header-brand {
  font-family: Indie Flower;
  font-size: 24px;
  color: #111;
  font-weight: 900;
  text-transform: uppercase;
  display: block;
  margin: 0 auto;
  text-align: center;
  padding: 20px...