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.

954 lines
32 KiB

2 years ago
  1. <!DOCTYPE html>
  2. <html lang="zxx">
  3. <head>
  4. <title>Home</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. <!-- Slider -->
  15. <link rel="stylesheet" type="text/css" href="css/swiper.min.css">
  16. <link rel="stylesheet" type="text/css" href="css/slider.css">
  17. <!-- Animate.css -->
  18. <link rel="stylesheet" href="css/animate.css">
  19. <!-- Color Switcher -->
  20. <link rel="stylesheet" type="text/css" href="css/switcher.css">
  21. <!-- Owl Carousel -->
  22. <link rel="stylesheet" href="css/owl.carousel.css">
  23. <!-- Main Styles -->
  24. <link rel="stylesheet" type="text/css" href="css/default.css">
  25. <link rel="stylesheet" type="text/css" href="css/styles.css" id="colors">
  26. <!-- Fonts Google -->
  27. <link href="https://fonts.googleapis.com/css?family=Fira+Sans:100,200,300,400,500,600,700,800,900" rel="stylesheet">
  28. </head>
  29. <body>
  30. <!-- Preloader Start-->
  31. <div id="preloader">
  32. <div class="row loader">
  33. <div class="loader-icon"></div>
  34. </div>
  35. </div>
  36. <!-- Preloader End -->
  37. <!-- Top-Bar START -->
  38. <div id="top-bar" class="hidden-sm-down">
  39. <div class="container">
  40. <div class="row">
  41. <div class="col-md-9 col-12">
  42. <div class="top-bar-welcome">
  43. <ul>
  44. <li>Welcome to Professional Consulting Agency</li>
  45. </ul>
  46. </div>
  47. <div class="top-bar-info">
  48. <ul>
  49. <li><i class="fa fa-phone"></i>(+123) 456 7890
  50. <li>
  51. <li><i class="fa fa-envelope"></i>example@gmail.com
  52. <li>
  53. </ul>
  54. </div>
  55. </div>
  56. <div class="col-md-3 col-12">
  57. <ul class="social-icons hidden-md-down">
  58. <li><a href="#"><i class="fa fa-facebook"></i></a></li>
  59. <li><a href="#"><i class="fa fa-twitter"></i></a></li>
  60. <li><a href="#"><i class="fa fa-instagram"></i></a></li>
  61. <li><a href="#"><i class="fa fa-pinterest"></i></a></li>
  62. </ul>
  63. </div>
  64. </div>
  65. </div>
  66. </div>
  67. <!-- Top-Bar END -->
  68. <!-- Navbar START -->
  69. <header>
  70. <nav id="navigation4" class="container navigation">
  71. <div class="nav-header">
  72. <a class="nav-brand" href="index.html">
  73. <img src="img/logos/origtek logo.png" class="main-logo" alt="logo" id="main_logo">
  74. </a>
  75. <div class="nav-toggle"></div>
  76. </div>
  77. <div class="nav-menus-wrapper">
  78. <ul class="nav-menu align-to-right">
  79. <li><a href="#">產品</a>
  80. <ul class="nav-dropdown">
  81. <li><a href="about.html">電銷CRM</a></li>
  82. <li><a href="about-2.html">倉儲智能管理系統</a></li>
  83. <li><a href="team.html">軟體業智能管理系統</a></li>
  84. <li><a href="team-2.html">Liferay</a></li>
  85. <li><a href="team-3.html">DB2SYS</a></li>
  86. <li><a href="team-single.html">網頁動態報表外掛</a></li>
  87. <li><a href="partners.html">流程自動化機器人RPA</a></li>
  88. </ul>
  89. </li>
  90. </li>
  91. <li><a href="#">服務</a>
  92. <ul class="nav-dropdown">
  93. <li><a href="about.html">系統開發</a></li>
  94. <li><a href="about-2.html">ERP整合</a></li>
  95. <li><a href="team.html">資訊委外服務</a></li>
  96. <li><a href="team-2.html">Open Source導入</a></li>
  97. <li><a href="team-3.html">社群媒體管理統合</a></li>
  98. </ul>
  99. </li>
  100. <li><a href="#">產業應用</a>
  101. <ul class="nav-dropdown">
  102. <li><a href="services.html">電子產業(ERP整合)</a></li>
  103. <li><a href="services-2.html">物流、倉儲業</a></li>
  104. <li><a href="services-3.html">資訊業管理系統</a></li>
  105. <li><a href="service-detail.html">金流、稅務整合</a></li>
  106. </ul>
  107. </li>
  108. <li><a href="#">關於元赫</a>
  109. <ul class="nav-dropdown">
  110. <li><a href="projects-grid.html">關於元赫</a></li>
  111. <li><a href="projects-masonry-3-column.html">業務合作</a></li>
  112. <li><a href="projects-masonry-4-column.html">客戶案例</a></li>
  113. <li><a href="project-detail.html">人才招募</a></li>
  114. <li><a href="project-detail-2.html">聯絡我們</a></li>
  115. </ul>
  116. </li>
  117. </ul>
  118. </div>
  119. </nav>
  120. </header>
  121. <!-- Navbar END -->
  122. <!-- Slider START -->
  123. <div class="swiper-main-slider-fade swiper-container">
  124. <div class="swiper-wrapper">
  125. <!-- Slide 1 Start -->
  126. <div class="swiper-slide" style="background-image:url(http://via.placeholder.com/1730x550);">
  127. <!-- <div class="medium-overlay"></div> -->
  128. <div class="container">
  129. <div class="slider-content left-holder">
  130. <h2 class="animated fadeInDown">
  131. Creative Consulting Agency <br> For Smart Solutions.
  132. </h2>
  133. <div class="row">
  134. <div class="col-md-6 col-sm-12 col-12">
  135. <p class="animated fadeInDown">
  136. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
  137. tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
  138. quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo.
  139. </p>
  140. </div>
  141. </div>
  142. <div class="animated fadeInUp mt-30">
  143. <a href="#contact" class="dark-button button-md">Contact us</a>
  144. </div>
  145. </div>
  146. </div>
  147. </div>
  148. <!-- Slide 1 End -->
  149. <!-- Slide 2 Start -->
  150. <div class="swiper-slide" style="background-image:url(http://via.placeholder.com/1730x550);">
  151. <div class="container">
  152. <div class="slider-content left-holder">
  153. <h2 class="animated fadeInDown">
  154. We will help to improve<br> your business
  155. </h2>
  156. <div class="row">
  157. <div class="col-md-6 col-sm-12 col-12">
  158. <p class="animated fadeInDown">
  159. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
  160. tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
  161. quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo.
  162. </p>
  163. </div>
  164. </div>
  165. <div class="animated fadeInUp mt-25">
  166. <a href="#contact" class="dark-button button-md">Contact us</a>
  167. </div>
  168. </div>
  169. </div>
  170. </div>
  171. <!-- Slide 2 End -->
  172. <!-- Slide 3 Start -->
  173. <div class="swiper-slide" style="background-image:url(http://via.placeholder.com/1730x550);">
  174. <div class="container">
  175. <div class="slider-content left-holder">
  176. <h2 class="animated fadeInDown">
  177. Building a Succesfull Business
  178. </h2>
  179. <div class="row">
  180. <div class="col-md-6 col-sm-12 col-12">
  181. <p class="animated fadeInDown">
  182. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
  183. tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
  184. quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo.
  185. </p>
  186. </div>
  187. </div>
  188. <div class="animated fadeInUp mt-30">
  189. <a href="#contact" class="dark-button button-md">Contact us</a>
  190. </div>
  191. </div>
  192. </div>
  193. </div>
  194. <!-- Slide 3 End -->
  195. </div>
  196. <!-- Add Arrows -->
  197. <div class="swiper-button-next"></div>
  198. <div class="swiper-button-prev"></div>
  199. <!-- Add Pagination -->
  200. <div class="swiper-pagination"></div>
  201. </div>
  202. <!-- Slider END -->
  203. <!-- Number Boxes START -->
  204. <div class="section-block">
  205. <div class="container">
  206. <div class="section-heading center-holder">
  207. <span>元赫科技原廠開發的iRPA</span>
  208. <h2>互動式機器人流程自動化iRPA系列</h2>
  209. <div class="section-heading-line"></div>
  210. <p>強大功能</p>
  211. </div>
  212. <div class="row mt-50">
  213. <div class="col-md-3 col-sm-6 col-12">
  214. <div class="number-box">
  215. <h3>01</h3>
  216. <div class="number-box-line"></div>
  217. <h4><strong>支援登入任何系統程式</strong></h4>
  218. <p>包含網頁及應用程式</p>
  219. </div>
  220. </div>
  221. <div class="col-md-3 col-sm-6 col-12">
  222. <div class="number-box">
  223. <h3>02</h3>
  224. <div class="number-box-line"></div>
  225. <h4><strong>取/輸出/搬移</strong></h4>
  226. <h4><strong>多種資料類型</strong></h4>
  227. <p>如文件(Office Word、Excel、CSV…)、資料夾創建、轉移、FTP/sFTP、網路芳鄰、雲端空間整合等 </p>
  228. </div>
  229. </div>
  230. <div class="col-md-3 col-sm-6 col-12">
  231. <div class="number-box">
  232. <h3>03</h3>
  233. <div class="number-box-line"></div>
  234. <h4><strong>網頁擷取</strong></h4>
  235. <p>支援文字、影音下載</p>
  236. </div>
  237. </div>
  238. <div class="col-md-3 col-sm-6 col-12">
  239. <div class="number-box">
  240. <h3>04</h3>
  241. <div class="number-box-line"></div>
  242. <h4><strong>可客製化</strong></h4>
  243. <p>跨系統串接、跨系統運算</p>
  244. </div>
  245. </div>
  246. <div class="section-block">
  247. <div class="container">
  248. <div class="section-block">
  249. <div class="container">
  250. <div class="section-heading center-holder">
  251. <span>輸入方式多元</span>
  252. <h2>iRPA是擁有互動性的RPA</h2>
  253. <div class="section-heading-line"></div>
  254. <p>智能化是企業降低成本、提升競爭力的利器。然而智能化的過程並非一蹴可幾,</p>
  255. <p>從系統審視、流程與資料的標準化、系統導入到例外處理,都是需要一步一步與企業同行</p>
  256. </div>
  257. </div>
  258. </div>
  259. </div>
  260. <!-- Number Boxes END -->
  261. <!-- Info Section START -->
  262. <div class="section-block-grey">
  263. <div class="container">
  264. <div class="row">
  265. <div class="col-md-6 col-sm-6 col-12">
  266. <div class="pr-30-md">
  267. <div class="section-heading">
  268. <h4>Welcome To Our Consulting Agency</h4>
  269. </div>
  270. <div class="section-heading-line-left"></div>
  271. <div class="text-content-big mt-20">
  272. <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim
  273. veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
  274. </div>
  275. <div class="mt-20">
  276. <ul class="primary-list">
  277. <li><i class="fa fa-caret-right"></i>Immigration consultant, Information technology consulting</li>
  278. <li><i class="fa fa-caret-right"></i>Consultant pharmacist Creative consultant</li>
  279. <li><i class="fa fa-caret-right"></i>Employment consultant Environmental consultant</li>
  280. </ul>
  281. </div>
  282. <div class="mt-25">
  283. <a href="#" class="primary-button button-sm mb-15-xs">Contact Us</a>
  284. </div>
  285. </div>
  286. </div>
  287. <div class="col-md-6 col-sm-6 col-12">
  288. <img src="http://via.placeholder.com/540x360" class="rounded-border shadow-primary" alt="img">
  289. </div>
  290. </div>
  291. </div>
  292. </div>
  293. <!-- Info Section END -->
  294. <!-- Services START -->
  295. <div class="section-block">
  296. <div class="container">
  297. <div class="section-heading center-holder">
  298. <span>What We Offer</span>
  299. <h3>We Provide All Kind Of Business Services</h3>
  300. <div class="section-heading-line"></div>
  301. <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor <br>incididunt ut labore et dolore magna aliqua.</p>
  302. </div>
  303. <div class="row mt-50">
  304. <div class="col-md-4 col-sm-4 col-12">
  305. <div class="service-simple">
  306. <img src="http://via.placeholder.com/350x245" alt="img">
  307. <div class="service-simple-inner">
  308. <h4>Professional Advisor</h4>
  309. <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
  310. tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam</p>
  311. <div class="service-simple-button">
  312. <a href="#">Learn More</a>
  313. </div>
  314. </div>
  315. </div>
  316. </div>
  317. <div class="col-md-4 col-sm-4 col-12">
  318. <div class="service-simple">
  319. <img src="http://via.placeholder.com/350x245" alt="img">
  320. <div class="service-simple-inner">
  321. <h4>Financial Services Consulting</h4>
  322. <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
  323. tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam</p>
  324. <div class="service-simple-button">
  325. <a href="#">Learn More</a>
  326. </div>
  327. </div>
  328. </div>
  329. </div>
  330. <div class="col-md-4 col-sm-4 col-12">
  331. <div class="service-simple">
  332. <img src="http://via.placeholder.com/350x245" alt="img">
  333. <div class="service-simple-inner">
  334. <h4>Consumer Product Consulting</h4>
  335. <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
  336. tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam</p>
  337. <div class="service-simple-button">
  338. <a href="#">Learn More</a>
  339. </div>
  340. </div>
  341. </div>
  342. </div>
  343. </div>
  344. </div>
  345. </div>
  346. <!-- Services END -->
  347. <!-- Background Section START -->
  348. <div class="section-block-bg" style="background-image: url(http://via.placeholder.com/1730x400);">
  349. <div class="container">
  350. <div class="section-heading center-holder white-color">
  351. <span>Gain a Success With Us!</span>
  352. <h2><strong>Doing the right thing</strong></h2>
  353. <h4>At the Right Time.</h4>
  354. <a href="#" class="primary-button button-md mt-10">Become a Client</a>
  355. </div>
  356. </div>
  357. </div>
  358. <!-- Background Section END -->
  359. <!-- Clients Carousel START -->
  360. <div class="section-clients-grey">
  361. <div class="container">
  362. <div class="owl-carousel owl-theme clients" id="clients">
  363. <div class="item">
  364. <img src="http://via.placeholder.com/155x75" alt="partner-image">
  365. </div>
  366. <div class="item">
  367. <img src="http://via.placeholder.com/155x75" alt="partner-image">
  368. </div>
  369. <div class="item">
  370. <img src="http://via.placeholder.com/155x75" alt="partner-image">
  371. </div>
  372. <div class="item">
  373. <img src="http://via.placeholder.com/155x75" alt="partner-image">
  374. </div>
  375. <div class="item">
  376. <img src="http://via.placeholder.com/155x75" alt="partner-image">
  377. </div>
  378. <div class="item">
  379. <img src="http://via.placeholder.com/155x75" alt="partner-image">
  380. </div>
  381. </div>
  382. </div>
  383. </div>
  384. <!-- Clients Carousel END -->
  385. <!-- Map Info Section START -->
  386. <div class="section-block">
  387. <div class="container">
  388. <div class="row">
  389. <div class="col-md-6 col-sm-6 col-12">
  390. <img src="http://via.placeholder.com/540x270" class="mb-15-xs" alt="map">
  391. </div>
  392. <div class="col-md-5 col-sm-6 col-12 offset-md-1">
  393. <div class="section-heading">
  394. <h5>We are Available Worldwide</h5>
  395. <div class="section-heading-line-left"></div>
  396. </div>
  397. <div class="text-content mt-25">
  398. <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim
  399. veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
  400. </div>
  401. <div class="mt-25">
  402. <a href="#" class="primary-button button-sm">Contact Us</a>
  403. </div>
  404. </div>
  405. </div>
  406. </div>
  407. </div>
  408. <!-- Map Info Section END -->
  409. <!-- Testmonials START -->
  410. <div class="section-block-bg" style="background-image: url(http://via.placeholder.com/1730x630);">
  411. <div class="container">
  412. <div class="section-heading center-holder">
  413. <span>Testmonials</span>
  414. <h3>What People Say</h3>
  415. <div class="section-heading-line"></div>
  416. </div>
  417. <div class="owl-carousel owl-theme" id="testmonials-carousel">
  418. <div class="testmonial-single">
  419. <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
  420. quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
  421. <h4>John Doe</h4>
  422. <h6>Consultant</h6>
  423. </div>
  424. <div class="testmonial-single">
  425. <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
  426. quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
  427. <h4>Mary Kay</h4>
  428. <h6>Design Lead</h6>
  429. </div>
  430. <div class="testmonial-single">
  431. <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
  432. quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
  433. <h4>Jakob Nielsen</h4>
  434. <h6>Networking Lead</h6>
  435. </div>
  436. </div>
  437. </div>
  438. </div>
  439. <!-- Testmonials END -->
  440. <!-- Pricing Section START -->
  441. <div class="section-block">
  442. <div class="container">
  443. <div class="section-heading center-holder">
  444. <span>Our Packages</span>
  445. <h3>Pick The Best Plan For You</h3>
  446. <div class="section-heading-line"></div>
  447. <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor <br>incididunt ut labore et dolore magna aliqua.</p>
  448. </div>
  449. <div class="row mt-50">
  450. <div class="col-md-4 col-sm-4 col-12">
  451. <div class="pricing-list">
  452. <h4>Classic</h4>
  453. <div class="pricing-list-price">
  454. <h2><sup>$</sup>37</h2>
  455. <span>/week</span>
  456. </div>
  457. <ul>
  458. <li>Express, Support</li>
  459. <li>Business Analyzing</li>
  460. <li>Swift Management</li>
  461. </ul>
  462. <div class="pricing-list-button">
  463. <a href="#">Buy Now</a>
  464. </div>
  465. </div>
  466. </div>
  467. <div class="col-md-4 col-sm-4 col-12">
  468. <div class="pricing-list">
  469. <strong>New</strong>
  470. <h4>Popular</h4>
  471. <div class="pricing-list-price">
  472. <h2><sup>$</sup>79</h2>
  473. <span>/month</span>
  474. </div>
  475. <ul>
  476. <li>Express, Support</li>
  477. <li>Business Analyzing</li>
  478. <li>Swift Management</li>
  479. </ul>
  480. <div class="pricing-list-button">
  481. <a href="#">Buy Now</a>
  482. </div>
  483. </div>
  484. </div>
  485. <div class="col-md-4 col-sm-4 col-12">
  486. <div class="pricing-list">
  487. <h4>Premium</h4>
  488. <div class="pricing-list-price">
  489. <h2><sup>$</sup>99</h2>
  490. <span>/month</span>
  491. </div>
  492. <ul>
  493. <li>Express, Support</li>
  494. <li>Business Analyzing</li>
  495. <li>Swift Management</li>
  496. </ul>
  497. <div class="pricing-list-button">
  498. <a href="#">Buy Now</a>
  499. </div>
  500. </div>
  501. </div>
  502. </div>
  503. </div>
  504. </div>
  505. <!-- Pricing Section END -->
  506. <!-- Newsletter START -->
  507. <div class="section-block-parallax" style="background-image: url(http://via.placeholder.com/1730x6400);">
  508. <div class="container">
  509. <div class="section-heading center-holder white-color">
  510. <h2>Stay <strong>informed</strong></h2>
  511. <div class="section-heading-line"></div>
  512. <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor<br> incididunt ut labore et dolore magna aliqua.</p>
  513. </div>
  514. <div class="mt-30 center-holder">
  515. <!-- Newsletter Form START -->
  516. <form class="newsletter-form" method="post" action="#">
  517. <input type="email" name="email" placeholder="Enter Your Email adress">
  518. <button type="submit">Subscribe</button>
  519. </form>
  520. <!-- Newsletter Form END -->
  521. </div>
  522. </div>
  523. </div>
  524. <!-- Newsletter END -->
  525. <!-- Progress Bars Section START -->
  526. <div class="section-block">
  527. <div class="container">
  528. <div class="row">
  529. <div class="col-md-6 col-sm-6 col-12">
  530. <div class="section-heading">
  531. <span>Our mission</span>
  532. <h4>Our Mission is to Turn Your Ideas Into Businesses.</h4>
  533. </div>
  534. <div class="text-content">
  535. <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim
  536. veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
  537. </div>
  538. </div>
  539. <div class="col-md-5 col-sm-6 col-12 offset-md-1">
  540. <!-- PROGRESS BARS Start -->
  541. <div class="mt-35">
  542. <!-- Progress Bar Start -->
  543. <div class="progress-text">
  544. <div class="row">
  545. <div class="col-md-6 col-sm-6 col-6">
  546. Market Research
  547. </div>
  548. <div class="col-md-6 col-sm-6 col-6 text-right">
  549. 10%
  550. </div>
  551. </div>
  552. </div>
  553. <div class="progress custom-progress">
  554. <div class="progress-bar custom-bar wow slideInLeft animated" role="progressbar" aria-valuenow="10" aria-valuemin="0" aria-valuemax="100"
  555. style="width:10%">
  556. </div>
  557. </div>
  558. <!-- Progress Bar End -->
  559. <!-- Progress Bar Start -->
  560. <div class="progress-text">
  561. <div class="row">
  562. <div class="col-md-6 col-sm-6 col-6">
  563. Sales Services
  564. </div>
  565. <div class="col-md-6 col-sm-6 col-6 text-right">
  566. 25%
  567. </div>
  568. </div>
  569. </div>
  570. <div class="progress custom-progress">
  571. <div class="progress-bar custom-bar wow slideInLeft animated" role="progressbar" aria-valuenow="70" aria-valuemin="0" aria-valuemax="100"
  572. style="width:25%">
  573. </div>
  574. </div>
  575. <!-- Progress Bar End -->
  576. <!-- Progress Bar Start -->
  577. <div class="progress-text">
  578. <div class="row">
  579. <div class="col-md-6 col-sm-6 col-6">
  580. Online Reputation
  581. </div>
  582. <div class="col-md-6 col-sm-6 col-6 text-right">
  583. 50%
  584. </div>
  585. </div>
  586. </div>
  587. <div class="progress custom-progress">
  588. <div class="progress-bar custom-bar wow slideInLeft animated" role="progressbar" aria-valuenow="70" aria-valuemin="0" aria-valuemax="100"
  589. style="width:50%">
  590. </div>
  591. </div>
  592. <!-- Progress Bar End -->
  593. <!-- Progress Bar Start -->
  594. <div class="progress-text">
  595. <div class="row">
  596. <div class="col-md-6 col-sm-6 col-6">
  597. Strategic Consulting
  598. </div>
  599. <div class="col-md-6 col-sm-6 col-6 text-right">
  600. 75%
  601. </div>
  602. </div>
  603. </div>
  604. <div class="progress custom-progress">
  605. <div class="progress-bar custom-bar wow slideInLeft animated" role="progressbar" aria-valuenow="70" aria-valuemin="0" aria-valuemax="100"
  606. style="width:75%">
  607. </div>
  608. </div>
  609. <!-- Progress Bar End -->
  610. </div>
  611. <!-- PROGRESS BARS End -->
  612. </div>
  613. </div>
  614. </div>
  615. </div>
  616. <!-- Progress Bars Section END -->
  617. <!-- Cases START -->
  618. <div class="section-block-grey border-top">
  619. <div class="container">
  620. <div class="section-heading">
  621. <h5>Featured Cases</h5>
  622. <div class="section-heading-line-left"></div>
  623. </div>
  624. <div class="row mt-40">
  625. <!-- Project Block Start -->
  626. <div class="col-md-6 col-sm-12 col-12">
  627. <div class="case-block">
  628. <div class="row">
  629. <div class="col-md-6 col-sm-6 col-12 pr-0">
  630. <img src="http://via.placeholder.com/270x215" alt="case">
  631. </div>
  632. <div class="col-md-6 col-sm-6 col-12">
  633. <div class="case-block-inner">
  634. <h4>Social Media Marketting</h4>
  635. <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt.</p>
  636. <a href="#">Learn More</a>
  637. </div>
  638. </div>
  639. </div>
  640. </div>
  641. </div>
  642. <!-- Project Block End -->
  643. <!-- Project Block Start -->
  644. <div class="col-md-6 col-sm-12 col-12">
  645. <div class="case-block">
  646. <div class="row">
  647. <div class="col-md-6 col-sm-6 col-12 pr-0">
  648. <img src="http://via.placeholder.com/270x215" alt="case">
  649. </div>
  650. <div class="col-md-6 col-sm-6 col-12">
  651. <div class="case-block-inner">
  652. <h4>Sensitivity Analysis</h4>
  653. <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt.</p>
  654. <a href="#">Learn More</a>
  655. </div>
  656. </div>
  657. </div>
  658. </div>
  659. </div>
  660. <!-- Project Block End -->
  661. <!-- Project Block Start -->
  662. <div class="col-md-6 col-sm-12 col-12">
  663. <div class="case-block">
  664. <div class="row">
  665. <div class="col-md-6 col-sm-6 col-12 pr-0">
  666. <img src="http://via.placeholder.com/270x215" alt="case">
  667. </div>
  668. <div class="col-md-6 col-sm-6 col-12">
  669. <div class="case-block-inner">
  670. <h4>Project Governances</h4>
  671. <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt.</p>
  672. <a href="#">Learn More</a>
  673. </div>
  674. </div>
  675. </div>
  676. </div>
  677. </div>
  678. <!-- Project Block End -->
  679. <!-- Project Block Start -->
  680. <div class="col-md-6 col-sm-12 col-12">
  681. <div class="case-block">
  682. <div class="row">
  683. <div class="col-md-6 col-sm-6 col-12 pr-0">
  684. <img src="http://via.placeholder.com/270x215" alt="case">
  685. </div>
  686. <div class="col-md-6 col-sm-6 col-12">
  687. <div class="case-block-inner">
  688. <h4>Market Assessment</h4>
  689. <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt.</p>
  690. <a href="#">Learn More</a>
  691. </div>
  692. </div>
  693. </div>
  694. </div>
  695. </div>
  696. <!-- Project Block End -->
  697. </div>
  698. </div>
  699. </div>
  700. <!-- Cases END -->
  701. <!-- Notice Section START -->
  702. <div class="notice-section notice-section-sm border-top">
  703. <div class="container">
  704. <div class="row">
  705. <div class="col-md-8 col-sm-8 col-12">
  706. <div class="mt-5">
  707. <h6>Looking for Professional Approach and Quality Services ?</h6>
  708. <div class="section-heading-line-left"></div>
  709. </div>
  710. </div>
  711. <div class="col-md-4 col-sm-4 col-12">
  712. <div class="mt-10 right-holder-md">
  713. <a href="#" class="primary-button button-sm mt-15-xs">Contact Us Today</a>
  714. </div>
  715. </div>
  716. </div>
  717. </div>
  718. </div>
  719. <!-- Notice Section END -->
  720. <!-- Footer START -->
  721. <footer>
  722. <div class="container">
  723. <div class="row">
  724. <!-- Column 1 Start -->
  725. <div class="col-md-4 col-sm-6 col-12">
  726. <h3>About Us</h3>
  727. <div class="mt-25">
  728. <img src="img/logos/logo-footer.png" alt="footer-logo">
  729. <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
  730. ad minim veniam.</p>
  731. <div class="footer-social-icons mt-25">
  732. <ul>
  733. <li><a href="#"><i class="fa fa-facebook-square"></i></a></li>
  734. <li><a href="#"><i class="fa fa-instagram"></i></a></li>
  735. <li><a href="#"><i class="fa fa-pinterest"></i></a></li>
  736. <li><a href="#"><i class="fa fa-skype"></i></a></li>
  737. <li><a href="#"><i class="fa fa-youtube"></i></a></li>
  738. </ul>
  739. </div>
  740. </div>
  741. </div>
  742. <!-- Column 1 End -->
  743. <!-- Column 2 Start -->
  744. <div class="col-md-3 col-sm-6 col-12">
  745. <h3>Quick Links</h3>
  746. <ul class="footer-list">
  747. <li><a href="#">Strategic Consulting</a></li>
  748. <li><a href="#">Sales Services</a></li>
  749. <li><a href="#">Market Research</a></li>
  750. <li><a href="#">Online Reputation</a></li>
  751. <li><a href="#">Strategic Consulting</a></li>
  752. <li><a href="#">Sales Services</a></li>
  753. <li><a href="#">Market Research</a></li>
  754. </ul>
  755. </div>
  756. <!-- Column 2 End -->
  757. <!-- Column 3 Start -->
  758. <div class="col-md-3 col-sm-6 col-12">
  759. <h3>Recent Posts</h3>
  760. <div class="mt-25">
  761. <!-- Post Start -->
  762. <div class="footer-recent-post clearfix">
  763. <div class="footer-recent-post-thumb">
  764. <img src="http://via.placeholder.com/65x65" alt="img">
  765. </div>
  766. <div class="footer-recent-post-content">
  767. <span>February 7, 2018</span>
  768. <a href="#">Advices for young designers</a>
  769. </div>
  770. </div>
  771. <!-- Post End -->
  772. <!-- Post Start -->
  773. <div class="footer-recent-post clearfix">
  774. <div class="footer-recent-post-thumb">
  775. <img src="http://via.placeholder.com/65x65" alt="img">
  776. </div>
  777. <div class="footer-recent-post-content">
  778. <span>February 7, 2018</span>
  779. <a href="#">What Planning Process Needs?</a>
  780. </div>
  781. </div>
  782. <!-- Post End -->
  783. <!-- Post Start -->
  784. <div class="footer-recent-post clearfix">
  785. <div class="footer-recent-post-thumb">
  786. <img src="http://via.placeholder.com/65x65" alt="img">
  787. </div>
  788. <div class="footer-recent-post-content">
  789. <span>February 7, 2018</span>
  790. <a href="#">Lorem ipsum dolor sit amet.</a>
  791. </div>
  792. </div>
  793. <!-- Post End -->
  794. </div>
  795. </div>
  796. <!-- Column 3 End -->
  797. <!-- Column 4 Start -->
  798. <div class="col-md-2 col-sm-6 col-12">
  799. <h3>Tags</h3>
  800. <div class="footer-tags mt-25">
  801. <a href="#">Business</a>
  802. <a href="#">Conusltant</a>
  803. <a href="#">Coach</a>
  804. <a href="#">UX</a>
  805. <a href="#">API</a>
  806. <a href="#">Reputation</a>
  807. <a href="#">Research</a>
  808. <a href="#">Sale</a>
  809. <a href="#">Service</a>
  810. <a href="#">UI</a>
  811. <a href="#">Web</a>
  812. <a href="#">WebDesign</a>
  813. </div>
  814. </div>
  815. <!-- Column 4 End -->
  816. </div>
  817. <!-- Footer Bar Start -->
  818. <div class="footer-bar">
  819. <p><span class="primary-color">SpecThemes</span> © 2018. All Rights Reserved.</p>
  820. </div>
  821. <!-- Footer Bar End -->
  822. </div>
  823. </footer>
  824. <!-- Footer END -->
  825. <!-- Scroll to top button Start -->
  826. <a href="#" class="scroll-to-top"><i class="fa fa-angle-up" aria-hidden="true"></i></a>
  827. <!-- Scroll to top button End -->
  828. <!-- Jquery -->
  829. <script src="js/jquery.min.js"></script>
  830. <!--Popper JS-->
  831. <script src="js/popper.min.js"></script>
  832. <!--Popper JS-->
  833. <script src="js/popper.min.js"></script>
  834. <!-- Bootstrap JS-->
  835. <script src="js/bootstrap.min.js"></script>
  836. <!-- Owl Carousel-->
  837. <script src="js/owl.carousel.js"></script>
  838. <!-- Navbar JS -->
  839. <script src="js/navigation.js"></script>
  840. <script src="js/navigation.fixed.js"></script>
  841. <!-- Wow JS -->
  842. <script src="js/wow.min.js"></script>
  843. <!-- Countup -->
  844. <script src="js/jquery.counterup.min.js"></script>
  845. <script src="js/waypoints.min.js"></script>
  846. <!-- Tabs -->
  847. <script src="js/tabs.min.js"></script>
  848. <!-- Yotube Video Player -->
  849. <script src="js/jquery.mb.YTPlayer.min.js"></script>
  850. <!-- Swiper Slider -->
  851. <script src="js/swiper.min.js"></script>
  852. <!-- Isotop -->
  853. <script src="js/isotope.pkgd.min.js"></script>
  854. <!-- Switcher JS -->
  855. <script src="js/switcher.js"></script>
  856. <!-- Modernizr -->
  857. <script src="js/modernizr.js"></script>
  858. <!-- Google Map -->
  859. <script src="js/map.js"></script>
  860. <!-- Main JS -->
  861. <script src="js/main.js"></script>
  862. </body>
  863. </html>