<!-- Order Form 2 -->
<div class="admin-form theme-success" id="order2">
    <div class="panel panel-success heading-border">
        <div class="panel-heading">
            <span class="panel-title"><i class="fa fa-comments"></i>Make your order</span>
        </div>
        <!-- end .form-header section -->

        <form method="post" action="/" id="form-order2">
            <div class="panel-body p25">
                <div class="section row">
                    <div class="col-md-6">
                        <div class="section">
                            <label for="names" class="field-label">Your names
                                <em>*</em>
                            </label>
                            <label for="names" class="field prepend-icon">
                                <input type="text" name="names" id="names" class="gui-input" placeholder="Enter first name...">
                                <label for="names" class="field-icon"><i class="fa fa-user"></i>
                                </label>
                            </label>
                        </div>
                        <!-- end section -->

                        <div class="section">
                            <label for="othernames" class="field-label">Other names
                                <em>*</em>
                            </label>
                            <label for="othernames" class="field prepend-icon">
                                <input type="text" name="othernames" id="othernames" class="gui-input" placeholder="Enter other name...">
                                <label for="othernames" class="field-icon"><i class="fa fa-user"></i>
                                </label>
                            </label>
                        </div>
                        <!-- end section -->

                        <div class="section">
                            <label for="email" class="field-label">Your email address
                                <em>*</em>
                            </label>
                            <label for="email" class="field prepend-icon">
                                <input type="email" name="email" id="email" class="gui-input" placeholder="Enter Email...">
                                <label for="email" class="field-icon"><i class="fa fa-envelope"></i>
                                </label>
                            </label>
                        </div>
                        <!-- end section -->

                    </div>
                    <!-- end .colm section -->

                    <div class="col-md-6">
                        <div class="section">
                            <label for="mobile" class="field-label">Telephone / mobile
                                <em>*</em>
                            </label>
                            <label for="mobile" class="field prepend-icon">
                                <input type="tel" name="mobile" id="mobile" class="gui-input" placeholder="Enter mobile">
                                <label for="mobile" class="field-icon"><i class="fa fa-phone-square"></i>
                                </label>
                            </label>
                        </div>
                        <!-- end section -->

                        <div class="section">
                            <label for="services" class="field-label">Services required
                                <em>*</em>
                            </label>
                            <label class="field select">
                                <select id="services" name="services">
                                    <option value="">Choose a service...</option>
                                    <option value="webdesign">Web design</option>
                                    <option value="wordpress">Wordpress</option>
                                    <option value="identity">Corporate identity</option>
                                    <option value="cms">Custom CMS</option>
                                </select>
                                <i class="arrow double"></i>
                            </label>
                        </div>
                        <!-- end section -->

                        <div class="section">
                            <label for="budget" class="field-label">Project budget
                                <em>*</em>
                            </label>
                            <label class="field select">
                                <select id="budget" name="budget">
                                    <option value="">Select budget...</option>
                                    <option value="500-1000">$500 - $1000</option>
                                    <option value="1000-2000">$1000 - $2000</option>
                                    <option value="2000-4000">$2000 - $4000</option>
                                    <option value="5000+">$5000+</option>
                                </select>
                                <i class="arrow double"></i>
                            </label>
                        </div>
                        <!-- end section -->

                    </div>
                    <!-- end .colm section -->

                </div>
                <!-- end .section row section -->

                <div class="section">
                    <label for="file1" class="field-label">Upload project samples -
                        <span class="small-text text-muted">(ONLY JPG : PNG : PDF)</span>
                    </label>
                    <label for="file1" class="field prepend-icon file">
                        <span class="button btn-primary">Choose File</span>
                        <input type="file" class="gui-file" name="upload1" id="file1" onChange="document.getElementById('uploader1').value = this.value;">
                        <input type="text" class="gui-input" id="uploader1" placeholder="no file selected" readonly>
                        <label for="comment" class="field-icon"><i class="fa fa-upload"></i>
                        </label>
                    </label>
                </div>
                <!-- end  section -->

                <div class="section">
                    <label for="description" class="field-label">Project description
                        <em>*</em>
                    </label>
                    <label for="description" class="field prepend-icon">
                        <textarea class="gui-textarea" id="description" name="description" placeholder="Write your project description..."></textarea>
                        <label for="description" class="field-icon"><i class="fa fa-file-text"></i>
                        </label>
                        <span class="input-footer">
                            <strong>Hint:</strong>Please be as detailed as possible.</span>
                    </label>
                </div>
                <!-- end section -->

            </div>
            <!-- end .form-body section -->
            <div class="panel-footer">
                <button type="submit" class="button btn-primary">Submit</button>
            </div>
            <!-- end .form-footer section -->
        </form>
    </div>
    <!-- end .admin-form section -->
</div>
<!-- end: .admin-form -->