<br>
<div class="container">
    <div class="row">
        <div class="six columns">
             <h2>Date Range Form</h2>

             <h5 class="small">By <a href="https://gist.github.com/cbumgard/4742703" target="_blank">Chris Bumgardner</a></h5>

             <h3 class="subheader">Built with <a href="http://jquery.com/" target="_blank">jQuery</a>, <a href="http://api.jqueryui.com/datepicker/" target="_blank">jQuery UI DatePicker</a>, <a href="http://bassistance.de/jquery-plugins/jquery-plugin-validation/" target="_blank">jQuery Validation</a>, and <a href="http://foundation.zurb.com/" target="_blank">Zurb Foundation</a></h3> 
             <h5><a href="http://jsfiddle.net/chrisbumgardner/VzYQn/" target="_blank">See the jsFiddle</a></h5>

             <h5><a href="https://gist.github.com/cbumgard/4742703" target="_blank">See the Gist</a></h5> 
             <h5 class="subheader">This form allows choosing a date range from any previous day up to and including today's date. When a start date is selected, the end date cannot come before it. When an end date is selected, the start date cannot come after it. Dates are represented in <a href="http://en.wikipedia.org/wiki/ISO_8601" target="_blank">ISO-8601</a> format "YYYY-MM-DD" and are validated on the client.</h5>

            <div>
                <form id="download-csv" method="post" action="#" class="date-range nice">
                    <fieldset>
                        <legend>Date Range Form</legend>
                         <h4 class="subheader">Please select a range of dates:</h4>

                        <div class="row">
                            <div class="six columns">
                                <label>Start Date (required)&nbsp;<a id="reset-start-date" href="#" tabindex="-1">Reset</a>

                                </label>
                                <input id="start-date" type="text" name="startDate" tabindex="1" class="dateISO input-text small required"
                                placeholder="Please select a start date" />
                                <label>End Date (required)&nbsp;<a id="reset-end-date" href="#" tabindex="-1">Reset</a>

                                </label>
                                <input id="end-date" type="text" name="endDate" tabindex="2" class="dateISO input-text small required"
                                placeholder="Please select an end date" />
                                <input type="submit" value="Submit" tabindex="3" class="nice radius large blue button"
                                />
                            </div>
                        </div>
                    </fieldset>
                </form>
            </div>
        </div>
    </div>
</div>