Here is the contact form section code:
<!-- Contact Section Start -->
<div class="form-group">[text* yourname class:bg-athens class:w-100 class:round-5 placeholder "Name"]<i class="ri-user-3-line"></i>
</div>
<div class="form-group">[email* youremail class:bg-athens class:w-100 class:round-5 placeholder "Email"]<i class="ri-mail-line"></i>
</div>
<div class="form-group">[number* Yourphone class:bg-athens class:w-100 class:round-5 placeholder "Phone"]<i class="ri-phone-line"></i>
</div>
<div class="form-group">[text* subjectnam class:bg-athens class:w-100 class:round-5 placeholder "Subject"]<i class="ri-edit-line"></i>
</div>
<div class="form-group">[textarea* ysubject class:bg-athens class:w-100 class:round-5 placeholder "Write your message"]<i class="ri-edit-line"></i>
</div>
<div class="form-check checkbox"><input class="form-check-input" type="checkbox" id="gridCheck"
><label class="form-check-label" for="gridCheck">I have read and accepted the <a href="http://localhost/TFTheme/metfo/terms-conditions/">Terms & Conditions</a> and <a href="http://localhost/TFTheme/metfo/privacy-policy/">Privacy Policy</a></label></div>
<button class="btn style-three mt-4">Send Message</button>
<!-- Contact Section End -->
Here is the book form section code:
<div class="row">
<div class="col-md-6">
<div class="form-group">[text* yourname class:bg-athens class:w-100 class:round-5 placeholder "Name"]<i class="ri-user-3-line"></i></div>
<div class="form-group">[number* Yourphone class:bg-athens class:w-100 class:round-5 placeholder "Phone"]<i class="ri-phone-line"></i></div>
<div class="form-group mb-0 mb-sm-20">[textarea* message class:bg-athens class:w-100 class:round-5 placeholder "Message"]<i class="ri-edit-line"></i>
</div>
</div>
<div class="col-md-6">
<div class="form-group">[email* youremail class:bg-athens class:w-100 class:round-5 placeholder "Email"]<i class="ri-mail-line"></i>
</div>
<div class="form-group">[text* yourname class:bg-athens class:w-100 class:round-5 placeholder "Time"]<i class="ri-time-line"></i>
</div>
<div class="form-group">[date* youdate class:bg-athens class:w-100 class:round-5]<i class="ri-calendar-line"></i>
</div>
<button class="btn style-five mt-4 d-block w-100"><i class="ri-calendar-line"></i>Book Appointment</button>
</div>
</div>
Here is the book appointment form section code:
<div class="row">
<div class="col-xl-3 col-sm-6" data-cue="slideInUp"><div class="form-group position-relative mb-25"><span class="input-icon d-flex flex-column align-items-center justify-content-center position-absolute top-0 start-0 bg-white"><i class="ri-user-3-line"></i></span>[text* name class:round-5 class:border-0 class:text-title placeholder "Name"]</div></div>
<div class="col-xl-3 col-sm-6" data-cue="slideInUp"><div class="form-group position-relative mb-25"><span class="input-icon d-flex flex-column align-items-center justify-content-center position-absolute top-0 start-0 bg-white"><i class="ri-mail-line"></i></span>[email* youremail class:round-5 class:border-0 class:text-title placeholder "Email"]</div></div>
<div class="col-xl-3 col-sm-6" data-cue="slideInUp"><div class="form-group position-relative mb-25"><span class="input-icon d-flex flex-column align-items-center justify-content-center position-absolute top-0 start-0 bg-white"><i class="ri-phone-line"></i></span>[number* your-name class:round-5 class:border-0 class:text-title placeholder "Phone"]</div></div>
<div class="col-xl-3 col-sm-6" data-cue="slideInUp"><button type="submit" class="btn style-one d-block w-100 mb-25"><i class="ri-calendar-line"></i>Book Appointment</button></div>
</div>
Here is the appointment book form section code:
<div class="row align-items-center">
<div class="col-md-6">
<div class="form-group">[text* yourname class:bg-athens class:w-100 class:round-5 placeholder "Name*"]<i class="ri-user-3-line"></i>
</div>
</div>
<div class="col-md-6">
<div class="form-group">[email* youremail class:bg-athens class:w-100 class:round-5 placeholder "Email"]<i class="ri-mail-line"></i>
</div>
</div>
<div class="col-md-6">
<div class="form-group">[number* phone_number class:bg-athens class:w-100 class:round-5 placeholder "Phone"]<i class="ri-phone-line"></i>
</div>
</div>
<div class="col-md-6">
<div class="form-group">[date* DateOfBirth class:bg-athens class:w-100 class:round-5 placeholder "Date Of Birth"]<i class="ri-calendar-line"></i>
</div>
</div>
<div class="col-md-6">
<div class="form-group">[text* addtime class:bg-athens class:w-100 class:round-5 placeholder "Time"]<i class="ri-time-line"></i>
</div>
</div>
<div class="col-md-6">
<div class="form-group">[date* bookDate class:bg-athens class:w-100 class:round-5 placeholder "Date"] <i class="ri-calendar-line"></i>
</div>
</div>
<div class="col-md-6">
<div class="form-group">[select* select_dep class:bg-athens class:w-100 class:round-5 class:ps-4 "Department" "Dental" "Surgery"]</div>
</div>
<div class="col-md-6">
<div class="form-group">[text* Socnum class:bg-athens class:w-100 class:round-5 placeholder "Social Security Number"] <i class="ri-hashtag"></i>
</div>
</div>
<div class="col-md-12">
<div class="form-group">[textarea* bookReason class:bg-athens class:w-100 class:round-5 placeholder "Reason of appointment"] <i class="ri-edit-line"></i>
</div>
</div>
<div class="col-xl-3 col-lg-4 col-md-4 pe-xxl-0 mb-sm-20"><button class="btn style-three"><i class="ri-calendar-line"></i>Book Appointment</button></div>
<div class="col-xl-9 col-lg-8 col-md-8 ps-xxl-0">
<div class="form-check checkbox"><input class="form-check-input" type="checkbox" id="gridCheck"
><label class="form-check-label" for="gridCheck">I have read and accepted the <a href="terms-conditions.html">Terms & Conditions</a> and <a href="privacy-policy.html">Privacy Policy</a></label>
</div>
</div>
</div>