contact.html 12KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246
  1. <!doctype html>
  2. <html lang="en">
  3. <head>
  4. <!-- Required meta tags -->
  5. <meta charset="utf-8">
  6. <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
  7. <link rel="icon" href="img/favicon.png" type="image/png">
  8. <title>MeetMe Personal</title>
  9. <!-- Bootstrap CSS -->
  10. <link rel="stylesheet" href="css/bootstrap.css">
  11. <link rel="stylesheet" href="vendors/linericon/style.css">
  12. <link rel="stylesheet" href="css/font-awesome.min.css">
  13. <link rel="stylesheet" href="vendors/owl-carousel/owl.carousel.min.css">
  14. <link rel="stylesheet" href="vendors/lightbox/simpleLightbox.css">
  15. <link rel="stylesheet" href="vendors/nice-select/css/nice-select.css">
  16. <link rel="stylesheet" href="vendors/animate-css/animate.css">
  17. <link rel="stylesheet" href="vendors/popup/magnific-popup.css">
  18. <!-- main css -->
  19. <link rel="stylesheet" href="css/style.css">
  20. <link rel="stylesheet" href="css/responsive.css">
  21. </head>
  22. <body>
  23. <!--================Header Menu Area =================-->
  24. <header class="header_area">
  25. <div class="main_menu">
  26. <nav class="navbar navbar-expand-lg navbar-light">
  27. <div class="container box_1620">
  28. <!-- Brand and toggle get grouped for better mobile display -->
  29. <a class="navbar-brand logo_h" href="index.html"><img src="img/logo.png" alt=""></a>
  30. <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
  31. <span class="icon-bar"></span>
  32. <span class="icon-bar"></span>
  33. <span class="icon-bar"></span>
  34. </button>
  35. <!-- Collect the nav links, forms, and other content for toggling -->
  36. <div class="collapse navbar-collapse offset" id="navbarSupportedContent">
  37. <ul class="nav navbar-nav menu_nav ml-auto">
  38. <li class="nav-item active"><a class="nav-link" href="index.html">Home</a></li>
  39. <li class="nav-item"><a class="nav-link" href="about-us.html">About</a></li>
  40. <li class="nav-item submenu dropdown">
  41. <a href="#" class="nav-link dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Blog</a>
  42. <ul class="dropdown-menu">
  43. <!-- <li class="nav-item"><a class="nav-link" href="blog.html">Blog</a></li>
  44. <li class="nav-item"><a class="nav-link" href="single-blog.html">Blog Details</a></li>-->
  45. </ul>
  46. </li>
  47. <!--<li class="nav-item"><a class="nav-link" href="contact.html">Contact</a></li>-->
  48. </ul>
  49. </div>
  50. </div>
  51. </nav>
  52. </div>
  53. </header>
  54. <!--================Header Menu Area =================-->
  55. <!--================Home Banner Area =================-->
  56. <section class="banner_area">
  57. <div class="box_1620">
  58. <div class="banner_inner d-flex align-items-center">
  59. <div class="container">
  60. <div class="banner_content text-center">
  61. <h2>Contact Us</h2>
  62. <div class="page_link">
  63. <a href="index.html">Home</a>
  64. <a href="contact.html">Contact Us</a>
  65. </div>
  66. </div>
  67. </div>
  68. </div>
  69. </div>
  70. </section>
  71. <!--================End Home Banner Area =================-->
  72. <!--================Contact Area =================-->
  73. <section class="contact_area p_120">
  74. <div class="container">
  75. <div id="mapBox" class="mapBox"
  76. data-lat="40.701083"
  77. data-lon="-74.1522848"
  78. data-zoom="13"
  79. data-info="PO Box CT16122 Collins Street West, Victoria 8007, Australia."
  80. data-mlat="40.701083"
  81. data-mlon="-74.1522848">
  82. </div>
  83. <div class="row">
  84. <div class="col-lg-3">
  85. <div class="contact_info">
  86. <div class="info_item">
  87. <i class="lnr lnr-home"></i>
  88. <h6>Pennsilyenia, United States</h6>
  89. <p></p>
  90. </div>
  91. <div class="info_item">
  92. <i class="lnr lnr-phone-handset"></i>
  93. <h6><a href="#">00 (484)401-2804</a></h6>
  94. <p>Mon to Fri 9am to 6 pm</p>
  95. </div>
  96. <div class="info_item">
  97. <i class="lnr lnr-envelope"></i>
  98. <h6><a href="#">yasoda.sanka@gmail.com</a></h6>
  99. <p></p>
  100. </div>
  101. </div>
  102. </div>
  103. <div class="col-lg-9">
  104. <form class="row contact_form" action="contact_process.php" method="post" id="contactForm" novalidate="novalidate">
  105. <div class="col-md-6">
  106. <div class="form-group">
  107. <input type="text" class="form-control" id="name" name="name" placeholder="Enter your name">
  108. </div>
  109. <div class="form-group">
  110. <input type="email" class="form-control" id="email" name="email" placeholder="Enter email address">
  111. </div>
  112. <div class="form-group">
  113. <input type="text" class="form-control" id="subject" name="subject" placeholder="Enter Subject">
  114. </div>
  115. </div>
  116. <div class="col-md-6">
  117. <div class="form-group">
  118. <textarea class="form-control" name="message" id="message" rows="1" placeholder="Enter Message"></textarea>
  119. </div>
  120. </div>
  121. <div class="col-md-12 text-right">
  122. <button type="submit" value="submit" class="btn submit_btn">Send Message</button>
  123. </div>
  124. </form>
  125. </div>
  126. </div>
  127. </div>
  128. </section>
  129. <!--================Contact Area =================-->
  130. <!--================Footer Area =================-->
  131. <footer class="footer_area p_120">
  132. <div class="container">
  133. <div class="row footer_inner">
  134. <div class="col-lg-5 col-sm-6">
  135. <aside class="f_widget ab_widget">
  136. <div class="f_title">
  137. <h3>About Me</h3>
  138. </div>
  139. <p>Do you want to be even more successful? Learn to love learning and growth. The more effort you put into improving your skills,</p>
  140. <p><!-- Link back to Colorlib can't be removed. Template is licensed under CC BY 3.0. -->
  141. Copyright &copy;<script>document.write(new Date().getFullYear());</script> All rights reserved | This template is made with <i class="fa fa-heart-o" aria-hidden="true"></i> by <a href="https://colorlib.com" target="_blank">Colorlib</a>
  142. <!-- Link back to Colorlib can't be removed. Template is licensed under CC BY 3.0. --></p>
  143. </aside>
  144. </div>
  145. <div class="col-lg-5 col-sm-6">
  146. <aside class="f_widget news_widget">
  147. <div class="f_title">
  148. <h3>Newsletter</h3>
  149. </div>
  150. <p>Stay updated with our latest trends</p>
  151. <div id="mc_embed_signup">
  152. <form target="_blank" action="https://spondonit.us12.list-manage.com/subscribe/post?u=1462626880ade1ac87bd9c93a&amp;id=92a4423d01" method="get" class="subscribe_form relative">
  153. <div class="input-group d-flex flex-row">
  154. <input name="EMAIL" placeholder="Enter email address" onfocus="this.placeholder = ''" onblur="this.placeholder = 'Email Address '" required="" type="email">
  155. <button class="btn sub-btn"><span class="lnr lnr-arrow-right"></span></button>
  156. </div>
  157. <div class="mt-10 info"></div>
  158. </form>
  159. </div>
  160. </aside>
  161. </div>
  162. <div class="col-lg-2">
  163. <aside class="f_widget social_widget">
  164. <div class="f_title">
  165. <h3>Follow Me</h3>
  166. </div>
  167. <p>Let us be social</p>
  168. <ul class="list">
  169. <li><a href="#"><i class="fa fa-facebook"></i></a></li>
  170. <li><a href="#"><i class="fa fa-twitter"></i></a></li>
  171. <li><a href="#"><i class="fa fa-dribbble"></i></a></li>
  172. <li><a href="#"><i class="fa fa-behance"></i></a></li>
  173. </ul>
  174. </aside>
  175. </div>
  176. </div>
  177. </div>
  178. </footer>
  179. <!--================End Footer Area =================-->
  180. <!--================Contact Success and Error message Area =================-->
  181. <div id="success" class="modal modal-message fade" role="dialog">
  182. <div class="modal-dialog">
  183. <div class="modal-content">
  184. <div class="modal-header">
  185. <button type="button" class="close" data-dismiss="modal" aria-label="Close">
  186. <i class="fa fa-close"></i>
  187. </button>
  188. <h2>Thank you</h2>
  189. <p>Your message is successfully sent...</p>
  190. </div>
  191. </div>
  192. </div>
  193. </div>
  194. <!-- Modals error -->
  195. <div id="error" class="modal modal-message fade" role="dialog">
  196. <div class="modal-dialog">
  197. <div class="modal-content">
  198. <div class="modal-header">
  199. <button type="button" class="close" data-dismiss="modal" aria-label="Close">
  200. <i class="fa fa-close"></i>
  201. </button>
  202. <h2>Sorry !</h2>
  203. <p> Something went wrong </p>
  204. </div>
  205. </div>
  206. </div>
  207. </div>
  208. <!--================End Contact Success and Error message Area =================-->
  209. <!-- Optional JavaScript -->
  210. <!-- jQuery first, then Popper.js, then Bootstrap JS -->
  211. <script src="js/jquery-3.3.1.min.js"></script>
  212. <script src="js/popper.js"></script>
  213. <script src="js/bootstrap.min.js"></script>
  214. <script src="js/stellar.js"></script>
  215. <script src="vendors/lightbox/simpleLightbox.min.js"></script>
  216. <script src="vendors/nice-select/js/jquery.nice-select.min.js"></script>
  217. <script src="vendors/isotope/imagesloaded.pkgd.min.js"></script>
  218. <script src="vendors/isotope/isotope.pkgd.min.js"></script>
  219. <script src="vendors/popup/jquery.magnific-popup.min.js"></script>
  220. <script src="vendors/owl-carousel/owl.carousel.min.js"></script>
  221. <script src="js/jquery.ajaxchimp.min.js"></script>
  222. <script src="js/mail-script.js"></script>
  223. <script src="vendors/counter-up/jquery.waypoints.min.js"></script>
  224. <script src="vendors/counter-up/jquery.counterup.min.js"></script>
  225. <!-- contact js -->
  226. <script src="js/jquery.form.js"></script>
  227. <script src="js/jquery.validate.min.js"></script>
  228. <script src="js/contact.js"></script>
  229. <!--gmaps Js-->
  230. <script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCjCGmQ0Uq4exrzdcL6rvxywDDOvfAu6eE"></script>
  231. <script src="js/gmaps.min.js"></script>
  232. <script src="js/theme.js"></script>
  233. </body>
  234. </html>