JSFiddle - React, Tailwind, and code Playground

HTML

<html">
<head>
    <title>Blah</title>
    <link type="text/css" rel="stylesheet" media="all" href="landing-9395a7120703e2c5181d432c5299cfa5.css">
    <link type="text/css" rel="stylesheet" media="screen" href="css.css">
    <link type="text/css" rel="stylesheet" media="screen" href="css_002.css">
  </head>
  
<body class="user_suscriptions index">
    <div id="wrapper">
      <section class="info">
        <h1 class="logo">Title</h1>
        <h2>another title</h2>
        <div class="field form_suscription">
          <form novalidate="novalidate" method="post" id="new_user_suscription" data-remote="true" class="simple_form new_user_suscription" action="/user_suscriptions" accept-charset="UTF-8">
            <div style="margin:0;padding:0;display:inline">
              <input type="hidden" value="✓" name="utf8">
              <input type="hidden" value="1Oz4NpXl188INQoGZkqy4LaItW/6sxtsNNruWFBJQEM=" name="authenticity_token">
            </div>
            <div class="error_message">
            </div>
            <div class="input email required user_suscription_email">
              <input type="email" size="50" placeholder="Your email address ;)" name="user_suscription[email]" id="user_suscription_email" class="string email required left" autofocus="autofocus">
            </div>
            <input type="submit" value="Subscribe!" name="commit" class="btn green-btn">
          </form>
          <div class="clear">
          </div>
          <small>blahb</small>
        </div>
        <div class="clear">
        </div>
      </section>
      <section class="about">
        <div class="content">
          <div class="left">
            <h2 class="logo">test subject</h2>
          </div>
          <div class="right">
            <h2>Blah title.</h2>
            <p>Blah</p>
          </div>
          <div class="clear">
          </div>
        </div>
      </section>
      <section class="demo">
      </section>
      <section class="features">
        <div...

CSS

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
nav,
section,
summary {
    display: block;
}
audio,
canvas,
video {
    display: inline-block;
}



audio:not([controls]) {
    display: none;
    height: 0;
}



[hidden] {
    display: none;
}

html {
    font-family: sans-serif; /* 1 */
    -webkit-text-size-adjust: 100%; /* 2 */
    -ms-text-size-adjust: 100%; /* 2 */
}

body {
    margin: 0;
}

a:focus {
    outline: thin dotted;
}

a:active,
a:hover {
    outline: 0;
}

h1 {
    font-size: 2em;
}

abbr[title] {
    border-bottom: 1px dotted;
}


b,
strong {
    font-weight: bold;
}



dfn {
    font-style: italic;
}



mark {
    background: #ff0;
    color: #000;
}




code,
kbd,
pre,
samp {
    font-family: monospace, serif;
    font-size: 1em;
}


pre {
    white-space: pre;
    white-space: pre-wrap;
    word-wrap: break-word;
}

q {
    quotes: "\201C" "\201D" "\2018" "\2019";
}



small {
    font-size: 80%;
}


sub,
sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
}

sup {
    top: -0.5em;
}

sub {
    bottom: -0.25em;
}


img {
    border: 0;
}


svg:not(:root) {
    overflow: hidden;
}



figure {
    margin: 0;
}


fieldset {
    border: 1px solid #c0c0c0;
    margin: 0 2px;
    padding: 0.35em 0.625em 0.75em;
}


legend {
    border: 0; /* 1 */
    padding: 0; /* 2 */
}


button,
input,
select,
textarea {
    font-family: inherit; /* 1 */
    font-size: 100%; /* 2 */
    margin: 0; /* 3 */
}


button,
input {
    line-height: normal;
}
button,
html input[type="button"], /* 1 */
input[type="reset"],
input[type="submit"] {
    -webkit-appearance: button; /* 2 */
    cursor: pointer; /* 3 */
}



button[disabled],
input[disabled] {
    cursor: default;
}


input[type="checkbox"],
input[type="radio"] {
    box-sizing: border-box; /* 1 */
    padding: 0; /* 2 */
}

input[type="search"] {
    -webkit-appearance: textfield; /* 1 */
    -moz-box-sizing: content-box;
   ...