index-two.vue 50 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148
  1. <template>
  2. <Preloader></Preloader>
  3. <FixArea></FixArea>
  4. <header class="header-section">
  5. <Header-top-section />
  6. <TopHeader headerClass="header-2" />
  7. </header>
  8. <div class="search-wrap">
  9. <div class="search-inner">
  10. <i class="fas fa-times search-close" id="search-close"></i>
  11. <div class="search-cell">
  12. <form method="get">
  13. <div class="search-field-holder">
  14. <input type="search" class="main-search-input" placeholder="Search..." />
  15. </div>
  16. </form>
  17. </div>
  18. </div>
  19. </div>
  20. <section class="hero-section hero-2 fix">
  21. <div class="circle-shape"><img src="/picture/circle.png" alt="shape-img" /></div>
  22. <div class="line-shape"><img src="/picture/line-shape.png" alt="shape-img" /></div>
  23. <div class="right-shape"><img src="/picture/right-shape.png" alt="shape-img" /></div>
  24. <div class="roket-shape float-bob-y"><img src="/picture/roket.png" alt="shape-img" /></div>
  25. <div class="compass-shape"><img src="/picture/compass.png" alt="shape-img" /></div>
  26. <div class="bus-shape float-bob-x"><img src="/picture/bus.png" alt="shape-img" /></div>
  27. <div class="frame-shape"><img src="/picture/frame2.png" alt="shape-img" /></div>
  28. <div class="star-shape"><img src="/picture/star-2.png" alt="shape-img" /></div>
  29. <div class="pencil-shape"><img src="/picture/pencil.png" alt="" /></div>
  30. <div class="container">
  31. <div class="row g-4 align-items-center">
  32. <div class="col-lg-6">
  33. <div class="hero-content">
  34. <h5 class="wow fadeInUp">Preschool & Baby Care</h5>
  35. <h1 class="wow fadeInUp" data-wow-delay=".3s">
  36. We Prepare Your
  37. <br />
  38. Child For
  39. <span>Life</span>
  40. </h1>
  41. <p class="wow fadeInUp" data-wow-delay=".5s">
  42. Suspendisse eget lectus vitae elit malesuada lacinia Vestibulum
  43. <br />
  44. scelerisque,ligula sit amet consequat
  45. </p>
  46. <div class="hero-button">
  47. <a href="index-2.html" class="theme-btn wow fadeInUp" data-wow-delay=".7s">
  48. Explore More
  49. <i class="fa-solid fa-arrow-right-long"></i>
  50. </a>
  51. <a
  52. href="contact.html"
  53. class="theme-btn transparent wow fadeInUp"
  54. data-wow-delay=".8s"
  55. >
  56. Get In Touch
  57. <i class="fa-solid fa-arrow-right-long"></i>
  58. </a>
  59. </div>
  60. </div>
  61. </div>
  62. <div class="col-lg-6 wow fadeInUp" data-wow-delay=".4s">
  63. <div class="hero-image"><img src="/picture/022.png" alt="hero-img" /></div>
  64. </div>
  65. </div>
  66. </div>
  67. </section>
  68. <section class="work-process-section-2 fix section-padding fix">
  69. <div class="top-shape"><img src="/picture/bottom-shape.png" alt="shape-img" /></div>
  70. <div class="container">
  71. <div class="process-work-wrapper style-padding">
  72. <div class="row g-4">
  73. <div class="col-xl-3 col-lg-4 col-md-6 wow fadeInUp" data-wow-delay=".2s">
  74. <div class="work-process-items text-center">
  75. <div class="icon bg-cover" style="background-image: url('/image/icon-bg.png')">
  76. <img src="/picture/01.svg" alt="img" />
  77. </div>
  78. <div class="content">
  79. <h4>Choose A Service</h4>
  80. <p>In a free hour,when our power of choice is untrammeled and</p>
  81. </div>
  82. </div>
  83. </div>
  84. <div class="col-xl-3 col-lg-4 col-md-6 wow fadeInUp" data-wow-delay=".4s">
  85. <div class="work-process-items text-center">
  86. <div class="icon bg-cover" style="background-image: url('/image/icon-bg.png')">
  87. <img src="/picture/02.svg" alt="img" />
  88. </div>
  89. <div class="content">
  90. <h4>Expert Teachers</h4>
  91. <p>In a free hour,when our power of choice is untrammeled and</p>
  92. </div>
  93. </div>
  94. </div>
  95. <div class="col-xl-3 col-lg-4 col-md-6 wow fadeInUp" data-wow-delay=".6s">
  96. <div class="work-process-items text-center">
  97. <div class="icon bg-cover" style="background-image: url('/image/icon-bg.png')">
  98. <img src="/picture/03.svg" alt="img" />
  99. </div>
  100. <div class="content">
  101. <h4>E-Learning Media</h4>
  102. <p>In a free hour,when our power of choice is untrammeled and</p>
  103. </div>
  104. </div>
  105. </div>
  106. <div class="col-xl-3 col-lg-4 col-md-6 wow fadeInUp" data-wow-delay=".8s">
  107. <div class="work-process-items text-center">
  108. <div class="icon bg-cover" style="background-image: url('/image/icon-bg.png')">
  109. <img src="/picture/04.svg" alt="img" />
  110. </div>
  111. <div class="content">
  112. <h4>Full Day Programs</h4>
  113. <p>In a free hour,when our power of choice is untrammeled and</p>
  114. </div>
  115. </div>
  116. </div>
  117. </div>
  118. </div>
  119. </div>
  120. </section>
  121. <section class="about-activities-section-2 section-padding pt-0" id="about">
  122. <div class="left-shape"><img src="/picture/left-shape.png" alt="shape-img" /></div>
  123. <div class="zebra-shape float-bob-y"><img src="/picture/zebra.png" alt="shape-img" /></div>
  124. <div class="bottom-shape"><img src="/picture/section-top-shape-2.png" alt="shape-img" /></div>
  125. <div class="sun-shape"><img src="/picture/shape-2.png" alt="shape-img" /></div>
  126. <div class="container">
  127. <div class="about-activities-wrapper style-2">
  128. <div class="row g-4">
  129. <div class="col-lg-6 wow fadeInUp" data-wow-delay=".3s">
  130. <div class="activities-image-items">
  131. <img src="/picture/04.png" alt="img" />
  132. <div class="radius-shape">
  133. <img src="/picture/radius-shape.png" alt="shape-img" />
  134. </div>
  135. <div class="circle-shape"><img src="/picture/circle1.png" alt="shape-img" /></div>
  136. </div>
  137. </div>
  138. <div class="col-lg-6">
  139. <div class="activities-content">
  140. <div class="section-title">
  141. <span class="wow fadeInUp">About Us</span>
  142. <h2 class="wow fadeInUp" data-wow-delay=".3s">
  143. Learn to play,converse
  144. <br />
  145. with confidence.
  146. </h2>
  147. </div>
  148. <p class="mt-3 mt-md-0 wow fadeInUp" data-wow-delay=".5s">
  149. Luctus. Curabitur nibh justo imperdiet non ex non tempus faucibus urna Aliquam at
  150. elit vitae dui sagittis maximus eget vitae diam In fermentum
  151. </p>
  152. <div class="row g-4 mt-4">
  153. <div class="col-xl-6 col-lg-8 col-md-6 wow fadeInUp" data-wow-delay=".3s">
  154. <div class="icon-items">
  155. <div class="icon"><img src="/picture/icon-5.svg" alt="img" /></div>
  156. <div class="content">
  157. <h5>Sport Program</h5>
  158. <p>
  159. Aliquam erat volutpat
  160. <br />
  161. nullam imperdiet
  162. </p>
  163. </div>
  164. </div>
  165. </div>
  166. <div class="col-xl-6 col-lg-8 col-md-6 wow fadeInUp" data-wow-delay=".5s">
  167. <div class="icon-items">
  168. <div class="icon"><img src="/picture/icon-6.svg" alt="img" /></div>
  169. <div class="content">
  170. <h5>Easy To Learn</h5>
  171. <p>
  172. Ut vehiculadictumst
  173. <br />
  174. maecenas ante.
  175. </p>
  176. </div>
  177. </div>
  178. </div>
  179. </div>
  180. <div class="about-author">
  181. <div class="author-image wow fadeInUp" data-wow-delay=".3s">
  182. <img src="/picture/author1.png" alt="author-img" />
  183. <div class="content">
  184. <h6>Ronald Richards</h6>
  185. <p>Co,Founder</p>
  186. </div>
  187. </div>
  188. <div class="author-icon wow fadeInUp" data-wow-delay=".5s">
  189. <div class="icon"><i class="fa-solid fa-phone"></i></div>
  190. <div class="content">
  191. <span>Call Us Now</span>
  192. <h5><a href="tel:18589716552">18589716552</a></h5>
  193. </div>
  194. </div>
  195. </div>
  196. </div>
  197. </div>
  198. </div>
  199. </div>
  200. </div>
  201. </section>
  202. <section class="feature-value-section fix section-padding section-bg-2">
  203. <div class="shape-1"><img src="/picture/shape-1.png" alt="shape-img" /></div>
  204. <div class="shape-2 float-bob-x"><img src="/picture/shape-21.png" alt="shape-img" /></div>
  205. <div class="container">
  206. <div class="section-title text-center">
  207. <span class="wow fadeInUp">Our values</span>
  208. <h2 class="wow fadeInUp" data-wow-delay=".3s">
  209. The best playschool
  210. <br />
  211. for your kid
  212. </h2>
  213. </div>
  214. <div class="row">
  215. <div class="col-xl-4 col-lg-6">
  216. <div class="feature-value-items">
  217. <div class="value-icon-items wow fadeInUp" data-wow-delay=".3s">
  218. <div class="icon"><img src="/picture/icon-11.svg" alt="img" /></div>
  219. <div class="content">
  220. <h5>Teacher Training and Progress</h5>
  221. <p>
  222. Adipiscing elit Praesent luctus laoreet iaculis Curabitur rutrum lectus augue,ut
  223. pulvinar.
  224. </p>
  225. </div>
  226. </div>
  227. <div class="value-icon-items wow fadeInUp" data-wow-delay=".5s">
  228. <div class="icon color-2"><img src="/picture/icon-21.svg" alt="img" /></div>
  229. <div class="content">
  230. <h5>Nanny Selection 24/7</h5>
  231. <p>
  232. Adipiscing elit Praesent luctus laoreet iaculis Curabitur rutrum lectus augue,ut
  233. pulvinar.
  234. </p>
  235. </div>
  236. </div>
  237. </div>
  238. </div>
  239. <div class="col-xl-4 col-lg-6 wow fadeInUp" data-wow-delay=".4s">
  240. <div class="feature-value-items">
  241. <div class="feature-value-image">
  242. <img src="/picture/cta-2.png" alt="img" />
  243. <div class="value-shape"><img src="/picture/cta-shape-2.png" alt="shape-img" /></div>
  244. </div>
  245. </div>
  246. </div>
  247. <div class="col-xl-4 col-lg-6">
  248. <div class="feature-value-items">
  249. <div class="value-icon-items style-2 wow fadeInUp" data-wow-delay=".3s">
  250. <div class="content">
  251. <h5>Advanced Placement Courses</h5>
  252. <p>
  253. Adipiscing elit Praesent luctus laoreet iaculis Curabitur rutrum lectus augue,ut
  254. pulvinar.
  255. </p>
  256. </div>
  257. <div class="icon color-3"><img src="/picture/icon-3.svg" alt="img" /></div>
  258. </div>
  259. <div class="value-icon-items style-2 wow fadeInUp" data-wow-delay=".5s">
  260. <div class="content">
  261. <h5>Self-contained gifted programs​</h5>
  262. <p>
  263. Adipiscing elit Praesent luctus laoreet iaculis Curabitur rutrum lectus augue,ut
  264. pulvinar.
  265. </p>
  266. </div>
  267. <div class="icon color-2 color-4"><img src="/picture/icon-41.svg" alt="img" /></div>
  268. </div>
  269. </div>
  270. </div>
  271. </div>
  272. </div>
  273. </section>
  274. <section class="counter-section fix">
  275. <div class="line-shape"><img src="/picture/line-shape1.png" alt="shape-img" /></div>
  276. <div class="box-shape float-bob-x"><img src="/picture/box-shape.png" alt="shape-img" /></div>
  277. <div class="counter-bg"></div>
  278. <div class="container">
  279. <div class="counter-wrapper">
  280. <div class="row g-4">
  281. <div class="col-xl-3 col-lg-4 col-md-6 wow fadeInUp" data-wow-delay=".2s">
  282. <div class="counter-items">
  283. <div class="icon"><img src="/picture/icon-12.svg" alt="img" /></div>
  284. <div class="content">
  285. <h2>
  286. <span class="count">25</span>
  287. +
  288. </h2>
  289. <p>Year of Experience</p>
  290. </div>
  291. </div>
  292. </div>
  293. <div class="col-xl-3 col-lg-4 col-md-6 wow fadeInUp" data-wow-delay=".4s">
  294. <div class="counter-items">
  295. <div class="icon"><img src="/picture/icon-22.svg" alt="img" /></div>
  296. <div class="content">
  297. <h2>
  298. <span class="count">6,500</span>
  299. +
  300. </h2>
  301. <p>Class Completed</p>
  302. </div>
  303. </div>
  304. </div>
  305. <div class="col-xl-3 col-lg-4 col-md-6 wow fadeInUp" data-wow-delay=".6s">
  306. <div class="counter-items">
  307. <div class="icon"><img src="/picture/icon-31.svg" alt="img" /></div>
  308. <div class="content">
  309. <h2>
  310. <span class="count">100</span>
  311. +
  312. </h2>
  313. <p>Experts Instructors</p>
  314. </div>
  315. </div>
  316. </div>
  317. <div class="col-xl-3 col-lg-4 col-md-6 wow fadeInUp" data-wow-delay=".8s">
  318. <div class="counter-items border-none">
  319. <div class="icon"><img src="/picture/icon-42.svg" alt="img" /></div>
  320. <div class="content">
  321. <h2>
  322. <span class="count">6,561</span>
  323. +
  324. </h2>
  325. <p>Students Enroll</p>
  326. </div>
  327. </div>
  328. </div>
  329. </div>
  330. </div>
  331. </div>
  332. </section>
  333. <section class="program-section-2 section-padding fix" id="programs">
  334. <div class="line-1"><img src="/picture/line-1.png" alt="shape-img" /></div>
  335. <div class="container">
  336. <div class="section-title text-center">
  337. <span class="wow fadeInUp">Our Programs</span>
  338. <h2 class="wow fadeInUp" data-wow-delay=".3s">
  339. We meet kids at their level
  340. <br />
  341. regardless of their age
  342. </h2>
  343. </div>
  344. <div class="row">
  345. <div class="col-xl-3 col-lg-4 col-md-6 wow fadeInUp" data-wow-delay=".2s">
  346. <div class="program-box-items-2">
  347. <div class="program-bg"></div>
  348. <div class="icon"><img src="/picture/011.svg" alt="icon-img" /></div>
  349. <div class="content text-center">
  350. <h4><a href="program-details.html">Preschool</a></h4>
  351. <span>(2-3 years)</span>
  352. <p>Consectur the adipiscing elit eiusmod.</p>
  353. <a href="program-details.html" class="arrow-icon">
  354. <i class="fa-solid fa-arrow-right-long"></i>
  355. </a>
  356. </div>
  357. </div>
  358. </div>
  359. <div class="col-xl-3 col-lg-4 col-md-6 wow fadeInUp" data-wow-delay=".4s">
  360. <div class="program-box-items-2">
  361. <div class="program-bg bg-2"></div>
  362. <div class="icon"><img src="/picture/021.svg" alt="icon-img" /></div>
  363. <div class="content text-center">
  364. <h4><a href="program-details.html">Chemistry Class</a></h4>
  365. <span>(4-5 years)</span>
  366. <p>Consectur the adipiscing elit eiusmod.</p>
  367. <a href="program-details.html" class="arrow-icon color-2">
  368. <i class="fa-solid fa-arrow-right-long"></i>
  369. </a>
  370. </div>
  371. </div>
  372. </div>
  373. <div class="col-xl-3 col-lg-4 col-md-6 wow fadeInUp" data-wow-delay=".6s">
  374. <div class="program-box-items-2">
  375. <div class="program-bg bg-3"></div>
  376. <div class="icon"><img src="/picture/031.svg" alt="icon-img" /></div>
  377. <div class="content text-center">
  378. <h4><a href="program-details.html">Kindergarten</a></h4>
  379. <span>(4-5 years)</span>
  380. <p>Consectur the adipiscing elit eiusmod.</p>
  381. <a href="program-details.html" class="arrow-icon color-3">
  382. <i class="fa-solid fa-arrow-right-long"></i>
  383. </a>
  384. </div>
  385. </div>
  386. </div>
  387. <div class="col-xl-3 col-lg-4 col-md-6 wow fadeInUp" data-wow-delay=".8s">
  388. <div class="program-box-items-2">
  389. <div class="program-bg bg-4"></div>
  390. <div class="icon"><img src="/picture/041.svg" alt="icon-img" /></div>
  391. <div class="content text-center">
  392. <h4><a href="program-details.html">Drawing Class</a></h4>
  393. <span>(1-2 years)</span>
  394. <p>Consectur the adipiscing elit eiusmod.</p>
  395. <a href="program-details.html" class="arrow-icon color-4">
  396. <i class="fa-solid fa-arrow-right-long"></i>
  397. </a>
  398. </div>
  399. </div>
  400. </div>
  401. </div>
  402. </div>
  403. </section>
  404. <section class="team-section-2 section-bg section-padding" id="team">
  405. <div class="top-shape"><img src="/picture/top-shape.png" alt="shape-img" /></div>
  406. <div class="love-shape float-bob-y"><img src="/picture/love.png" alt="shape-img" /></div>
  407. <div class="frame-shape"><img src="/picture/frame.png" alt="shape-img" /></div>
  408. <div class="container">
  409. <div class="section-title-area">
  410. <div class="section-title">
  411. <span class="wow fadeInUp">Our Experts</span>
  412. <h2 class="wow fadeInUp" data-wow-delay=".3s">Our Expert Instructors</h2>
  413. </div>
  414. <div class="array-button wow fadeInUp" data-wow-delay=".5s">
  415. <button class="array-prev"><i class="fal fa-arrow-left"></i></button>
  416. <button class="array-next"><i class="fal fa-arrow-right"></i></button>
  417. </div>
  418. </div>
  419. <div class="swiper team-slider-2">
  420. <div class="swiper-wrapper">
  421. <div class="swiper-slide">
  422. <div class="team-box-items">
  423. <div class="team-image"><img src="/picture/05.png" alt="team-img" /></div>
  424. <div class="team-content">
  425. <h3><a href="team-details.html">Leslie Alexander</a></h3>
  426. <p>Math Teacher</p>
  427. <div class="social-icon d-flex align-items-center">
  428. <a href="#"><i class="fab fa-facebook-f"></i></a>
  429. <a href="#"><i class="fa-brands fa-instagram"></i></a>
  430. <a href="#"><i class="fab fa-twitter"></i></a>
  431. <a href="#"><i class="fab fa-pinterest-p"></i></a>
  432. </div>
  433. </div>
  434. </div>
  435. </div>
  436. <div class="swiper-slide">
  437. <div class="team-box-items">
  438. <div class="team-image"><img src="/picture/06.png" alt="team-img" /></div>
  439. <div class="team-content">
  440. <h3><a href="team-details.html">Esther Howard</a></h3>
  441. <p>Art Teacher</p>
  442. <div class="social-icon d-flex align-items-center">
  443. <a href="#"><i class="fab fa-facebook-f"></i></a>
  444. <a href="#"><i class="fa-brands fa-instagram"></i></a>
  445. <a href="#"><i class="fab fa-twitter"></i></a>
  446. <a href="#"><i class="fab fa-pinterest-p"></i></a>
  447. </div>
  448. </div>
  449. </div>
  450. </div>
  451. <div class="swiper-slide">
  452. <div class="team-box-items">
  453. <div class="team-image"><img src="/picture/07.png" alt="team-img" /></div>
  454. <div class="team-content">
  455. <h3><a href="team-details.html">Ralph Edwards</a></h3>
  456. <p>Sport Teacher</p>
  457. <div class="social-icon d-flex align-items-center">
  458. <a href="#"><i class="fab fa-facebook-f"></i></a>
  459. <a href="#"><i class="fa-brands fa-instagram"></i></a>
  460. <a href="#"><i class="fab fa-twitter"></i></a>
  461. <a href="#"><i class="fab fa-pinterest-p"></i></a>
  462. </div>
  463. </div>
  464. </div>
  465. </div>
  466. </div>
  467. </div>
  468. </div>
  469. </section>
  470. <section class="contact-section section-padding">
  471. <div class="line-1"><img src="/picture/line-1.png" alt="shape-img" /></div>
  472. <div class="line-2"><img src="/picture/line-21.png" alt="shape-img" /></div>
  473. <div class="container">
  474. <div class="contact-wrapper">
  475. <div class="row">
  476. <div class="col-lg-6">
  477. <div class="contact-content">
  478. <div class="section-title">
  479. <span class="text-white wow fadeInUp">Contact with Us</span>
  480. <h2 class="text-white wow fadeInUp" data-wow-delay=".3s">How May We Help You!</h2>
  481. </div>
  482. <form action="#" id="contact-form" method="POST" class="contact-form-items">
  483. <div class="row g-4">
  484. <div class="col-lg-6 wow fadeInUp" data-wow-delay=".3s">
  485. <div class="form-clt">
  486. <span>Your name*</span>
  487. <input type="text" name="name" id="name" placeholder="Robot fox" />
  488. </div>
  489. </div>
  490. <div class="col-lg-6 wow fadeInUp" data-wow-delay=".5s">
  491. <div class="form-clt">
  492. <span>Your Email*</span>
  493. <input type="text" name="email" id="email" placeholder="info@example.com" />
  494. </div>
  495. </div>
  496. <div class="col-lg-12 wow fadeInUp" data-wow-delay=".7s">
  497. <div class="form-clt">
  498. <span>Message*</span>
  499. <textarea name="message" id="message" placeholder="Write Message"></textarea>
  500. </div>
  501. </div>
  502. <div class="col-lg-7 wow fadeInUp" data-wow-delay=".9s">
  503. <button type="submit" class="theme-btn bg-white">
  504. Send Request
  505. <i class="fa-solid fa-arrow-right-long"></i>
  506. </button>
  507. </div>
  508. </div>
  509. </form>
  510. </div>
  511. </div>
  512. <div class="col-lg-6">
  513. <div class="contact-image wow fadeInUp" data-wow-delay=".4s">
  514. <img src="/picture/contact.png" alt="contact-img" />
  515. <div class="cricle-shape"><img src="/picture/circle-2.png" alt="shape-img" /></div>
  516. </div>
  517. </div>
  518. </div>
  519. </div>
  520. </div>
  521. </section>
  522. <section class="pricing-section section-bg section-padding">
  523. <div class="tree-shape float-bob-x"><img src="/picture/tree-shape.png" alt="shape-img" /></div>
  524. <div class="pencil-shape"><img src="/picture/pencil4.png" alt="shape-img" /></div>
  525. <div class="top-shape"><img src="/picture/top-shape.png" alt="shape-img" /></div>
  526. <div class="container">
  527. <div class="pricing-wrapper">
  528. <div class="section-title text-center mb-0">
  529. <span class="wow fadeInUp">Our pricing</span>
  530. <h2 class="wow fadeInUp" data-wow-delay=".3s">
  531. Select a plan according to
  532. <br />
  533. your requirements
  534. </h2>
  535. </div>
  536. <ul class="nav" role="tablist">
  537. <li class="nav-item wow fadeInUp" data-wow-delay=".3s" role="presentation">
  538. <a
  539. href="#monthly"
  540. data-bs-toggle="tab"
  541. class="nav-link active"
  542. aria-selected="true"
  543. role="tab"
  544. >
  545. Monthly
  546. </a>
  547. </li>
  548. <li class="nav-item wow fadeInUp" data-wow-delay=".5s" role="presentation">
  549. <a
  550. href="#yearly"
  551. data-bs-toggle="tab"
  552. class="nav-link"
  553. aria-selected="false"
  554. role="tab"
  555. tabindex="-1"
  556. >
  557. Yearly
  558. </a>
  559. </li>
  560. </ul>
  561. </div>
  562. <div class="tab-content">
  563. <div id="monthly" class="tab-pane fade show active" role="tabpanel">
  564. <div class="row">
  565. <div class="col-xl-4 col-lg-6 col-md-6 wow fadeInUp" data-wow-delay=".3s">
  566. <div class="pricing-items">
  567. <div class="icon"><img src="/picture/icon.svg" alt="icon-img" /></div>
  568. <div class="element-shape"><img src="/picture/element.png" alt="shape-img" /></div>
  569. <div class="pricing-header">
  570. <h4>Basic Plan</h4>
  571. <h2>
  572. $39
  573. <span>/monthly</span>
  574. </h2>
  575. </div>
  576. <ul class="pricing-list">
  577. <li>
  578. <i class="fa-solid fa-check"></i>
  579. Condimentum porttitor sem
  580. </li>
  581. <li>
  582. <i class="fa-solid fa-check"></i>
  583. Condimentum lacinia quisque
  584. </li>
  585. <li>
  586. <i class="fa-solid fa-check"></i>
  587. Fusce sagittis est fringilla auctor
  588. </li>
  589. <li>
  590. <i class="fa-solid fa-check"></i>
  591. Ligula enim varius lacus et luctus
  592. </li>
  593. <li>
  594. <i class="fa-solid fa-check"></i>
  595. Pellentesque non massa sed elit
  596. </li>
  597. </ul>
  598. <a href="contact.html" class="theme-btn">
  599. Choose Plan
  600. <i class="fa-solid fa-arrow-right-long"></i>
  601. </a>
  602. </div>
  603. </div>
  604. <div class="col-xl-4 col-lg-6 col-md-6 wow fadeInUp" data-wow-delay=".5s">
  605. <div class="pricing-items active">
  606. <div class="icon"><img src="/picture/icon.svg" alt="icon-img" /></div>
  607. <div class="element-shape">
  608. <img src="/picture/element-2.png" alt="shape-img" />
  609. </div>
  610. <div class="pricing-header">
  611. <h4>Premium Plan</h4>
  612. <h2>
  613. $49
  614. <span>/monthly</span>
  615. </h2>
  616. </div>
  617. <ul class="pricing-list">
  618. <li>
  619. <i class="fa-solid fa-check"></i>
  620. Condimentum porttitor sem
  621. </li>
  622. <li>
  623. <i class="fa-solid fa-check"></i>
  624. Condimentum lacinia quisque
  625. </li>
  626. <li>
  627. <i class="fa-solid fa-check"></i>
  628. Fusce sagittis est fringilla auctor
  629. </li>
  630. <li>
  631. <i class="fa-solid fa-check"></i>
  632. Ligula enim varius lacus et luctus
  633. </li>
  634. <li>
  635. <i class="fa-solid fa-check"></i>
  636. Pellentesque non massa sed elit
  637. </li>
  638. </ul>
  639. <a href="contact.html" class="theme-btn">
  640. Choose Plan
  641. <i class="fa-solid fa-arrow-right-long"></i>
  642. </a>
  643. </div>
  644. </div>
  645. <div class="col-xl-4 col-lg-6 col-md-6 wow fadeInUp" data-wow-delay=".7s">
  646. <div class="pricing-items">
  647. <div class="icon"><img src="/picture/icon.svg" alt="icon-img" /></div>
  648. <div class="element-shape"><img src="/picture/element.png" alt="shape-img" /></div>
  649. <div class="pricing-header">
  650. <h4>Advanced</h4>
  651. <h2>
  652. $99
  653. <span>/monthly</span>
  654. </h2>
  655. </div>
  656. <ul class="pricing-list">
  657. <li>
  658. <i class="fa-solid fa-check"></i>
  659. Condimentum porttitor sem
  660. </li>
  661. <li>
  662. <i class="fa-solid fa-check"></i>
  663. Condimentum lacinia quisque
  664. </li>
  665. <li>
  666. <i class="fa-solid fa-check"></i>
  667. Fusce sagittis est fringilla auctor
  668. </li>
  669. <li>
  670. <i class="fa-solid fa-check"></i>
  671. Ligula enim varius lacus et luctus
  672. </li>
  673. <li>
  674. <i class="fa-solid fa-check"></i>
  675. Pellentesque non massa sed elit
  676. </li>
  677. </ul>
  678. <a href="contact.html" class="theme-btn">
  679. Choose Plan
  680. <i class="fa-solid fa-arrow-right-long"></i>
  681. </a>
  682. </div>
  683. </div>
  684. </div>
  685. </div>
  686. <div id="yearly" class="tab-pane fade" role="tabpanel">
  687. <div class="row">
  688. <div class="col-xl-4 col-lg-6 col-md-6">
  689. <div class="pricing-items">
  690. <div class="icon"><img src="/picture/icon.svg" alt="icon-img" /></div>
  691. <div class="element-shape"><img src="/picture/element.png" alt="shape-img" /></div>
  692. <div class="pricing-header">
  693. <h4>Basic Plan</h4>
  694. <h2>
  695. $39
  696. <span>/monthly</span>
  697. </h2>
  698. </div>
  699. <ul class="pricing-list">
  700. <li>
  701. <i class="fa-solid fa-check"></i>
  702. Condimentum porttitor sem
  703. </li>
  704. <li>
  705. <i class="fa-solid fa-check"></i>
  706. Condimentum lacinia quisque
  707. </li>
  708. <li>
  709. <i class="fa-solid fa-check"></i>
  710. Fusce sagittis est fringilla auctor
  711. </li>
  712. <li>
  713. <i class="fa-solid fa-check"></i>
  714. Ligula enim varius lacus et luctus
  715. </li>
  716. <li>
  717. <i class="fa-solid fa-check"></i>
  718. Pellentesque non massa sed elit
  719. </li>
  720. </ul>
  721. <a href="contact.html" class="theme-btn">
  722. Choose Plan
  723. <i class="fa-solid fa-arrow-right-long"></i>
  724. </a>
  725. </div>
  726. </div>
  727. <div class="col-xl-4 col-lg-6 col-md-6">
  728. <div class="pricing-items active">
  729. <div class="icon"><img src="/picture/icon.svg" alt="icon-img" /></div>
  730. <div class="element-shape">
  731. <img src="/picture/element-2.png" alt="shape-img" />
  732. </div>
  733. <div class="pricing-header">
  734. <h4>Premium Plan</h4>
  735. <h2>
  736. $49
  737. <span>/monthly</span>
  738. </h2>
  739. </div>
  740. <ul class="pricing-list">
  741. <li>
  742. <i class="fa-solid fa-check"></i>
  743. Condimentum porttitor sem
  744. </li>
  745. <li>
  746. <i class="fa-solid fa-check"></i>
  747. Condimentum lacinia quisque
  748. </li>
  749. <li>
  750. <i class="fa-solid fa-check"></i>
  751. Fusce sagittis est fringilla auctor
  752. </li>
  753. <li>
  754. <i class="fa-solid fa-check"></i>
  755. Ligula enim varius lacus et luctus
  756. </li>
  757. <li>
  758. <i class="fa-solid fa-check"></i>
  759. Pellentesque non massa sed elit
  760. </li>
  761. </ul>
  762. <a href="contact.html" class="theme-btn">
  763. Choose Plan
  764. <i class="fa-solid fa-arrow-right-long"></i>
  765. </a>
  766. </div>
  767. </div>
  768. <div class="col-xl-4 col-lg-6 col-md-6">
  769. <div class="pricing-items">
  770. <div class="icon"><img src="/picture/icon.svg" alt="icon-img" /></div>
  771. <div class="element-shape"><img src="/picture/element.png" alt="shape-img" /></div>
  772. <div class="pricing-header">
  773. <h4>Advanced</h4>
  774. <h2>
  775. $99
  776. <span>/monthly</span>
  777. </h2>
  778. </div>
  779. <ul class="pricing-list">
  780. <li>
  781. <i class="fa-solid fa-check"></i>
  782. Condimentum porttitor sem
  783. </li>
  784. <li>
  785. <i class="fa-solid fa-check"></i>
  786. Condimentum lacinia quisque
  787. </li>
  788. <li>
  789. <i class="fa-solid fa-check"></i>
  790. Fusce sagittis est fringilla auctor
  791. </li>
  792. <li>
  793. <i class="fa-solid fa-check"></i>
  794. Ligula enim varius lacus et luctus
  795. </li>
  796. <li>
  797. <i class="fa-solid fa-check"></i>
  798. Pellentesque non massa sed elit
  799. </li>
  800. </ul>
  801. <a href="contact.html" class="theme-btn">
  802. Choose Plan
  803. <i class="fa-solid fa-arrow-right-long"></i>
  804. </a>
  805. </div>
  806. </div>
  807. </div>
  808. </div>
  809. </div>
  810. </div>
  811. </section>
  812. <section class="testimonial-section-2 fix section-padding">
  813. <div class="zebra-shape float-bob-y"><img src="/picture/zebra.png" alt="shape-img" /></div>
  814. <div class="left-shape"><img src="/picture/testi-l-shape.png" alt="shape-img" /></div>
  815. <div class="container">
  816. <div class="testimonial-wrapper section-padding">
  817. <div class="shape-1"><img src="/picture/shape-11.png" alt="shape-img" /></div>
  818. <div class="shape-2"><img src="/picture/shape-2.png" alt="shape-img" /></div>
  819. <div class="testimonial-bg"></div>
  820. <div class="section-title text-center">
  821. <span class="wow fadeInUp">Testimonials</span>
  822. <h2 class="wow fadeInUp" data-wow-delay=".3s">What clients say</h2>
  823. </div>
  824. <div class="swiper testimonial-slider-2">
  825. <div class="swiper-wrapper">
  826. <div class="swiper-slide">
  827. <div class="testimonial-box-items">
  828. <p>
  829. Nunc vulputate tempor leo quis accumsan Sed vel mauris bibendum dignissim nisl a
  830. dapibus tortor Fusce sagittis est fringilla auctor eros vitae aliquam mauris Ut et
  831. elit consectetur porta felis ac interdum dolor Maecenas neque mi ullamcorper id
  832. sapien ac elementum
  833. </p>
  834. <div class="client-info">
  835. <img src="/picture/author1.png" alt="img" />
  836. <div class="content">
  837. <h5>Ronald Richards</h5>
  838. <p>Co,Founder</p>
  839. </div>
  840. </div>
  841. </div>
  842. </div>
  843. <div class="swiper-slide">
  844. <div class="testimonial-box-items">
  845. <p>
  846. Nunc vulputate tempor leo quis accumsan Sed vel mauris bibendum dignissim nisl a
  847. dapibus tortor Fusce sagittis est fringilla auctor eros vitae aliquam mauris Ut et
  848. elit consectetur porta felis ac interdum dolor Maecenas neque mi ullamcorper id
  849. sapien ac elementum
  850. </p>
  851. <div class="client-info">
  852. <img src="/picture/author1.png" alt="img" />
  853. <div class="content">
  854. <h5>Ronald Richards</h5>
  855. <p>Co,Founder</p>
  856. </div>
  857. </div>
  858. </div>
  859. </div>
  860. <div class="swiper-slide">
  861. <div class="testimonial-box-items">
  862. <p>
  863. Nunc vulputate tempor leo quis accumsan Sed vel mauris bibendum dignissim nisl a
  864. dapibus tortor Fusce sagittis est fringilla auctor eros vitae aliquam mauris Ut et
  865. elit consectetur porta felis ac interdum dolor Maecenas neque mi ullamcorper id
  866. sapien ac elementum
  867. </p>
  868. <div class="client-info">
  869. <img src="/picture/author1.png" alt="img" />
  870. <div class="content">
  871. <h5>Ronald Richards</h5>
  872. <p>Co,Founder</p>
  873. </div>
  874. </div>
  875. </div>
  876. </div>
  877. </div>
  878. </div>
  879. <div class="array-button">
  880. <button class="array-prev"><i class="fal fa-arrow-left"></i></button>
  881. <button class="array-next"><i class="fal fa-arrow-right"></i></button>
  882. </div>
  883. </div>
  884. </div>
  885. </section>
  886. <section class="news-section-2 fix section-padding" id="blog">
  887. <div class="shape-1 float-bob-y"><img src="/picture/shape-12.png" alt="shape-img" /></div>
  888. <div class="container">
  889. <div class="section-title text-center pt-40">
  890. <span class="text-white wow fadeInUp">Blog And News</span>
  891. <h2 class="text-white wow fadeInUp" data-wow-delay=".3s">
  892. Education foundation
  893. <br />
  894. for a better
  895. </h2>
  896. </div>
  897. <div class="row">
  898. <div class="col-xl-4 col-lg-6 col-md-6 wow fadeInUp" data-wow-delay=".3s">
  899. <div class="news-card-items">
  900. <div class="news-image">
  901. <img src="/picture/042.jpg" alt="img" />
  902. <div class="news-layer-wrapper">
  903. <div class="news-layer-image" style="background-image: url('/image/04.jpg')"></div>
  904. <div class="news-layer-image" style="background-image: url('/image/04.jpg')"></div>
  905. <div class="news-layer-image" style="background-image: url('/image/04.jpg')"></div>
  906. <div class="news-layer-image" style="background-image: url('/image/04.jpg')"></div>
  907. </div>
  908. <div class="post"><span>Activities</span></div>
  909. </div>
  910. <div class="news-content">
  911. <ul>
  912. <li>
  913. <i class="fas fa-calendar-alt"></i>
  914. Feb 10,2024
  915. </li>
  916. <li>
  917. <i class="far fa-user"></i>
  918. By admin
  919. </li>
  920. </ul>
  921. <h3>
  922. <a href="news-details.html">
  923. From without content
  924. <br />
  925. style without
  926. </a>
  927. </h3>
  928. <a href="news-details.html" class="theme-btn-2 mt-3">
  929. Read More
  930. <i class="fas fa-long-arrow-right"></i>
  931. </a>
  932. </div>
  933. </div>
  934. </div>
  935. <div class="col-xl-4 col-lg-6 col-md-6 wow fadeInUp" data-wow-delay=".5s">
  936. <div class="news-card-items">
  937. <div class="news-image">
  938. <img src="/picture/051.jpg" alt="img" />
  939. <div class="news-layer-wrapper">
  940. <div class="news-layer-image" style="background-image: url('/image/05.jpg')"></div>
  941. <div class="news-layer-image" style="background-image: url('/image/05.jpg')"></div>
  942. <div class="news-layer-image" style="background-image: url('/image/05.jpg')"></div>
  943. <div class="news-layer-image" style="background-image: url('/image/05.jpg')"></div>
  944. </div>
  945. <div class="post"><span>Activities</span></div>
  946. </div>
  947. <div class="news-content">
  948. <ul>
  949. <li>
  950. <i class="fas fa-calendar-alt"></i>
  951. Feb 10,2024
  952. </li>
  953. <li>
  954. <i class="far fa-user"></i>
  955. By admin
  956. </li>
  957. </ul>
  958. <h3>
  959. <a href="news-details.html">
  960. That jerk Form Finance
  961. <br />
  962. really threw me
  963. </a>
  964. </h3>
  965. <a href="news-details.html" class="theme-btn-2 mt-3">
  966. Read More
  967. <i class="fas fa-long-arrow-right"></i>
  968. </a>
  969. </div>
  970. </div>
  971. </div>
  972. <div class="col-xl-4 col-lg-6 col-md-6 wow fadeInUp" data-wow-delay=".7s">
  973. <div class="news-card-items">
  974. <div class="news-image">
  975. <img src="/picture/061.jpg" alt="img" />
  976. <div class="news-layer-wrapper">
  977. <div class="news-layer-image" style="background-image: url('/image/06.jpg')"></div>
  978. <div class="news-layer-image" style="background-image: url('/image/06.jpg')"></div>
  979. <div class="news-layer-image" style="background-image: url('/image/06.jpg')"></div>
  980. <div class="news-layer-image" style="background-image: url('/image/06.jpg')"></div>
  981. </div>
  982. <div class="post"><span>Activities</span></div>
  983. </div>
  984. <div class="news-content">
  985. <ul>
  986. <li>
  987. <i class="fas fa-calendar-alt"></i>
  988. Feb 10,2024
  989. </li>
  990. <li>
  991. <i class="far fa-user"></i>
  992. By admin
  993. </li>
  994. </ul>
  995. <h3>
  996. <a href="news-details.html">
  997. All Inclusive Ultimate Circle
  998. <br />
  999. Island Day with Lunch
  1000. </a>
  1001. </h3>
  1002. <a href="news-details.html" class="theme-btn-2 mt-3">
  1003. Read More
  1004. <i class="fas fa-long-arrow-right"></i>
  1005. </a>
  1006. </div>
  1007. </div>
  1008. </div>
  1009. </div>
  1010. </div>
  1011. </section>
  1012. <div class="brand-section fix section-padding pt-0">
  1013. <div class="container">
  1014. <div class="brand-wrapper">
  1015. <h6 class="text-center wow fadeInUp" data-wow-delay=".3s">1k+Brands Trust Us</h6>
  1016. <div class="swiper brand-slider">
  1017. <div class="swiper-wrapper">
  1018. <div class="swiper-slide">
  1019. <div class="brand-image"><img src="/picture/brand.png" alt="brand-img" /></div>
  1020. </div>
  1021. <div class="swiper-slide">
  1022. <div class="brand-image"><img src="/picture/brand.png" alt="brand-img" /></div>
  1023. </div>
  1024. <div class="swiper-slide">
  1025. <div class="brand-image"><img src="/picture/brand.png" alt="brand-img" /></div>
  1026. </div>
  1027. <div class="swiper-slide">
  1028. <div class="brand-image"><img src="/picture/brand.png" alt="brand-img" /></div>
  1029. </div>
  1030. <div class="swiper-slide">
  1031. <div class="brand-image"><img src="/picture/brand.png" alt="brand-img" /></div>
  1032. </div>
  1033. </div>
  1034. </div>
  1035. </div>
  1036. </div>
  1037. </div>
  1038. <FooterSection></FooterSection>
  1039. <!-- <footer class="footer-section section-bg">
  1040. <div class="frame-shape style-2"><img src="/picture/frame-2.png" alt="shape-img"></div>
  1041. <div class="frame-shape-3 float-bob-y"><img src="/picture/frame-3.png" alt="shape-img"></div>
  1042. <div class="footer-widgets-wrapper">
  1043. <div class="container">
  1044. <div class="row">
  1045. <div class="col-xl-3 col-lg-4 col-md-6 wow fadeInUp" data-wow-delay=".3s">
  1046. <div class="single-footer-widget">
  1047. <div class="widget-head"><a href="p9wfc14694.html"><img src="/picture/logo.svg"
  1048. alt="logo-img"></a></div>
  1049. <div class="footer-content">
  1050. <p>Phasellus ultricies aliquam volutpat ullamcorper laoreet neque,a lacinia curabitur
  1051. lacinia mollis </p>
  1052. <div class="social-icon d-flex align-items-center"><a href="#"><i
  1053. class="fab fa-facebook-f"></i></a><a href="#"><i
  1054. class="fab fa-twitter"></i></a><a href="#"><i
  1055. class="fa-brands fa-linkedin-in"></i></a><a href="#"><i
  1056. class="fa-brands fa-youtube"></i></a></div>
  1057. </div>
  1058. </div>
  1059. </div>
  1060. <div class="col-xl-2 col-lg-4 col-md-6 ps-lg-5 wow fadeInUp" data-wow-delay=".5s">
  1061. <div class="single-footer-widget">
  1062. <div class="widget-head">
  1063. <h3>Quick Links</h3>
  1064. </div>
  1065. <ul class="list-area">
  1066. <li><a href="program-details.html"><i class="fa-solid fa-chevron-right"></i>Our Services
  1067. </a></li>
  1068. <li><a href="news-details.html"><i class="fa-solid fa-chevron-right"></i>Our Blogs </a>
  1069. </li>
  1070. <li><a href="faq.html"><i class="fa-solid fa-chevron-right"></i>FAQ’S </a></li>
  1071. <li><a href="contact.html"><i class="fa-solid fa-chevron-right"></i>Contact Us </a></li>
  1072. </ul>
  1073. </div>
  1074. </div>
  1075. <div class="col-xl-3 col-lg-4 col-md-6 ps-lg-5 wow fadeInUp" data-wow-delay=".5s">
  1076. <div class="single-footer-widget style-margin">
  1077. <div class="widget-head">
  1078. <h3>Categories</h3>
  1079. </div>
  1080. <ul class="list-area">
  1081. <li><a href="program-details.html"><i class="fa-solid fa-chevron-right"></i>Music
  1082. Learning </a></li>
  1083. <li><a href="program-details.html"><i class="fa-solid fa-chevron-right"></i>Sports,Games
  1084. </a></li>
  1085. <li><a href="program-details.html"><i class="fa-solid fa-chevron-right"></i>Science
  1086. Class </a></li>
  1087. <li><a href="program-details.html"><i class="fa-solid fa-chevron-right"></i>Drawing </a>
  1088. </li>
  1089. </ul>
  1090. </div>
  1091. </div>
  1092. <div class="col-xl-4 col-lg-4 col-md-6 wow fadeInUp" data-wow-delay=".7s">
  1093. <div class="single-footer-widget style-margin">
  1094. <div class="widget-head">
  1095. <h3>Our Galleries</h3>
  1096. </div>
  1097. <div class="footer-gallery">
  1098. <div class="gallery-wrap">
  1099. <div class="gallery-item">
  1100. <div class="thumb"><a href="/picture/gallery-1.jpg" class="img-popup"><img
  1101. src="/picture/gallery-1.jpg" alt="gallery-img">
  1102. <div class="icon"><i class="far fa-plus"></i></div>
  1103. </a></div>
  1104. <div class="thumb"><a href="/picture/gallery-2.jpg" class="img-popup"><img
  1105. src="/picture/gallery-2.jpg" alt="gallery-img">
  1106. <div class="icon"><i class="far fa-plus"></i></div>
  1107. </a></div>
  1108. <div class="thumb"><a href="/picture/gallery-3.jpg" class="img-popup"><img
  1109. src="/picture/gallery-3.jpg" alt="gallery-img">
  1110. <div class="icon"><i class="far fa-plus"></i></div>
  1111. </a></div>
  1112. </div>
  1113. <div class="gallery-item">
  1114. <div class="thumb"><a href="/picture/gallery-4.jpg" class="img-popup"><img
  1115. src="/picture/gallery-4.jpg" alt="gallery-img">
  1116. <div class="icon"><i class="far fa-plus"></i></div>
  1117. </a></div>
  1118. <div class="thumb"><a href="/picture/gallery-5.jpg" class="img-popup"><img
  1119. src="/picture/gallery-5.jpg" alt="gallery-img">
  1120. <div class="icon"><i class="far fa-plus"></i></div>
  1121. </a></div>
  1122. <div class="thumb"><a href="/picture/gallery-6.jpg" class="img-popup"><img
  1123. src="/picture/gallery-6.jpg" alt="gallery-img">
  1124. <div class="icon"><i class="far fa-plus"></i></div>
  1125. </a></div>
  1126. </div>
  1127. </div>
  1128. </div>
  1129. </div>
  1130. </div>
  1131. </div>
  1132. </div>
  1133. </div>
  1134. <div class="footer-bottom">
  1135. <div class="f-bottom-shape"></div>
  1136. <div class="container">
  1137. <div class="footer-wrapper d-flex align-items-center justify-content-between">
  1138. <p class="wow fadeInLeft color-2" data-wow-delay=".3s">© All Copyright 2024 by <a
  1139. href="https://www.99ziyuan.net">99ziyuan</a></p>
  1140. <ul class="footer-menu wow fadeInRight" data-wow-delay=".5s">
  1141. <li><a href="contact.html">Terms & Condition </a></li>
  1142. <li><a href="contact.html">Privacy Policy </a></li>
  1143. </ul>
  1144. </div>
  1145. </div><a href="#" id="scrollUp" class="scroll-icon"><i class="far fa-arrow-up"></i></a>
  1146. </div>
  1147. </footer> -->
  1148. </template>