Forms

Form Style 1

                            
<section class="forms elements-page">
    <div class="container">
        <div class="forms-block">     
            <div class="form1">
                <form>
                    <div class="row">
                        <div class="col-md-12"><input type="text" class="form-control" id="name1" placeholder="First Name"></div>
                        <div class="col-md-12"><input type="email" class="form-control" id="email1" placeholder="Email"></div>
                        <div class="col-md-12">
                            <select class="form-select" aria-label="Default select example">
                                <option selected>Subject</option>
                                <option value="1">One</option>
                                <option value="2">Two</option>
                                <option value="3">Three</option>
                            </select>
                            <svg xmlns="http://www.w3.org/2000/svg" width="25.201" height="45" viewBox="0 0 25.201 45">
                                <path data-name="Icon ionic-ios-arrow-forward" d="M28.85,28.688,12.172,11.673a3.25,3.25,0,0,1,0-4.542,3.13,3.13,0,0,1,4.462,0l18.9,19.279a3.259,3.259,0,0,1,.092,4.435L16.646,50.258a3.122,3.122,0,0,1-4.462,0,3.25,3.25,0,0,1,0-4.542Z" transform="translate(-11.246 -6.196)"/>
                            </svg>
                        </div>
                        <div class="col-md-12"><textarea class="form-control" id="textarea1" rows="4" placeholder="Message"></textarea></div>
                    </div>
                    <button type="submit" class="btn btn-secondary br-6" title="Title">Send Now</button>
                </form>
            </div>
        </div>
    </div>
</section>
                            
                        
                        

Form Style 2

                            
<section class="forms elements-page">
    <div class="container">
        <div class="forms-block">     
            <div class="form2">
                <form>
                    <div class="row">
                        <div class="col-md-6"><input type="text" class="form-control" id="name2" placeholder="First Name"></div>
                        <div class="col-md-6"><input type="number" class="form-control" id="phone2" placeholder="Phone Number"></div>
                        <div class="col-md-6"><input type="email" class="form-control" id="email2" placeholder="Email"></div>
                        <div class="col-md-6">
                            <select class="form-select" aria-label="Default select example">
                                <option selected>Subject</option>
                                <option value="1">One</option>
                                <option value="2">Two</option>
                                <option value="3">Three</option>
                            </select>
                            <svg xmlns="http://www.w3.org/2000/svg" width="25.201" height="45" viewBox="0 0 25.201 45">
                                <path data-name="Icon ionic-ios-arrow-forward" d="M28.85,28.688,12.172,11.673a3.25,3.25,0,0,1,0-4.542,3.13,3.13,0,0,1,4.462,0l18.9,19.279a3.259,3.259,0,0,1,.092,4.435L16.646,50.258a3.122,3.122,0,0,1-4.462,0,3.25,3.25,0,0,1,0-4.542Z" transform="translate(-11.246 -6.196)"/>
                            </svg>
                        </div>
                        <div class="col-md-12"><textarea class="form-control" id="textarea2" rows="4" placeholder="Why Join Volunteer"></textarea></div>
                    </div>
                    <button type="submit" class="btn btn-secondary br-6" title="Title">Join Us Today</button>
                </form>
            </div>
        </div>
    </div>
</section>