checkout.html 37 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta http-equiv="X-UA-Compatible" content="IE=edge">
  6. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  7. <!-- fonts -->
  8. <link rel="preconnect" href="https://fonts.googleapis.com">
  9. <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
  10. <link href="https://fonts.googleapis.com/css2?family=Josefin+Sans:wght@100;200;300;400;500;600;700&display=swap" rel="stylesheet">
  11. <!-- bootstrap css -->
  12. <link rel="stylesheet" href="./css/bootstrap.min.css">
  13. <!-- swiper slider css -->
  14. <link rel="stylesheet" href="./css/swiper-bundle.min.css">
  15. <!-- lightbox css -->
  16. <link rel="stylesheet" href="./css/simple-lightbox.css">
  17. <!-- custom css -->
  18. <link rel="stylesheet" href="./css/style.css">
  19. <title>Checkout</title>
  20. </head>
  21. <body>
  22. <!-- nav header -->
  23. <section id="header">
  24. <!-- offrer -->
  25. <div class="offer bg-pink text-white py-1">
  26. <div class="container">
  27. <p class="text-center px-2 py-1">
  28. free delivery over dhaka over 999 Delivery policy (Inside Dhaka delivery within 24hrs, Outside Dhaka delivery within 72hrs)
  29. </p>
  30. </div>
  31. </div>
  32. <!-- upper nav -->
  33. <div id="uper-nav" class="bg-white">
  34. <div class="container py-1">
  35. <div class="d-flex justify-content-between align-items-center w-100">
  36. <!-- brand logo -->
  37. <div class="brand-logo">
  38. <img src="./images/navbar/brand-logo.svg" alt="">
  39. </div>
  40. <!-- search box -->
  41. <div class="search flex-fill px-5">
  42. <div class=" form-group position-relative ">
  43. <label for="search-box" class="search-icon position-absolute">
  44. <img src="./images/icon/search.svg" alt="">
  45. </label>
  46. <input type="text" id="search-box" class=" form-control rounded-pill" placeholder="search" >
  47. </div>
  48. </div>
  49. <!-- link -->
  50. <div class="link-box d-flex align-items-center">
  51. <a href="#" class="link d-flex align-items-center px-1 py-1" >
  52. <img class="link-icon" src="./images/navbar/group.png" alt="">
  53. </a>
  54. <a href="#" class="link d-flex align-items-center px-1 py-1 text-decoration-none" >
  55. <img class="link-icon" src="./images/navbar/face.png" alt="">
  56. <div>
  57. <h4 class="name fw-bold text-nowrap text-black">Hi Human</h4>
  58. <h5 class="fw-bold text-no-wrap text-black">Vip: 0 points</h5>
  59. </div>
  60. </a>
  61. <a href="#" class="link d-flex align-items-center px-1 py-1" >
  62. <img class="link-icon" src="./images/navbar/message.png" alt="">
  63. </a>
  64. <a href="#" class="link d-flex align-items-center px-1 py-1" >
  65. <img class="link-icon" src="./images/navbar/heart.png" alt="">
  66. </a>
  67. <a href="#" class="link d-flex align-items-center px-1 py-1" >
  68. <img class="link-icon" src="./images/navbar/bascket.png" alt="">
  69. </a>
  70. </div>
  71. </div>
  72. </div>
  73. </div>
  74. <!-- main navigation -->
  75. <div class="main-nav bg-black text-white">
  76. <div class="container py-2">
  77. <ul class="d-flex align-items-center justify-content-between px-1">
  78. <li>Makeup</li>
  79. <li>Skincare</li>
  80. <li>K beauty</li>
  81. <li>Heir</li>
  82. <li>Man</li>
  83. <li>Baby</li>
  84. <li>Fragnance</li>
  85. <li>Healthcare</li>
  86. <li>Lifestyle</li>
  87. <li>pet</li>
  88. <li>Gifts</li>
  89. <li>Brands</li>
  90. <li>Makeup</li>
  91. <li>
  92. <button class="btn btn-sm btn-pink px-3">Blog</button>
  93. </li>
  94. <li>
  95. <button class="btn btn-sm btn-orange-vivid px-3">Buy 1 Get 1</button>
  96. </li>
  97. <li>
  98. <button class="btn btn-sm btn-orange-vivid px-3">Sale</button>
  99. </li>
  100. </ul>
  101. </div>
  102. </div>
  103. </section>
  104. <!-- checkpot -->
  105. <section id="checkout-page">
  106. <div class="container py-4">
  107. <!-- title -->
  108. <div class="section-title text-start py-3 border-bottom border-2 border-extralight-black">CHECKOUT</div>
  109. <div class="mt-3 p-3 bg-pink-light text-pink fs-1">
  110. Hello Shuvo, You are our VIP customer.
  111. </div>
  112. <!-- checkout section -->
  113. <div class="row mt-3">
  114. <!-- checkout steper form -->
  115. <div class="col-12 col-lg-7">
  116. <div class="checkout-container px-4 py-5">
  117. <form id="checkoutForm" action="#!">
  118. <!-- start step indicators -->
  119. <div class="form-header d-flex mb-4">
  120. <span class="stepIndicator">Delivery Address</span>
  121. <span class="stepIndicator">Shipping Method</span>
  122. <span class="stepIndicator">Payment</span>
  123. </div>
  124. <!-- end step indicators -->
  125. <!-- step one -->
  126. <div class="step pt-5">
  127. <div class="mb-3">
  128. <select id="address" class=" form-select text-gray bg-gray-extralight border-0 rounded-0" aria-label="Default select example" >
  129. <option selected value="">Select your delivery address</option>
  130. <option value="1">One</option>
  131. <option value="2">Two</option>
  132. <option value="3">Three</option>
  133. </select>
  134. </div>
  135. <div class="mb-3 d-flex flex-column flex-md-row gap-3">
  136. <input type="text" placeholder="First Name" name="first-name">
  137. <input type="text" placeholder="Last Name" name="password">
  138. </div>
  139. <div class="mb-3">
  140. <textarea placeholder="Address" name="address" id="" cols="30" rows="2" ></textarea>
  141. </div>
  142. <div class="mb-3">
  143. <select class="form-select text-gray border-0 rounded-0 w-100" aria-label="Default select example" >
  144. <option selected value="">City</option>
  145. <option value="1">One</option>
  146. <option value="2">Two</option>
  147. <option value="3">Three</option>
  148. </select>
  149. </div>
  150. <div class="mb-3 d-flex flex-column flex-md-row gap-3">
  151. <input type="text" placeholder="Phone Number" name="phone">
  152. </div>
  153. </div>
  154. <!-- step two -->
  155. <div class="step py-4">
  156. <div class="d-flex flex-wrap justify-content-center gap-4">
  157. <!-- the mall delivery -->
  158. <div class="position-relative delivery-method text-gray rounded-1 ">
  159. <input type="radio" id="mall-delivery-services" name="delivery">
  160. <label for="mall-delivery-services" class="p-3 py-4">
  161. <!-- icon -->
  162. <div class="icon text-center mx-auto">
  163. <img src="./images/icon/the mall delivery.svg" alt="">
  164. </div>
  165. <!-- service name -->
  166. <div class="fw-semibold fs-5 text-center">
  167. The Mall Delivery Service
  168. </div>
  169. <!-- notice -->
  170. <div class="text-center">
  171. (within Dhaka only)
  172. </div>
  173. <!-- delivery fee -->
  174. <div class="delivery-fee mt-2 py-2 d-flex justify-content-between align-items-center border-bottom border-1 border-extralight-gray">
  175. <span class="text-light-gray">Delivery Fees</span>
  176. <span class="text-black">Tk 45</span>
  177. </div>
  178. <!-- delivery time -->
  179. <div class="delivery-time mt-2 py-2 d-flex justify-content-between align-items-center border-bottom border-1 border-extralight-gray">
  180. <span class="text-light-gray">Delivery Time</span>
  181. <span class="text-black">24-48h</span>
  182. </div>
  183. <!-- delivery in -->
  184. <div class="delivery-in mt-2 py-2 d-flex justify-content-between align-items-center border-bottom border-1 border-extralight-gray">
  185. <span class="text-light-gray">Delivery in </span>
  186. <span class="text-black">Home</span>
  187. </div>
  188. </label>
  189. <!-- selected icon -->
  190. <div class="selected">
  191. <img src="./images/icon/selected.svg" alt="">
  192. </div>
  193. </div>
  194. <!-- other delivery -->
  195. <div class="position-relative delivery-method text-gray rounded-1 ">
  196. <input type="radio" id="regular-delivery-services" name="delivery">
  197. <label for="regular-delivery-services" class="p-3 py-4">
  198. <!-- icon -->
  199. <div class="icon text-center mx-auto">
  200. <img src="./images/icon/regular delivery.svg" alt="">
  201. </div>
  202. <!-- service name -->
  203. <div class="fw-semibold fs-5 text-center">
  204. Regular Delivery Service
  205. </div>
  206. <!-- notice -->
  207. <div class="text-center">
  208. (Outside Dhaka )
  209. </div>
  210. <!-- delivery fee -->
  211. <div class="delivery-fee mt-2 py-2 d-flex justify-content-between align-items-center border-bottom border-1 border-extralight-gray">
  212. <span class="text-light-gray">Delivery Fees</span>
  213. <span class="text-black">Tk 45</span>
  214. </div>
  215. <!-- delivery time -->
  216. <div class="delivery-time mt-2 py-2 d-flex justify-content-between align-items-center border-bottom border-1 border-extralight-gray">
  217. <span class="text-light-gray">Delivery Time</span>
  218. <span class="text-black">24-48h</span>
  219. </div>
  220. <!-- delivery in -->
  221. <div class="delivery-in mt-2 py-2 d-flex justify-content-between align-items-center border-bottom border-1 border-extralight-gray">
  222. <span class="text-light-gray">Delivery in </span>
  223. <span class="text-black">Home</span>
  224. </div>
  225. </label>
  226. <!-- selected icon -->
  227. <div class="selected">
  228. <img src="./images/icon/selected.svg" alt="">
  229. </div>
  230. </div>
  231. </div>
  232. </div>
  233. <!-- step three -->
  234. <div class="step py-5">
  235. <div class="d-flex flex-column justify-content-center align-items-center flex-wrap gap-3">
  236. <!-- cashon payment -->
  237. <div class="position-relative payment-type text-gray rounded-1">
  238. <input class="position-absolute " type="radio" id="cash-on" name="delivery">
  239. <label for="cash-on" class="d-flex justify-content-center align-items-center px-5 py-2">
  240. <span>
  241. <img class="" src="./images/icon/money-hand.svg" alt="">
  242. </span>
  243. <span class="ms-2">
  244. Cash on Delivery
  245. </span>
  246. </label>
  247. <!-- selected icon -->
  248. <div class="selected">
  249. <img src="./images/icon/selected.svg" alt="">
  250. </div>
  251. </div>
  252. <!-- bkash payment -->
  253. <div class="position-relative payment-type text-gray rounded-1 ">
  254. <input type="radio" id="bkash" name="delivery">
  255. <label for="bkash" class="d-flex justify-content-center align-items-center px-5 py-2">
  256. <span>
  257. <img class="" src="./images/icon/bkash.svg" alt="">
  258. </span>
  259. <span class="ms-2">
  260. Pay By Bkash
  261. </span>
  262. </label>
  263. <!-- selected icon -->
  264. <div class="selected">
  265. <img src="./images/icon/selected.svg" alt="">
  266. </div>
  267. </div>
  268. <!-- visa card payment -->
  269. <div class="position-relative payment-type text-gray rounded-1">
  270. <input type="radio" id="visa-card" name="delivery">
  271. <label for="visa-card" class="d-flex justify-content-center align-items-center px-5 py-2">
  272. <span>
  273. <img class="" src="./images/icon/visa.svg" alt="">
  274. </span>
  275. <span class="ms-2">
  276. Visa/MasterCard
  277. </span>
  278. </label>
  279. <!-- selected icon -->
  280. <div class="selected">
  281. <img src="./images/icon/selected.svg" alt="">
  282. </div>
  283. </div>
  284. </div>
  285. </div>
  286. <!-- start previous / next buttons -->
  287. <div class="form-footer d-flex">
  288. <button type="button" id="prevBtn" onclick="nextPrev(-1)">Previous</button>
  289. <button type="button" id="nextBtn" onclick="nextPrev(1)">Next</button>
  290. </div>
  291. <!-- end previous / next buttons -->
  292. </form>
  293. </div>
  294. </div>
  295. <!-- order summery -->
  296. <div class="col-12 col-lg-5 mt-3 mt-lg-0">
  297. <div class="order-summery py-4 px-3">
  298. <!-- title -->
  299. <div class="pb-2 fs-5 text-gray border-bottom border-1 border-extralight-gray">
  300. Order Summary
  301. </div>
  302. <!-- summery products -->
  303. <div class="summery-products">
  304. <!-- product -->
  305. <div class="product position-relative pt-2 mt-2 border-bottom border-1 border-extralight-black">
  306. <!-- product details -->
  307. <div class="details row mb-3">
  308. <!-- product picture -->
  309. <div class="col-3">
  310. <img class="w-100" src="./images/product_details/product image.png" alt="">
  311. </div>
  312. <!-- product details -->
  313. <div class="col-9">
  314. <div class="title w-75 fs-5 text-light-gray">
  315. Clear Men Cool Sport Menthol Shampoo 450ml
  316. </div>
  317. <!-- count and price -->
  318. <div class="mt-2 d-flex justify-content-between align-items-center">
  319. <!-- count -->
  320. <div class=" count-container px-1 border border-1 border-light-gray rounded-0 d-flex">
  321. <div class="btn p-1">
  322. <img class="count-btn" src="./images/icon/minus.svg" alt="">
  323. </div>
  324. <div class="mx-2 count">1</div>
  325. <div class="btn p-1">
  326. <img class="count-btn" src="./images/icon/plus.svg" alt="">
  327. </div>
  328. </div>
  329. <!-- product price -->
  330. <div class="fs-6 pe-3">
  331. <span class="text-decoration-line-through text-light-gray">৳ 600 </span>
  332. <span class="ms-3 text-deep-red">৳ 510 </span>
  333. </div>
  334. </div>
  335. </div>
  336. </div>
  337. <!-- discount notice -->
  338. <div class="discount-notice mt-2">
  339. <span class="text-black bg-orange-vivid-light px-2 py-1">VIP: 10% Off</span>
  340. <span class="text-deep-red ms-2">25% Discount Notice</span>
  341. </div>
  342. <!-- clear btn -->
  343. <div class="btn clear-btn position-absolute top-0 end-0">
  344. <img src="./images/icon/cross-icon.svg" alt="">
  345. </div>
  346. </div>
  347. <!-- product -->
  348. <div class="product position-relative pt-2 mt-2 border-bottom border-1 border-extralight-black">
  349. <!-- product details -->
  350. <div class="details row mb-3">
  351. <!-- product picture -->
  352. <div class="col-3">
  353. <img class="w-100" src="./images/product_details/product image.png" alt="">
  354. </div>
  355. <!-- product details -->
  356. <div class="col-9">
  357. <div class="title w-75 fs-5 text-light-gray">
  358. Clear Men Cool Sport Menthol Shampoo 450ml
  359. </div>
  360. <!-- count and price -->
  361. <div class="mt-2 d-flex justify-content-between align-items-center">
  362. <!-- count -->
  363. <div class=" count-container px-1 border border-1 border-light-gray rounded-0 d-flex">
  364. <div class="btn p-1">
  365. <img class="count-btn" src="./images/icon/minus.svg" alt="">
  366. </div>
  367. <div class="mx-2 count">1</div>
  368. <div class="btn p-1">
  369. <img class="count-btn" src="./images/icon/plus.svg" alt="">
  370. </div>
  371. </div>
  372. <!-- product price -->
  373. <div class="fs-6 pe-3">
  374. <span class="text-decoration-line-through text-light-gray">৳ 600 </span>
  375. <span class="ms-3 text-deep-red">৳ 510 </span>
  376. </div>
  377. </div>
  378. </div>
  379. </div>
  380. <!-- discount notice -->
  381. <div class="discount-notice mt-2">
  382. <span class="text-black bg-orange-vivid-light px-2 py-1">VIP: 10% Off</span>
  383. <span class="text-deep-red ms-2 d-none">25% Discount Notice</span>
  384. </div>
  385. <!-- clear btn -->
  386. <div class="btn clear-btn position-absolute top-0 end-0">
  387. <img src="./images/icon/cross-icon.svg" alt="">
  388. </div>
  389. </div>
  390. <!-- product -->
  391. <div class="product position-relative pt-2 mt-2 border-bottom border-1 border-extralight-black">
  392. <!-- product details -->
  393. <div class="details row mb-3">
  394. <!-- product picture -->
  395. <div class="col-3">
  396. <img class="w-100" src="./images/product_details/product image.png" alt="">
  397. </div>
  398. <!-- product details -->
  399. <div class="col-9">
  400. <div class="title w-75 fs-5 text-light-gray">
  401. Clear Men Cool Sport Menthol Shampoo 450ml
  402. </div>
  403. <!-- count and price -->
  404. <div class="mt-2 d-flex justify-content-between align-items-center">
  405. <!-- count -->
  406. <div class=" count-container px-1 border border-1 border-light-gray rounded-0 d-flex">
  407. <div class="btn p-1">
  408. <img class="count-btn" src="./images/icon/minus.svg" alt="">
  409. </div>
  410. <div class="mx-2 count">1</div>
  411. <div class="btn p-1">
  412. <img class="count-btn" src="./images/icon/plus.svg" alt="">
  413. </div>
  414. </div>
  415. <!-- product price -->
  416. <div class="fs-6 pe-3">
  417. <span class="text-decoration-line-through text-light-gray">৳ 600 </span>
  418. <span class="ms-3 text-deep-red">৳ 510 </span>
  419. </div>
  420. </div>
  421. </div>
  422. </div>
  423. <!-- discount notice -->
  424. <div class="d-none discount-notice mt-2 ">
  425. <span class="text-black bg-orange-vivid-light px-2 py-1">VIP: 10% Off</span>
  426. <span class="text-deep-red ms-2">25% Discount Notice</span>
  427. </div>
  428. <!-- clear btn -->
  429. <div class="btn clear-btn position-absolute top-0 end-0">
  430. <img src="./images/icon/cross-icon.svg" alt="">
  431. </div>
  432. </div>
  433. </div>
  434. <!-- cupon -->
  435. <form class="cupon mt-3" action="">
  436. <div class="d-flex justify-content-between border border-2 border-pink">
  437. <input class="border-0 text-light-gray px-3 fs-4 fw-light flex-fill" type="text">
  438. <button class="btn rounded-0 bg-pink text-white fs-4">Apply</button>
  439. </div>
  440. </form>
  441. <!-- price summery -->
  442. <div class="price-summery mt-4">
  443. <!-- subtotal -->
  444. <div class="mt-3 d-flex justify-content-between align-items-center text-gray fs-5">
  445. <span>Subtotal</span>
  446. <span>৳ 2,040</span>
  447. </div>
  448. <!-- Delivery Charge -->
  449. <div class="mt-3 d-flex justify-content-between align-items-center text-gray fs-5">
  450. <span>Delivery Charge</span>
  451. <span>৳ 60</span>
  452. </div>
  453. <!-- Discount -->
  454. <div class="mt-3 d-flex justify-content-between align-items-center text-gray fs-5">
  455. <span>Discount</span>
  456. <span>৳ 850</span>
  457. </div>
  458. <!-- Coupon/ Voucher -->
  459. <div class="mt-3 d-flex justify-content-between align-items-center text-gray fs-5">
  460. <span>Coupon/ Voucher</span>
  461. <span>৳ 50</span>
  462. </div>
  463. <!-- Total -->
  464. <div class="mt-3 d-flex justify-content-between align-items-center text-gray fs-5">
  465. <span>Total</span>
  466. <span class="text-black fw-semibold">৳ 2,100</span>
  467. </div>
  468. </div>
  469. </div>
  470. </div>
  471. </div>
  472. </div>
  473. </section>
  474. <!-- footer -->
  475. <section id="footer" class=" bg-dark text-white mt-5">
  476. <div class="container py-5">
  477. <div class="row footer-border-bottom justify-content-evenly">
  478. <div class="col-12 col-lg-4">
  479. <div class="py-2 footer-comp-title h3 text-center">
  480. BECOME AN INSIDER
  481. </div>
  482. <form class="mt-2 text-center" action="">
  483. <input class="footer-input px-3 py-3 py-md-3 px-md-5 mx-auto text-center" type="text" placeholder="ENTER YOUR EMAIL ADDRESS">
  484. </form>
  485. <div class="social mt-5 mb-5">
  486. <div class="footer-comp-title h3 text-center">
  487. FOLLOW US ON
  488. </div>
  489. <ul class="mt-4 d-flex justify-content-center align-items-center">
  490. <li>
  491. <a href="#">
  492. <img class="social-icon mx-3 mx-md-4" src="./images/icon/footer-facebook.svg" alt="">
  493. </a>
  494. </li>
  495. <li>
  496. <a href="#">
  497. <img class="social-icon mx-3 mx-md-4" src="./images/icon/footer-twitter.svg" alt="">
  498. </a>
  499. </li>
  500. <li>
  501. <a href="#">
  502. <img class="social-icon mx-3 mx-md-4" src="./images/icon/footer-insta.svg" alt="">
  503. </a>
  504. </li>
  505. <li>
  506. <a href="#">
  507. <img class="social-icon mx-3 mx-md-4" src="./images/icon/footer-pinterest.svg" alt="">
  508. </a>
  509. </li>
  510. <li>
  511. <a href="#">
  512. <img class="social-icon mx-3 mx-md-4" src="./images/icon/footer-youtube.svg" alt="">
  513. </a>
  514. </li>
  515. </ul>
  516. <p class="mt-4 fw-light fs-5 text-center">hr@themallbd.com</p>
  517. </div>
  518. </div>
  519. <div class="col-12 col-lg-6">
  520. <div class="row justify-content-between">
  521. <div class="col-6 col-md-5 mb-5">
  522. <div class="py-2 mb-3 footer-comp-title footer-border-bottom h3 ">HELP</div>
  523. <ul>
  524. <li class="mb-2"><a href="#">ORDER</a></li>
  525. <li class="mb-2"><a href="#">DELIVERY</a></li>
  526. <li class="mb-2"><a href="#">RETUTRNS</a></li>
  527. <li class="mb-2"><a href="#">COOKIE POLICY</a></li>
  528. <li class="mb-2"><a href="#">CUSTOMER SUPPORT</a></li>
  529. <li class="mb-2"><a href="#">VIP PRIVILEGES</a></li>
  530. <li class="mb-2"><a href="#">HOW TO BECOME A VIP</a></li>
  531. <li class="mb-2"><a href="#">THE MALL GLOBAL</a></li>
  532. </ul>
  533. </div>
  534. <div class="col-6 col-md-5 mb-5">
  535. <div class="py-2 mb-3 footer-comp-title footer-border-bottom h3">OUR COMPANY</div>
  536. <ul>
  537. <li class="mb-2"><a href="#">ABOUT US</a></li>
  538. <li class="mb-2"><a href="#">CONTACT US</a></li>
  539. <li class="mb-2"><a href="#">PRIVACY POLICY</a></li>
  540. <li class="mb-2"><a href="#">COOKIE POLICY</a></li>
  541. <li class="mb-2"><a href="#">PAYMENTS</a></li>
  542. <li class="mb-2"><a href="#">SITEMAP</a></li>
  543. <li class="mb-2"><a href="#">TERMS & CONDITIONS</a></li>
  544. </ul>
  545. </div>
  546. </div>
  547. </div>
  548. </div>
  549. <div class="copyright mt-4 text-center fw-light">
  550. &copy 2022 THE MALL ALL RIGHT RESERVED
  551. </div>
  552. </div>
  553. </section>
  554. <!-- footer end-->
  555. <!-- bootstrap js -->
  556. <script src="./js/bootstrap.bundle.min.js"></script>
  557. <!-- swiper slider js -->
  558. <script src="./js/swiper-bundle.min.js"></script>
  559. <!-- lightbox js -->
  560. <script src="./js/simple-lightbox.js"></script>
  561. <!-- custom js -->
  562. <script src="./js/app.js"></script>
  563. </body>
  564. </html>