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.

739 lines
27 KiB

2 years ago
  1. <!DOCTYPE html>
  2. <html lang="zxx">
  3. <head>
  4. <title>Feature Boxes</title>
  5. <meta charset="UTF-8">
  6. <link rel="shortcut icon" href="img/logos/logo-shortcut.png"/>
  7. <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  8. <!-- Bootstrap CSS-->
  9. <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
  10. <!-- Font-Awesome -->
  11. <link rel="stylesheet" type="text/css" href="css/font-awesome.css">
  12. <!-- Icomoon -->
  13. <link rel="stylesheet" type="text/css" href="css/icomoon.css">
  14. <!-- Animate.css -->
  15. <link rel="stylesheet" href="css/animate.css">
  16. <!-- Color Switcher -->
  17. <link rel="stylesheet" type="text/css" href="css/switcher.css">
  18. <!-- Owl Carousel -->
  19. <link rel="stylesheet" href="css/owl.carousel.css">
  20. <!-- Main Styles -->
  21. <link rel="stylesheet" type="text/css" href="css/default.css">
  22. <link rel="stylesheet" type="text/css" href="css/styles.css" id="colors">
  23. <!-- Fonts Google -->
  24. <link href="https://fonts.googleapis.com/css?family=Fira+Sans:100,200,300,400,500,600,700,800,900" rel="stylesheet">
  25. </head>
  26. <body>
  27. <!-- Preloader Start-->
  28. <div id="preloader">
  29. <div class="row loader">
  30. <div class="loader-icon"></div>
  31. </div>
  32. </div>
  33. <!-- Preloader End -->
  34. <!-- Top-Bar START -->
  35. <div id="top-bar" class="hidden-sm-down">
  36. <div class="container">
  37. <div class="row">
  38. <div class="col-md-9 col-12">
  39. <div class="top-bar-welcome">
  40. <ul>
  41. <li>Welcome to Professional Consulting Agency</li>
  42. </ul>
  43. </div>
  44. <div class="top-bar-info">
  45. <ul>
  46. <li><i class="fa fa-phone"></i>(+123) 456 7890
  47. <li>
  48. <li><i class="fa fa-envelope"></i>example@gmail.com
  49. <li>
  50. </ul>
  51. </div>
  52. </div>
  53. <div class="col-md-3 col-12">
  54. <ul class="social-icons hidden-md-down">
  55. <li><a href="#"><i class="fa fa-facebook"></i></a></li>
  56. <li><a href="#"><i class="fa fa-twitter"></i></a></li>
  57. <li><a href="#"><i class="fa fa-instagram"></i></a></li>
  58. <li><a href="#"><i class="fa fa-pinterest"></i></a></li>
  59. </ul>
  60. </div>
  61. </div>
  62. </div>
  63. </div>
  64. <!-- Top-Bar END -->
  65. <!-- Navbar START -->
  66. <header>
  67. <nav id="navigation4" class="container navigation">
  68. <div class="nav-header">
  69. <a class="nav-brand" href="index.html">
  70. <img src="img/logos/logo.png" class="main-logo" alt="logo" id="main_logo">
  71. </a>
  72. <div class="nav-toggle"></div>
  73. </div>
  74. <div class="nav-menus-wrapper">
  75. <ul class="nav-menu align-to-right">
  76. <li><a href="#">Home</a>
  77. <div class="megamenu-panel">
  78. <div class="megamenu-lists">
  79. <ul class="megamenu-list list-col-4">
  80. <li class="megamenu-list-title"><a href="#">Multi Purpose 01</a></li>
  81. <li><a href="index.html">Home Page 01</a></li>
  82. <li><a href="home-2.html">Home Page 02</a></li>
  83. <li><a href="home-3.html">Home Page 03</a></li>
  84. </ul>
  85. <ul class="megamenu-list list-col-4">
  86. <li class="megamenu-list-title"><a href="#">Multi Purpose 02</a></li>
  87. <li><a href="home-4.html">Home Page 04</a></li>
  88. <li><a href="home-5.html">Home Page 05</a></li>
  89. <li><a href="home-6.html">Home Page 06</a></li>
  90. </ul>
  91. <ul class="megamenu-list list-col-4">
  92. <li class="megamenu-list-title"><a href="#">Multi Purpose 03</a></li>
  93. <li><a href="home-7.html">Home Page 07</a></li>
  94. <li><a href="home-8.html">Home Page 08</a></li>
  95. <li><a href="home-9.html">Home Page 09</a></li>
  96. </ul>
  97. <ul class="megamenu-list list-col-4">
  98. <li class="megamenu-list-title"><a href="#">Multi Purpose 04</a></li>
  99. <li><a href="home-10.html">Home Page 10 <span class="menu-tag">NEW</span><span class="menu-tag">HOT</span></a></li>
  100. <li><a href="home-11.html">Home Page 11 <span class="menu-tag">NEW</span></a></li>
  101. <li><a href="home-12.html">Home Page 12 <span class="menu-tag">NEW</span></a></li>
  102. </ul>
  103. </div>
  104. </div>
  105. </li>
  106. <li><a href="#">About</a>
  107. <ul class="nav-dropdown">
  108. <li><a href="about.html">About Us 01</a></li>
  109. <li><a href="about-2.html">About Us 02</a></li>
  110. <li><a href="team.html">Our Team 01</a></li>
  111. <li><a href="team-2.html">Our Team 02</a></li>
  112. <li><a href="team-3.html">Our Team 03</a></li>
  113. <li><a href="team-single.html">Team Single</a></li>
  114. <li><a href="partners.html">Our Partners</a></li>
  115. </ul>
  116. </li>
  117. <li><a href="#">Services</a>
  118. <ul class="nav-dropdown">
  119. <li><a href="services.html">Services 01</a></li>
  120. <li><a href="services-2.html">Services 02</a></li>
  121. <li><a href="services-3.html">Services 03</a></li>
  122. <li><a href="service-detail.html">Service Detail</a></li>
  123. <li><a href="cases.html">Cases</a></li>
  124. </ul>
  125. </li>
  126. <li><a href="#">Projects</a>
  127. <ul class="nav-dropdown">
  128. <li><a href="projects-grid.html">Grid Style</a></li>
  129. <li><a href="projects-masonry-3-column.html">Masonry Style 01</a></li>
  130. <li><a href="projects-masonry-4-column.html">Masonry Style 02</a></li>
  131. <li><a href="project-detail.html">Projects Detail 01</a></li>
  132. <li><a href="project-detail-2.html">Projects Detail 02</a></li>
  133. </ul>
  134. </li>
  135. <li><a href="#">Blog</a>
  136. <ul class="nav-dropdown">
  137. <li><a href="blog-grid.html">Blog Grid</a></li>
  138. <li><a href="blog-grid-classic.html">Blog Grid Classic</a></li>
  139. <li><a href="blog-grid-sidebar.html">Blog Grid Sidebar</a></li>
  140. <li><a href="blog-list.html">Blog List</a></li>
  141. <li><a href="blog-list-sidebar.html">Blog List Sidebar</a></li>
  142. <li><a href="blog-post.html">Blog Post</a></li>
  143. </ul>
  144. </li>
  145. <li><a href="#">Shop</a>
  146. <ul class="nav-dropdown">
  147. <li><a href="shop-grid.html">Grid Style 3 Col</a></li>
  148. <li><a href="shop-grid-4-col.html">Grid Style 4 Col</a></li>
  149. <li><a href="shop-grid-classic.html">Classic Style 3 Col</a></li>
  150. <li><a href="shop-grid-classic-4-col.html">Classic Style 4 Col</a></li>
  151. <li><a href="shop-single.html">Shop Single</a></li>
  152. <li><a href="shopping-cart.html">Shopping Cart</a></li>
  153. </ul>
  154. </li>
  155. <li><a href="#">Pages</a>
  156. <ul class="nav-dropdown">
  157. <li><a href="faq.html">FAQ 01</a></li>
  158. <li><a href="faq-2.html">FAQ 02</a></li>
  159. <li><a href="404.html">Error 404</a></li>
  160. <li><a href="under-construction.html">Under Construction</a></li>
  161. </ul>
  162. </li>
  163. <li><a href="#">Elements</a>
  164. <ul class="nav-dropdown">
  165. <li><a href="feature-boxes.html">Feature Boxes</a></li>
  166. <li><a href="pricing-lists.html">Pricing Lists</a></li>
  167. <li><a href="testmonials.html">Testmonials</a></li>
  168. <li><a href="progress-bars.html">Progress Bars</a></li>
  169. <li><a href="accordions.html">Accordions</a></li>
  170. <li><a href="animated-tabs.html">Animated Tabs</a></li>
  171. <li><a href="countups.html">Countups</a></li>
  172. <li><a href="responsive-videos.html">Responsive Videos</a></li>
  173. </ul>
  174. </li>
  175. <li><a href="#">Contact</a>
  176. <ul class="nav-dropdown">
  177. <li><a href="contact.html">Contact Us 01</a></li>
  178. <li><a href="contact-2.html">Contact Us 02</a></li>
  179. <li><a href="contact-3.html">Contact Us 03</a></li>
  180. <li><a href="contact-4.html">Contact Us 04</a></li>
  181. </ul>
  182. </li>
  183. </ul>
  184. </div>
  185. </nav>
  186. </header>
  187. <!-- Navbar END -->
  188. <!-- Page Title START -->
  189. <div class="page-title-section" style="background-image: url(http://via.placeholder.com/1730x300);">
  190. <div class="container">
  191. <h1>Feature Boxes</h1>
  192. <ul>
  193. <li><a href="index.html">Home</a></li>
  194. <li><a href="feature-boxes.html">Feature Boxes</a></li>
  195. </ul>
  196. </div>
  197. </div>
  198. <!-- Page Title END -->
  199. <!--Features Section START-->
  200. <div class="section-block">
  201. <div class="container">
  202. <div class="section-heading center-holder">
  203. <h3>Doing the right thing at the right time</h3>
  204. <div class="section-heading-line"></div>
  205. <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor <br>incididunt ut labore et dolore magna aliqua.</p>
  206. </div>
  207. <div class="row mt-60">
  208. <div class="col-md-4 col-sm-12 col-12">
  209. <div class="serv-section-2">
  210. <div class="serv-section-2-icon">
  211. <i class="icon-diamond"></i>
  212. </div>
  213. <div class="serv-section-desc">
  214. <h4>Planning</h4>
  215. <h5>Business Planning</h5>
  216. </div>
  217. <div class="section-heading-line-left"></div>
  218. <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore.</p>
  219. </div>
  220. </div>
  221. <div class="col-md-4 col-sm-12 col-12">
  222. <div class="serv-section-2 serv-section-2-act">
  223. <div class="serv-section-2-icon serv-section-2-icon-act">
  224. <i class="icon-settings"></i>
  225. </div>
  226. <div class="serv-section-desc">
  227. <h4>Management</h4>
  228. <h5>Retirement Planning</h5>
  229. </div>
  230. <div class="section-heading-line-left"></div>
  231. <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore.</p>
  232. </div>
  233. </div>
  234. <div class="col-md-4 col-sm-12 col-12">
  235. <div class="serv-section-2">
  236. <div class="serv-section-2-icon">
  237. <i class="icon-checked"></i>
  238. </div>
  239. <div class="serv-section-desc">
  240. <h4>Accumulation</h4>
  241. <h5>Support and Sell</h5>
  242. </div>
  243. <div class="section-heading-line-left"></div>
  244. <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore.</p>
  245. </div>
  246. </div>
  247. </div>
  248. </div>
  249. </div>
  250. <!--Features Section END-->
  251. <!--Services Section START-->
  252. <div class="section-block-bg" style="background-image: url('http://via.placeholder.com/1730x745')">
  253. <div class="container">
  254. <div class="section-heading center-holder">
  255. <h2>Why Choose Us</h2>
  256. <div class="section-heading-line"></div>
  257. <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor <br>incididunt ut labore et dolore magna aliqua.</p>
  258. </div>
  259. <div class="row">
  260. <div class="owl-carousel owl-theme mt-25" id="services-carousel-2">
  261. <div class="service-box-car-2">
  262. <i class="icon-hourglass"></i>
  263. <h4>Financial Planing</h4>
  264. <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore.</p>
  265. </div>
  266. <div class="service-box-car-2">
  267. <i class="icon-money-bag"></i>
  268. <h4>Business Development</h4>
  269. <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore.</p>
  270. </div>
  271. <div class="service-box-car-2">
  272. <i class="icon-atm"></i>
  273. <h4>Market Research</h4>
  274. <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore.</p>
  275. </div>
  276. <div class="service-box-car-2">
  277. <i class="icon-clipboard"></i>
  278. <h4>Turnaround Consulting</h4>
  279. <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore.</p>
  280. </div>
  281. <div class="service-box-car-2">
  282. <i class="icon-exchange-2"></i>
  283. <h4>Financial Consulting</h4>
  284. <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore.</p>
  285. </div>
  286. <div class="service-box-car-2">
  287. <i class="icon-padlock"></i>
  288. <h4>Risk Management</h4>
  289. <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore.</p>
  290. </div>
  291. </div>
  292. </div>
  293. </div>
  294. </div>
  295. <!--Services Section END-->
  296. <!-- Feature Boxes Start -->
  297. <div class="section-block">
  298. <div class="container">
  299. <div class="section-heading center-holder">
  300. <h3>Awesome Features</h3>
  301. <div class="section-heading-line"></div>
  302. <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor <br>incididunt ut labore et dolore magna aliqua.</p>
  303. </div>
  304. <div class="row mt-50">
  305. <div class="col-md-4 col-sm-4 col-12">
  306. <div class="feature-flex">
  307. <div class="clearfix">
  308. <div class="feature-flex-icon">
  309. <i class="icon-balance3"></i>
  310. </div>
  311. <div class="feature-flex-content">
  312. <h4><a href="#">Business Solutions</a></h4>
  313. <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus bibendum, nunc ut hendrerit tempus.</p>
  314. </div>
  315. </div>
  316. </div>
  317. </div>
  318. <div class="col-md-4 col-sm-4 col-12">
  319. <div class="feature-flex">
  320. <div class="clearfix">
  321. <div class="feature-flex-icon">
  322. <i class="icon-diamond"></i>
  323. </div>
  324. <div class="feature-flex-content">
  325. <h4><a href="#">Development Manager</a></h4>
  326. <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus bibendum, nunc ut hendrerit tempus.</p>
  327. </div>
  328. </div>
  329. </div>
  330. </div>
  331. <div class="col-md-4 col-sm-4 col-12">
  332. <div class="feature-flex">
  333. <div class="clearfix">
  334. <div class="feature-flex-icon">
  335. <i class="icon-credit-card2"></i>
  336. </div>
  337. <div class="feature-flex-content">
  338. <h4><a href="#">Global Consumer insights</a></h4>
  339. <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus bibendum, nunc ut hendrerit tempus.</p>
  340. </div>
  341. </div>
  342. </div>
  343. </div>
  344. </div>
  345. </div>
  346. </div>
  347. <!-- Feature Boxes End -->
  348. <!-- Feature Boxes Start -->
  349. <div class="section-block-grey">
  350. <div class="container">
  351. <div class="section-heading center-holder">
  352. <span>Explore Our Features</span>
  353. <h3>Creative Consulting Agency</h3>
  354. <div class="section-heading-line"></div>
  355. </div>
  356. <div class="row mt-50">
  357. <div class="col-md-3 col-sm-6 col-12">
  358. <div class="feature-box">
  359. <i class="icon-clock2"></i>
  360. <h4>Business Solutions</h4>
  361. <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus bibendum, nunc ut hendrerit tempus.</p>
  362. </div>
  363. </div>
  364. <div class="col-md-3 col-sm-6 col-12">
  365. <div class="feature-box">
  366. <i class="icon-wallet2"></i>
  367. <h4>Solutions Analyst</h4>
  368. <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus bibendum, nunc ut hendrerit tempus.</p>
  369. </div>
  370. </div>
  371. <div class="col-md-3 col-sm-6 col-12">
  372. <div class="feature-box">
  373. <i class="icon-bar-graph-12"></i>
  374. <h4>Development Manager</h4>
  375. <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus bibendum, nunc ut hendrerit tempus.</p>
  376. </div>
  377. </div>
  378. <div class="col-md-3 col-sm-6 col-12">
  379. <div class="feature-box">
  380. <i class="icon-piggy-bank3"></i>
  381. <h4>Project Lead</h4>
  382. <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus bibendum, nunc ut hendrerit tempus.</p>
  383. </div>
  384. </div>
  385. </div>
  386. </div>
  387. </div>
  388. <!-- Feature Boxes End -->
  389. <!-- Feature Boxes Start -->
  390. <div class="section-block">
  391. <div class="container">
  392. <div class="section-heading center-holder">
  393. <span>Explore Our Features</span>
  394. <h3>First class business solutions since 1995</h3>
  395. <div class="section-heading-line"></div>
  396. </div>
  397. <div class="row mt-50">
  398. <div class="col-md-4 col-sm-4 col-12">
  399. <div class="feature-flex-square">
  400. <div class="clearfix">
  401. <div class="feature-flex-square-icon">
  402. <i class="icon-target"></i>
  403. </div>
  404. <div class="feature-flex-square-content">
  405. <h4><a href="#">Business Solutions</a></h4>
  406. <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus bibendum, nunc ut hendrerit tempus.</p>
  407. <a href="#" class="feature-flex-square-content-button">Learn More</a>
  408. </div>
  409. </div>
  410. </div>
  411. </div>
  412. <div class="col-md-4 col-sm-4 col-12">
  413. <div class="feature-flex-square">
  414. <div class="clearfix">
  415. <div class="feature-flex-square-icon">
  416. <i class="icon-diamond"></i>
  417. </div>
  418. <div class="feature-flex-square-content">
  419. <h4><a href="#">Development Manager</a></h4>
  420. <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus bibendum, nunc ut hendrerit tempus.</p>
  421. <a href="#" class="feature-flex-square-content-button">Learn More</a>
  422. </div>
  423. </div>
  424. </div>
  425. </div>
  426. <div class="col-md-4 col-sm-4 col-12">
  427. <div class="feature-flex-square">
  428. <div class="clearfix">
  429. <div class="feature-flex-square-icon">
  430. <i class="icon-networking"></i>
  431. </div>
  432. <div class="feature-flex-square-content">
  433. <h4><a href="#">Global Consumer insights</a></h4>
  434. <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus bibendum, nunc ut hendrerit tempus.</p>
  435. <a href="#" class="feature-flex-square-content-button">Learn More</a>
  436. </div>
  437. </div>
  438. </div>
  439. </div>
  440. </div>
  441. </div>
  442. </div>
  443. <!-- Feature Boxes End -->
  444. <!-- Feature Boxes Section START -->
  445. <div class="section-block-grey">
  446. <div class="container">
  447. <div class="section-heading center-holder">
  448. <span>Explore Our Features</span>
  449. <h3>Let your business to grow with us</h3>
  450. <div class="section-heading-line"></div>
  451. </div>
  452. <div class="row mt-50">
  453. <div class="col-md-4 col-sm-4 col-12">
  454. <div class="feature-box-long">
  455. <i class="icon-target"></i>
  456. <h3>Business Solutions</h3>
  457. <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
  458. tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam.</p>
  459. </div>
  460. </div>
  461. <div class="col-md-4 col-sm-4 col-12">
  462. <div class="feature-box-long">
  463. <i class="icon-diamond"></i>
  464. <h3>Development Manager</h3>
  465. <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
  466. tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam.</p>
  467. </div>
  468. </div>
  469. <div class="col-md-4 col-sm-4 col-12">
  470. <div class="feature-box-long">
  471. <i class="icon-bank"></i>
  472. <h3>Professional Approach</h3>
  473. <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
  474. tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam.</p>
  475. </div>
  476. </div>
  477. </div>
  478. </div>
  479. </div>
  480. <!-- Feature Boxes Section END -->
  481. <!--Features Section START-->
  482. <div class="section-block">
  483. <div class="container">
  484. <div class="section-heading text-center">
  485. <span>Insight for the connected world</span>
  486. <h3>Making sense of global markets<br> More than measurement.</h3>
  487. <div class="section-heading-line"></div>
  488. </div>
  489. <div class="row mt-50">
  490. <div class="col-md-4 col-sm-4 col-12">
  491. <div class="feature-box-4">
  492. <div class="feature-box-4-icon">
  493. <i class="icon-worldwide2"></i>
  494. </div>
  495. <div class="feature-box-4-content">
  496. <h4>Insurance Consulting</h4>
  497. <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmodtempor incididunt ut labore et dolore.</p>
  498. <a href="#" class="feature-box-4-link">Read More <i class="fa fa-chevron-right"></i></a>
  499. </div>
  500. <i class="feature-box-4-icon-bg icon-worldwide2"></i>
  501. </div>
  502. </div>
  503. <div class="col-md-4 col-sm-4 col-12">
  504. <div class="feature-box-4">
  505. <div class="feature-box-4-icon">
  506. <i class="icon-balance3"></i>
  507. </div>
  508. <div class="feature-box-4-content">
  509. <h4>Insurance Consulting</h4>
  510. <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmodtempor incididunt ut labore et dolore.</p>
  511. <a href="#" class="feature-box-4-link">Read More <i class="fa fa-chevron-right"></i></a>
  512. </div>
  513. <i class="feature-box-4-icon-bg icon-balance3"></i>
  514. </div>
  515. </div>
  516. <div class="col-md-4 col-sm-4 col-12">
  517. <div class="feature-box-4">
  518. <div class="feature-box-4-icon">
  519. <i class="icon-credit-card3"></i>
  520. </div>
  521. <div class="feature-box-4-content">
  522. <h4>Insurance Consulting</h4>
  523. <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmodtempor incididunt ut labore et dolore.</p>
  524. <a href="#" class="feature-box-4-link">Read More <i class="fa fa-chevron-right"></i></a>
  525. </div>
  526. <i class="feature-box-4-icon-bg icon-credit-card3"></i>
  527. </div>
  528. </div>
  529. </div>
  530. </div>
  531. </div>
  532. <!--Features Section END-->
  533. <!-- Footer START -->
  534. <footer>
  535. <div class="container">
  536. <div class="row">
  537. <!-- Column 1 Start -->
  538. <div class="col-md-4 col-sm-6 col-12">
  539. <h3>About Us</h3>
  540. <div class="mt-25">
  541. <img src="img/logos/logo-footer.png" alt="footer-logo">
  542. <p class="mt-25">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim
  543. ad minim veniam.</p>
  544. <div class="footer-social-icons mt-25">
  545. <ul>
  546. <li><a href="#"><i class="fa fa-facebook-square"></i></a></li>
  547. <li><a href="#"><i class="fa fa-instagram"></i></a></li>
  548. <li><a href="#"><i class="fa fa-pinterest"></i></a></li>
  549. <li><a href="#"><i class="fa fa-skype"></i></a></li>
  550. <li><a href="#"><i class="fa fa-youtube"></i></a></li>
  551. </ul>
  552. </div>
  553. </div>
  554. </div>
  555. <!-- Column 1 End -->
  556. <!-- Column 2 Start -->
  557. <div class="col-md-3 col-sm-6 col-12">
  558. <h3>Quick Links</h3>
  559. <ul class="footer-list">
  560. <li><a href="#">Strategic Consulting</a></li>
  561. <li><a href="#">Sales Services</a></li>
  562. <li><a href="#">Market Research</a></li>
  563. <li><a href="#">Online Reputation</a></li>
  564. <li><a href="#">Strategic Consulting</a></li>
  565. <li><a href="#">Sales Services</a></li>
  566. <li><a href="#">Market Research</a></li>
  567. </ul>
  568. </div>
  569. <!-- Column 2 End -->
  570. <!-- Column 3 Start -->
  571. <div class="col-md-3 col-sm-6 col-12">
  572. <h3>Recent Posts</h3>
  573. <div class="mt-25">
  574. <!-- Post Start -->
  575. <div class="footer-recent-post clearfix">
  576. <div class="footer-recent-post-thumb">
  577. <img src="http://via.placeholder.com/65x65" alt="img">
  578. </div>
  579. <div class="footer-recent-post-content">
  580. <span>February 7, 2018</span>
  581. <a href="#">Advices for young designers</a>
  582. </div>
  583. </div>
  584. <!-- Post End -->
  585. <!-- Post Start -->
  586. <div class="footer-recent-post clearfix">
  587. <div class="footer-recent-post-thumb">
  588. <img src="http://via.placeholder.com/65x65" alt="img">
  589. </div>
  590. <div class="footer-recent-post-content">
  591. <span>February 7, 2018</span>
  592. <a href="#">What Planning Process Needs?</a>
  593. </div>
  594. </div>
  595. <!-- Post End -->
  596. <!-- Post Start -->
  597. <div class="footer-recent-post clearfix">
  598. <div class="footer-recent-post-thumb">
  599. <img src="http://via.placeholder.com/65x65" alt="img">
  600. </div>
  601. <div class="footer-recent-post-content">
  602. <span>February 7, 2018</span>
  603. <a href="#">Lorem ipsum dolor sit amet.</a>
  604. </div>
  605. </div>
  606. <!-- Post End -->
  607. </div>
  608. </div>
  609. <!-- Column 3 End -->
  610. <!-- Column 4 Start -->
  611. <div class="col-md-2 col-sm-6 col-12">
  612. <h3>Tags</h3>
  613. <div class="footer-tags mt-25">
  614. <a href="#">Business</a>
  615. <a href="#">Conusltant</a>
  616. <a href="#">Coach</a>
  617. <a href="#">UX</a>
  618. <a href="#">API</a>
  619. <a href="#">Reputation</a>
  620. <a href="#">Research</a>
  621. <a href="#">Sale</a>
  622. <a href="#">Service</a>
  623. <a href="#">UI</a>
  624. <a href="#">Web</a>
  625. <a href="#">WebDesign</a>
  626. </div>
  627. </div>
  628. <!-- Column 4 End -->
  629. </div>
  630. <!-- Footer Bar Start -->
  631. <div class="footer-bar">
  632. <p><span class="primary-color">SpecThemes</span> © 2018. All Rights Reserved.</p>
  633. </div>
  634. <!-- Footer Bar End -->
  635. </div>
  636. </footer>
  637. <!-- Footer END -->
  638. <!-- Scroll to top button Start -->
  639. <a href="#" class="scroll-to-top"><i class="fa fa-angle-up" aria-hidden="true"></i></a>
  640. <!-- Scroll to top button End -->
  641. <!-- Jquery -->
  642. <script src="js/jquery.min.js"></script>
  643. <!--Popper JS-->
  644. <script src="js/popper.min.js"></script>
  645. <!-- Bootstrap JS-->
  646. <script src="js/bootstrap.min.js"></script>
  647. <!-- Owl Carousel-->
  648. <script src="js/owl.carousel.js"></script>
  649. <!-- Navbar JS -->
  650. <script src="js/navigation.js"></script>
  651. <script src="js/navigation.fixed.js"></script>
  652. <!-- Wow JS -->
  653. <script src="js/wow.min.js"></script>
  654. <!-- Countup -->
  655. <script src="js/jquery.counterup.min.js"></script>
  656. <script src="js/waypoints.min.js"></script>
  657. <!-- Tabs -->
  658. <script src="js/tabs.min.js"></script>
  659. <!-- Yotube Video Player -->
  660. <script src="js/jquery.mb.YTPlayer.min.js"></script>
  661. <!-- Isotop -->
  662. <script src="js/isotope.pkgd.min.js"></script>
  663. <!-- Modernizr -->
  664. <script src="js/modernizr.js"></script>
  665. <!-- Switcher JS -->
  666. <script src="js/switcher.js"></script>
  667. <!-- Google Map -->
  668. <script src="js/map.js"></script>
  669. <!-- Main JS -->
  670. <script src="js/main.js"></script>
  671. </body>
  672. </html>