Contact us 1
<section class="py-5">
<div class="container">
<div class="row align-items-center">
<div class="col-lg-8 mx-auto text-center">
<div class="ms-3 mb-md-5">
<div class="icon icon-shape icon-md bg-gradient-info shadow-info mx-auto text-center mb-4">
<i class="material-symbols-rounded opacity-10">person</i>
</div>
<h3>Contact us</h3>
<p>
For further questions, including partnership opportunities, please email [email protected]
or contact using our contact form.
</p>
</div>
</div>
</div>
<div class="row">
<div class="col-lg-8 mx-auto">
<div class="card card-plain">
<form id="contact-form" method="post" autocomplete="off">
<div class="card-body">
<div class="row">
<div class="col-md-6">
<div class="input-group input-group-static mb-4">
<label>First Name</label>
<input class="form-control" placeholder="eg. Michael" aria-label="First Name..." type="text">
</div>
</div>
<div class="col-md-6 ps-2">
<div class="input-group input-group-static">
<label>Last Name</label>
<input type="text" class="form-control" placeholder="eg. Jordan" aria-label="Last Name...">
</div>
</div>
</div>
<div class="mb-4">
<div class="input-group input-group-static">
<label>Company</label>
<input type="text" class="form-control" placeholder="eg. Apple Inc.">
</div>
</div>
<div class="mb-4">
<div class="input-group input-group-static">
<label>Email Address</label>
<input type="email" class="form-control" placeholder="eg. [email protected]">
</div>
</div>
<div class="mb-4">
<div class="input-group input-group-static mb-3">
<label>Phone Number</label>
<select class="input-group-text" id="inputGroupSelect01">
<option selected>RU</option>
<option value="1">EN</option>
<option value="2">US</option>
<option value="3">AR</option>
</select>
<input type="number" class="form-control ps-3" aria-label="Phone Number" placeholder="+(1111) 32322 11">
</div>
</div>
<div class="input-group input-group-static mb-4">
<label>Your message</label>
<textarea name="message" class="form-control" placeholder="Type here" id="message" rows="6"></textarea>
</div>
<div class="row">
<div class="col-md-6">
<div class="form-check form-switch d-flex align-items-center mb-4">
<input class="form-check-input" type="checkbox" id="flexSwitchCheckDefault" checked="">
<label class="form-check-label mb-0 ms-3" for="flexSwitchCheckDefault">I agree to the <a href="javascript:;" class="text-dark"><u>Terms and Conditions</u></a>.</label>
</div>
</div>
<div class="col-md-12">
<button type="submit" class="btn bg-gradient-info float-end">Send Message</button>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</section>
Contact us 2
<section class="py-7 bg-gradient-dark position-relative overflow-hidden">
<img class="position-absolute start-0 top-0 h-100 z-index-1 opacity-6" src="../../assets/img/shapes/pattern-lines.svg" alt="pattern">
<div class="container position-relative z-index-1">
<div class="row">
<div class="col-lg-6 col-md-12 d-flex justify-content-center flex-column">
<h2 class="text-white">Get in Touch</h2>
<p class="pe-5 text-white opacity-8 z-index-1">You need more information? Check what other persons are saying about our product. They are very happy with their purchase.</p>
<p class="mt-4 text-white opacity-8 z-index-1">730 Dyonisie Wolf <br> Bucharest, RO 010458</p>
<div class="d-flex p-2 text-white opacity-8">
<i class="material-symbols-rounded text-sm">call</i>
<span class="text-sm ps-3">(+40) 772 100 200</span>
</div>
<div class="d-flex p-2 text-white opacity-8">
<i class="material-symbols-rounded text-sm">email</i>
<span class="text-sm ps-3">[email protected]</span>
</div>
<div class="d-flex p-2 text-white opacity-8">
<i class="material-symbols-rounded text-sm">support</i>
<span class="text-sm ps-3">Open Support Ticket</span>
</div>
</div>
<div class="col-lg-6">
<div class="card mt-5 mt-lg-0">
<form id="contact-form" method="post" autocomplete="off">
<div class="card-body">
<div class="row">
<div class="col-md-6">
<div class="input-group input-group-static mb-4">
<label>First name</label>
<input class="form-control" placeholder="eg. William" aria-label="First Name..." type="text">
</div>
</div>
<div class="col-md-6 ps-2">
<div class="input-group input-group-static mb-4">
<label>Last name</label>
<input type="text" class="form-control" placeholder="eg. Smith" aria-label="Last Name...">
</div>
</div>
</div>
<div>
<div class="input-group input-group-static">
<label>Email address</label>
<input type="email" class="form-control" placeholder="[email protected]">
</div>
</div>
<div class="input-group input-group-static mt-4">
<label>Your message</label>
<textarea name="message" class="form-control" placeholder="Type here" id="message" rows="3"></textarea>
</div>
<div class="row mt-3">
<div class="col-md-8">
<div class="form-check form-switch d-flex align-items-center mb-2">
<input class="form-check-input" type="checkbox" id="flexSwitchCheckDefault" checked="">
<label class="form-check-label mb-0 ms-3" for="flexSwitchCheckDefault">I agree to the <a href="javascript:;" class="text-dark text-underline">Terms and Conditions</a>.</label>
</div>
</div>
<div class="col-md-12">
<button type="submit" class="btn bg-gradient-info mt-3">Submit</button>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</section>
Contact us 3
<section class="py-7 bg-cover position-relative" style="background-image: url('../../assets/img/city-profile.jpg');">
<div class="mask bg-gradient-dark"></div>
<div class="container position-relative z-index-2">
<div class="row">
<div class="col-lg-5 my-auto">
<h2 class="text-white">Get in Touch</h2>
<p class="text-white text-lg mb-lg-5">You need more information? Check what other persons are saying about our product. They are very happy with their purchase.</p>
<div class="p-3 d-flex">
<i class="material-symbols-rounded text-3xl text-white">location_on</i>
<div class="ms-5">
<h5 class="text-white">Find us at the office</h5>
<p class="text-white text-sm"> Bld Mihail Kogalniceanu, nr. 8,<br>
7652 Bucharest,<br>
Romania
</p>
</div>
</div>
<div class="p-3 d-flex">
<i class="material-symbols-rounded text-3xl text-white">notifications_active</i>
<div class="ms-5">
<h5 class="text-white">Give us a ring</h5>
<p class="text-white text-sm"> Michael Jordan<br>
+40 762 321 762<br>
Mon - Fri, 8:00-22:00
</p>
</div>
</div>
</div>
<div class="col-lg-5 m-auto">
<div class="card card-contact card-raised">
<form id="contact-form1" method="post">
<div class="card-header p-0 position-relative mt-2 mx-2 z-index-2 bg-transparent">
<div class="bg-gradient-dark shadow-dark border-radius-lg py-3 pe-1">
<h5 class="text-center text-white">Contact Us</h5>
</div>
</div>
<div class="card-body">
<div class="row">
<div class="col-md-6 pe-2">
<div class="input-group input-group-dynamic mb-4">
<label class="form-label">First name</label>
<input class="form-control" type="text" >
</div>
</div>
<div class="col-md-6 ps-2">
<div class="input-group input-group-dynamic mb-4">
<label class="form-label">Last name</label>
<input class="form-control" type="text" >
</div>
</div>
</div>
<div class="input-group input-group-dynamic mb-4">
<label class="form-label">Email address</label>
<input class="form-control" type="email" >
</div>
<div class="input-group input-group-static mb-4">
<label>Your message</label>
<textarea name="message" class="form-control" id="message" rows="6"></textarea>
</div>
<div class="row">
<div class="col-md-6 text-center m-auto">
<button type="submit" class="btn bg-gradient-dark mb-0">Send Message</button>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</section>
Contact us 4
<section class="py-7 bg-white position-relative">
<div class="page-header min-vh-50" style="background-image: url('../../assets/img/dg1.jpg');">
<span class="mask bg-gradient-dark opacity-4"></span>
<div class="container">
<div class="row justify-content-center">
<div class="col-lg-6 text-center mx-auto">
<h1 class="text-white font-weight-black mt-4 mb-1">Got a question?</h1>
<p class="lead text-white mb-6">We'd like to talk more about what you need</p>
</div>
</div>
</div>
</div>
<div class="container">
<div class="row mt-n5 blur border-radius-xl shadow-blur position-relative overflow-hidden">
<div class="col-lg-3 col-md-6 col-6 position-relative my-auto">
<div class="p-3 text-center">
<div class="icon icon-shape icon-md bg-gradient-dark shadow-dark text-center mx-auto">
<i class="material-symbols-rounded opacity-10">menu_book</i>
</div>
<h5 class="mt-3 mb-1">Address</h5>
<p class="mb-0">12124 First Street, nr 54</p>
<hr class="vertical dark">
</div>
</div>
<div class="col-lg-3 col-md-6 col-6 position-relative my-auto">
<div class="p-3 text-center">
<div class="icon icon-shape icon-md bg-gradient-dark shadow-dark text-center mx-auto">
<i class="material-symbols-rounded opacity-10">email</i>
</div>
<h5 class="mt-3 mb-1">Email</h5>
<p class="mb-0">[email protected]</p>
</div>
<hr class="vertical dark">
</div>
<div class="col-lg-3 col-md-6 col-6 position-relative my-auto">
<div class="p-3 text-center">
<div class="icon icon-shape icon-md bg-gradient-dark shadow-dark text-center mx-auto">
<i class="material-symbols-rounded opacity-10">call</i>
</div>
<h5 class="mt-3 mb-1">Phone</h5>
<p class="mb-0">+1(424) 535 3523</p>
</div>
<hr class="vertical dark">
</div>
<div class="col-lg-3 col-md-6 col-6 position-relative my-auto">
<div class="p-3 text-center">
<div class="icon icon-shape icon-md bg-gradient-dark shadow-dark text-center mx-auto">
<i class="material-symbols-rounded opacity-10">contacts</i>
</div>
<h5 class="mt-3 mb-1">Contact</h5>
<p class="mb-0">Andrew Samian</p>
</div>
</div>
</div>
</div>
</section>
Contact us 5
<section class="py-7">
<div class="container">
<div class="row align-items-center">
<div class="col-lg-8 mx-auto text-center">
<div class="ms-3 mb-md-5">
<h3>Contact us</h3>
<p>
For further questions, including partnership opportunities, please email [email protected]
or contact using our contact form.
</p>
</div>
</div>
</div>
<div class="row">
<div class="col-lg-8 mx-auto">
<div class="card card-plain">
<form id="contact-form" method="post" autocomplete="off">
<div class="card-body">
<div class="row">
<div class="col-md-6">
<div class="input-group input-group-outline mb-4">
<label class="form-label">Full Name</label>
<input class="form-control" aria-label="Full Name" type="text">
</div>
</div>
<div class="col-md-6 ps-md-2">
<div class="input-group input-group-outline">
<label class="form-label">Email</label>
<input type="email" class="form-control">
</div>
</div>
</div>
<div class="input-group input-group-outline mb-4 mt-md-0 mt-4">
<label class="form-label">What can we help you?</label>
<textarea name="message" class="form-control" id="message" rows="6"></textarea>
</div>
<div class="row">
<div class="col-md-12 text-center">
<button type="submit" class="btn bg-gradient-dark mt-4">Send Message</button>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</section>
Contact us 6
<section class="py-7 bg-gray-100 position-relative">
<div class="container">
<div class="row">
<div class="col-lg-6 mx-auto text-center">
<h2>Contact Us</h2>
<p class="font-weight-normal">Amy questions or remarks? Just write us a messaage!</p>
</div>
</div>
<div class="row mt-6">
<div class="col-lg-10 mx-auto">
<div class="card">
<div class="row">
<div class="col-lg-5 d-flex">
<div class="bg-gradient-dark mt-n5 mb-3 ms-lg-3 border-radius-md">
<div class="card-body p-5 position-relative">
<h3 class="text-white">Contact Information</h3>
<p class="text-white opacity-8 mb-4">Fill up the form and our Team will get back to you within 24 hours.</p>
<div class="d-flex p-2 text-white">
<i class="material-symbols-rounded text-sm">call</i>
<span class="text-sm opacity-8 ps-3">(+40) 772 100 200</span>
</div>
<div class="d-flex p-2 text-white">
<i class="material-symbols-rounded text-sm">email</i>
<span class="text-sm opacity-8 ps-3">[email protected]</span>
</div>
<div class="d-flex p-2 text-white">
<i class="material-symbols-rounded text-sm">location_on</i>
<span class="text-sm opacity-8 ps-3">730 Dyonisie Wolf <br> Bucharest, RO 010458</span>
</div>
<div class="mt-4">
<button type="button" class="btn btn-icon-only btn-link text-white btn-lg mb-0" data-toggle="tooltip" data-placement="bottom" data-original-title="Log in with Facebook">
<i class="fab fa-facebook"></i>
</button>
<button type="button" class="btn btn-icon-only btn-link text-white btn-lg mb-0" data-toggle="tooltip" data-placement="bottom" data-original-title="Log in with Twitter">
<i class="fab fa-twitter"></i>
</button>
<button type="button" class="btn btn-icon-only btn-link text-white btn-lg mb-0" data-toggle="tooltip" data-placement="bottom" data-original-title="Log in with Dribbble">
<i class="fab fa-dribbble"></i>
</button>
<button type="button" class="btn btn-icon-only btn-link text-white btn-lg mb-0" data-toggle="tooltip" data-placement="bottom" data-original-title="Log in with Instagram">
<i class="fab fa-instagram"></i>
</button>
</div>
</div>
</div>
</div>
<div class="col-lg-7">
<form id="contact-form" method="post" autocomplete="off">
<div class="card-body position-relative">
<div class="row mt-4">
<div class="col-md-6">
<div class="input-group input-group-static mb-4">
<label>First name</label>
<input class="form-control" placeholder="eg. Lucas" aria-label="First Name..." type="text">
</div>
</div>
<div class="col-md-6 ps-2">
<div class="input-group input-group-static mb-4">
<label>Last name</label>
<input type="text" class="form-control" placeholder="eg. Jones" aria-label="Last Name...">
</div>
</div>
</div>
<div>
<div class="input-group input-group-static mb-4">
<label>Email address</label>
<input type="email" class="form-control" placeholder="eg. [email protected]">
</div>
</div>
<label>What are you interested on?</label>
<div class="d-flex">
<div class="form-check me-3 my-auto">
<input class="form-check-input" type="radio" name="flexRadioDefault" id="flexRadioDefault1" checked>
<label class="form-check-label mb-0 ms-0" for="flexRadioDefault1">
Design
</label>
</div>
<div class="form-check me-3 my-auto">
<input class="form-check-input" type="radio" name="flexRadioDefault" id="flexRadioDefault2">
<label class="form-check-label mb-0 ms-0" for="flexRadioDefault2">
Development
</label>
</div>
<div class="form-check me-3 my-auto">
<input class="form-check-input" type="radio" name="flexRadioDefault" id="flexRadioDefault3">
<label class="form-check-label mb-0 ms-0" for="flexRadioDefault3">
Support
</label>
</div>
<div class="form-check my-auto">
<input class="form-check-input" type="radio" name="flexRadioDefault" id="flexRadioDefault4">
<label class="form-check-label mb-0 ms-0" for="flexRadioDefault4">
Other
</label>
</div>
</div>
<div class="input-group input-group-static mt-4">
<label>Your message</label>
<textarea name="message" class="form-control" id="message" rows="3"></textarea>
</div>
<div class="text-end mt-4">
<button type="button" class="btn bg-gradient-dark mb-0">Send message</button>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
Contact us 7
<section class="py-7">
<div class="container">
<div class="row">
<div class="col">
<div class="card overflow-hidden">
<div class="row">
<div class="col-lg-7">
<form class="p-3" id="contact-form" method="post">
<div class="card-header px-4 py-sm-5 py-3">
<h2>Say Hi!</h2>
<p class="lead"> We'd like to talk with you.</p>
</div>
<div class="card-body pt-1">
<div class="row">
<div class="col-md-12 pe-2 mb-3">
<div class="input-group input-group-static">
<label>My name is</label>
<input class="form-control" placeholder="Full Name" type="text" >
</div>
</div>
<div class="col-md-12 pe-2 mb-3">
<div class="input-group input-group-static">
<label>I'm looking for</label>
<input class="form-control" placeholder="What you love" type="text" >
</div>
</div>
<div class="col-md-12 pe-2 mb-3">
<div class="input-group input-group-static mb-0">
<label>Your message</label>
<textarea name="message" class="form-control" id="message" rows="6" placeholder="I want to say that..."></textarea>
</div>
</div>
</div>
<div class="row">
<div class="col-md-6 text-end ms-auto">
<button type="submit" class="btn btn-primary bg-gradient-dark mb-0">Send Message</button>
</div>
</div>
</div>
</form>
</div>
<div class="col-lg-5 position-relative bg-cover px-0" style="background-image: url('../../assets/img/examples/blog4.jpg')">
<div class="z-index-2 text-center d-flex h-100 w-100 d-flex m-auto justify-content-center">
<div class="mask bg-gradient-dark opacity-9"></div>
<div class="p-5 position-relative text-start my-auto">
<h3 class="text-white">Contact Information</h3>
<p class="text-white opacity-8 mb-4">Fill up the form and our Team will get back to you within 24 hours.</p>
<div class="d-flex p-2 text-white">
<i class="material-symbols-rounded text-sm">call</i>
<span class="text-sm opacity-8 ps-3">(+40) 772 100 200</span>
</div>
<div class="d-flex p-2 text-white">
<i class="material-symbols-rounded text-sm">email</i>
<span class="text-sm opacity-8 ps-3">[email protected]</span>
</div>
<div class="d-flex p-2 text-white">
<i class="material-symbols-rounded text-sm">location_on</i>
<span class="text-sm opacity-8 ps-3">Dyonisie Wolf Bucharest, RO 010458</span>
</div>
<div class="mt-4">
<button type="button" class="btn btn-icon-only btn-link text-white btn-lg mb-0" data-toggle="tooltip" data-placement="bottom" data-original-title="Log in with Facebook">
<i class="fab fa-facebook"></i>
</button>
<button type="button" class="btn btn-icon-only btn-link text-white btn-lg mb-0" data-toggle="tooltip" data-placement="bottom" data-original-title="Log in with Twitter">
<i class="fab fa-twitter"></i>
</button>
<button type="button" class="btn btn-icon-only btn-link text-white btn-lg mb-0" data-toggle="tooltip" data-placement="bottom" data-original-title="Log in with Dribbble">
<i class="fab fa-dribbble"></i>
</button>
<button type="button" class="btn btn-icon-only btn-link text-white btn-lg mb-0" data-toggle="tooltip" data-placement="bottom" data-original-title="Log in with Instagram">
<i class="fab fa-instagram"></i>
</button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
Contact us 8
<section class="py-7 bg-white position-relative">
<div class="container">
<div class="row">
<div class="col-lg-6 col-md-5 mb-5">
<div class="icon icon-shape icon-md bg-gradient-dark shadow-dark text-center mb-4">
<i class="material-symbols-rounded opacity-10">support_agent</i>
</div>
<h3>Premium Support</h3>
<p class="pe-5">You need more information? Check what other persons are saying about our product. They are very happy with their purchase.</p>
<div class="d-flex p-2 ps-0">
<i class="material-symbols-rounded text-sm">map</i>
<span class="ps-3">730 Dyonisie Wolf <br> Bucharest, RO 010458</span>
</div>
<div class="d-flex align-items-center p-2 ps-0">
<i class="material-symbols-rounded text-sm">mail</i>
<span class="ps-3">[email protected]</span>
</div>
</div>
<div class="col-lg-6 col-md-5">
<div class="icon icon-shape icon-md bg-gradient-dark shadow-dark text-center mb-4">
<i class="material-symbols-rounded opacity-10">system_update_alt</i>
</div>
<h3>Free Updates</h3>
<p class="pe-5">You need more information? Check what other persons are saying about our product. They are very happy with their purchase.</p>
<div class="d-flex p-2 ps-0">
<i class="material-symbols-rounded text-sm">call</i>
<span class="ps-3">(+40) 772 100 200 <br> (+40) 763 310 190</span>
</div>
<div class="d-flex align-items-center p-2 ps-0">
<i class="material-symbols-rounded text-sm">contact_mail</i>
<span class="ps-3">[email protected]</span>
</div>
</div>
</div>
</div>
</section>