<div class="md:max-w-md md:mx-auto">
    <form netlify name="contact" method="POST">
        <div class="md:flex overflow-hidden -mx-1 mb-2">
            <div class="md:w-1/2 px-1 flex flex-col justify-between">
                <div>
                    <label for="name" class="hidden">Name</label>
                    <input type="text" id="name" name="name" required class="border border-grey w-full p-1 mb-2" placeholder="Name">
                </div>

                <div>
                    <label for="email" class="hidden">Email</label>
                    <input type="email" id="email" name="email" required class="border border-grey w-full p-1 mb-2" placeholder="Email">
                </div>

                <div>
                    <label for="subject" class="hidden">Subject</label>
                    <input type="text" id="subject" name="subject" required class="border border-grey w-full p-1 mb-2" placeholder="Subject">
                </div>
            </div>

            <div class="md:w-1/2 px-1">
                <label for="message" class="hidden">Message</label>
                <textarea name="message" id="message" cols="30" rows="5" required class="border border-grey w-full p-1 block" placeholder="Message"></textarea>
            </div>
        </div>

        <div class="flex justify-end">
            <button type="submit" class="bg-red text-white px-3 py-2">Send</button>
        </div>
    </form>
</div>