<div id="userModalRegister" class="reveal-modal" data-reveal aria-labelledby="modalTitle" aria-hidden="true" role="dialog">
                        <h2 id="modalTitle">Register</h2>
                        <p>Register an account now to be able to place orders and enjoy countless discounts.</p>
                        <form data-abide id="registerform" novalidate="novalidate">
                            <fieldset>
                                <legend>Basic information</legend>
                                <div class="row">
                                    <div class="large-4 columns">
                                        <label>Initials <small>required</small>
                                            <input type="text" id="initials" placeholder="initials" required />
                                        </label>
                                        <small class="error">Initials are required.</small>
                                    </div>

                                    <div class="large-4 columns">
                                        <label>Insertions
                                            <input type="text" id="inserations" placeholder="inserations" />
                                        </label>
                                    </div>

                                    <div class="large-4 columns">
                                        <label>Surname <small>required</small>
                                            <input type="text" id="surname" placeholder="surname" required />
                                        </label>
                                        <small class="error">Surname is required.</small>
                                    </div>
                                </div>

                                <div class="row">
                                    <div class="large-12 columns">
                                        <label>Password <small>required</small>
                                            <input type="password" id="password" placeholder="password" required />
                                        </label>
                                        <small class="error">Passwords must be at least 8 characters with 1 capital letter, 1 number, and one special character.</small>
                                    </div>

                                    <div class="large-12 columns">
                                        <label>Confirm password <small>required</small>
                                            <input type="password" id="confirmPassword" placeholder="password" required data-equalto="password" />
                                        </label>
                                        <small class="error">Passwords must match.</small>
                                    </div>
                                </div>

                                <div class="row">
                                    <div class="large-6 columns">
                                        <label>Email <small>required</small>
                                            <input type="email" id="email" placeholder="mymail@gmail.com" required />
                                        </label>
                                        <small class="error">Valid email required.</small>
                                    </div>

                                    <div class="large-6 columns">
                                        <label>Phone <small>required</small>
                                            <input type="tel" id="phone" placeholder="06 12345678" required />
                                        </label>
                                        <small class="error">Please provide a valid phone number</small>
                                    </div>
                                </div>

                                <div class="row">
                                    <div class="large-6 columns">
                                        <label>Address <small>required</small>
                                            <input type="text" id="address" placeholder="Somestreet 51" required />
                                        </label>
                                        <small class="error">Address is required.</small>
                                    </div>

                                    <div class="large-6 columns">
                                        <label>ZIP Code <small>required</small>
                                            <input type="text" id="zipcode" placeholder="1234AB" required />
                                        </label>
                                        <small class="error">ZIP Code is required.</small>
                                    </div>
                                </div>

                                <div class="row">
                                    <div class="large-12 columns">
                                        <label>Date of Birth <small>required</small>
                                            <input type="date" id="dob" required />
                                        </label>
                                        <small class="error">Date of Birth is required.</small>
                                    </div>
                                </div>
                            </fieldset>

                            <fieldset>
                                <legend>Addition information</legend>
                            </fieldset>

                            <fieldset>
                                <legend>Ready!</legend>
                                <div class="row">
                                    <div class="large-12 columns">
                                        <button type="submit" class="medium button green">Register</button>
                                    </div>
                                </div>
                            </fieldset>
                        </form>
                    </div>