JSFiddle - React, Tailwind, and code Playground

HTML

<script src="//s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
<div id="transy"></div>
<div id="wrapper">
    <div class="logo">
         <h1>Barrta</h1>

         <h2><strong class="one"></strong>Achieve More With Less<strong class="two"></strong></h2>

    </div>
    <div class="content">
        <p class="big_text"><strong>we are working on something</strong> very interesting!</p>
        <p class="small_text"><strong>be notified.</strong> we just need your email address.</p>

        <!-- Begin MailChimp Signup Form 
        <div id="mc_embed_signup" class="field_content form">-->
            <form class="form" action="//barrta.us9.list-manage.com/subscribe/post?u=8160a89f7a2b4a53492d24f93&amp;id=dcba6eebe3 " method="POST" name="mc-embedded-subscribe-form" class="validate" rel="nofollow" rel="nofollow" target="_blank" novalidate>
                <div class="field_content">
                    <input type="text" value="" name="EMAIL" class="required field email" id="mce-EMAIL">
                    <input class="submit button" type="submit" value="" name="subscribe" />
                </div>
                <div id="mce-responses" class="clear">
                    <div class="response" id="mce-error-response" style="display:none"></div>
                    <div class="response" id="mce-success-response" style="display:none"></div>
                </div>
                <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
                <div style="position: absolute; left: -5000px;">
                    <input type="text" name="b_8160a89f7a2b4a53492d24f93_dcba6eebe3" tabindex="-1" value="">
                </div>
            </form>
        </div>
        <!--End mc_embed_signup-->
        <div class="clear"></div>
        <ul class="social">
            <li class="pinterest"><a href="#"></a>

            </li>
            <li class="instagram"><a href="#"></a>

           ...

CSS

/* Reset */
 body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td {
    margin:0;
    padding:0;
}
table {
    border-collapse:collapse;
    border-spacing:0;
}
fieldset, img {
    border:0;
}
address, caption, dfn, th, var {
    font-style:normal;
    font-weight:normal;
}
li {
    list-style:none;
}
caption, th {
    text-align:left;
}
h1, h2, h3, h4, h5, h6 {
    font-size:100%;
    font-weight:normal;
}
html {
    background: url(http://nootperformance.com/barrta.com/images/bg.jpg) no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}
html, body {
    margin:0;
    padding:0;
    font-family: Helvetica Neue, Helvetica, Arial;
    color: #ffffff;
    height: 100%;
}
#transy {
    width: 100%;
    height: 100%;
    float: left;
    background: #08233e;
    opacity: 0.8;
    filter: alpha(opacity=80);
    position: absolute;
    z-index: -1;
}
#wrapper {
    width: 940px;
    margin: 0 auto;
}
.logo {
    width: 940px;
    float: left;
    margin-top: 30px;
    margin-bottom: 100px;
}
h1 {
    text-align: center;
    font-size: 150px;
}
h2 {
    text-align: center;
    font-size: 20px;
    font-weight: 100;
    margin-top: 10px;
}
h2 strong.one {
    width: 40px;
    height: 1px;
    background: #fff;
    position: absolute;
    margin-left: -50px;
    margin-top: 10px;
    opacity: 0.5;
    filter: alpha(opacity=50);
}
h2 strong.two {
    width: 40px;
    height: 1px;
    background: #fff;
    position: absolute;
    margin-left: 10px;
    opacity: 0.5;
    filter: alpha(opacity=50);
    margin-top: 10px;
}
.content {
    width: 940px;
    float: left;
}
.content p {
    text-align: center;
}
p.big_text {
    font-size: 27px;
    margin-bottom: 10px;
}
p.small_text {
    font-size: 20px;
}
.form {
    width: 485px;
    margin: 20px auto 0 auto;
}
.field_content {
   ...

JavaScript

(function ($) {
    window.fnames = new Array();
    window.ftypes = new Array();
    fnames[0] = 'EMAIL';
    ftypes[0] = 'email';
    fnames[1] = 'FNAME';
    ftypes[1] = 'text';
    fnames[2] = 'LNAME';
    ftypes[2] = 'text';
}(jQuery));
var = jQuery.noConflict(true);