about-us.html 17 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390
  1. <!DOCTYPE html>
  2. <html lang="zxx">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta name="description" content="Sona Template">
  6. <meta name="keywords" content="Sona, unica, creative, html">
  7. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  8. <meta http-equiv="X-UA-Compatible" content="ie=edge">
  9. <title>Sona | Template</title>
  10. <!-- Google Font -->
  11. <link href="https://fonts.googleapis.com/css?family=Lora:400,700&display=swap" rel="stylesheet">
  12. <link href="https://fonts.googleapis.com/css?family=Cabin:400,500,600,700&display=swap" rel="stylesheet">
  13. <!-- Css Styles -->
  14. <link rel="stylesheet" href="css/bootstrap.min.css" type="text/css">
  15. <link rel="stylesheet" href="css/font-awesome.min.css" type="text/css">
  16. <link rel="stylesheet" href="css/elegant-icons.css" type="text/css">
  17. <link rel="stylesheet" href="css/flaticon.css" type="text/css">
  18. <link rel="stylesheet" href="css/owl.carousel.min.css" type="text/css">
  19. <link rel="stylesheet" href="css/nice-select.css" type="text/css">
  20. <link rel="stylesheet" href="css/jquery-ui.min.css" type="text/css">
  21. <link rel="stylesheet" href="css/magnific-popup.css" type="text/css">
  22. <link rel="stylesheet" href="css/slicknav.min.css" type="text/css">
  23. <link rel="stylesheet" href="css/style.css" type="text/css">
  24. </head>
  25. <body>
  26. <!-- Page Preloder -->
  27. <div id="preloder">
  28. <div class="loader"></div>
  29. </div>
  30. <!-- Offcanvas Menu Section Begin -->
  31. <div class="offcanvas-menu-overlay"></div>
  32. <div class="canvas-open">
  33. <i class="icon_menu"></i>
  34. </div>
  35. <div class="offcanvas-menu-wrapper">
  36. <div class="canvas-close">
  37. <i class="icon_close"></i>
  38. </div>
  39. <div class="search-icon search-switch">
  40. <i class="icon_search"></i>
  41. </div>
  42. <div class="header-configure-area">
  43. <div class="language-option">
  44. <img src="img/flag.jpg" alt="">
  45. <span>EN <i class="fa fa-angle-down"></i></span>
  46. <div class="flag-dropdown">
  47. <ul>
  48. <li><a href="#">Zi</a></li>
  49. <li><a href="#">Fr</a></li>
  50. </ul>
  51. </div>
  52. </div>
  53. <a href="#" class="bk-btn">Booking Now</a>
  54. </div>
  55. <nav class="mainmenu mobile-menu">
  56. <ul>
  57. <li class="active"><a href="./index.html">Home</a></li>
  58. <li><a href="./rooms.html">Rooms</a></li>
  59. <li><a href="./about-us.html">About Us</a></li>
  60. <li><a href="./pages.html">Pages</a>
  61. <ul class="dropdown">
  62. <li><a href="./room-details.html">Room Details</a></li>
  63. <li><a href="./blog-details.html">Blog Details</a></li>
  64. <li><a href="#">Family Room</a></li>
  65. <li><a href="#">Premium Room</a></li>
  66. </ul>
  67. </li>
  68. <li><a href="./blog.html">News</a></li>
  69. <li><a href="./contact.html">Contact</a></li>
  70. </ul>
  71. </nav>
  72. <div id="mobile-menu-wrap"></div>
  73. <div class="top-social">
  74. <a href="#"><i class="fa fa-facebook"></i></a>
  75. <a href="#"><i class="fa fa-twitter"></i></a>
  76. <a href="#"><i class="fa fa-tripadvisor"></i></a>
  77. <a href="#"><i class="fa fa-instagram"></i></a>
  78. </div>
  79. <ul class="top-widget">
  80. <li><i class="fa fa-phone"></i> (12) 345 67890</li>
  81. <li><i class="fa fa-envelope"></i> info.colorlib@gmail.com</li>
  82. </ul>
  83. </div>
  84. <!-- Offcanvas Menu Section End -->
  85. <!-- Header Section Begin -->
  86. <header class="header-section header-normal">
  87. <div class="top-nav">
  88. <div class="container">
  89. <div class="row">
  90. <div class="col-lg-6">
  91. <ul class="tn-left">
  92. <li><i class="fa fa-phone"></i> (12) 345 67890</li>
  93. <li><i class="fa fa-envelope"></i> info.colorlib@gmail.com</li>
  94. </ul>
  95. </div>
  96. <div class="col-lg-6">
  97. <div class="tn-right">
  98. <div class="top-social">
  99. <a href="#"><i class="fa fa-facebook"></i></a>
  100. <a href="#"><i class="fa fa-twitter"></i></a>
  101. <a href="#"><i class="fa fa-tripadvisor"></i></a>
  102. <a href="#"><i class="fa fa-instagram"></i></a>
  103. </div>
  104. <a href="#" class="bk-btn">Booking Now</a>
  105. <div class="language-option">
  106. <img src="img/flag.jpg" alt="">
  107. <span>EN <i class="fa fa-angle-down"></i></span>
  108. <div class="flag-dropdown">
  109. <ul>
  110. <li><a href="#">Zi</a></li>
  111. <li><a href="#">Fr</a></li>
  112. </ul>
  113. </div>
  114. </div>
  115. </div>
  116. </div>
  117. </div>
  118. </div>
  119. </div>
  120. <div class="menu-item">
  121. <div class="container">
  122. <div class="row">
  123. <div class="col-lg-2">
  124. <div class="logo">
  125. <a href="./index.html">
  126. <img src="img/logo.png" alt="">
  127. </a>
  128. </div>
  129. </div>
  130. <div class="col-lg-10">
  131. <div class="nav-menu">
  132. <nav class="mainmenu">
  133. <ul>
  134. <li><a href="./index.html">Home</a></li>
  135. <li><a href="./rooms.html">Rooms</a></li>
  136. <li class="active"><a href="./about-us.html">About Us</a></li>
  137. <li><a href="./pages.html">Pages</a>
  138. <ul class="dropdown">
  139. <li><a href="./room-details.html">Room Details</a></li>
  140. <li><a href="./blog-details.html">Blog Details</a></li>
  141. <li><a href="#">Family Room</a></li>
  142. <li><a href="#">Premium Room</a></li>
  143. </ul>
  144. </li>
  145. <li><a href="./blog.html">News</a></li>
  146. <li><a href="./contact.html">Contact</a></li>
  147. </ul>
  148. </nav>
  149. <div class="nav-right search-switch">
  150. <i class="icon_search"></i>
  151. </div>
  152. </div>
  153. </div>
  154. </div>
  155. </div>
  156. </div>
  157. </header>
  158. <!-- Header End -->
  159. <!-- Breadcrumb Section Begin -->
  160. <div class="breadcrumb-section">
  161. <div class="container">
  162. <div class="row">
  163. <div class="col-lg-12">
  164. <div class="breadcrumb-text">
  165. <h2>About Us</h2>
  166. <div class="bt-option">
  167. <a href="./index.html">Home</a>
  168. <span>About Us</span>
  169. </div>
  170. </div>
  171. </div>
  172. </div>
  173. </div>
  174. </div>
  175. <!-- Breadcrumb Section End -->
  176. <!-- About Us Page Section Begin -->
  177. <section class="aboutus-page-section spad">
  178. <div class="container">
  179. <div class="about-page-text">
  180. <div class="row">
  181. <div class="col-lg-6">
  182. <div class="ap-title">
  183. <h2>Welcome To Sona.</h2>
  184. <p>Built in 1910 during the Belle Epoque period, this hotel is located in the center of
  185. Paris, with easy access to the city’s tourist attractions. It offers tastefully
  186. decorated rooms.</p>
  187. </div>
  188. </div>
  189. <div class="col-lg-5 offset-lg-1">
  190. <ul class="ap-services">
  191. <li><i class="icon_check"></i> 20% Off On Accommodation.</li>
  192. <li><i class="icon_check"></i> Complimentary Daily Breakfast</li>
  193. <li><i class="icon_check"></i> 3 Pcs Laundry Per Day</li>
  194. <li><i class="icon_check"></i> Free Wifi.</li>
  195. <li><i class="icon_check"></i> Discount 20% On F&B</li>
  196. </ul>
  197. </div>
  198. </div>
  199. </div>
  200. <div class="about-page-services">
  201. <div class="row">
  202. <div class="col-md-4">
  203. <div class="ap-service-item set-bg" data-setbg="img/about/about-p1.jpg">
  204. <div class="api-text">
  205. <h3>Restaurants Services</h3>
  206. </div>
  207. </div>
  208. </div>
  209. <div class="col-md-4">
  210. <div class="ap-service-item set-bg" data-setbg="img/about/about-p2.jpg">
  211. <div class="api-text">
  212. <h3>Travel & Camping</h3>
  213. </div>
  214. </div>
  215. </div>
  216. <div class="col-md-4">
  217. <div class="ap-service-item set-bg" data-setbg="img/about/about-p3.jpg">
  218. <div class="api-text">
  219. <h3>Event & Party</h3>
  220. </div>
  221. </div>
  222. </div>
  223. </div>
  224. </div>
  225. </div>
  226. </section>
  227. <!-- About Us Page Section End -->
  228. <!-- Video Section Begin -->
  229. <section class="video-section set-bg" data-setbg="img/video-bg.jpg">
  230. <div class="container">
  231. <div class="row">
  232. <div class="col-lg-12">
  233. <div class="video-text">
  234. <h2>Discover Our Hotel & Services.</h2>
  235. <p>It S Hurricane Season But We Are Visiting Hilton Head Island</p>
  236. <a href="https://www.youtube.com/watch?v=EzKkl64rRbM" class="play-btn video-popup"><img
  237. src="img/play.png" alt=""></a>
  238. </div>
  239. </div>
  240. </div>
  241. </div>
  242. </section>
  243. <!-- Video Section End -->
  244. <!-- Gallery Section Begin -->
  245. <section class="gallery-section spad">
  246. <div class="container">
  247. <div class="row">
  248. <div class="col-lg-12">
  249. <div class="section-title">
  250. <span>Our Gallery</span>
  251. <h2>Discover Our Work</h2>
  252. </div>
  253. </div>
  254. </div>
  255. <div class="row">
  256. <div class="col-lg-6">
  257. <div class="gallery-item set-bg" data-setbg="img/gallery/gallery-1.jpg">
  258. <div class="gi-text">
  259. <h3>Room Luxury</h3>
  260. </div>
  261. </div>
  262. <div class="row">
  263. <div class="col-sm-6">
  264. <div class="gallery-item set-bg" data-setbg="img/gallery/gallery-3.jpg">
  265. <div class="gi-text">
  266. <h3>Room Luxury</h3>
  267. </div>
  268. </div>
  269. </div>
  270. <div class="col-sm-6">
  271. <div class="gallery-item set-bg" data-setbg="img/gallery/gallery-4.jpg">
  272. <div class="gi-text">
  273. <h3>Room Luxury</h3>
  274. </div>
  275. </div>
  276. </div>
  277. </div>
  278. </div>
  279. <div class="col-lg-6">
  280. <div class="gallery-item large-item set-bg" data-setbg="img/gallery/gallery-2.jpg">
  281. <div class="gi-text">
  282. <h3>Room Luxury</h3>
  283. </div>
  284. </div>
  285. </div>
  286. </div>
  287. </div>
  288. </section>
  289. <!-- Gallery Section End -->
  290. <!-- Footer Section Begin -->
  291. <footer class="footer-section">
  292. <div class="container">
  293. <div class="footer-text">
  294. <div class="row">
  295. <div class="col-lg-4">
  296. <div class="ft-about">
  297. <div class="logo">
  298. <a href="#">
  299. <img src="img/footer-logo.png" alt="">
  300. </a>
  301. </div>
  302. <p>We inspire and reach millions of travelers<br /> across 90 local websites</p>
  303. <div class="fa-social">
  304. <a href="#"><i class="fa fa-facebook"></i></a>
  305. <a href="#"><i class="fa fa-twitter"></i></a>
  306. <a href="#"><i class="fa fa-tripadvisor"></i></a>
  307. <a href="#"><i class="fa fa-instagram"></i></a>
  308. <a href="#"><i class="fa fa-youtube-play"></i></a>
  309. </div>
  310. </div>
  311. </div>
  312. <div class="col-lg-3 offset-lg-1">
  313. <div class="ft-contact">
  314. <h6>Contact Us</h6>
  315. <ul>
  316. <li>(12) 345 67890</li>
  317. <li>info.colorlib@gmail.com</li>
  318. <li>856 Cordia Extension Apt. 356, Lake, United State</li>
  319. </ul>
  320. </div>
  321. </div>
  322. <div class="col-lg-3 offset-lg-1">
  323. <div class="ft-newslatter">
  324. <h6>New latest</h6>
  325. <p>Get the latest updates and offers.</p>
  326. <form action="#" class="fn-form">
  327. <input type="text" placeholder="Email">
  328. <button type="submit"><i class="fa fa-send"></i></button>
  329. </form>
  330. </div>
  331. </div>
  332. </div>
  333. </div>
  334. </div>
  335. <div class="copyright-option">
  336. <div class="container">
  337. <div class="row">
  338. <div class="col-lg-7">
  339. <ul>
  340. <li><a href="#">Contact</a></li>
  341. <li><a href="#">Terms of use</a></li>
  342. <li><a href="#">Privacy</a></li>
  343. <li><a href="#">Environmental Policy</a></li>
  344. </ul>
  345. </div>
  346. <div class="col-lg-5">
  347. <div class="co-text"><p><!-- Link back to Colorlib can't be removed. Template is licensed under CC BY 3.0. -->
  348. Copyright &copy;<script>document.write(new Date().getFullYear());</script> All rights reserved | This template is made with <i class="fa fa-heart" aria-hidden="true"></i> by <a href="https://colorlib.com" target="_blank">Colorlib</a>
  349. <!-- Link back to Colorlib can't be removed. Template is licensed under CC BY 3.0. --></p></div>
  350. </div>
  351. </div>
  352. </div>
  353. </div>
  354. </footer>
  355. <!-- Footer Section End -->
  356. <!-- Search model Begin -->
  357. <div class="search-model">
  358. <div class="h-100 d-flex align-items-center justify-content-center">
  359. <div class="search-close-switch"><i class="icon_close"></i></div>
  360. <form class="search-model-form">
  361. <input type="text" id="search-input" placeholder="Search here.....">
  362. </form>
  363. </div>
  364. </div>
  365. <!-- Search model end -->
  366. <!-- Js Plugins -->
  367. <script src="js/jquery-3.3.1.min.js"></script>
  368. <script src="js/bootstrap.min.js"></script>
  369. <script src="js/jquery.magnific-popup.min.js"></script>
  370. <script src="js/jquery.nice-select.min.js"></script>
  371. <script src="js/jquery-ui.min.js"></script>
  372. <script src="js/jquery.slicknav.js"></script>
  373. <script src="js/owl.carousel.min.js"></script>
  374. <script src="js/main.js"></script>
  375. </body>
  376. </html>