JSFiddle - React, Tailwind, and code Playground

HTML

<div id='contact'>
    <form action="" id="message" method="post">
        <fieldset>
            <label for="message_email">Your email</label>
            <input id="message_email" name="message[email]" placeholder="[email protected]" size="30" type="email" />
        </fieldset>
        <fieldset>
            <label for="message_phone">Your phone</label>
            <input id="message_phone" name="message[phone]" placeholder="+358 40 123 4567 (optional)" size="30" type="tel" />
        </fieldset>
        <fieldset>
            <label for="message_message">Your message</label>
            <textarea id="message_message" name="message[message]" placeholder="A brief description of your project and budget.">&#x000A;</textarea>
        </fieldset>
        <fieldset class='submit'>
            <input name="commit" type="submit" value="Send" />
<small>
You can also email
<a href="mailto:[email protected]">[email protected]</a>
or call
<strong>Antti Akonniemi</strong>
at
<a href="tel:+358405051909">+358 40 5051 909</a>.
</small>

        </fieldset>
    </form>
</div>

CSS

#contact {
    border-top:0.125em solid #272524
}
#contact form {
    margin-top:3em
}
#contact fieldset {
    margin-top:1.125em;
    padding-left:12em;
    padding-right:7.5em;
    position:relative
}
@media screen and (max-width: 47.9375em) {
    #contact fieldset {
        padding-left:0;
        padding-right:0
    }
}
#contact label {
    display:block;
    position:absolute;
    left:0;
    top:0.6875em;
    text-align:right;
    width:10.5em;
    color:#e8e8e7;
    font-weight:600
}
@media screen and (max-width: 47.9375em) {
    #contact label {
        position:static;
        width:auto;
        text-align:left;
        margin-bottom:0.375em
    }
}
#contact input[type="email"], #contact input[type="name"], #contact textarea {
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    display:block;
    padding:0.75em;
    -webkit-border-radius:0.375em;
    -moz-border-radius:0.375em;
    -ms-border-radius:0.375em;
    -o-border-radius:0.375em;
    border-radius:0.375em;
    background:#181716;
    border:0.125em solid #2c2929;
    width:100%;
    color:#e8e8e7
}
#contact input[type="email"]:hover, #contact input[type="name"]:hover, #contact textarea:hover {
    border-color:#353131
}
#contact input[type="email"]:focus, #contact input[type="name"]:focus, #contact textarea:focus {
    outline:none;
    border-color:#9f9e9d
}
#contact textarea {
    min-height:7.5em;
    resize:vertical
}
#contact ::-webkit-input-placeholder {
    color:#636261;
    font-style:italic
}
#contact :-moz-placeholder {
    color:#636261;
    font-style:italic
}
#contact .submit {
    text-align:right;
    position:relative
}
#contact .submit small {
    text-align:left;
    display:block;
    font-size:0.8125em;
    line-height:1.38462em;
    max-width:21.23077em
}
#contact .submit small a {
    white-space:nowrap
}
#contact .submit input {
    float:right;
    margin-left:0.75em;
    display:block;
    -webkit-apperance:none;
   ...

JavaScript

$(document).ready(function () {
    var a;
    a = function (a) {
        var b, c, d, e;
        return
        c = /[^@]+@[^\.]+\.[\w\.\-]+/,
        e = !0,
        $(a).find("fieldset").removeClass("error"),
        b = $(a).find("[name='message[email]']"),
        d = $(a).find("[name='message[message]']"),
        $.trim(b.val()).length === 0 && (e = !1, b.closest("fieldset").addClass("error")),
        c.test(b.val()) || (e = !1, b.closest("fieldset").addClass("error")),
        $.trim(d.val()).length === 0 && (e = !1, d.closest("fieldset").addClass("error")),
        e
    },
    $(function () {
        var b, c;
        return
        c = 414,
        b = "html,body",

        $("#message").submit(function (b) {
            var c;
            c = a(this);
            if (!c) return
            b.preventDefault()
        }),

        $("#message").on("ajax:success", function (a, b, c) {
            var d;
            return
            $(this).find("input, textarea").val(""),
            d = $(this).find("input[type=submit]"),
            d.val("Success!").css("background-color", "#00b233"),
            setTimeout(function () {
                return d.val("Send"), d.css("background-color", "#cf3f13")
            }, 5e3, d)
        }),

        $("#message").on("ajax:error", function (a, b, c) {
            var d;
            return
            d = $(this).find("input[type=submit]"),
            d.val("Error"),
            setTimeout(function () {
                return d.val("Send")
            }, 5e3, d)
        }),

        $("#message").on("keyup", ".error input, .error textarea", function (b) {
            var c;
            return
            console.log("error"),
            c = $(this).closest("form"),
            a(c),
            this;
        });
    });
}.call(this));