Geen omschrijving
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

contact-us.html 22KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="utf-8" />
  5. <title>
  6. Brihaspathi Technologies - Leading IT Solutions & Services Provider
  7. </title>
  8. <meta content="width=device-width, initial-scale=1.0" name="viewport" />
  9. <meta content="" name="keywords" />
  10. <meta content="" name="description" />
  11. <!-- Google Web Fonts -->
  12. <link rel="preconnect" href="https://fonts.googleapis.com" />
  13. <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
  14. <link
  15. href="https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,100..1000;1,9..40,100..1000&family=Inter:slnt,wght@-10..0,100..900&display=swap"
  16. rel="stylesheet" />
  17. <!-- Icon Font Stylesheet -->
  18. <link
  19. rel="stylesheet"
  20. href="https://use.fontawesome.com/releases/v5.15.4/css/all.css" />
  21. <link
  22. href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.4.1/font/bootstrap-icons.css"
  23. rel="stylesheet" />
  24. <!-- Libraries Stylesheet -->
  25. <link rel="stylesheet" href="lib/animate/animate.min.css" />
  26. <link href="lib/lightbox/css/lightbox.min.css" rel="stylesheet" />
  27. <link href="lib/owlcarousel/assets/owl.carousel.min.css" rel="stylesheet" />
  28. <!-- Customized Bootstrap Stylesheet -->
  29. <link href="css/bootstrap.min.css" rel="stylesheet" />
  30. <!-- Template Stylesheet -->
  31. <link href="css/style.css" rel="stylesheet" />
  32. <link href="css/navbar.css" rel="stylesheet" />
  33. </head>
  34. <body>
  35. <!-- Spinner Start -->
  36. <div
  37. id="spinner"
  38. class="show bg-white position-fixed translate-middle w-100 vh-100 top-50 start-50 d-flex align-items-center justify-content-center">
  39. <div
  40. class="spinner-border text-primary"
  41. style="width: 3rem; height: 3rem"
  42. role="status">
  43. <span class="sr-only">Loading...</span>
  44. </div>
  45. </div>
  46. <!-- Spinner End -->
  47. <header class="header" id="header"></header>
  48. <!-- Header Start -->
  49. <!-- <div class="container-fluid bg-breadcrumb">
  50. <div class="container text-center py-5" style="max-width: 900px;">
  51. <h4 class="text-white display-4 mb-4 wow fadeInDown" data-wow-delay="0.1s">Our Features</h4>
  52. <ol class="breadcrumb d-flex justify-content-center mb-0 wow fadeInDown" data-wow-delay="0.3s">
  53. <li class="breadcrumb-item"><a href="index.html">Home</a></li>
  54. <li class="breadcrumb-item"><a href="#">Pages</a></li>
  55. <li class="breadcrumb-item active text-primary">Feature</li>
  56. </ol>
  57. </div>
  58. </div> -->
  59. <!-- Header End -->
  60. <!-- Contact Start -->
  61. <div class="container-fluid contact bg-light py-5 mt-5">
  62. <div class="container py-5 mt-5">
  63. <div class="text-center mx-auto pb-5 wow fadeInUp" data-wow-delay="0.2s" style="max-width: 800px;">
  64. <h4 class="text-primary">Contact Us</h4>
  65. <h1 class="display-4 mb-4">
  66. Please fill the details so that our experts will get back to you.</h1>
  67. </div>
  68. <div class="row g-5">
  69. <div class="col-xl-6 wow fadeInLeft" data-wow-delay="0.2s">
  70. <div class="contact-img d-flex justify-content-center" >
  71. <div class="contact-img-inner">
  72. <img src="img/contact-img.png" class="img-fluid w-100" alt="Image">
  73. </div>
  74. </div>
  75. </div>
  76. <div class="col-xl-6 wow fadeInRight" data-wow-delay="0.4s">
  77. <div>
  78. <h4 class="text-primary">Send Your Message</h4>
  79. <form>
  80. <div class="row g-3">
  81. <div class="col-lg-12 col-xl-6">
  82. <div class="form-floating">
  83. <input type="text" class="form-control border-0" id="name" placeholder="Your Name">
  84. <label for="name">Your Name</label>
  85. </div>
  86. </div>
  87. <div class="col-lg-12 col-xl-6">
  88. <div class="form-floating">
  89. <input type="email" class="form-control border-0" id="email" placeholder="Your Email">
  90. <label for="email">Your Email</label>
  91. </div>
  92. </div>
  93. <div class="col-lg-12 col-xl-6">
  94. <div class="form-floating">
  95. <input type="phone" class="form-control border-0" id="phone" placeholder="Phone">
  96. <label for="phone">Your Phone</label>
  97. </div>
  98. </div>
  99. <div class="col-lg-12 col-xl-6">
  100. <div class="form-floating">
  101. <input type="text" class="form-control border-0" id="project" placeholder="Project">
  102. <label for="project">Your Project</label>
  103. </div>
  104. </div>
  105. <div class="col-12">
  106. <div class="form-floating">
  107. <input type="text" class="form-control border-0" id="subject" placeholder="Subject">
  108. <label for="subject">Subject</label>
  109. </div>
  110. </div>
  111. <div class="col-12">
  112. <div class="form-floating">
  113. <textarea class="form-control border-0" placeholder="Leave a message here" id="message" style="height: 120px"></textarea>
  114. <label for="message">Message</label>
  115. </div>
  116. </div>
  117. <div class="col-12">
  118. <button class="btn btn-primary w-100 py-3">Send Message</button>
  119. </div>
  120. </div>
  121. </form>
  122. </div>
  123. </div>
  124. <div class="col-12">
  125. <div>
  126. <div class="row g-4">
  127. <div class="col-md-6 col-lg-3 wow fadeInUp" data-wow-delay="0.2s">
  128. <div class="contact-add-item">
  129. <div class="contact-icon text-primary mb-4">
  130. <i class="fas fa-map-marker-alt fa-2x"></i>
  131. </div>
  132. <div>
  133. <h4>Address</h4>
  134. <p class="mb-0">123 Street New York.USA</p>
  135. </div>
  136. </div>
  137. </div>
  138. <div class="col-md-6 col-lg-3 wow fadeInUp" data-wow-delay="0.4s">
  139. <div class="contact-add-item">
  140. <div class="contact-icon text-primary mb-4">
  141. <i class="fas fa-envelope fa-2x"></i>
  142. </div>
  143. <div>
  144. <h4>Mail Us</h4>
  145. <p class="mb-0">info@example.com</p>
  146. </div>
  147. </div>
  148. </div>
  149. <div class="col-md-6 col-lg-3 wow fadeInUp" data-wow-delay="0.6s">
  150. <div class="contact-add-item">
  151. <div class="contact-icon text-primary mb-4">
  152. <i class="fa fa-phone-alt fa-2x"></i>
  153. </div>
  154. <div>
  155. <h4>Telephone</h4>
  156. <p class="mb-0">(+012) 3456 7890</p>
  157. </div>
  158. </div>
  159. </div>
  160. <div class="col-md-6 col-lg-3 wow fadeInUp" data-wow-delay="0.8s">
  161. <div class="contact-add-item">
  162. <div class="contact-icon text-primary mb-4">
  163. <i class="fab fa-firefox-browser fa-2x"></i>
  164. </div>
  165. <div>
  166. <h4>Yoursite@ex.com</h4>
  167. <p class="mb-0">(+012) 3456 7890</p>
  168. </div>
  169. </div>
  170. </div>
  171. </div>
  172. </div>
  173. </div>
  174. <div class="col-12 wow fadeInUp" data-wow-delay="0.2s">
  175. <div class="rounded">
  176. <iframe class="rounded w-100"
  177. style="height: 400px;" src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d387191.33750346623!2d-73.97968099999999!3d40.6974881!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x89c24fa5d33f083b%3A0xc80b8f06e177fe62!2sNew%20York%2C%20NY%2C%20USA!5e0!3m2!1sen!2sbd!4v1694259649153!5m2!1sen!2sbd"
  178. loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe>
  179. </div>
  180. </div>
  181. </div>
  182. </div>
  183. </div>
  184. <!-- Contact End -->
  185. <!-- Footer Start -->
  186. <footer>
  187. <div class="container-fluid footer py-5 wow fadeIn" data-wow-delay="0.2s">
  188. <div class="container py-5">
  189. <div class="row g-5">
  190. <div class="col-xl-9">
  191. <!-- <div class="mb-5"> -->
  192. <!-- <div class="row g-4"> -->
  193. <!-- <div class="col-md-6 col-lg-6 col-xl-5"> -->
  194. <!-- <div class="footer-item"> -->
  195. <!-- <a href="index.html" class="p-0"> -->
  196. <!-- <h3 class="text-white"> -->
  197. <!-- <i class="fab fa-slack me-3"></i> LifeSure -->
  198. <!-- </h3> -->
  199. <!-- <!-- <img src="img/logo.png" alt="Logo"> -->
  200. <!-- </a> -->
  201. <!-- <p class="text-white mb-4"> -->
  202. <!-- Dolor amet sit justo amet elitr clita ipsum elitr -->
  203. <!-- est.Lorem ipsum dolor sit amet, consectetur adipiscing... -->
  204. <!-- </p> -->
  205. <!-- <div class="footer-btn d-flex"> -->
  206. <!-- <a class="btn btn-md-square rounded-circle me-3" href="#" -->
  207. <!-- ><i class="fab fa-facebook-f"></i -->
  208. <!-- ></a> -->
  209. <!-- <a class="btn btn-md-square rounded-circle me-3" href="#" -->
  210. <!-- ><i class="fab fa-twitter"></i -->
  211. <!-- ></a> -->
  212. <!-- <a class="btn btn-md-square rounded-circle me-3" href="#" -->
  213. <!-- ><i class="fab fa-instagram"></i -->
  214. <!-- ></a> -->
  215. <!-- <a class="btn btn-md-square rounded-circle me-0" href="#" -->
  216. <!-- ><i class="fab fa-linkedin-in"></i -->
  217. <!-- ></a> -->
  218. <!-- </div> -->
  219. <!-- </div> -->
  220. <!-- </div> -->
  221. <!-- <div class="col-md-6 col-lg-6 col-xl-3"> -->
  222. <!-- <div class="footer-item"> -->
  223. <!-- <h4 class="text-white mb-4">Useful Links</h4> -->
  224. <!-- <a href="#" -->
  225. <!-- ><i class="fas fa-angle-right me-2"></i> About Us</a -->
  226. <!-- > -->
  227. <!-- <a href="#" -->
  228. <!-- ><i class="fas fa-angle-right me-2"></i> Features</a -->
  229. <!-- > -->
  230. <!-- <a href="#" -->
  231. <!-- ><i class="fas fa-angle-right me-2"></i> Services</a -->
  232. <!-- > -->
  233. <!-- <a href="#" -->
  234. <!-- ><i class="fas fa-angle-right me-2"></i> FAQ's</a -->
  235. <!-- > -->
  236. <!-- <a href="#" -->
  237. <!-- ><i class="fas fa-angle-right me-2"></i> Blogs</a -->
  238. <!-- > -->
  239. <!-- <a href="#" -->
  240. <!-- ><i class="fas fa-angle-right me-2"></i> Contact</a -->
  241. <!-- > -->
  242. <!-- </div> -->
  243. <!-- </div> -->
  244. <!-- <div class="col-md-6 col-lg-6 col-xl-4"> -->
  245. <!-- <div class="footer-item"> -->
  246. <!-- <h4 class="mb-4 text-white">Instagram</h4> -->
  247. <!-- <div class="row g-3"> -->
  248. <!-- <div class="col-4"> -->
  249. <!-- <div class="footer-instagram rounded"> -->
  250. <!-- <img -->
  251. <!-- src="img/instagram-footer-1.jpg" -->
  252. <!-- class="img-fluid w-100" -->
  253. <!-- alt="" /> -->
  254. <!-- <div class="footer-search-icon"> -->
  255. <!-- <a -->
  256. <!-- href="img/instagram-footer-1.jpg" -->
  257. <!-- data-lightbox="footerInstagram-1" -->
  258. <!-- class="my-auto" -->
  259. <!-- ><i class="fas fa-link text-white"></i -->
  260. <!-- ></a> -->
  261. <!-- </div> -->
  262. <!-- </div> -->
  263. <!-- </div> -->
  264. <!-- <div class="col-4"> -->
  265. <!-- <div class="footer-instagram rounded"> -->
  266. <!-- <img -->
  267. <!-- src="img/instagram-footer-2.jpg" -->
  268. <!-- class="img-fluid w-100" -->
  269. <!-- alt="" /> -->
  270. <!-- <div class="footer-search-icon"> -->
  271. <!-- <a -->
  272. <!-- href="img/instagram-footer-2.jpg" -->
  273. <!-- data-lightbox="footerInstagram-2" -->
  274. <!-- class="my-auto" -->
  275. <!-- ><i class="fas fa-link text-white"></i -->
  276. <!-- ></a> -->
  277. <!-- </div> -->
  278. <!-- </div> -->
  279. <!-- </div> -->
  280. <!-- <div class="col-4"> -->
  281. <!-- <div class="footer-instagram rounded"> -->
  282. <!-- <img -->
  283. <!-- src="img/instagram-footer-3.jpg" -->
  284. <!-- class="img-fluid w-100" -->
  285. <!-- alt="" /> -->
  286. <!-- <div class="footer-search-icon"> -->
  287. <!-- <a -->
  288. <!-- href="img/instagram-footer-3.jpg" -->
  289. <!-- data-lightbox="footerInstagram-3" -->
  290. <!-- class="my-auto" -->
  291. <!-- ><i class="fas fa-link text-white"></i -->
  292. <!-- ></a> -->
  293. <!-- </div> -->
  294. <!-- </div> -->
  295. <!-- </div> -->
  296. <!-- <div class="col-4"> -->
  297. <!-- <div class="footer-instagram rounded"> -->
  298. <!-- <img -->
  299. <!-- src="img/instagram-footer-4.jpg" -->
  300. <!-- class="img-fluid w-100" -->
  301. <!-- alt="" /> -->
  302. <!-- <div class="footer-search-icon"> -->
  303. <!-- <a -->
  304. <!-- href="img/instagram-footer-4.jpg" -->
  305. <!-- data-lightbox="footerInstagram-4" -->
  306. <!-- class="my-auto" -->
  307. <!-- ><i class="fas fa-link text-white"></i -->
  308. <!-- ></a> -->
  309. <!-- </div> -->
  310. <!-- </div> -->
  311. <!-- </div> -->
  312. <!-- <div class="col-4"> -->
  313. <!-- <div class="footer-instagram rounded"> -->
  314. <!-- <img -->
  315. <!-- src="img/instagram-footer-5.jpg" -->
  316. <!-- class="img-fluid w-100" -->
  317. <!-- alt="" /> -->
  318. <!-- <div class="footer-search-icon"> -->
  319. <!-- <a -->
  320. <!-- href="img/instagram-footer-5.jpg" -->
  321. <!-- data-lightbox="footerInstagram-5" -->
  322. <!-- class="my-auto" -->
  323. <!-- ><i class="fas fa-link text-white"></i -->
  324. <!-- ></a> -->
  325. <!-- </div> -->
  326. <!-- </div> -->
  327. <!-- </div> -->
  328. <!-- <div class="col-4"> -->
  329. <!-- <div class="footer-instagram rounded"> -->
  330. <!-- <img -->
  331. <!-- src="img/instagram-footer-6.jpg" -->
  332. <!-- class="img-fluid w-100" -->
  333. <!-- alt="" /> -->
  334. <!-- <div class="footer-search-icon"> -->
  335. <!-- <a -->
  336. <!-- href="img/instagram-footer-6.jpg" -->
  337. <!-- data-lightbox="footerInstagram-6" -->
  338. <!-- class="my-auto" -->
  339. <!-- ><i class="fas fa-link text-white"></i -->
  340. <!-- ></a> -->
  341. <!-- </div> -->
  342. <!-- </div> -->
  343. <!-- </div> -->
  344. <!-- </div> -->
  345. <!-- </div> -->
  346. <!-- </div> -->
  347. <!-- </div> -->
  348. <!-- </div> -->
  349. <div
  350. class="pt-5"
  351. style="border-top: 1px solid rgba(255, 255, 255, 0.08)">
  352. <div class="row g-0">
  353. <div class="col-12">
  354. <div class="row g-4">
  355. <div class="col-lg-6 col-xl-4">
  356. <div class="d-flex">
  357. <div
  358. class="btn-xl-square bg-primary text-white rounded p-4 me-4">
  359. <i class="fas fa-map-marker-alt fa-2x"></i>
  360. </div>
  361. <div>
  362. <h4 class="text-white">Address</h4>
  363. <p class="mb-0">
  364. #501,#508-510, Shangrila Plaza , <br />Road No. 2,
  365. Park View Enclave, <br />Banjara Hills , Hyderabad,
  366. <br />Telangana-500034
  367. </p>
  368. </div>
  369. </div>
  370. </div>
  371. <div class="col-lg-6 col-xl-4">
  372. <div class="d-flex">
  373. <div
  374. class="btn-xl-square bg-primary text-white rounded p-4 me-4">
  375. <i class="fas fa-envelope fa-2x"></i>
  376. </div>
  377. <div>
  378. <h4 class="text-white">Mail Us</h4>
  379. <p class="mb-0">info@brihaspathi.com</p>
  380. </div>
  381. </div>
  382. </div>
  383. <div class="col-lg-6 col-xl-4">
  384. <div class="d-flex">
  385. <div
  386. class="btn-xl-square bg-primary text-white rounded p-4 me-4">
  387. <i class="fa fa-phone-alt fa-2x"></i>
  388. </div>
  389. <div>
  390. <h4 class="text-white">Telephone</h4>
  391. <p class="mb-0">+91 9885888835</p>
  392. <p class="mb-0">+91 9581234499</p>
  393. </div>
  394. </div>
  395. </div>
  396. </div>
  397. </div>
  398. </div>
  399. </div>
  400. </div>
  401. <div class="col-xl-3">
  402. <div class="footer-item">
  403. <h4 class="text-white mb-4">Follow Us</h4>
  404. <a href="">
  405. <i class="fab fa-facebook facebook"> Facebook</i>
  406. </a>
  407. <a href="">
  408. <i class="fab fa-twitter twitter"> Twitter</i>
  409. </a>
  410. <a href="">
  411. <i class="fab fa-instagram instagram"> Instagram</i>
  412. </a>
  413. <a href="">
  414. <i class="fab fa-linkedin linkedin"> Linkedin</i>
  415. </a>
  416. <a href="">
  417. <i class="fab fa-youtube youtube"> Youtube</i>
  418. </a>
  419. <a href="">
  420. <i class="fab fa-pinterest pinterest"> Pinterest</i>
  421. </a>
  422. </div>
  423. </div>
  424. </div>
  425. </div>
  426. </div>
  427. <!-- Footer End -->
  428. <!-- Copyright Start -->
  429. <div class="container-fluid copyright py-4">
  430. <div class="container">
  431. <div class="row g-4 align-items-center">
  432. <div class="col-md-6 text-center text-md-end mb-md-0">
  433. <span class="text-body">
  434. 2024 © Copy Rights
  435. <a
  436. href="https://brihaspathi.com/"
  437. class="border-bottom text-white">
  438. Brihaspathi
  439. </a>
  440. </span>
  441. </div>
  442. <!-- <div class="col-md-6 text-center text-md-start text-body"> -->
  443. <!-- <!--/*** This template is free as long as you keep the below author’s credit link/attribution link/backlink. ***/-->
  444. <!-- <!--/*** If you'd like to use the template without the below author’s credit link/attribution link/backlink, ***/-->
  445. <!-- <!--/*** you can purchase the Credit Removal License from "https://htmlcodex.com/credit-removal". ***/-->
  446. <!-- Designed By -->
  447. <!-- <a class="border-bottom text-white" href="https://htmlcodex.com" -->
  448. <!-- >HTML Codex</a -->
  449. <!-- > -->
  450. <!-- Distributed By -->
  451. <!-- <a class="border-bottom text-white" href="https://themewagon.com" -->
  452. <!-- >ThemeWagon</a -->
  453. <!-- > -->
  454. <!-- </div> -->
  455. </div>
  456. </div>
  457. </div>
  458. <!-- Copyright End -->
  459. </footer>
  460. <!-- Back to Top -->
  461. <a href="#" class="btn btn-primary btn-lg-square rounded-circle back-to-top"
  462. ><i class="fa fa-arrow-up"></i
  463. ></a>
  464. <!-- JavaScript Libraries -->
  465. <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.4/jquery.min.js"></script>
  466. <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0/dist/js/bootstrap.bundle.min.js"></script>
  467. <script src="lib/wow/wow.min.js"></script>
  468. <script src="lib/easing/easing.min.js"></script>
  469. <script src="lib/waypoints/waypoints.min.js"></script>
  470. <script src="lib/counterup/counterup.min.js"></script>
  471. <script src="lib/lightbox/js/lightbox.min.js"></script>
  472. <script src="lib/owlcarousel/owl.carousel.min.js"></script>
  473. <!-- Template Javascript -->
  474. <script src="js/main.js"></script>
  475. <script src="js/footer.js"></script>
  476. <script src="js/navbar.js"></script>
  477. </body>
  478. </html>