Contact

<div class="master">
    <div class="master__content">
        <header class="site-header">
            <div class="container">
                <h1 class="site-header__title">Patterns</h1>
            </div>
        </header>

        <main>

            <div class="container">
                <h2>Contact</h2>
                <div class="md:grid grid-cols-2 gap-8">
                    <div>
                        <p class="mt-4">
                            Lorem ipsum dolor sit amet consectetur adipisicing elit.
                            Nihil, neque ipsa! Maiores, molestias dicta. Ad, voluptatum assumenda
                            perferendis facere, voluptatem odio laborum, repellat sint laudantium
                            labore non cumque eaque tempore!
                        </p>
                        <h3>The five boxing wizards jump quickly</h3>
                        <p class="mt-4">
                            Lorem ipsum dolor sit amet consectetur adipisicing elit.
                            Nihil, neque ipsa! Maiores, molestias dicta. Ad, voluptatum assumenda
                            perferendis facere, voluptatem odio laborum, repellat sint laudantium
                            labore non cumque eaque tempore!
                        </p>
                    </div>

                    <form>
                        <ul class="list">
                            <li>
                                <fieldset>
                                    <legend class="text-label">Gender</legend>
                                    <label class="form-control">
                                        <input class="form-control__radio" type="radio" name="gender" value="male" />
                                        <span class="form-control__visual"></span>
                                        <span class="form-control__text">Male</span>
                                    </label>

                                    <label class="form-control">
                                        <input class="form-control__radio" type="radio" name="gender" value="male" />
                                        <span class="form-control__visual"></span>
                                        <span class="form-control__text">Female</span>
                                    </label>

                                    <label class="form-control">
                                        <input class="form-control__radio" type="radio" name="gender" value="male" />
                                        <span class="form-control__visual"></span>
                                        <span class="form-control__text">Rather not say</span>
                                    </label>

                                </fieldset>
                            </li>
                            <li>
                                <label>
                                    <span class="text-label">First name</span>
                                    <input type="text" class="form-input" placeholder="John" />
                                </label>

                            </li>
                            <li>
                                <label>
                                    <span class="text-label">Last name</span>
                                    <input type="text" class="form-input" placeholder="Doe" />
                                </label>

                            </li>
                            <li>
                                <label>
                                    <span class="text-label">Email</span>
                                    <input type="text" class="form-input" placeholder="john.doe@mail.com" />
                                </label>

                            </li>
                            <li>
                                <label class="form-control">
                                    <input class="form-control__checkbox" type="checkbox" name="food" value="" />
                                    <span class="form-control__visual"></span>
                                    <span class="form-control__text">Subscribe to our newsletter</span>
                                </label>

                            </li>
                            <li>
                                <button class="button">
                                    Submit <svg class="icon icon--chevron-right ml-1">
                                        <use xlink:href="../../assets/icons.svg#chevron-right" />
                                    </svg>

                                </button>
                            </li>
                        </ul>
                    </form>

                </div>
            </div>

        </main>
    </div>
    <div class="master__footer">
        <div class="mt-8">
            <footer class="site-footer ">
                <div class="container">
                    2020 Copyright
                </div>
            </footer>
        </div>
    </div>
</div>