Overflow comes with integrated support for the Contact Form 7 plugin:
<div class="row"> <div class="col-lg-6"> <div class="form-box user-icon mb-30"> [text YourName placeholder "Your Name"] </div> </div> <div class="col-lg-6"> <div class="form-box email-icon mb-30"> [email YourEmail placeholder "Your Email"] </div> </div> <div class="col-lg-6"> <div class="form-box phone-icon mb-30"> [text YourPhone placeholder "Your Phone"] </div> </div> <div class="col-lg-6"> <div class="form-box subject-icon mb-30"> [text YourSubject placeholder "Your Subject"] </div> </div> <div class="col-lg-12"> <div class="form-box message-icon mb-30"> [textarea YourMessage placeholder "Your Message"] </div> <div class="contact-btn text-center"> [submit class:btn class:btn-icon class:ml-0 "get action"] </div> </div> </div>
<div class="calculate-content"> <div class="row"> <div class="col-xl-12"> <div class="about-title news-letter-title mb-70"> <h5 class="pink-color">Appointment</h5> <h1>Book Appointment</h1> </div> </div> </div> <div class="row"> <div class="col-xl-6 col-lg-6 col-md-6"> [select Department "Department" "Surgery and Radiology" "SPediatrics"] </div> <div class="col-xl-6 col-lg-6 col-md-6"> [select Doctor "Doctor" "Salim Rana" "Jon Williamsoin" "Masud Rana"] </div> <div class="col-xl-6 col-lg-6 col-md-6"> [select ap-name "Your Name" "Salim Rana" "Name One" "Name Two"] </div> <div class="col-xl-6 col-lg-6 col-md-6"> <div class="calculate-form appointment-form-3 mb-20"> [text phone placeholder "Your Phone number"] <i class="fas fa-phone"></i> </div> </div> <div class="col-xl-6 col-lg-6 col-md-6"> <div class="calculate-form appointment-form-3 mb-20"> [date Date placeholder "Select date"] <i class="far fa-calendar"></i> </div> </div> <div class="col-xl-6 col-lg-6 col-md-6"> <div class="calculate-form appointment-form-3 mb-20"> [text Addtime placeholder "Add time"]<i class="far fa-clock"></i> </div> </div> <div class="col-xl-12"> <div class="calculate-form appointment-form-3"> [textarea Specialrequest placeholder "Special Request"] <i class="far fa-edit"></i> </div> [submit class:btn class:w-100 class:mt-40 "submit query"] </div> </div> </div>
<div class="row">
<div class="col-xl-6 col-lg-6 col-md-6">
<div class="appoinment-form-box d-flex mb-40">
<div class="appoint-ment-icon">
<img src="http://bdevs.net/theme/medidove/wp-content/uploads/2019/06/caregive-option-icon-3.png" alt="">
</div>
<div class="appointment-form-2">
<label>your name</label> [text yourname placeholder "Enter Your Name"]
</div>
</div>
</div>
<div class="col-xl-6 col-lg-6 col-md-6">
<div class="appoinment-form-box d-flex mb-40">
<div class="appoint-ment-icon">
<img src="http://bdevs.net/theme/medidove/wp-content/uploads/2019/06/caregive-option-icon-4.png" alt="">
</div>
<div class="appointment-form-2">
<label>your email</label>
[email EmailAddress placeholder "Enter Email Address"]
</div>
</div>
</div>
<div class="col-xl-6 col-lg-6 col-md-6">
<div class="appoinment-form-box appoinment-form-box-option d-flex mb-40">
<div class="appoint-ment-icon">
<img src="http://bdevs.net/theme/medidove/wp-content/uploads/2019/06/caregive-option-icon-2.png" alt="">
</div>
<div class="appointment-form-2">
<label>select your services</label>
[select ChooseService "Choose A Service" "Eye Point" "Home Care" "Older Care"]
</div>
</div>
</div>
<div class="col-xl-6 col-lg-6 col-md-6">
<div class="appoinment-form-box d-flex mb-40">
<div class="appoint-ment-icon">
<img src="http://bdevs.net/theme/medidove/wp-content/uploads/2019/06/caregive-option-icon-5.png" alt="">
</div>
<div class="appointment-form-2">
<label>your phone</label>
[text EnterYourPhone placeholder "Enter Your Phone"]
</div>
</div>
</div>
<div class="col-xl-6 col-lg-12">
<div class="appoint-button">
<button type="submit" class="btn green-bg-btn">Make Appointment</button>
</div>
</div>
</div>
<div class="appoinment-form-box appoinment-form-box-option d-flex mb-40">
<div class="appoint-ment-icon">
<img src="http://bdevs.net/theme/medidove/wp-content/uploads/2019/06/caregive-option-icon-2.png" alt="">
</div>
<div class="appointment-form-2">
<label>select your location</label>
[select hero-select "Choose A Location" "Chicago, United States" "California, United States"]
</div>
</div>
<div class="appoinment-form-box appoinment-form-box-option d-flex mb-40">
<div class="appoint-ment-icon">
<img src="http://bdevs.net/theme/medidove/wp-content/uploads/2019/06/caregive-option-icon-2.png" alt="">
</div>
<div class="appointment-form-2">
<label>select your services</label>
[select hero-select "Choose A Service" "Dental" "Blood Preshure" "Surgery Doctor"]
</div>
</div>
<div class="inner caregive-btn text-center mb-30">
<button type="submit" class="btn gray-btn-border">Make Appointment</button>
</div>
<div class="row"> <div class="col-xl-12"> [select support "When would you like our support?" "Morning" "Afternoon" "Night"] </div> <div class="col-xl-12"> [select arrive "When would you like us arrive?" "Saturday" "Sunday" "Monday"] </div> <div class="col-xl-12"> [select stay "How long should we stay?" "2 Hours" "3 Hours" "4 Hours"] </div> <div class="col-xl-12"> [select located "Where are you located?" "United Kingdom" "Canada City" "India City"] </div> <div class="col-xl-12"> <div class="calculate-form mb-20"> [text phone placeholder "Your Phone number"] <i class="fas fa-phone"></i> </div> </div> </div> [submit class:btn class:m-0 class:w-100 "submit query"]
<div class="row"> <div class="col-xl-12"> <div class="contact-input contact-icon contact-user mb-20"> [text text-88 placeholder "Enter your name"] </div> </div> <div class="col-xl-12"> <div class="contact-input contact-icon contact-mail mb-20"> [email email-339 placeholder "Enter your email"] </div> </div> <div class="col-xl-12"> <div class="contact-input"> [select menu-143 id:service-option "Select type of care" "Full Body" "Blood Issue" "Surgery Issue" "Dental Unit"] </div> </div> <div class="col-xl-12"> <div class="ser-form-btn text-center mt-40"> [submit class:btn class:btn-icon class:ml-0 "Request for call"] </div> </div> </div>