813 lines
42 KiB
HTML
813 lines
42 KiB
HTML
<!DOCTYPE html>
|
|
<!--
|
|
Template: Metronic Frontend Freebie - Responsive HTML Template Based On Twitter Bootstrap 3.3.4
|
|
Version: 1.0.0
|
|
Author: KeenThemes
|
|
Website: http://www.keenthemes.com/
|
|
Contact: support@keenthemes.com
|
|
Follow: www.twitter.com/keenthemes
|
|
Like: www.facebook.com/keenthemes
|
|
Purchase Premium Metronic Admin Theme: http://themeforest.net/item/metronic-responsive-admin-dashboard-template/4021469?ref=keenthemes
|
|
-->
|
|
<!--[if IE 8]> <html lang="en" class="ie8 no-js"> <![endif]-->
|
|
<!--[if IE 9]> <html lang="en" class="ie9 no-js"> <![endif]-->
|
|
<!--[if !IE]><!-->
|
|
<html lang="en">
|
|
<!--<![endif]-->
|
|
|
|
<!-- Head BEGIN -->
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<title>Metronic Frontend (with Top Bar)</title>
|
|
|
|
<meta content="width=device-width, initial-scale=1.0" name="viewport">
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
|
|
|
<meta content="Metronic Shop UI description" name="description">
|
|
<meta content="Metronic Shop UI keywords" name="keywords">
|
|
<meta content="keenthemes" name="author">
|
|
|
|
<meta property="og:site_name" content="-CUSTOMER VALUE-">
|
|
<meta property="og:title" content="-CUSTOMER VALUE-">
|
|
<meta property="og:description" content="-CUSTOMER VALUE-">
|
|
<meta property="og:type" content="website">
|
|
<meta property="og:image" content="-CUSTOMER VALUE-"><!-- link to image for socio -->
|
|
<meta property="og:url" content="-CUSTOMER VALUE-">
|
|
|
|
<link rel="shortcut icon" href="favicon.ico">
|
|
|
|
<!-- Fonts START -->
|
|
<link href="http://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700|PT+Sans+Narrow|Source+Sans+Pro:200,300,400,600,700,900&subset=all" rel="stylesheet" type="text/css">
|
|
<!-- Fonts END -->
|
|
|
|
<!-- Global styles START -->
|
|
<link href="assets/plugins/font-awesome/css/font-awesome.min.css" rel="stylesheet">
|
|
<link href="assets/plugins/bootstrap/css/bootstrap.min.css" rel="stylesheet">
|
|
<!-- Global styles END -->
|
|
|
|
<!-- Page level plugin styles START -->
|
|
<link href="assets/pages/css/animate.css" rel="stylesheet">
|
|
<link href="assets/plugins/fancybox/source/jquery.fancybox.css" rel="stylesheet">
|
|
<link href="assets/plugins/owl.carousel/assets/owl.carousel.css" rel="stylesheet">
|
|
<!-- Page level plugin styles END -->
|
|
|
|
<!-- Theme styles START -->
|
|
<link href="assets/pages/css/components.css" rel="stylesheet">
|
|
<link href="assets/pages/css/slider.css" rel="stylesheet">
|
|
<link href="assets/corporate/css/style.css" rel="stylesheet">
|
|
<link href="assets/corporate/css/style-responsive.css" rel="stylesheet">
|
|
<link href="assets/corporate/css/themes/red.css" rel="stylesheet" id="style-color">
|
|
<link href="assets/corporate/css/custom.css" rel="stylesheet">
|
|
<!-- Theme styles END -->
|
|
</head>
|
|
<!-- Head END -->
|
|
|
|
<!-- Body BEGIN -->
|
|
<body class="corporate">
|
|
<!-- BEGIN STYLE CUSTOMIZER -->
|
|
<div class="color-panel hidden-sm">
|
|
<div class="color-mode-icons icon-color"></div>
|
|
<div class="color-mode-icons icon-color-close"></div>
|
|
<div class="color-mode">
|
|
<p>THEME COLOR</p>
|
|
<ul class="inline">
|
|
<li class="color-red current color-default" data-style="red"></li>
|
|
<li class="color-blue" data-style="blue"></li>
|
|
<li class="color-green" data-style="green"></li>
|
|
<li class="color-orange" data-style="orange"></li>
|
|
<li class="color-gray" data-style="gray"></li>
|
|
<li class="color-turquoise" data-style="turquoise"></li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
<!-- END BEGIN STYLE CUSTOMIZER -->
|
|
|
|
<!-- BEGIN TOP BAR -->
|
|
<div class="pre-header">
|
|
<div class="container">
|
|
<div class="row">
|
|
<!-- BEGIN TOP BAR LEFT PART -->
|
|
<div class="col-md-6 col-sm-6 additional-shop-info">
|
|
<ul class="list-unstyled list-inline">
|
|
<li><i class="fa fa-phone"></i><span>+1 456 6717</span></li>
|
|
<li><i class="fa fa-envelope-o"></i><span>info@keenthemes.com</span></li>
|
|
</ul>
|
|
</div>
|
|
<!-- END TOP BAR LEFT PART -->
|
|
<!-- BEGIN TOP BAR MENU -->
|
|
<div class="col-md-6 col-sm-6 additional-nav">
|
|
<ul class="list-unstyled list-inline pull-right">
|
|
<li><a href="page-login.html">Log In</a></li>
|
|
<li><a href="page-reg-page.html">Registration</a></li>
|
|
</ul>
|
|
</div>
|
|
<!-- END TOP BAR MENU -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- END TOP BAR -->
|
|
<!-- BEGIN HEADER -->
|
|
<div class="header">
|
|
<div class="container">
|
|
<a class="site-logo" href="index.html"><img src="assets/corporate/img/logos/logo-corp-red.png" alt="Metronic FrontEnd"></a>
|
|
|
|
<a href="javascript:void(0);" class="mobi-toggler"><i class="fa fa-bars"></i></a>
|
|
|
|
<!-- BEGIN NAVIGATION -->
|
|
<div class="header-navigation pull-right font-transform-inherit">
|
|
<ul>
|
|
<li class="dropdown">
|
|
<a class="dropdown-toggle" data-toggle="dropdown" data-target="#" href="javascript:;">
|
|
Home
|
|
|
|
</a>
|
|
|
|
<ul class="dropdown-menu">
|
|
<li class="active"><a href="index.html">Home Default</a></li>
|
|
<li><a href="index-header-fix.html">Home with Header Fixed</a></li>
|
|
<li><a href="index-without-topbar.html">Home without Top Bar</a></li>
|
|
</ul>
|
|
</li>
|
|
|
|
|
|
|
|
<li class="dropdown">
|
|
<a class="dropdown-toggle" data-toggle="dropdown" data-target="#" href="javascript:;">
|
|
Pages
|
|
|
|
</a>
|
|
|
|
<ul class="dropdown-menu">
|
|
<li><a href="page-about.html">About Us</a></li>
|
|
<li><a href="page-services.html">Services</a></li>
|
|
<li><a href="page-prices.html">Prices</a></li>
|
|
<li><a href="page-faq.html">FAQ</a></li>
|
|
<li><a href="page-gallery.html">Gallery</a></li>
|
|
<li><a href="page-search-result.html">Search Result</a></li>
|
|
<li><a href="page-404.html">404</a></li>
|
|
<li><a href="page-500.html">500</a></li>
|
|
<li><a href="page-login.html">Login Page</a></li>
|
|
<li><a href="page-forgotton-password.html">Forget Password</a></li>
|
|
<li><a href="page-reg-page.html">Signup Page</a></li>
|
|
<li><a href="page-careers.html">Careers</a></li>
|
|
<li><a href="page-site-map.html">Site Map</a></li>
|
|
<li><a href="page-contacts.html">Contact</a></li>
|
|
</ul>
|
|
</li>
|
|
<li class="dropdown">
|
|
<a class="dropdown-toggle" data-toggle="dropdown" data-target="#" href="javascript:;">
|
|
Multilevel
|
|
|
|
</a>
|
|
|
|
<ul class="dropdown-menu">
|
|
<li class="dropdown-submenu">
|
|
<a href="index.html">Multi level <i class="fa fa-angle-right"></i></a>
|
|
<ul class="dropdown-menu" role="menu">
|
|
<li><a href="index.html">Second Level Link</a></li>
|
|
<li><a href="index.html">Second Level Link</a></li>
|
|
<li class="dropdown-submenu">
|
|
<a class="dropdown-toggle" data-toggle="dropdown" data-target="#" href="javascript:;">
|
|
Second Level Link
|
|
<i class="fa fa-angle-right"></i>
|
|
</a>
|
|
<ul class="dropdown-menu">
|
|
<li><a href="index.html">Third Level Link</a></li>
|
|
<li><a href="index.html">Third Level Link</a></li>
|
|
<li><a href="index.html">Third Level Link</a></li>
|
|
</ul>
|
|
</li>
|
|
</ul>
|
|
</li>
|
|
</ul>
|
|
</li>
|
|
<li class="dropdown">
|
|
<a class="dropdown-toggle" data-toggle="dropdown" data-target="#" href="javascript:;">
|
|
Portfolio
|
|
|
|
</a>
|
|
|
|
<ul class="dropdown-menu">
|
|
<li><a href="portfolio-4.html">Portfolio 4</a></li>
|
|
<li><a href="portfolio-3.html">Portfolio 3</a></li>
|
|
<li><a href="portfolio-2.html">Portfolio 2</a></li>
|
|
<li><a href="portfolio-item.html">Portfolio Item</a></li>
|
|
</ul>
|
|
</li>
|
|
<li class="dropdown">
|
|
<a class="dropdown-toggle" data-toggle="dropdown" data-target="#" href="javascript:;">
|
|
Blog
|
|
|
|
</a>
|
|
|
|
<ul class="dropdown-menu">
|
|
<li><a href="blog.html">Blog Page</a></li>
|
|
<li><a href="blog-item.html">Blog Item</a></li>
|
|
</ul>
|
|
</li>
|
|
|
|
<li class="dropdown dropdown-megamenu">
|
|
<a class="dropdown-toggle" data-toggle="dropdown" data-target="#" href="javascript:;">
|
|
Mega Menu
|
|
|
|
</a>
|
|
<ul class="dropdown-menu">
|
|
<li>
|
|
<div class="header-navigation-content">
|
|
<div class="row">
|
|
<div class="col-md-4 header-navigation-col">
|
|
<h4>Footwear</h4>
|
|
<ul>
|
|
<li><a href="index.html">Astro Trainers</a></li>
|
|
<li><a href="index.html">Basketball Shoes</a></li>
|
|
<li><a href="index.html">Boots</a></li>
|
|
<li><a href="index.html">Canvas Shoes</a></li>
|
|
<li><a href="index.html">Football Boots</a></li>
|
|
<li><a href="index.html">Golf Shoes</a></li>
|
|
<li><a href="index.html">Hi Tops</a></li>
|
|
<li><a href="index.html">Indoor Trainers</a></li>
|
|
</ul>
|
|
</div>
|
|
<div class="col-md-4 header-navigation-col">
|
|
<h4>Clothing</h4>
|
|
<ul>
|
|
<li><a href="index.html">Base Layer</a></li>
|
|
<li><a href="index.html">Character</a></li>
|
|
<li><a href="index.html">Chinos</a></li>
|
|
<li><a href="index.html">Combats</a></li>
|
|
<li><a href="index.html">Cricket Clothing</a></li>
|
|
<li><a href="index.html">Fleeces</a></li>
|
|
<li><a href="index.html">Gilets</a></li>
|
|
<li><a href="index.html">Golf Tops</a></li>
|
|
</ul>
|
|
</div>
|
|
<div class="col-md-4 header-navigation-col">
|
|
<h4>Accessories</h4>
|
|
<ul>
|
|
<li><a href="index.html">Belts</a></li>
|
|
<li><a href="index.html">Caps</a></li>
|
|
<li><a href="index.html">Gloves</a></li>
|
|
</ul>
|
|
|
|
<h4>Clearance</h4>
|
|
<ul>
|
|
<li><a href="index.html">Jackets</a></li>
|
|
<li><a href="index.html">Bottoms</a></li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</li>
|
|
|
|
|
|
|
|
<li><a href="http://themeforest.net/item/metronic-responsive-admin-dashboard-template/4021469?ref=keenthemes&utm_source=download&utm_medium=banner&utm_campaign=metronic_frontend_freebie" target="_blank">Admin theme</a></li>
|
|
|
|
<!-- BEGIN TOP SEARCH -->
|
|
<li class="menu-search">
|
|
<span class="sep"></span>
|
|
<i class="fa fa-search search-btn"></i>
|
|
<div class="search-box">
|
|
<form action="#">
|
|
<div class="input-group">
|
|
<input type="text" placeholder="Search" class="form-control">
|
|
<span class="input-group-btn">
|
|
<button class="btn btn-primary" type="submit">Search</button>
|
|
</span>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</li>
|
|
<!-- END TOP SEARCH -->
|
|
</ul>
|
|
</div>
|
|
<!-- END NAVIGATION -->
|
|
</div>
|
|
</div>
|
|
<!-- Header END -->
|
|
|
|
<!-- BEGIN SLIDER -->
|
|
<div class="page-slider margin-bottom-40">
|
|
<div id="carousel-example-generic" class="carousel slide carousel-slider">
|
|
<!-- Indicators -->
|
|
<ol class="carousel-indicators carousel-indicators-frontend">
|
|
<li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
|
|
<li data-target="#carousel-example-generic" data-slide-to="1"></li>
|
|
<li data-target="#carousel-example-generic" data-slide-to="2"></li>
|
|
</ol>
|
|
|
|
<!-- Wrapper for slides -->
|
|
<div class="carousel-inner" role="listbox">
|
|
<!-- First slide -->
|
|
<div class="item carousel-item-eight active">
|
|
<div class="container">
|
|
<div class="carousel-position-six text-uppercase text-center">
|
|
<h2 class="margin-bottom-20 animate-delay carousel-title-v5" data-animation="animated fadeInDown">
|
|
Expore the power <br/>
|
|
<span class="carousel-title-normal">of Metronic</span>
|
|
</h2>
|
|
<p class="carousel-subtitle-v5 border-top-bottom margin-bottom-30" data-animation="animated fadeInDown">This is what you were looking for</p>
|
|
<a class="carousel-btn-green" href="#" data-animation="animated fadeInUp">Purchase Now!</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Second slide -->
|
|
<div class="item carousel-item-nine">
|
|
<div class="container">
|
|
<div class="carousel-position-six">
|
|
<h2 class="animate-delay carousel-title-v6 text-uppercase" data-animation="animated fadeInDown">
|
|
Need a website design?
|
|
</h2>
|
|
<p class="carousel-subtitle-v6 text-uppercase" data-animation="animated fadeInDown">
|
|
This is what you were looking for
|
|
</p>
|
|
<p class="carousel-subtitle-v7 margin-bottom-30" data-animation="animated fadeInDown">
|
|
Lorem ipsum dolor sit amet, consectetur adipiscing elit.<br/>
|
|
Sed est nunc, sagittis at consectetur id.
|
|
</p>
|
|
<a class="carousel-btn-green" href="#" data-animation="animated fadeInUp">Purchase Now!</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Third slide -->
|
|
<div class="item carousel-item-ten">
|
|
<div class="container">
|
|
<div class="carousel-position-six">
|
|
<h2 class="animate-delay carousel-title-v6 text-uppercase" data-animation="animated fadeInDown">
|
|
Powerful & Clean
|
|
</h2>
|
|
<p class="carousel-subtitle-v6 text-uppercase" data-animation="animated fadeInDown">
|
|
Responsive Website & Admin Theme
|
|
</p>
|
|
<p class="carousel-subtitle-v7 margin-bottom-30" data-animation="animated fadeInDown">
|
|
Lorem ipsum dolor sit amet, consectetur adipiscing elit.<br/>
|
|
Sed est nunc, sagittis at consectetur id.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Controls -->
|
|
<a class="left carousel-control carousel-control-shop carousel-control-frontend" href="#carousel-example-generic" role="button" data-slide="prev">
|
|
<i class="fa fa-angle-left" aria-hidden="true"></i>
|
|
</a>
|
|
<a class="right carousel-control carousel-control-shop carousel-control-frontend" href="#carousel-example-generic" role="button" data-slide="next">
|
|
<i class="fa fa-angle-right" aria-hidden="true"></i>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
<!-- END SLIDER -->
|
|
|
|
<div class="main">
|
|
<div class="container">
|
|
<!-- BEGIN SERVICE BOX -->
|
|
<div class="row service-box margin-bottom-40">
|
|
<div class="col-md-4 col-sm-4">
|
|
<div class="service-box-heading">
|
|
<em><i class="fa fa-location-arrow blue"></i></em>
|
|
<span>Multipurpose Template</span>
|
|
</div>
|
|
<p>Lorem ipsum dolor sit amet, dolore eiusmod quis tempor incididunt ut et dolore Ut veniam unde nostrudlaboris. Sed unde omnis iste natus error sit voluptatem.</p>
|
|
</div>
|
|
<div class="col-md-4 col-sm-4">
|
|
<div class="service-box-heading">
|
|
<em><i class="fa fa-check red"></i></em>
|
|
<span>Well Documented</span>
|
|
</div>
|
|
<p>Lorem ipsum dolor sit amet, dolore eiusmod quis tempor incididunt ut et dolore Ut veniam unde nostrudlaboris. Sed unde omnis iste natus error sit voluptatem.</p>
|
|
</div>
|
|
<div class="col-md-4 col-sm-4">
|
|
<div class="service-box-heading">
|
|
<em><i class="fa fa-compress green"></i></em>
|
|
<span>Responsive Design</span>
|
|
</div>
|
|
<p>Lorem ipsum dolor sit amet, dolore eiusmod quis tempor incididunt ut et dolore Ut veniam unde nostrudlaboris. Sed unde omnis iste natus error sit voluptatem.</p>
|
|
</div>
|
|
</div>
|
|
<!-- END SERVICE BOX -->
|
|
|
|
<!-- BEGIN BLOCKQUOTE BLOCK -->
|
|
<div class="row quote-v1 margin-bottom-30">
|
|
<div class="col-md-9">
|
|
<span>Metronic - The Most Complete & Popular Admin & Frontend Theme</span>
|
|
</div>
|
|
<div class="col-md-3 text-right">
|
|
<a class="btn-transparent" href="http://www.keenthemes.com/preview/index.php?theme=metronic_admin" target="_blank"><i class="fa fa-rocket margin-right-10"></i>Preview Admin</a>
|
|
</div>
|
|
</div>
|
|
<!-- END BLOCKQUOTE BLOCK -->
|
|
|
|
<!-- BEGIN RECENT WORKS -->
|
|
<div class="row recent-work margin-bottom-40">
|
|
<div class="col-md-3">
|
|
<h2><a href="portfolio.html">Recent Works</a></h2>
|
|
<p>Lorem ipsum dolor sit amet, dolore eiusmod quis tempor incididunt ut et dolore Ut veniam unde voluptatem. Sed unde omnis iste natus error sit voluptatem.</p>
|
|
</div>
|
|
<div class="col-md-9">
|
|
<div class="owl-carousel owl-carousel3">
|
|
<div class="recent-work-item">
|
|
<em>
|
|
<img src="assets/pages/img/works/img1.jpg" alt="Amazing Project" class="img-responsive">
|
|
<a href="portfolio-item.html"><i class="fa fa-link"></i></a>
|
|
<a href="assets/pages/img/works/img1.jpg" class="fancybox-button" title="Project Name #1" data-rel="fancybox-button"><i class="fa fa-search"></i></a>
|
|
</em>
|
|
<a class="recent-work-description" href="javascript:;">
|
|
<strong>Amazing Project</strong>
|
|
<b>Agenda corp.</b>
|
|
</a>
|
|
</div>
|
|
<div class="recent-work-item">
|
|
<em>
|
|
<img src="assets/pages/img/works/img2.jpg" alt="Amazing Project" class="img-responsive">
|
|
<a href="portfolio-item.html"><i class="fa fa-link"></i></a>
|
|
<a href="assets/pages/img/works/img2.jpg" class="fancybox-button" title="Project Name #2" data-rel="fancybox-button"><i class="fa fa-search"></i></a>
|
|
</em>
|
|
<a class="recent-work-description" href="javascript:;">
|
|
<strong>Amazing Project</strong>
|
|
<b>Agenda corp.</b>
|
|
</a>
|
|
</div>
|
|
<div class="recent-work-item">
|
|
<em>
|
|
<img src="assets/pages/img/works/img3.jpg" alt="Amazing Project" class="img-responsive">
|
|
<a href="portfolio-item.html"><i class="fa fa-link"></i></a>
|
|
<a href="assets/pages/img/works/img3.jpg" class="fancybox-button" title="Project Name #3" data-rel="fancybox-button"><i class="fa fa-search"></i></a>
|
|
</em>
|
|
<a class="recent-work-description" href="javascript:;">
|
|
<strong>Amazing Project</strong>
|
|
<b>Agenda corp.</b>
|
|
</a>
|
|
</div>
|
|
<div class="recent-work-item">
|
|
<em>
|
|
<img src="assets/pages/img/works/img4.jpg" alt="Amazing Project" class="img-responsive">
|
|
<a href="portfolio-item.html"><i class="fa fa-link"></i></a>
|
|
<a href="assets/pages/img/works/img4.jpg" class="fancybox-button" title="Project Name #4" data-rel="fancybox-button"><i class="fa fa-search"></i></a>
|
|
</em>
|
|
<a class="recent-work-description" href="javascript:;">
|
|
<strong>Amazing Project</strong>
|
|
<b>Agenda corp.</b>
|
|
</a>
|
|
</div>
|
|
<div class="recent-work-item">
|
|
<em>
|
|
<img src="assets/pages/img/works/img5.jpg" alt="Amazing Project" class="img-responsive">
|
|
<a href="portfolio-item.html"><i class="fa fa-link"></i></a>
|
|
<a href="assets/pages/img/works/img5.jpg" class="fancybox-button" title="Project Name #5" data-rel="fancybox-button"><i class="fa fa-search"></i></a>
|
|
</em>
|
|
<a class="recent-work-description" href="javascript:;">
|
|
<strong>Amazing Project</strong>
|
|
<b>Agenda corp.</b>
|
|
</a>
|
|
</div>
|
|
<div class="recent-work-item">
|
|
<em>
|
|
<img src="assets/pages/img/works/img6.jpg" alt="Amazing Project" class="img-responsive">
|
|
<a href="portfolio-item.html"><i class="fa fa-link"></i></a>
|
|
<a href="assets/pages/img/works/img6.jpg" class="fancybox-button" title="Project Name #6" data-rel="fancybox-button"><i class="fa fa-search"></i></a>
|
|
</em>
|
|
<a class="recent-work-description" href="javascript:;">
|
|
<strong>Amazing Project</strong>
|
|
<b>Agenda corp.</b>
|
|
</a>
|
|
</div>
|
|
<div class="recent-work-item">
|
|
<em>
|
|
<img src="assets/pages/img/works/img3.jpg" alt="Amazing Project" class="img-responsive">
|
|
<a href="portfolio-item.html"><i class="fa fa-link"></i></a>
|
|
<a href="assets/pages/img/works/img3.jpg" class="fancybox-button" title="Project Name #3" data-rel="fancybox-button"><i class="fa fa-search"></i></a>
|
|
</em>
|
|
<a class="recent-work-description" href="javascript:;">
|
|
<strong>Amazing Project</strong>
|
|
<b>Agenda corp.</b>
|
|
</a>
|
|
</div>
|
|
<div class="recent-work-item">
|
|
<em>
|
|
<img src="assets/pages/img/works/img4.jpg" alt="Amazing Project" class="img-responsive">
|
|
<a href="portfolio-item.html"><i class="fa fa-link"></i></a>
|
|
<a href="assets/pages/img/works/img4.jpg" class="fancybox-button" title="Project Name #4" data-rel="fancybox-button"><i class="fa fa-search"></i></a>
|
|
</em>
|
|
<a class="recent-work-description" href="javascript:;">
|
|
<strong>Amazing Project</strong>
|
|
<b>Agenda corp.</b>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- END RECENT WORKS -->
|
|
|
|
<!-- BEGIN TABS AND TESTIMONIALS -->
|
|
<div class="row mix-block margin-bottom-40">
|
|
<!-- TABS -->
|
|
<div class="col-md-7 tab-style-1">
|
|
<ul class="nav nav-tabs">
|
|
<li class="active"><a href="#tab-1" data-toggle="tab">Multipurpose</a></li>
|
|
<li><a href="#tab-2" data-toggle="tab">Documented</a></li>
|
|
<li><a href="#tab-3" data-toggle="tab">Responsive</a></li>
|
|
<li><a href="#tab-4" data-toggle="tab">Clean & Fresh</a></li>
|
|
</ul>
|
|
<div class="tab-content">
|
|
<div class="tab-pane row fade in active" id="tab-1">
|
|
<div class="col-md-3 col-sm-3">
|
|
<a href="assets/temp/photos/img7.jpg" class="fancybox-button" title="Image Title" data-rel="fancybox-button">
|
|
<img class="img-responsive" src="assets/pages/img/photos/img7.jpg" alt="">
|
|
</a>
|
|
</div>
|
|
<div class="col-md-9 col-sm-9">
|
|
<p class="margin-bottom-10">Raw denim you probably haven't heard of them jean shorts Austin. Nesciunt tofu stumptown aliqua, retro synth master cleanse. Mustache cliche tempor, williamsburg carles vegan helvetica. Cosby sweater eu banh mi, qui irure terry richardson ex squid Aliquip placeat salvia cillum iphone.</p>
|
|
<p><a class="more" href="javascript:;">Read more <i class="icon-angle-right"></i></a></p>
|
|
</div>
|
|
</div>
|
|
<div class="tab-pane row fade" id="tab-2">
|
|
<div class="col-md-9 col-sm-9">
|
|
<p>Food truck fixie locavore, accusamus mcsweeney's marfa nulla single-origin coffee squid. Exercitation +1 labore velit, blog sartorial PBR leggings next level wes anderson artisan four loko farm-to-table craft beer twee. Qui photo booth letterpress, commodo enim craft beer mlkshk aliquip jean shorts ullamco ad vinyl cillum PBR. Homo nostrud organic, assumenda labore aesthetic magna delectus mollit. Keytar helvetica VHS salvia..</p>
|
|
</div>
|
|
<div class="col-md-3 col-sm-3">
|
|
<a href="assets/temp/photos/img10.jpg" class="fancybox-button" title="Image Title" data-rel="fancybox-button">
|
|
<img class="img-responsive" src="assets/pages/img/photos/img10.jpg" alt="">
|
|
</a>
|
|
</div>
|
|
</div>
|
|
<div class="tab-pane fade" id="tab-3">
|
|
<p>Etsy mixtape wayfarers, ethical wes anderson tofu before they sold out mcsweeney's organic lomo retro fanny pack lo-fi farm-to-table readymade. Messenger bag gentrify pitchfork tattooed craft beer, iphone skateboard locavore carles etsy salvia banksy hoodie helvetica. DIY synth PBR banksy irony. Leggings gentrify squid 8-bit cred pitchfork. Williamsburg banh mi whatever gluten-free, carles pitchfork biodiesel fixie etsy retro mlkshk vice blog. Scenester cred you probably haven't heard of them, vinyl craft beer blog stumptown. Pitchfork sustainable tofu synth chambray yr.</p>
|
|
</div>
|
|
<div class="tab-pane fade" id="tab-4">
|
|
<p>Trust fund seitan letterpress, keytar raw denim keffiyeh etsy art party before they sold out master cleanse gluten-free squid scenester freegan cosby sweater. Fanny pack portland seitan DIY, art party locavore wolf cliche high life echo park Austin. Cred vinyl keffiyeh DIY salvia PBR, banh mi before they sold out farm-to-table VHS viral locavore cosby sweater. Lomo wolf viral, mustache readymade thundercats keffiyeh craft beer marfa ethical. Wolf salvia freegan, sartorial keffiyeh echo park vegan.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- END TABS -->
|
|
|
|
<!-- TESTIMONIALS -->
|
|
<div class="col-md-5 testimonials-v1">
|
|
<div id="myCarousel" class="carousel slide">
|
|
<!-- Carousel items -->
|
|
<div class="carousel-inner">
|
|
<div class="active item">
|
|
<blockquote><p>Denim you probably haven't heard of. Lorem ipsum dolor met consectetur adipisicing sit amet, consectetur adipisicing elit, of them jean shorts sed magna aliqua. Lorem ipsum dolor met.</p></blockquote>
|
|
<div class="carousel-info">
|
|
<img class="pull-left" src="assets/pages/img/people/img1-small.jpg" alt="">
|
|
<div class="pull-left">
|
|
<span class="testimonials-name">Lina Mars</span>
|
|
<span class="testimonials-post">Commercial Director</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="item">
|
|
<blockquote><p>Raw denim you Mustache cliche tempor, williamsburg carles vegan helvetica probably haven't heard of them jean shorts austin. Nesciunt tofu stumptown aliqua, retro synth master cleanse. Mustache cliche tempor, williamsburg carles vegan helvetica.</p></blockquote>
|
|
<div class="carousel-info">
|
|
<img class="pull-left" src="assets/pages/img/people/img5-small.jpg" alt="">
|
|
<div class="pull-left">
|
|
<span class="testimonials-name">Kate Ford</span>
|
|
<span class="testimonials-post">Commercial Director</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="item">
|
|
<blockquote><p>Reprehenderit butcher stache cliche tempor, williamsburg carles vegan helvetica.retro keffiyeh dreamcatcher synth. Cosby sweater eu banh mi, qui irure terry richardson ex squid Aliquip placeat salvia cillum iphone.</p></blockquote>
|
|
<div class="carousel-info">
|
|
<img class="pull-left" src="assets/pages/img/people/img2-small.jpg" alt="">
|
|
<div class="pull-left">
|
|
<span class="testimonials-name">Jake Witson</span>
|
|
<span class="testimonials-post">Commercial Director</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Carousel nav -->
|
|
<a class="left-btn" href="#myCarousel" data-slide="prev"></a>
|
|
<a class="right-btn" href="#myCarousel" data-slide="next"></a>
|
|
</div>
|
|
</div>
|
|
<!-- END TESTIMONIALS -->
|
|
</div>
|
|
<!-- END TABS AND TESTIMONIALS -->
|
|
|
|
<!-- BEGIN STEPS -->
|
|
<div class="row margin-bottom-40 front-steps-wrapper front-steps-count-3">
|
|
<div class="col-md-4 col-sm-4 front-step-col">
|
|
<div class="front-step front-step1">
|
|
<h2>Goal definition</h2>
|
|
<p>Lorem ipsum dolor sit amet sit consectetur adipisicing eiusmod tempor.</p>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-4 col-sm-4 front-step-col">
|
|
<div class="front-step front-step2">
|
|
<h2>Analyse</h2>
|
|
<p>Lorem ipsum dolor sit amet sit consectetur adipisicing eiusmod tempor.</p>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-4 col-sm-4 front-step-col">
|
|
<div class="front-step front-step3">
|
|
<h2>Implementation</h2>
|
|
<p>Lorem ipsum dolor sit amet sit consectetur adipisicing eiusmod tempor.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- END STEPS -->
|
|
|
|
<!-- BEGIN CLIENTS -->
|
|
<div class="row margin-bottom-40 our-clients">
|
|
<div class="col-md-3">
|
|
<h2><a href="javascript:;">Our Clients</a></h2>
|
|
<p>Lorem dipsum folor margade sitede lametep eiusmod psumquis dolore.</p>
|
|
</div>
|
|
<div class="col-md-9">
|
|
<div class="owl-carousel owl-carousel6-brands">
|
|
<div class="client-item">
|
|
<a href="javascript:;">
|
|
<img src="assets/pages/img/clients/client_1_gray.png" class="img-responsive" alt="">
|
|
<img src="assets/pages/img/clients/client_1.png" class="color-img img-responsive" alt="">
|
|
</a>
|
|
</div>
|
|
<div class="client-item">
|
|
<a href="javascript:;">
|
|
<img src="assets/pages/img/clients/client_2_gray.png" class="img-responsive" alt="">
|
|
<img src="assets/pages/img/clients/client_2.png" class="color-img img-responsive" alt="">
|
|
</a>
|
|
</div>
|
|
<div class="client-item">
|
|
<a href="javascript:;">
|
|
<img src="assets/pages/img/clients/client_3_gray.png" class="img-responsive" alt="">
|
|
<img src="assets/pages/img/clients/client_3.png" class="color-img img-responsive" alt="">
|
|
</a>
|
|
</div>
|
|
<div class="client-item">
|
|
<a href="javascript:;">
|
|
<img src="assets/pages/img/clients/client_4_gray.png" class="img-responsive" alt="">
|
|
<img src="assets/pages/img/clients/client_4.png" class="color-img img-responsive" alt="">
|
|
</a>
|
|
</div>
|
|
<div class="client-item">
|
|
<a href="javascript:;">
|
|
<img src="assets/pages/img/clients/client_5_gray.png" class="img-responsive" alt="">
|
|
<img src="assets/pages/img/clients/client_5.png" class="color-img img-responsive" alt="">
|
|
</a>
|
|
</div>
|
|
<div class="client-item">
|
|
<a href="javascript:;">
|
|
<img src="assets/pages/img/clients/client_6_gray.png" class="img-responsive" alt="">
|
|
<img src="assets/pages/img/clients/client_6.png" class="color-img img-responsive" alt="">
|
|
</a>
|
|
</div>
|
|
<div class="client-item">
|
|
<a href="javascript:;">
|
|
<img src="assets/pages/img/clients/client_7_gray.png" class="img-responsive" alt="">
|
|
<img src="assets/pages/img/clients/client_7.png" class="color-img img-responsive" alt="">
|
|
</a>
|
|
</div>
|
|
<div class="client-item">
|
|
<a href="javascript:;">
|
|
<img src="assets/pages/img/clients/client_8_gray.png" class="img-responsive" alt="">
|
|
<img src="assets/pages/img/clients/client_8.png" class="color-img img-responsive" alt="">
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- END CLIENTS -->
|
|
</div>
|
|
</div>
|
|
|
|
<!-- BEGIN PRE-FOOTER -->
|
|
<div class="pre-footer">
|
|
<div class="container">
|
|
<div class="row">
|
|
<!-- BEGIN BOTTOM ABOUT BLOCK -->
|
|
<div class="col-md-4 col-sm-6 pre-footer-col">
|
|
<h2>About us</h2>
|
|
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam sit nonummy nibh euismod tincidunt ut laoreet dolore magna aliquarm erat sit volutpat.</p>
|
|
|
|
<div class="photo-stream">
|
|
<h2>Photos Stream</h2>
|
|
<ul class="list-unstyled">
|
|
<li><a href="javascript:;"><img alt="" src="assets/pages/img/people/img5-small.jpg"></a></li>
|
|
<li><a href="javascript:;"><img alt="" src="assets/pages/img/works/img1.jpg"></a></li>
|
|
<li><a href="javascript:;"><img alt="" src="assets/pages/img/people/img4-large.jpg"></a></li>
|
|
<li><a href="javascript:;"><img alt="" src="assets/pages/img/works/img6.jpg"></a></li>
|
|
<li><a href="javascript:;"><img alt="" src="assets/pages/img/works/img3.jpg"></a></li>
|
|
<li><a href="javascript:;"><img alt="" src="assets/pages/img/people/img2-large.jpg"></a></li>
|
|
<li><a href="javascript:;"><img alt="" src="assets/pages/img/works/img2.jpg"></a></li>
|
|
<li><a href="javascript:;"><img alt="" src="assets/pages/img/works/img5.jpg"></a></li>
|
|
<li><a href="javascript:;"><img alt="" src="assets/pages/img/people/img5-small.jpg"></a></li>
|
|
<li><a href="javascript:;"><img alt="" src="assets/pages/img/works/img1.jpg"></a></li>
|
|
<li><a href="javascript:;"><img alt="" src="assets/pages/img/people/img4-large.jpg"></a></li>
|
|
<li><a href="javascript:;"><img alt="" src="assets/pages/img/works/img6.jpg"></a></li>
|
|
<li><a href="javascript:;"><img alt="" src="assets/pages/img/works/img3.jpg"></a></li>
|
|
<li><a href="javascript:;"><img alt="" src="assets/pages/img/people/img2-large.jpg"></a></li>
|
|
<li><a href="javascript:;"><img alt="" src="assets/pages/img/works/img2.jpg"></a></li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
<!-- END BOTTOM ABOUT BLOCK -->
|
|
|
|
<!-- BEGIN BOTTOM CONTACTS -->
|
|
<div class="col-md-4 col-sm-6 pre-footer-col">
|
|
<h2>Our Contacts</h2>
|
|
<address class="margin-bottom-40">
|
|
35, Lorem Lis Street, Park Ave<br>
|
|
California, US<br>
|
|
Phone: 300 323 3456<br>
|
|
Fax: 300 323 1456<br>
|
|
Email: <a href="mailto:info@metronic.com">info@metronic.com</a><br>
|
|
Skype: <a href="skype:metronic">metronic</a>
|
|
</address>
|
|
|
|
<div class="pre-footer-subscribe-box pre-footer-subscribe-box-vertical">
|
|
<h2>Newsletter</h2>
|
|
<p>Subscribe to our newsletter and stay up to date with the latest news and deals!</p>
|
|
<form action="#">
|
|
<div class="input-group">
|
|
<input type="text" placeholder="youremail@mail.com" class="form-control">
|
|
<span class="input-group-btn">
|
|
<button class="btn btn-primary" type="submit">Subscribe</button>
|
|
</span>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
<!-- END BOTTOM CONTACTS -->
|
|
|
|
<!-- BEGIN TWITTER BLOCK -->
|
|
<div class="col-md-4 col-sm-6 pre-footer-col">
|
|
<h2 class="margin-bottom-0">Latest Tweets</h2>
|
|
<a class="twitter-timeline" href="https://twitter.com/twitterapi" data-tweet-limit="2" data-theme="dark" data-link-color="#57C8EB" data-widget-id="455411516829736961" data-chrome="noheader nofooter noscrollbar noborders transparent">Loading tweets by @keenthemes...</a>
|
|
</div>
|
|
<!-- END TWITTER BLOCK -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- END PRE-FOOTER -->
|
|
|
|
<!-- BEGIN FOOTER -->
|
|
<div class="footer">
|
|
<div class="container">
|
|
<div class="row">
|
|
<!-- BEGIN COPYRIGHT -->
|
|
<div class="col-md-4 col-sm-4 padding-top-10">
|
|
2015 © Keenthemes. ALL Rights Reserved. <a href="javascript:;">Privacy Policy</a> | <a href="javascript:;">Terms of Service</a>
|
|
</div>
|
|
<!-- END COPYRIGHT -->
|
|
<!-- BEGIN PAYMENTS -->
|
|
<div class="col-md-4 col-sm-4">
|
|
<ul class="social-footer list-unstyled list-inline pull-right">
|
|
<li><a href="javascript:;"><i class="fa fa-facebook"></i></a></li>
|
|
<li><a href="javascript:;"><i class="fa fa-google-plus"></i></a></li>
|
|
<li><a href="javascript:;"><i class="fa fa-dribbble"></i></a></li>
|
|
<li><a href="javascript:;"><i class="fa fa-linkedin"></i></a></li>
|
|
<li><a href="javascript:;"><i class="fa fa-twitter"></i></a></li>
|
|
<li><a href="javascript:;"><i class="fa fa-skype"></i></a></li>
|
|
<li><a href="javascript:;"><i class="fa fa-github"></i></a></li>
|
|
<li><a href="javascript:;"><i class="fa fa-youtube"></i></a></li>
|
|
<li><a href="javascript:;"><i class="fa fa-dropbox"></i></a></li>
|
|
</ul>
|
|
</div>
|
|
<!-- END PAYMENTS -->
|
|
<!-- BEGIN POWERED -->
|
|
<div class="col-md-4 col-sm-4 text-right">
|
|
<p class="powered">Powered by: <a href="http://www.keenthemes.com/">KeenThemes.com</a></p>
|
|
</div>
|
|
<!-- END POWERED -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- END FOOTER -->
|
|
|
|
<!-- Load javascripts at bottom, this will reduce page load time -->
|
|
<!-- BEGIN CORE PLUGINS (REQUIRED FOR ALL PAGES) -->
|
|
<!--[if lt IE 9]>
|
|
<script src="assets/plugins/respond.min.js"></script>
|
|
<![endif]-->
|
|
<script src="assets/plugins/jquery.min.js" type="text/javascript"></script>
|
|
<script src="assets/plugins/jquery-migrate.min.js" type="text/javascript"></script>
|
|
<script src="assets/plugins/bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
|
|
<script src="assets/corporate/scripts/back-to-top.js" type="text/javascript"></script>
|
|
<!-- END CORE PLUGINS -->
|
|
|
|
<!-- BEGIN PAGE LEVEL JAVASCRIPTS (REQUIRED ONLY FOR CURRENT PAGE) -->
|
|
<script src="assets/plugins/fancybox/source/jquery.fancybox.pack.js" type="text/javascript"></script><!-- pop up -->
|
|
<script src="assets/plugins/owl.carousel/owl.carousel.min.js" type="text/javascript"></script><!-- slider for products -->
|
|
|
|
<script src="assets/corporate/scripts/layout.js" type="text/javascript"></script>
|
|
<script src="assets/pages/scripts/bs-carousel.js" type="text/javascript"></script>
|
|
<script type="text/javascript">
|
|
jQuery(document).ready(function() {
|
|
Layout.init();
|
|
Layout.initOWL();
|
|
Layout.initTwitter();
|
|
//Layout.initFixHeaderWithPreHeader(); /* Switch On Header Fixing (only if you have pre-header) */
|
|
//Layout.initNavScrolling();
|
|
});
|
|
</script>
|
|
<!-- END PAGE LEVEL JAVASCRIPTS -->
|
|
</body>
|
|
<!-- END BODY -->
|
|
</html> |