index.html 46 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <!-- Basic Page Needs -->
  5. <meta charset="utf-8">
  6. <meta http-equiv="X-UA-Compatible" content="IE=edge">
  7. <meta name="description" content="Offshore - Responsive HTML Template">
  8. <meta name="author" content="Surjith S.M">
  9. <!-- Page Title -->
  10. <title> Offshore - Responsive Gas &amp; Oil Industry HTML Template </title>
  11. <!-- Favicon -->
  12. <link rel="icon" type="image/png" href="favicon.png">
  13. <!-- Mobile Specific Metas -->
  14. <meta name="viewport" content="width=device-width, initial-scale=1">
  15. <!-- Bootstrap core CSS -->
  16. <link href="css/bootstrap.min.css" rel="stylesheet">
  17. <!-- Font Awesome CSS -->
  18. <link rel="stylesheet" href="fonts/font-awesome/css/font-awesome.min.css">
  19. <!-- Flex Slider -->
  20. <link rel="stylesheet" href="css/flexslider.css">
  21. <!-- Owl Carousel -->
  22. <link rel="stylesheet" href="css/owl.carousel.min.css">
  23. <link rel="stylesheet" href="css/owl.theme.min.css">
  24. <!-- Custom styles for this template -->
  25. <link href="css/style.css" rel="stylesheet">
  26. </head>
  27. <body class="homepage">
  28. <!-- Preloader -->
  29. <div class="loader-wrapper">
  30. <div class="sk-cube-grid">
  31. <div class="sk-cube sk-cube1"></div>
  32. <div class="sk-cube sk-cube2"></div>
  33. <div class="sk-cube sk-cube3"></div>
  34. <div class="sk-cube sk-cube4"></div>
  35. <div class="sk-cube sk-cube5"></div>
  36. <div class="sk-cube sk-cube6"></div>
  37. <div class="sk-cube sk-cube7"></div>
  38. <div class="sk-cube sk-cube8"></div>
  39. <div class="sk-cube sk-cube9"></div>
  40. </div>
  41. </div>
  42. <!-- Page Wrapper -->
  43. <div class="wrapper">
  44. <!-- Header Section -->
  45. <header>
  46. <div class="header-area">
  47. <!-- Top Contact Info -->
  48. <div class="row logo-top-info">
  49. <div class="container">
  50. <div class="col-md-3 logo">
  51. <!-- Main Logo -->
  52. <a href="index.html"><img src="images/logo.png" alt="Offshore Logo" /></a>
  53. <!-- Responsive Toggle Menu -->
  54. <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#navbar">
  55. <span class="sr-only"> Main Menu </span>
  56. <span class="icon-bar"></span>
  57. <span class="icon-bar"></span>
  58. <span class="icon-bar"></span>
  59. </button>
  60. </div>
  61. <div class="col-md-9 top-info-social">
  62. <div class="pull-right">
  63. <div class="top-info">
  64. <div class="call">
  65. <h3> CALL US </h3>
  66. <p> 1800 425 4646 </p>
  67. </div>
  68. <div class="email">
  69. <h3> EMAIL US </h3>
  70. <p> info@offshoreinsustry.com </p>
  71. </div>
  72. <div class="market">
  73. <h3> MARKET </h3>
  74. <p> 256.78 <span class="forex"> <i class="fa fa-caret-up" aria-hidden="true"></i> + 4.26 </span> </p>
  75. </div>
  76. </div>
  77. <div class="social">
  78. <ul class="social-icons">
  79. <li><a href="#"><i class="fa fa-facebook" aria-hidden="true"></i></a></li>
  80. <li><a href="#"><i class="fa fa-twitter" aria-hidden="true"></i></a></li>
  81. <li><a href="#"><i class="fa fa-linkedin" aria-hidden="true"></i></a></li>
  82. </ul>
  83. </div>
  84. </div>
  85. </div>
  86. </div>
  87. </div>
  88. <!-- Main Navigation Section -->
  89. <nav id="navbar" class="collapse navbar-collapse main-menu">
  90. <div class="container">
  91. <ul class="main-menu">
  92. <li class="active"> <a href="index.html"> Home </a></li>
  93. <li class="dropdown"> <a href="#" data-toggle="dropdown"> About
  94. <i class="fa fa-chevron-down dropdown-toggle"> </i> </a>
  95. <ul>
  96. <li> <a href="about.html"> The Company </a> </li>
  97. <li> <a href="mission.html"> Vision &amp; Mission </a> </li>
  98. <li> <a href="approach.html"> Our Approach </a> </li>
  99. <li> <a href="leaders.html"> Our Team </a> </li>
  100. </ul>
  101. </li>
  102. <li class="dropdown"><a href="#" data-toggle="dropdown"> Services
  103. <i class="fa fa-chevron-down dropdown-toggle"> </i> </a>
  104. <ul>
  105. <li> <a href="services.html"> Services List </a> </li>
  106. <li> <a href="services-list.html"> Services List Fullwidth </a> </li>
  107. <li> <a href="services-single.html"> Services Single </a> </li>
  108. <li> <a href="services-full-width.html"> Services Full Width </a> </li>
  109. </ul>
  110. </li>
  111. <li><a href="technology.html"> Technology </a> </li>
  112. <li><a href="blog.html"> News &amp; Media </a> </li>
  113. <li class="dropdown"> <a href="#" data-toggle="dropdown"> Pages
  114. <i class="fa fa-chevron-down dropdown-toggle"> </i> </a>
  115. <ul>
  116. <li> <a href="blog.html"> Blog </a> </li>
  117. <li> <a href="blog-single.html"> Blog Single </a> </li>
  118. <li> <a href="careers-single.html"> Careers Single </a> </li>
  119. <li> <a href="shortcodes.html"> Shortcodes </a> </li>
  120. <li> <a href="404.html"> 404 page </a> </li>
  121. <li> <a href="blank-page.html"> Blank Page </a> </li>
  122. </ul>
  123. </li>
  124. <li><a href="careers.html"> CAREERS </a> </li>
  125. <li><a href="contact.html"> CONTACT </a> </li>
  126. </ul>
  127. </div>
  128. </nav>
  129. </div>
  130. </header>
  131. <!-- Header Section -->
  132. <!-- Main Content Section -->
  133. <main class="main">
  134. <section class="home-slider">
  135. <div class="flexslider">
  136. <ul class="slides">
  137. <li class="has-overlay">
  138. <img src="images/slider1.jpg" alt="Slider 1" />
  139. <div class="slider-content">
  140. <div class="container">
  141. <h2> Targeting high impact exploration <br> Offshore Industry </h2>
  142. <p> Holisticly brand sustainable solutions rather than clicks-and-mortar applications.
  143. <br> Phosfluorescently whiteboard fully tested initiatives. </p>
  144. <a class="btn primary-btn"> KNOW MORE <i class="fa fa-angle-right"></i> </a>
  145. </div>
  146. </div>
  147. </li>
  148. <li class="has-overlay">
  149. <img src="images/slider2.jpg" alt="Slider 2" />
  150. <div class="slider-content text-center">
  151. <div class="container">
  152. <h2>Most sophisticated Storage &amp; Transport</h2>
  153. <p> Quickly disintermediate collaborative web services via high standards in products.
  154. <br> Compellingly fabricate cutting-edge portals through alternative
  155. <br> opportunities. Objectively customize.</p>
  156. <a class="btn primary-btn"> KNOW MORE <i class="fa fa-angle-right"></i> </a>
  157. </div>
  158. </div>
  159. </li>
  160. </ul>
  161. </div>
  162. </section>
  163. <section class="home-company">
  164. <div class="container">
  165. <div class="row company">
  166. <div class="col-md-5 col-sm-8">
  167. <div class="company-details">
  168. <h2 class="company-title color-title"> THE COMPANY </h2>
  169. <h4 class="company-subtitle subtitle"> Interactively empower diverse imperatives after prospective convergence. </h4>
  170. <p> Assertively productize efficient partnerships through customer directed supply chains. Continually maintain process-centric catalysts for change via backward compatible value. </p>
  171. <a href="#" class="btn btn-primary" role="button"> READ OUR MISSION </a>
  172. </div>
  173. </div>
  174. <div class="col-md-7 col-sm-12">
  175. <div class="company-image">
  176. <div class="img-left hover-effect">
  177. <img src="images/company-image2.jpg" alt="Company Image" />
  178. </div>
  179. <div class="img-right hover-effect">
  180. <img src="images/company-image1.jpg" alt="Company Image" />
  181. </div>
  182. </div>
  183. </div>
  184. </div>
  185. </div>
  186. </section>
  187. <section class="home-ceo">
  188. <div class="container">
  189. <div class="row ceo">
  190. <div class="col-md-6">
  191. <div class="ceo-photo">
  192. <img src="images/ceo.png" alt="CEO" />
  193. </div>
  194. </div>
  195. <div class="col-md-6">
  196. <div class="ceo-details">
  197. <h2 class="ceo-title color-title"> WORD FROM CEO </h2>
  198. <h4 class="ceo-subtitle subtitle"> READ THE MESSAGE FROM OUR CEO </h4>
  199. <p> Proactively incubate enterprise total linkage without sustainable leadership skills. Monotonectally strategize user-centric interfaces whereas low-risk high-yield materials. Efficiently syndicate web-enabled portals for principle centered partnerships.
  200. </p>
  201. <p>Proactively whiteboard revolutionary processes after scalable testing procedures. Holisticly reinvent seamless after business.</p>
  202. <h4 class="ceo-sign"> <img src="images/ceo-sign.png" alt="signature" /> </h4>
  203. <p class="ceo-name">Gregory Walker, CEO</p>
  204. </div>
  205. </div>
  206. </div>
  207. </div>
  208. </section>
  209. <section class="home-services">
  210. <div class="container">
  211. <div class="row services">
  212. <div class="col-md-4">
  213. <div class="hover-effect">
  214. <img src="images/services-one.jpg" alt="technology-innovation" />
  215. </div>
  216. <h4 class="services-title-one subtitle">TECHNOLOGY &amp; INNOVATION</h4>
  217. <p>Professionally drive clicks-and-mortar web readiness after progressive e-commerce. Dramatically unleash cross functional.</p>
  218. <a href="#" class="btn btn-default btn-normal">Read More</a>
  219. </div>
  220. <div class="col-md-4">
  221. <div class="hover-effect">
  222. <img src="images/services-two.jpg" alt="our-operations" />
  223. </div>
  224. <h4 class="services-title-one subtitle">OUR OPERATIONS</h4>
  225. <p>Energistically productize wireless mindshare for emerging experiences. Myocardinate enabled alignments and magnetic scenarios. </p>
  226. <a href="#" class="btn btn-default btn-normal">Read More</a>
  227. </div>
  228. <div class="col-md-4">
  229. <div class="hover-effect">
  230. <img src="images/services-three.jpg" alt="social-resposibility" />
  231. </div>
  232. <h4 class="services-title-one subtitle">SOCIAL RESPONIBILITY</h4>
  233. <p>Globally incubate principle-centered e-markets with standards compliant catalysts for change. Efficiently extend highly efficient products.</p>
  234. <a href="#" class="btn btn-default btn-normal">Read More</a>
  235. </div>
  236. </div>
  237. </div>
  238. </section>
  239. <section class="home-links">
  240. <div class="container">
  241. <div class="row links">
  242. <div class="col-md-2">
  243. <h4 class="links-title subtitle">Quick Links</h4>
  244. </div>
  245. <div class="col-md-2">
  246. <a href="#" class="btn btn-primary" role="button">CAREERS</a>
  247. </div>
  248. <div class="col-md-2">
  249. <a href="#" class="btn btn-primary" role="button">CONTACT</a>
  250. </div>
  251. <div class="col-md-2">
  252. <a href="#" class="btn btn-primary" role="button">MARKET INFO</a>
  253. </div>
  254. <div class="col-md-2">
  255. <a href="#" class="btn btn-primary" role="button">TECHNOLOGY</a>
  256. </div>
  257. <div class="col-md-2">
  258. <a href="#" class="btn btn-primary" role="button">LATEST NEWS</a>
  259. </div>
  260. </div>
  261. </div>
  262. </section>
  263. <section class="home-process">
  264. <div class="container">
  265. <div class="row process">
  266. <div class="col-sm-6">
  267. <h2 class="process-title title-2"> OUR PROCESS </h2>
  268. <h4 class="process-subtitle subtitle-2"> Interactively empower diverse imperatives after prospective convergence. </h4>
  269. <p> Interactively fashion functional action items after 24/365 results. Dynamically redefine world-class metrics without leading-edge markets. Progressively orchestrate enabled "outside the box" thinking via scalable quality vectors. Objectively unleash optimal core competencies. </p>
  270. <a href="#" class="btn btn-primary" role="button">READ THE STORY</a>
  271. </div>
  272. <div class="col-sm-6">
  273. <div id="skills" class="process-bar">
  274. <div class="skillbar-title"> FEUL AND MISCELLANEOUS </div>
  275. <div class="skillbar" data-percent="46%">
  276. <div class="skillbar-bar"> </div>
  277. <div class="skill-bar-percent">46%</div>
  278. </div>
  279. <div class="skillbar-title"> LIQUID CHEMICALS </div>
  280. <div class="skillbar" data-percent="78%">
  281. <div class="skillbar-bar"> </div>
  282. <div class="skill-bar-percent">78%</div>
  283. </div>
  284. <div class="skillbar-title"> MONOMERS / POLYMERS </div>
  285. <div class="skillbar" data-percent="70%">
  286. <div class="skillbar-bar"> </div>
  287. <div class="skill-bar-percent">70%</div>
  288. </div>
  289. <div class="skillbar-title"> ISOCYANATE </div>
  290. <div class="skillbar" data-percent="80%">
  291. <div class="skillbar-bar"> </div>
  292. <div class="skill-bar-percent">80%</div>
  293. </div>
  294. </div>
  295. </div>
  296. </div>
  297. </div>
  298. </section>
  299. <section class="home-stats">
  300. <div class="container">
  301. <div class="row stats">
  302. <div class="col-md-3 col-xs-6">
  303. <img src="images/globe.png" alt="" />
  304. <div class="stats-info">
  305. <h4 class="counter">26</h4>
  306. <p>Offices Worldwide</p>
  307. </div>
  308. </div>
  309. <div class="col-md-3 col-xs-6">
  310. <img src="images/friends.png" alt="" />
  311. <div class="stats-info">
  312. <h4 class="counter">10000</h4>
  313. <p>Satisfied Employees</p>
  314. </div>
  315. </div>
  316. <div class="col-md-3 col-xs-6">
  317. <img src="images/fire.png" alt="" />
  318. <div class="stats-info">
  319. <h4 class="counter">126</h4>
  320. <p>Refineries &amp; Operations</p>
  321. </div>
  322. </div>
  323. <div class="col-md-3 col-xs-6">
  324. <img src="images/badge.png" alt="" />
  325. <div class="stats-info">
  326. <h4 class="counter">35</h4>
  327. <p>Awards &amp; Recognitions</p>
  328. </div>
  329. </div>
  330. </div>
  331. </div>
  332. </section>
  333. <section class="home-services-other">
  334. <div class="container">
  335. <div class="section-title text-center">
  336. <h2 class="title-services-other title-2">SERVICES</h2>
  337. <h4 class="subtitle-services-other subtitle-2">Objectively whiteboard transparent models for prospective <br/> information. Authoritatively myocardinate.</h4>
  338. <div class="spacer-50"> </div>
  339. </div>
  340. <div class="row services-other">
  341. <div class="col-sm-4">
  342. <div class="img-box">
  343. <img src="images/service-icon1.png" alt="SHELL CHEMICALS" />
  344. </div>
  345. <div class="services-info">
  346. <h4 class="services-title-one subtitle">SHELL CHEMICALS</h4>
  347. <p>Lorem ipsum dolor sit amet, con tetur adipiscing elit agenean.</p>
  348. </div>
  349. </div>
  350. <div class="col-sm-4">
  351. <div class="img-box">
  352. <img src="images/service-icon2.png" alt="COMMERCIAL FUELS" />
  353. </div>
  354. <div class="services-info">
  355. <h4 class="services-title-one subtitle">COMMERCIAL FUELS</h4>
  356. <p>Lorem ipsum dolor sit amet, con tetur adipiscing elit agenean.</p>
  357. </div>
  358. </div>
  359. <div class="col-sm-4">
  360. <div class="img-box">
  361. <img src="images/service-icon3.png" alt="AVIATION FUELS" />
  362. </div>
  363. <div class="services-info">
  364. <h4 class="services-title-one subtitle">AVIATION FUELS</h4>
  365. <p>Lorem ipsum dolor sit amet, con tetur adipiscing elit agenean.</p>
  366. </div>
  367. </div>
  368. <div class="clearfix spacer-70"></div>
  369. <div class="col-sm-4">
  370. <div class="img-box">
  371. <img src="images/service-icon4.png" alt="LUBRICANTS" />
  372. </div>
  373. <div class="services-info">
  374. <h4 class="services-title-one subtitle">LUBRICANTS</h4>
  375. <p>Lorem ipsum dolor sit amet, con tetur adipiscing elit agenean.</p>
  376. </div>
  377. </div>
  378. <div class="col-sm-4">
  379. <div class="img-box">
  380. <img src="images/service-icon5.png" alt="MARINE FUELS" />
  381. </div>
  382. <div class="services-info">
  383. <h4 class="services-title-one subtitle">MARINE FUELS</h4>
  384. <p>Lorem ipsum dolor sit amet, con tetur adipiscing elit agenean.</p>
  385. </div>
  386. </div>
  387. <div class="col-sm-4">
  388. <div class="img-box">
  389. <img src="images/service-icon6.png" alt="LIQUIFIED PETROLIUM GAS" />
  390. </div>
  391. <div class="services-info">
  392. <h4 class="services-title-one subtitle">LIQUIFIED PETROLIUM GAS</h4>
  393. <p>Lorem ipsum dolor sit amet, con tetur adipiscing elit agenean.</p>
  394. </div>
  395. </div>
  396. <div class="clearfix spacer-70"></div>
  397. <div class="col-sm-4">
  398. <div class="img-box">
  399. <img src="images/service-icon7.png" alt="SHELL SULPHUR" /></div>
  400. <div class="services-info">
  401. <h4 class="services-title-one subtitle">SHELL SULPHUR</h4>
  402. <p>Lorem ipsum dolor sit amet, con tetur adipiscing elit agenean.</p>
  403. </div>
  404. </div>
  405. <div class="col-sm-4">
  406. <div class="img-box">
  407. <img src="images/service-icon8.png" alt="SHELL TRADING" /></div>
  408. <div class="services-info">
  409. <h4 class="services-title-one subtitle">SHELL TRADING</h4>
  410. <p>Lorem ipsum dolor sit amet, con tetur adipiscing elit agenean.</p>
  411. </div>
  412. </div>
  413. <div class="col-sm-4">
  414. <div class="img-box">
  415. <img src="images/service-icon9.png" alt="SHELL FOR SUPPLIERS" /></div>
  416. <div class="services-info">
  417. <h4 class="services-title-one subtitle">SHELL FOR SUPPLIERS</h4>
  418. <p>Lorem ipsum dolor sit amet, con tetur adipiscing elit agenean.</p>
  419. </div>
  420. </div>
  421. </div>
  422. </div>
  423. </section>
  424. <section class="home-testimonials">
  425. <div class="container">
  426. <div class="section-title text-center">
  427. <h2 class="title-testimonials color-title">DON’T TAKE OUR WORD</h2>
  428. <h2 class="subtitle-testimonials title-2">CLIENT TESTIMONIALS</h2>
  429. <div class="spacer-50"> </div>
  430. </div>
  431. <div class="row">
  432. <div class="col-md-4">
  433. <blockquote>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean eget leo ac nisi porta consectetur. Duis sit amet ligula turpis. Suspendisse eget hendrerit justo. Suspendisse elementum eleifend arcu in consequat. Nullam imperdiet, mauris a consequat pharetra, quam quam malesuada nisi, non scelerisque.</blockquote>
  434. <h4 class="client-name">Calvin Sims</h4>
  435. <p class="designation">Marketing Head, ABC Chemicals</p>
  436. </div>
  437. <div class="col-md-4">
  438. <blockquote>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean eget leo ac nisi porta consectetur. Duis sit amet ligula turpis. Suspendisse eget hendrerit justo. Suspendisse elementum eleifend arcu in consequat. Nullam imperdiet, mauris a consequat pharetra, quam quam malesuada nisi, non scelerisque.</blockquote>
  439. <h4 class="client-name">Bertha Gonzales</h4>
  440. <p class="designation">Divisional Manager, Corpo Inc.</p>
  441. </div>
  442. <div class="col-md-4">
  443. <blockquote>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean eget leo ac nisi porta consectetur. Duis sit amet ligula turpis. Suspendisse eget hendrerit justo. Suspendisse elementum eleifend arcu in consequat. Nullam imperdiet, mauris a consequat pharetra, quam quam malesuada nisi, non scelerisque.</blockquote>
  444. <h4 class="client-name">Brianna Hernandez</h4>
  445. <p class="designation">Founder &amp; CEO, Marine Engineering</p>
  446. </div>
  447. </div>
  448. </div>
  449. </section>
  450. <section class="home-publications">
  451. <div class="container">
  452. <div class="row publications">
  453. <div class="col-md-7 col-sm-6">
  454. <div class="panel-group" id="accordion">
  455. <div class="panel panel-default">
  456. <div class="panel-heading">
  457. <h4 class="panel-title">
  458. <a data-toggle="collapse" data-parent="#accordion" href="#collapseOne">Petrolium Engineering</a>
  459. </h4>
  460. </div>
  461. <div id="collapseOne" class="panel-collapse collapse in">
  462. <div class="panel-body">
  463. <p>Synergistically build professional communities vis-a-vis best-of-breed paradigms. Quickly empower world-class networks with prospective methodologies. Enthusiastically morph cross functional web-readiness via virtual niche markets. Synergistically enhance one-to-one partnerships after go forward metrics. Competently facilitate alternative networks for fully tested internal or "organic" sources. Synergistically disintermediate an expanded array of niche markets through value-added value. Dynamically communicate cost effective results after intuitive scenarios. Distinctively impact synergistic experiences. </p>
  464. </div>
  465. </div>
  466. </div>
  467. <div class="panel panel-default">
  468. <div class="panel-heading">
  469. <h4 class="panel-title">
  470. <a class="collapsed" data-toggle="collapse" data-parent="#accordion" href="#collapseTwo">International Trade </a> </h4>
  471. </div>
  472. <div id="collapseTwo" class="panel-collapse collapse">
  473. <div class="panel-body">
  474. <p>Synergistically build professional communities vis-a-vis best-of-breed paradigms. Quickly empower world-class networks with prospective methodologies. Enthusiastically morph cross functional web-readiness via virtual niche markets. Synergistically enhance one-to-one partnerships after go forward metrics. Competently facilitate alternative networks for fully tested internal or "organic" sources. Synergistically disintermediate an expanded array of niche markets through value-added value. Dynamically communicate cost effective results after intuitive scenarios. Distinctively impact synergistic experiences.</p>
  475. </div>
  476. </div>
  477. </div>
  478. <div class="panel panel-default">
  479. <div class="panel-heading">
  480. <h4 class="panel-title">
  481. <a class="collapsed" data-toggle="collapse" data-parent="#accordion" href="#collapseThree">Chemicals and Refining </a> </h4>
  482. </div>
  483. <div id="collapseThree" class="panel-collapse collapse">
  484. <div class="panel-body">
  485. <p>Synergistically build professional communities vis-a-vis best-of-breed paradigms. Quickly empower world-class networks with prospective methodologies. Enthusiastically morph cross functional web-readiness via virtual niche markets. Synergistically enhance one-to-one partnerships after go forward metrics. Competently facilitate alternative networks for fully tested internal or "organic" sources. Synergistically disintermediate an expanded array of niche markets through value-added value. Dynamically communicate cost effective results after intuitive scenarios. Distinctively impact synergistic experiences.
  486. </p>
  487. </div>
  488. </div>
  489. </div>
  490. </div>
  491. </div>
  492. <div class="col-md-5 col-sm-6">
  493. <div class="plubication-downloads">
  494. <h2 class="publish">Publications</h2>
  495. <div class="download-file">
  496. <a href="#"> <i class="fa fa-file-pdf-o" aria-hidden="true"></i> Download PDF <span>1.5 MB</span> </a>
  497. </div>
  498. <p class="download-title">Other Downloads</p>
  499. <ul class="download-list">
  500. <li><a href="#"> Annual Report </a> <span>2.4 MB</span></li>
  501. <li><a href="#"> Sustainability Report </a> <span>150 KB</span></li>
  502. <li><a href="#"> Statistical Report </a> <span>250 KB</span></li>
  503. <li><a href="#"> Energy Outlook </a> <span>1.8 MB</span></li>
  504. <li><a href="#"> Chairman’s Message </a> <span>550 KB</span></li>
  505. </ul>
  506. </div>
  507. </div>
  508. </div>
  509. </div>
  510. </section>
  511. <section class="home-news">
  512. <div class="container">
  513. <div class="section-title text-center">
  514. <h2 class="title-blog color-title"> NEWS AND MEDIA </h2>
  515. <h2 class="subtitle-blog title-2"> LATEST FROM BLOG </h2>
  516. <div class="spacer-50"> </div>
  517. </div>
  518. <div class="row news">
  519. <div class="col-md-4">
  520. <div class="blog-img-box">
  521. <div class="blog-date"> <span class="month">MAR </span> <span class="date"> 06</span> </div>
  522. <a class="hover-effect" href="blog-single.html">
  523. <img src="images/news1.jpg" alt="Fuel" />
  524. </a>
  525. </div>
  526. <div class="blog-content">
  527. <h3><a href="blog-single.html"> FUEL TRANSPORTATION AND RAILWAY RULES </a> </h3>
  528. <p>By <a href="#">Eduardo Flores</a> in Transportation</p>
  529. </div>
  530. </div>
  531. <div class="col-md-4">
  532. <div class="blog-img-box">
  533. <div class="blog-date"> <span class="month">Feb </span> <span class="date"> 24</span> </div>
  534. <a class="hover-effect" href="blog-single.html">
  535. <img src="images/news2.jpg" alt="Field Training" />
  536. </a>
  537. </div>
  538. <div class="blog-content">
  539. <h3> <a href="blog-single.html"> FIELD TRAINING SESSIONS FOR NEW EMPLOYEES </a></h3>
  540. <p>By <a href="#">Clinton Chavez</a> in TCareers</p>
  541. </div>
  542. </div>
  543. <div class="col-md-4">
  544. <div class="blog-img-box">
  545. <div class="blog-date"> <span class="month">Jan </span> <span class="date"> 17</span> </div>
  546. <a class="hover-effect" href="blog-single.html">
  547. <img src="images/news3.jpg" alt="Environment" />
  548. </a>
  549. </div>
  550. <div class="blog-content">
  551. <h3> <a href="blog-single.html"> A STUDY ON SUSTAINABILITY &amp; ENVIRONMENT FACTORS </a> </h3>
  552. <p>By <a href="#">Gertrude Rose</a> in Environment</p>
  553. </div>
  554. </div>
  555. </div>
  556. <div class="blog-btn text-center">
  557. <a href="blog.html" class="btn btn-primary" role="button">READ THE BLOG</a>
  558. </div>
  559. </div>
  560. </section>
  561. <section class="home-partners">
  562. <div class="container">
  563. <div class="section-title text-center">
  564. <h2 class="subtitle-testimonials title-2"> OUR PARTNERS </h2>
  565. <div class="spacer-20"> </div>
  566. </div>
  567. <div class="row partners">
  568. <div class="logo-slides slides owl-carousel">
  569. <div class="item">
  570. <div class="partner-images">
  571. <img src="images/partner1.png" alt="Partner Image 1">
  572. </div>
  573. </div>
  574. <div class="item">
  575. <div class="partner-images">
  576. <img src="images/partner2.png" alt="Partner Image 1">
  577. </div>
  578. </div>
  579. <div class="item">
  580. <div class="partner-images">
  581. <img src="images/partner3.png" alt="Partner Image 1">
  582. </div>
  583. </div>
  584. <div class="item">
  585. <div class="partner-images">
  586. <img src="images/partner4.png" alt="Partner Image 1">
  587. </div>
  588. </div>
  589. <div class="item">
  590. <div class="partner-images">
  591. <img src="images/partner1.png" alt="Partner Image 1">
  592. </div>
  593. </div>
  594. <div class="item">
  595. <div class="partner-images">
  596. <img src="images/partner2.png" alt="Partner Image 1">
  597. </div>
  598. </div>
  599. <div class="item">
  600. <div class="partner-images">
  601. <img src="images/partner3.png" alt="Partner Image 1">
  602. </div>
  603. </div>
  604. <div class="item">
  605. <div class="partner-images">
  606. <img src="images/partner4.png" alt="Partner Image 1">
  607. </div>
  608. </div>
  609. </div>
  610. </div>
  611. </div>
  612. </section>
  613. </main>
  614. <!-- Main Content Section -->
  615. <!-- Footer Section -->
  616. <footer>
  617. <div class="footer">
  618. <div class="container">
  619. <!-- Prefooter Section -->
  620. <div class="row pre-footer">
  621. <div class="col-md-4">
  622. <div class="contact-box">
  623. <i class="fa fa-map-marker" aria-hidden="true"></i>
  624. <div class="contact-details">
  625. <h4 class="pre-footer-title">HEAD OFFICE</h4>
  626. <p>PO Box 16122, Collins Street West,
  627. <br> Victoria 8007 Australia </p>
  628. </div>
  629. </div>
  630. </div>
  631. <div class="col-md-4">
  632. <div class="contact-box">
  633. <i class="fa fa-phone" aria-hidden="true"></i>
  634. <div class="contact-details">
  635. <h4 class="pre-footer-title">CALL US</h4>
  636. <p>SUPPORT: 1800 425 4646
  637. <br> OFFICE: +1 (253) 2587 220</p>
  638. </div>
  639. </div>
  640. </div>
  641. <div class="col-md-4">
  642. <div class="contact-box">
  643. <i class="fa fa-envelope" aria-hidden="true"></i>
  644. <div class="contact-details">
  645. <h4 class="pre-footer-title">EMAIL US</h4>
  646. <p>hello@offshoreindustry.com
  647. <br> sales@offshoreindustry.com </p>
  648. </div>
  649. </div>
  650. </div>
  651. </div>
  652. <!-- Prefooter Section -->
  653. <!-- Footer widgets -->
  654. <div class="row widgets">
  655. <div class="col-md-4 col-sm-6">
  656. <div class="about-txt widget">
  657. <img src="images/footer-logo.png" alt="logo" />
  658. <p>Collaboratively deliver partnerships progressive alignments. Assertively premier supply chains before emerging solutions. Monetize high-payoff action items before wireless internal or "organic" sources exceptional action items. </p>
  659. <div class="widgets-social">
  660. <a href="#"> <i class="fa fa-facebook" aria-hidden="true"></i> </a>
  661. <a href="#"> <i class="fa fa-twitter" aria-hidden="true"></i></a>
  662. <a href="#"> <i class="fa fa-linkedin" aria-hidden="true"></i></a>
  663. <a href="#"> <i class="fa fa-instagram" aria-hidden="true"></i></a>
  664. </div>
  665. </div>
  666. </div>
  667. <div class="col-md-2 col-sm-6">
  668. <div class="quick-links widget">
  669. <h2 class="widget-title">QUICK LINKS</h2>
  670. <ul>
  671. <li> <a href="#"> Careers </a> </li>
  672. <li> <a href="#"> Contact </a> </li>
  673. <li> <a href="#"> Market Info </a> </li>
  674. <li> <a href="#"> Technology </a> </li>
  675. <li> <a href="#"> Latest News </a> </li>
  676. </ul>
  677. </div>
  678. </div>
  679. <div class="spacer-50 visible-sm"></div>
  680. <div class="col-md-3 col-sm-6">
  681. <div class="our-services widget">
  682. <h2 class="widget-title">OUR SERVICES</h2>
  683. <ul>
  684. <li> <a href="#"> Chemicals &amp; Commercial Fuels </a> </li>
  685. <li> <a href="#"> Aviation Fuels &amp; Marine Fuels </a> </li>
  686. <li> <a href="#"> Lubricants Services </a> </li>
  687. <li> <a href="#"> Liquified Petrolium Gas </a> </li>
  688. <li> <a href="#"> Shell Sulphur, Trading &amp; Supply </a> </li>
  689. </ul>
  690. </div>
  691. </div>
  692. <div class="col-md-3 col-sm-6">
  693. <div class="newsletter widget">
  694. <h2 class="widget-title">Newsletter</h2>
  695. <p>Subscribe to our newsletters to receive latest news and updates.</p>
  696. <!-- ============= Mailchimp Subscribe Form ============= -->
  697. <form action="php/subscribe.php" id="subscribeform" method="post">
  698. <div class="form-group">
  699. <input type="email" id="email" name="email" placeholder="Enter your email" class="form-control" title="Please enter your email" data-msg-email="Please enter a valid email">
  700. </div>
  701. <button type="submit" class="btn btn-block" id="js-subscribe-btn"> Subscribe Now! </button>
  702. <div id="js-subscribe-result" data-success-msg="Done. Subscribed" data-error-msg="Oops. Error!"></div>
  703. </form>
  704. </div>
  705. </div>
  706. </div>
  707. <!-- Footer widgets -->
  708. </div>
  709. </div>
  710. <!-- Copyright -->
  711. <div class="copyright">
  712. <div class="container">
  713. <div class="row copyright-bar">
  714. <div class="col-md-6">
  715. <p>Copyright © 2016 Offshore Industries. All rights reserved.</p>
  716. </div>
  717. <div class="col-md-6 text-right">
  718. <p> <a href="#"> Terms of use</a> <a href="#">Privacy Policy</a> <span> | </span> Made with <i class="fa fa-heart" aria-hidden="true"></i> by Surjith S M </p>
  719. </div>
  720. </div>
  721. </div>
  722. </div>
  723. <!-- Copyright -->
  724. </footer>
  725. <!-- Footer Section -->
  726. <!-- back-to-top link -->
  727. <a href="#0" class="cd-top"> Top </a>
  728. </div>
  729. <!-- Page Wrapper
  730. –––––––––––––––––––––––––––––––––––––––––––––––––– -->
  731. <!-- Javascripts
  732. –––––––––––––––––––––––––––––––––––––––––––––––––– -->
  733. <!-- Jquery Library -->
  734. <script src="js/jquery.min.js"></script>
  735. <!-- Bootstrap core JavaScript -->
  736. <script src="js/bootstrap.min.js"></script>
  737. <!-- jQuery Flex Slider -->
  738. <script src="js/jquery.flexslider-min.js"></script>
  739. <!-- Owl Carousel -->
  740. <script src="js/owl.carousel.min.js"></script>
  741. <!-- Counter JS -->
  742. <script src="js/waypoints.min.js"></script>
  743. <script src="js/jquery.counterup.min.js"></script>
  744. <!-- Back to top -->
  745. <script src="js/back-to-top.js"></script>
  746. <!-- Form Validation -->
  747. <script src="js/validate.js"></script>
  748. <!-- Subscribe Form JS -->
  749. <script src="js/subscribe.js"></script>
  750. <!-- Main JS -->
  751. <script src="js/main.js"></script>
  752. </body>
  753. </html>