911 lines
64 KiB
HTML
911 lines
64 KiB
HTML
<!doctype html>
|
|
<html class="no-js" lang="en">
|
|
<head>
|
|
<title>H-Code | Responsive & Multi-Purpose One/Multi Page Template</title>
|
|
<meta name="description" content="H-Code - A premium portfolio template from ThemeZaa">
|
|
<meta name="keywords" content="">
|
|
<meta charset="utf-8">
|
|
<meta name="author" content="ThemeZaa">
|
|
<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1" />
|
|
<!-- favicon -->
|
|
<link rel="shortcut icon" href="images/favicon.png">
|
|
<link rel="apple-touch-icon" href="images/apple-touch-icon-57x57.png">
|
|
<link rel="apple-touch-icon" sizes="72x72" href="images/apple-touch-icon-72x72.png">
|
|
<link rel="apple-touch-icon" sizes="114x114" href="images/apple-touch-icon-114x114.png">
|
|
<!-- animation -->
|
|
<link rel="stylesheet" href="css/animate.css" />
|
|
<!-- bootstrap -->
|
|
<link rel="stylesheet" href="css/bootstrap.css" />
|
|
<!-- et line icon -->
|
|
<link rel="stylesheet" href="css/et-line-icons.css" />
|
|
<!-- font-awesome icon -->
|
|
<link rel="stylesheet" href="css/font-awesome.min.css" />
|
|
<!-- revolution slider -->
|
|
<link rel="stylesheet" href="css/extralayers.css" />
|
|
<link rel="stylesheet" href="css/settings.css" />
|
|
<!-- magnific popup -->
|
|
<link rel="stylesheet" href="css/magnific-popup.css" />
|
|
<!-- owl carousel -->
|
|
<link rel="stylesheet" href="css/owl.carousel.css" />
|
|
<link rel="stylesheet" href="css/owl.transitions.css" />
|
|
<link rel="stylesheet" href="css/full-slider.css" />
|
|
<!-- text animation -->
|
|
<link rel="stylesheet" href="css/text-effect.css" />
|
|
<!-- hamburger menu -->
|
|
<link rel="stylesheet" href="css/menu-hamburger.css" />
|
|
<!-- common -->
|
|
<link rel="stylesheet" href="css/style.css" />
|
|
<!-- responsive -->
|
|
<link rel="stylesheet" href="css/responsive.css" />
|
|
<!--[if IE]>
|
|
<link rel="stylesheet" href="css/style-ie.css" />
|
|
<![endif]-->
|
|
<!--[if IE]>
|
|
<script src="js/html5shiv.js"></script>
|
|
<![endif]-->
|
|
</head>
|
|
<body>
|
|
<!-- navigation -->
|
|
<div class="menu-wrap pull-menu">
|
|
<nav class="menu navigation-menu">
|
|
<!-- Brand and toggle get grouped for better mobile display -->
|
|
<div class="col-md-12 navbar-header no-padding clearfix text-center xs-text-left">
|
|
<a class="no-padding section-link" href="#home"><img src="images/logo-light-big.png" alt=""/></a>
|
|
</div>
|
|
<div class="col-md-12 no-padding clearfix">
|
|
<div class="no-padding" id="bs-example-navbar-collapse-1">
|
|
<ul class="nav navbar-default navbar-nav">
|
|
<li><a href="#home" class="section-link active">Home</a></li>
|
|
<li><a href="#about-us" class="section-link">About Us</a> </li>
|
|
<li><a href="#portfolio" class="section-link">Portfolio</a> </li>
|
|
<li><a href="#service" class="section-link">Service</a></li>
|
|
<li><a href="#team" class="section-link">Team</a></li>
|
|
<li><a href="#blog" class="section-link">Blog</a></li>
|
|
<li><a href="#contact" class="section-link">Contact</a></li>
|
|
<li><a href="index.html" class="section-link">Demos</a></li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-12 no-padding clearfix">
|
|
<div class="footer-social no-margin-bottom no-margin-lr text-center">
|
|
<!-- social media link -->
|
|
<a href="https://www.facebook.com/" target="_blank"><i class="fa fa-facebook icon"></i></a>
|
|
<a href="https://twitter.com/" target="_blank"><i class="fa fa-twitter"></i></a>
|
|
<a href="https://plus.google.com" target="_blank"><i class="fa fa-google-plus"></i></a>
|
|
<a href="https://www.linkedin.com/" target="_blank"><i class="fa fa-linkedin"></i></a>
|
|
<!-- end social media link -->
|
|
</div>
|
|
</div>
|
|
</nav>
|
|
<button class="close-button" id="close-button">Close Menu</button>
|
|
</div>
|
|
<button class="menu-button" id="open-button">Open Menu</button>
|
|
<!-- end navigation -->
|
|
<!-- parallax -->
|
|
<section id="home" class="parallax4 parallax-fix full-screen no-padding">
|
|
<img class="parallax-background-img" src="http://placehold.it/1920x1152" alt="" />
|
|
<div class="container full-screen position-relative">
|
|
<div class="slider-typography text-left">
|
|
<div class="slider-text-middle-main pull-right">
|
|
<div class="col-md-6 col-sm-8 contant-box position-absolute position-right bg-orange no-padding">
|
|
<div class="position-relative overflow-hidden padding-ten no-padding-bottom">
|
|
<h5 class="white-text text-big position-absolute">Design.</h5>
|
|
<div class="separator-line bg-white margin-bottom-eleven no-margin-top no-margin-lr xs-margin-bottom-ten"></div>
|
|
<h4 class="white-text slider-subtitle6 margin-bottom-eleven">Just make design to help your design better.</h4>
|
|
<h5 class="white-text text-big-title">Design.</h5>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
<!-- end parallax -->
|
|
<!-- parallax -->
|
|
<section id="home2" class="parallax3 parallax-fix full-screen no-padding">
|
|
<img class="parallax-background-img" src="http://placehold.it/1920x1300" alt="" />
|
|
<div class="container full-screen position-relative">
|
|
<div class="slider-typography text-left">
|
|
<div class="slider-text-middle-main pull-right">
|
|
<div class="col-md-6 col-sm-8 contant-box position-absolute position-left bg-yellow-ochre no-padding">
|
|
<div class="position-relative overflow-hidden padding-ten no-padding-bottom">
|
|
<h5 class="white-text text-big position-absolute">Branding.</h5>
|
|
<div class="separator-line bg-white margin-bottom-eleven no-margin-top no-margin-lr xs-margin-bottom-ten"></div>
|
|
<h4 class="white-text slider-subtitle6 margin-bottom-eleven">We specialise in creating successful brands</h4>
|
|
<h5 class="white-text text-big-title">Branding.</h5>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
<!-- end parallax -->
|
|
<!-- parallax -->
|
|
<section id="home3" class="parallax1 parallax-fix full-screen no-padding">
|
|
<img class="parallax-background-img" src="http://placehold.it/1920x1300" alt="" />
|
|
<div class="container full-screen position-relative">
|
|
<div class="slider-typography text-left">
|
|
<div class="slider-text-middle-main pull-right">
|
|
<div class="col-md-6 col-sm-8 contant-box position-absolute position-right bg-deep-brown no-padding">
|
|
<div class="position-relative overflow-hidden padding-ten no-padding-bottom">
|
|
<h5 class="white-text text-big position-absolute">Creative.</h5>
|
|
<div class="separator-line bg-white margin-bottom-eleven no-margin-top no-margin-lr xs-margin-bottom-ten"></div>
|
|
<h4 class="white-text slider-subtitle6 margin-bottom-eleven">A Hard Working, Creative Agency. Advertising.</h4>
|
|
<h5 class="white-text text-big-title">Creative.</h5>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
<!-- end parallax -->
|
|
<!-- about us section -->
|
|
<section id="about-us" class="no-padding-bottom">
|
|
<div class="container">
|
|
<div class="row">
|
|
<!-- section title -->
|
|
<div class="col-md-12 text-center">
|
|
<h3 class="section-title no-padding-bottom deep-gray-text">About Us</h3>
|
|
</div>
|
|
<!-- end section title -->
|
|
</div>
|
|
<div class="row">
|
|
<!-- section text -->
|
|
<div class="col-md-5 col-sm-7 center-col text-center margin-six margin-bottom-seven">
|
|
<h4 class="gray-text">We are a multi-discipline design studio with an extensive network of the finest talent, allowing us to build the perfect team to respond to your brief.</h4>
|
|
</div>
|
|
<!-- end section text -->
|
|
</div>
|
|
</div>
|
|
<!-- slider -->
|
|
<div id="myCarousel2" class="carousel slide carousel-slide">
|
|
<!-- slider indicators -->
|
|
<ol class="carousel-indicators xs-indicators-black">
|
|
<li data-target="#myCarousel2" data-slide-to="0" class="active"></li>
|
|
<li data-target="#myCarousel2" data-slide-to="1"></li>
|
|
<li data-target="#myCarousel2" data-slide-to="2"></li>
|
|
<li data-target="#myCarousel2" data-slide-to="3"></li>
|
|
</ol>
|
|
<!-- end slider indicators -->
|
|
<div class="carousel-inner xs-bg-gray">
|
|
<!-- slider item -->
|
|
<div class="item active">
|
|
<!-- set the first background image using inline CSS below. -->
|
|
<div class="fill xs-display-none" style="background-image:url('http://placehold.it/1920x543');"></div>
|
|
<div class="case-study-slider clearfix">
|
|
<div class="col-lg-7 col-md-9 col-sm-10 pull-right">
|
|
<div class="col-lg-3 col-md-3 col-sm-3 col-xs-12">
|
|
<span class="about-number black-text font-weight-400 letter-spacing-2 xs-no-border xs-no-padding-left">01</span>
|
|
</div>
|
|
<div class="col-lg-8 col-md-9 col-sm-9 col-xs-12 about-text position-relative">
|
|
<p class="title-small text-uppercase letter-spacing-3 black-text no-margin-bottom"><a href="#portfolio" class="inner-link">UI/UX and Graphics Design</a></p>
|
|
<span class="case-study-work letter-spacing-2">Brand Strategy | Graphic Design</span>
|
|
<p class="width-80">Lorem Ipsum is simply dummy text of the printing & typesetting industry. Lorem Ipsum has been the industry's standard dummy. Lorem Ipsum is simply dummy text of the printing & typesetting industry.</p>
|
|
<a class="highlight-button-black-border btn btn-small no-margin-bottom inner-link" href="#portfolio">View Portfolio</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- end slider item -->
|
|
<!-- slider item -->
|
|
<div class="item">
|
|
<!-- set the first background image using inline CSS below. -->
|
|
<div class="fill xs-display-none" style="background-image:url('http://placehold.it/1920x543');"></div>
|
|
<div class="case-study-slider clearfix">
|
|
<div class="col-lg-7 col-md-9 col-sm-10 pull-right">
|
|
<div class="col-lg-3 col-md-3 col-sm-3 col-xs-12">
|
|
<span class="about-number black-text font-weight-400 letter-spacing-2 xs-no-border xs-no-padding-left">02</span>
|
|
</div>
|
|
<div class="col-lg-8 col-md-9 col-sm-9 col-xs-12 about-text position-relative">
|
|
<p class="title-small text-uppercase letter-spacing-3 black-text no-margin-bottom"><a href="#portfolio" class="inner-link">Multimedia Animation</a></p>
|
|
<span class="case-study-work letter-spacing-2">Brand Strategy | Graphic Design</span>
|
|
<p class="width-80">Lorem Ipsum is simply dummy text of the printing & typesetting industry. Lorem Ipsum has been the industry's standard dummy. Lorem Ipsum is simply dummy text of the printing & typesetting industry.</p>
|
|
<a class="highlight-button-black-border btn btn-small no-margin-bottom inner-link" href="#portfolio">View Portfolio</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- end slider item -->
|
|
<!-- slider item -->
|
|
<div class="item">
|
|
<!-- set the first background image using inline CSS below. -->
|
|
<div class="fill xs-display-none" style="background-image:url('http://placehold.it/1920x543');"></div>
|
|
<div class="case-study-slider clearfix">
|
|
<div class="col-lg-7 col-md-9 col-sm-10 pull-right">
|
|
<div class="col-lg-3 col-md-3 col-sm-3 col-xs-12">
|
|
<span class="about-number black-text font-weight-400 letter-spacing-2 xs-no-border xs-no-padding-left">03</span>
|
|
</div>
|
|
<div class="col-lg-8 col-md-9 col-sm-9 col-xs-12 about-text position-relative">
|
|
<p class="title-small text-uppercase letter-spacing-3 black-text no-margin-bottom"><a href="#portfolio" class="inner-link">Packaging Design</a></p>
|
|
<span class="case-study-work letter-spacing-2">Brand Strategy | Graphic Design</span>
|
|
<p class="width-80">Lorem Ipsum is simply dummy text of the printing & typesetting industry. Lorem Ipsum has been the industry's standard dummy. Lorem Ipsum is simply dummy text of the printing & typesetting industry.</p>
|
|
<a class="highlight-button-black-border btn btn-small no-margin-bottom inner-link" href="#portfolio">View Portfolio</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- end slider item -->
|
|
<!-- slider item -->
|
|
<div class="item">
|
|
<!-- set the first background image using inline CSS below. -->
|
|
<div class="fill xs-display-none" style="background-image:url('http://placehold.it/1920x543');"></div>
|
|
<div class="case-study-slider clearfix">
|
|
<div class="col-lg-7 col-md-9 col-sm-10 pull-right">
|
|
<div class="col-lg-3 col-md-3 col-sm-3 col-xs-12">
|
|
<span class="about-number black-text font-weight-400 letter-spacing-2 xs-no-border xs-no-padding-left">04</span>
|
|
</div>
|
|
<div class="col-lg-8 col-md-9 col-sm-9 col-xs-12 about-text position-relative">
|
|
<p class="title-small text-uppercase letter-spacing-3 black-text no-margin-bottom"><a href="#portfolio" class="inner-link">Branding and Identity</a></p>
|
|
<span class="case-study-work letter-spacing-2">Brand Strategy | Graphic Design</span>
|
|
<p class="width-80">Lorem Ipsum is simply dummy text of the printing & typesetting industry. Lorem Ipsum has been the industry's standard dummy. Lorem Ipsum is simply dummy text of the printing & typesetting industry.</p>
|
|
<a class="highlight-button-black-border btn btn-small no-margin-bottom inner-link" href="#portfolio">View Portfolio</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- end slider item -->
|
|
</div>
|
|
<!-- slider controls -->
|
|
<a class="left carousel-control" href="#myCarousel2" data-slide="prev"> <img src="images/arrow-pre.png" alt=""/> </a> <a class="right carousel-control" href="#myCarousel2" data-slide="next"> <img src="images/arrow-next.png" alt=""/> </a>
|
|
<!-- end slider controls -->
|
|
</div>
|
|
<!-- end slider -->
|
|
</section>
|
|
<!-- end about us section -->
|
|
<!-- portfolio section -->
|
|
<section id="portfolio" class="no-padding-bottom">
|
|
<div class="container">
|
|
<div class="row">
|
|
<!-- section title -->
|
|
<div class="col-md-12 text-center">
|
|
<h3 class="section-title no-padding-bottom deep-gray-text">Portfolio</h3>
|
|
</div>
|
|
<!-- end section title -->
|
|
<!-- section text -->
|
|
<div class="col-md-5 col-sm-7 center-col text-center margin-six margin-bottom-seven">
|
|
<h4 class="gray-text">Lorem Ipsum is simply dummy text of the printing & typesetting industry. Lorem Ipsum has been the industry's standard dummy </h4>
|
|
</div>
|
|
<!-- end section text -->
|
|
</div>
|
|
</div>
|
|
<div class="container-fluid">
|
|
<div class="row">
|
|
<div class="col-md-12 text-center">
|
|
<div class="text-center">
|
|
<ul class="portfolio-filter nav nav-tabs margin-one no-margin-top xs-margin-bottom-seven">
|
|
<li class="nav active"><a href="#" data-filter="*">All</a></li>
|
|
<li class="nav"><a href="#" data-filter=".design">Design</a></li>
|
|
<li class="nav"><a href="#" data-filter=".graphics">Graphics</a></li>
|
|
<li class="nav"><a href="#" data-filter=".branding">Branding</a></li>
|
|
<li class="nav"><a href="#" data-filter=".photography">Photography</a></li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
<div class="grid-gallery overflow-hidden" >
|
|
<div class="tab-content">
|
|
<ul class="masonry-items grid">
|
|
<!-- portfolio item -->
|
|
<li class="photography graphics">
|
|
<figure>
|
|
<div class="gallery-img"><a href="onepage-single-project-page1.html" class="simple-ajax-popup-align-top"><img src="http://placehold.it/480x358" alt=""></a></div>
|
|
<figcaption>
|
|
<h3><a href="onepage-single-project-page1.html" class="simple-ajax-popup-align-top">Herbal Beauty Salon</a></h3>
|
|
<p>Ajax popup - Style #1</p>
|
|
</figcaption>
|
|
</figure>
|
|
</li>
|
|
<!-- end portfolio item -->
|
|
<!-- portfolio item -->
|
|
<li class="graphics design lightbox-gallery">
|
|
<figure>
|
|
<div class="gallery-img"><a href="http://placehold.it/1200x800" title=""><img src="http://placehold.it/480x716" alt=""></a>
|
|
<a href="http://placehold.it/1200x800" title=""></a>
|
|
<a href="http://placehold.it/1200x800" title=""></a>
|
|
</div>
|
|
<figcaption>
|
|
<h3>Pixflow Studio</h3>
|
|
<p>Lightbox gallery</p>
|
|
</figcaption>
|
|
</figure>
|
|
</li>
|
|
<!-- end portfolio item -->
|
|
<!-- portfolio item -->
|
|
<li class="branding graphics design">
|
|
<figure>
|
|
<div class="gallery-img"><a href="onepage-single-project-page3.html" class="simple-ajax-popup-align-top"><img src="http://placehold.it/480x358" alt=""></a></div>
|
|
<figcaption>
|
|
<h3><a href="onepage-single-project-page3.html" class="simple-ajax-popup-align-top">Kaya Skin Care</a></h3>
|
|
<p>Ajax popup - Style #3</p>
|
|
</figcaption>
|
|
</figure>
|
|
</li>
|
|
<!-- end portfolio item -->
|
|
<!-- portfolio item -->
|
|
<li class="photography branding design graphics">
|
|
<figure>
|
|
<div class="gallery-img"><a href="onepage-single-project-page5.html" class="simple-ajax-popup-align-top"><img src="http://placehold.it/480x358" alt=""></a></div>
|
|
<figcaption>
|
|
<h3><a href="onepage-single-project-page1.html" class="simple-ajax-popup-align-top">Rubber Studio</a></h3>
|
|
<p>Ajax popup - Style #5</p>
|
|
</figcaption>
|
|
</figure>
|
|
</li>
|
|
<!-- end portfolio item -->
|
|
<!-- portfolio item -->
|
|
<li class="photography design branding">
|
|
<figure>
|
|
<div class="gallery-img"><a href="onepage-single-project-page2.html" class="simple-ajax-popup-align-top"><img src="http://placehold.it/480x358" alt=""></a></div>
|
|
<figcaption>
|
|
<h3><a href="onepage-single-project-page2.html" class="simple-ajax-popup-align-top">Tailoring Interior </a></h3>
|
|
<p>Ajax popup - Style #2</p>
|
|
</figcaption>
|
|
</figure>
|
|
</li>
|
|
<!-- end portfolio item -->
|
|
<!-- portfolio item -->
|
|
<li class="photography branding">
|
|
<figure>
|
|
<div class="gallery-img"><a href="onepage-single-project-page4.html" class="simple-ajax-popup-align-top"><img src="http://placehold.it/480x358" alt=""></a></div>
|
|
<figcaption>
|
|
<h3><a href="onepage-single-project-page5.html" class="simple-ajax-popup-align-top">Third Eye Glasses</a></h3>
|
|
<p>Ajax popup - Style #4</p>
|
|
</figcaption>
|
|
</figure>
|
|
</li>
|
|
<!-- end portfolio item -->
|
|
<!-- portfolio item -->
|
|
<li class="photography branding design graphics">
|
|
<figure>
|
|
<div class="gallery-img"><a href="onepage-single-project-page5.html" class="simple-ajax-popup-align-top"><img src="http://placehold.it/480x358" alt=""></a></div>
|
|
<figcaption>
|
|
<h3><a href="onepage-single-project-page1.html" class="simple-ajax-popup-align-top">Rubber Studio</a></h3>
|
|
<p>Ajax popup - Style #5</p>
|
|
</figcaption>
|
|
</figure>
|
|
</li>
|
|
<!-- end portfolio item -->
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
<!-- end portfolio section -->
|
|
<!-- counter section -->
|
|
<section id="counter">
|
|
<div class="container">
|
|
<div class="row wow fadeInUp">
|
|
<!-- counter item -->
|
|
<div class="col-md-3 col-sm-6 bottom-margin text-center counter-section sm-margin-bottom-ten">
|
|
<i class="icon-heart medium-icon"></i><span class="timer counter-number alt-font" data-to="741" data-speed="7000"></span><span class="counter-title">Pizzas Ordered</span>
|
|
</div>
|
|
<!-- end counter item -->
|
|
<!-- counter item -->
|
|
<div class="col-md-3 col-sm-6 bottom-margin text-center counter-section sm-margin-bottom-ten">
|
|
<i class="icon-happy medium-icon"></i><span class="timer counter-number alt-font" data-to="365" data-speed="7000"></span><span class="counter-title">Happy Clients</span>
|
|
</div>
|
|
<!-- end counter item -->
|
|
<!-- counter item -->
|
|
<div class="col-md-3 col-sm-6 bottom-margin-small text-center counter-section xs-margin-bottom-ten">
|
|
<i class="icon-anchor medium-icon"></i><span class="timer counter-number alt-font" data-to="498" data-speed="7000"></span><span class="counter-title">Projects Completed</span>
|
|
</div>
|
|
<!-- end counter item -->
|
|
<!-- counter item -->
|
|
<div class="col-md-3 col-sm-6 text-center counter-section">
|
|
<i class="icon-chat medium-icon"></i><span class="timer counter-number alt-font" data-to="625" data-speed="7000"></span><span class="counter-title">Comments Reserved</span>
|
|
</div>
|
|
<!-- end counter item -->
|
|
</div>
|
|
</div>
|
|
</section>
|
|
<!-- end counter section -->
|
|
<!-- services section -->
|
|
<section id="service" class="parallax9 parallax-fix">
|
|
<img class="parallax-background-img" src="http://placehold.it/1920x1400" alt="" />
|
|
<div class="container">
|
|
<div class="row">
|
|
<!-- section title -->
|
|
<div class="col-xs-12 text-center">
|
|
<h3 class="section-title no-padding-bottom deep-gray-text margin-ten no-margin-top">Our Service</h3>
|
|
</div>
|
|
<!-- end section title -->
|
|
</div>
|
|
<div class="row">
|
|
<div class="col-md-4 col-sm-12">
|
|
<!-- section item -->
|
|
<div class="features-section col-md-12 col-sm-6 no-padding wow fadeInUp">
|
|
<div class="col-md-3 col-sm-2 col-xs-2 no-padding"><i class="icon-toolbox medium-icon"></i></div>
|
|
<div class="col-md-9 col-sm-9 col-xs-9 no-padding text-left f-right">
|
|
<h5 class="deep-gray-text">Branding</h5>
|
|
<div class="separator-line bg-yellow"></div>
|
|
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry.</p>
|
|
</div>
|
|
</div>
|
|
<!-- end section item -->
|
|
<!-- section item -->
|
|
<div class="features-section no-margin col-md-12 col-sm-6 no-padding wow fadeInUp">
|
|
<div class="col-md-3 col-sm-2 col-xs-2 no-padding"><i class="icon-camera medium-icon"></i></div>
|
|
<div class="col-md-9 col-sm-9 col-xs-9 no-padding text-left f-right">
|
|
<h5 class="deep-gray-text">Photography</h5>
|
|
<div class="separator-line bg-yellow"></div>
|
|
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the standard dummy text.</p>
|
|
</div>
|
|
</div>
|
|
<!-- end section item -->
|
|
</div>
|
|
<div class="col-md-4 col-sm-12">
|
|
<!-- section item -->
|
|
<div class="features-section col-md-12 col-sm-6 no-padding wow fadeInUp">
|
|
<div class="col-md-3 col-sm-2 col-xs-2 no-padding"><i class="icon-megaphone medium-icon"></i></div>
|
|
<div class="col-md-9 col-sm-9 col-xs-9 no-padding text-left f-right">
|
|
<h5 class="deep-gray-text">Advertising</h5>
|
|
<div class="separator-line bg-yellow"></div>
|
|
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the standard dummy text.</p>
|
|
</div>
|
|
</div>
|
|
<!-- end section item -->
|
|
<!-- section item -->
|
|
<div class="features-section no-margin col-md-12 col-sm-6 no-padding wow fadeInUp">
|
|
<div class="col-md-3 col-sm-2 col-xs-2 no-padding"><i class="icon-scissors medium-icon"></i></div>
|
|
<div class="col-md-9 col-sm-9 col-xs-9 no-padding text-left f-right">
|
|
<h5 class="deep-gray-text">Packaging</h5>
|
|
<div class="separator-line bg-yellow"></div>
|
|
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the standard dummy text.</p>
|
|
</div>
|
|
</div>
|
|
<!-- end section item -->
|
|
</div>
|
|
<div class="col-md-4 col-sm-12">
|
|
<!-- section item -->
|
|
<div class="features-section no-bottom-margin col-md-12 col-sm-6 no-padding wow fadeInUp">
|
|
<div class="col-md-3 col-sm-2 col-xs-2 no-padding"><i class="icon-tools medium-icon"></i></div>
|
|
<div class="col-md-9 col-sm-9 col-xs-9 no-padding text-left f-right">
|
|
<h5 class="deep-gray-text">Graphic Design</h5>
|
|
<div class="separator-line bg-yellow"></div>
|
|
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the standard dummy text.</p>
|
|
</div>
|
|
</div>
|
|
<!-- end section item -->
|
|
<!-- section item -->
|
|
<div class="features-section no-margin col-md-12 col-sm-6 no-padding wow fadeInUp">
|
|
<div class="col-md-3 col-sm-2 col-xs-2 no-padding"><i class="icon-layers medium-icon"></i></div>
|
|
<div class="col-md-9 col-sm-9 col-xs-9 no-padding text-left f-right">
|
|
<h5 class="deep-gray-text">Production</h5>
|
|
<div class="separator-line bg-yellow"></div>
|
|
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the standard dummy text.</p>
|
|
</div>
|
|
</div>
|
|
<!-- end section item -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
<!-- end services section -->
|
|
<!-- team section -->
|
|
<section id="team" class="xs-no-padding-bottom">
|
|
<div class="container">
|
|
<div class="row">
|
|
<!-- section title -->
|
|
<div class="col-md-12 text-center">
|
|
<h3 class="section-title no-padding-bottom deep-gray-text">Our Team</h3>
|
|
</div>
|
|
<!-- end section title -->
|
|
<!-- section text -->
|
|
<div class="col-md-5 col-sm-7 center-col text-center margin-six margin-bottom-seven">
|
|
<h4 class="gray-text">We are a multi-discipline design studio with an extensive network of the finest talent, allowing us to build the perfect team to respond to your brief.</h4>
|
|
</div>
|
|
<!-- end section text -->
|
|
</div>
|
|
<div class="row margin-six">
|
|
<div id="blog-slider" class="owl-carousel owl-theme dark-pagination owl-no-pagination team-agency">
|
|
<!-- team member -->
|
|
<div class="item wow fadeInUp" data-wow-duration="300ms">
|
|
<div class="text-center team-member position-relative wow fadeInUp" data-wow-duration="300ms">
|
|
<img src="http://placehold.it/900x990" alt=""/>
|
|
<figure class="position-relative bg-white">
|
|
<span class="team-name text-uppercase black-text letter-spacing-2 display-block font-weight-600">Alexander Harvard</span>
|
|
<span class="team-post text-uppercase letter-spacing-2 display-block">Co Founder / CEO</span>
|
|
<div class="person-social margin-five no-margin-bottom"><a href="#"><i class="fa fa-facebook"></i></a><a href="#"><i class="fa fa-twitter"></i></a><a href="#"><i class="fa fa-google-plus"></i></a></div>
|
|
</figure>
|
|
<div class="team-details">
|
|
<h5 class="team-headline white-text text-uppercase font-weight-600">I am Punctual</h5>
|
|
<p class="width-80 center-col light-gray-text margin-five">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been.</p>
|
|
<div class="separator-line-thick bg-white"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- end team member -->
|
|
<!-- team member -->
|
|
<div class="text-center team-member position-relative wow fadeInUp" data-wow-duration="600ms">
|
|
<img src="http://placehold.it/900x990" alt=""/>
|
|
<figure class="position-relative bg-white">
|
|
<span class="team-name text-uppercase black-text letter-spacing-2 display-block font-weight-600">Herman Miller</span>
|
|
<span class="team-post text-uppercase letter-spacing-2 display-block">Co-Founder / Design</span>
|
|
<div class="person-social margin-five no-margin-bottom"><a href="#"><i class="fa fa-facebook"></i></a><a href="#"><i class="fa fa-twitter"></i></a><a href="#"><i class="fa fa-google-plus"></i></a></div>
|
|
</figure>
|
|
<div class="team-details">
|
|
<h5 class="team-headline white-text text-uppercase font-weight-600">I am Creative</h5>
|
|
<p class="width-80 center-col light-gray-text margin-five">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been.</p>
|
|
<div class="separator-line-thick bg-white"></div>
|
|
</div>
|
|
</div>
|
|
<!-- end team member -->
|
|
<!-- team member -->
|
|
<div class="text-center team-member position-relative wow fadeInUp" data-wow-duration="900ms">
|
|
<img src="http://placehold.it/900x990" alt=""/>
|
|
<figure class="position-relative bg-white">
|
|
<span class="team-name text-uppercase black-text letter-spacing-2 display-block font-weight-600">Bryan Jonhson</span>
|
|
<span class="team-post text-uppercase letter-spacing-2 display-block">Art Director</span>
|
|
<div class="person-social margin-five no-margin-bottom"><a href="#"><i class="fa fa-facebook"></i></a><a href="#"><i class="fa fa-twitter"></i></a><a href="#"><i class="fa fa-google-plus"></i></a></div>
|
|
</figure>
|
|
<div class="team-details">
|
|
<h5 class="team-headline white-text text-uppercase font-weight-600">I am Hungry</h5>
|
|
<p class="width-80 center-col light-gray-text margin-five">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been.</p>
|
|
<div class="separator-line-thick bg-white"></div>
|
|
</div>
|
|
</div>
|
|
<!-- end team member -->
|
|
<!-- team member -->
|
|
<div class="text-center team-member position-relative wow fadeInUp" data-wow-duration="300ms">
|
|
<img src="http://placehold.it/900x990" alt=""/>
|
|
<figure class="position-relative bg-white">
|
|
<span class="team-name text-uppercase black-text letter-spacing-2 display-block font-weight-600">Jeremy Dupont</span>
|
|
<span class="team-post text-uppercase letter-spacing-2 display-block">Creative Director</span>
|
|
<div class="person-social margin-five no-margin-bottom"><a href="#"><i class="fa fa-facebook"></i></a><a href="#"><i class="fa fa-twitter"></i></a><a href="#"><i class="fa fa-google-plus"></i></a></div>
|
|
</figure>
|
|
<div class="team-details">
|
|
<h5 class="team-headline white-text text-uppercase font-weight-600">I am Creative</h5>
|
|
<p class="width-80 center-col light-gray-text margin-five">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been.</p>
|
|
<div class="separator-line-thick bg-white"></div>
|
|
</div>
|
|
</div>
|
|
<!-- end team member -->
|
|
<!-- team member -->
|
|
<div class="text-center team-member position-relative wow fadeInUp" data-wow-duration="600ms">
|
|
<img src="http://placehold.it/900x990" alt=""/>
|
|
<figure class="position-relative bg-white">
|
|
<span class="team-name text-uppercase black-text letter-spacing-2 display-block font-weight-600">Steve Anders</span>
|
|
<span class="team-post text-uppercase letter-spacing-2 display-block">Head Developer</span>
|
|
<div class="person-social margin-five no-margin-bottom"><a href="#"><i class="fa fa-facebook"></i></a><a href="#"><i class="fa fa-twitter"></i></a><a href="#"><i class="fa fa-google-plus"></i></a></div>
|
|
</figure>
|
|
<div class="team-details">
|
|
<h5 class="team-headline white-text text-uppercase font-weight-600">I am Leader</h5>
|
|
<p class="width-80 center-col light-gray-text margin-five">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been.</p>
|
|
<div class="separator-line-thick bg-white"></div>
|
|
</div>
|
|
</div>
|
|
<!-- end team member -->
|
|
<!-- team member -->
|
|
<div class="text-center team-member position-relative wow fadeInUp" data-wow-duration="900ms">
|
|
<img src="http://placehold.it/900x990" alt=""/>
|
|
<figure class="position-relative bg-white">
|
|
<span class="team-name text-uppercase black-text letter-spacing-2 display-block font-weight-600">Bryan Johnson</span>
|
|
<span class="team-post text-uppercase letter-spacing-2 display-block">HR Manager</span>
|
|
<div class="person-social margin-five no-margin-bottom"><a href="#"><i class="fa fa-facebook"></i></a><a href="#"><i class="fa fa-twitter"></i></a><a href="#"><i class="fa fa-google-plus"></i></a></div>
|
|
</figure>
|
|
<div class="team-details">
|
|
<h5 class="team-headline white-text text-uppercase font-weight-600">I am Creative</h5>
|
|
<p class="width-80 center-col light-gray-text margin-five">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been.</p>
|
|
<div class="separator-line-thick bg-white"></div>
|
|
</div>
|
|
</div>
|
|
<!-- end team member -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
<!-- end team section -->
|
|
<!-- feature box section -->
|
|
<section class="no-padding">
|
|
<div class="container-fluid">
|
|
<div class="row">
|
|
<div class="col-md-4 col-sm-12 col-xs-12 no-padding bg-yellow-ochre sm-text-center">
|
|
<div class="no-padding-bottom reasons">
|
|
<span class="white-text slider-title-big2">01,<span>Insights</span></span>
|
|
<p class="white-text">Lorem Ipsum is simply dummy text of the typesetting industry. Ipsum has been.</p>
|
|
<img src="http://placehold.it/308x264" alt="" />
|
|
</div>
|
|
</div>
|
|
<div class="col-md-4 col-sm-12 col-xs-12 no-padding bg-orange sm-text-center">
|
|
<div class="no-padding-bottom reasons">
|
|
<span class="white-text slider-title-big2">02,<span>Strategy</span></span>
|
|
<p class="white-text">Lorem Ipsum is simply dummy text of the typesetting industry. Ipsum has been.</p>
|
|
<img src="http://placehold.it/308x264" alt="" />
|
|
</div>
|
|
</div>
|
|
<div class="col-md-4 col-sm-12 col-xs-12 no-padding bg-deep-brown sm-text-center">
|
|
<div class="no-padding-bottom reasons">
|
|
<span class="white-text slider-title-big2">03,<span>Realisation</span></span>
|
|
<p class="white-text">Lorem Ipsum is simply dummy text of the typesetting industry. Ipsum has been.</p>
|
|
<img src="http://placehold.it/308x264" alt="" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
<!-- end feature box section -->
|
|
<!-- blog section -->
|
|
<section id="blog">
|
|
<div class="container">
|
|
<div class="row">
|
|
<!-- section title -->
|
|
<div class="col-xs-12 text-center">
|
|
<h3 class="section-title no-padding-bottom deep-gray-text margin-ten no-margin-top">Blog</h3>
|
|
</div>
|
|
<!-- end section title -->
|
|
</div>
|
|
<div class="row">
|
|
<!-- post item -->
|
|
<div class="col-md-4 col-sm-4 col-xs-12 blog-listing wow fadeInUp xs-margin-bottom-seven" data-wow-duration="300ms">
|
|
<div class="blog-image"><a href="blog-single-right-sidebar.html"><img src="http://placehold.it/800x500" alt=""/></a></div>
|
|
<div class="blog-details">
|
|
<div class="blog-date">Posted by <a href="blog-masonry-2columns.html">Paul Scrivens</a> | 02 January 2015</div>
|
|
<div class="blog-title"><a href="blog-single-right-sidebar.html">Minimum Usable Design</a></div>
|
|
<div class="blog-short-description">Lorem Ipsum is simply dummy text of the printing and typesetting industry.</div>
|
|
<div class="separator-line bg-black no-margin-lr"></div>
|
|
</div>
|
|
</div>
|
|
<!-- end post item -->
|
|
<!-- post item -->
|
|
<div class="col-md-4 col-sm-4 col-xs-12 blog-listing wow fadeInUp xs-margin-bottom-seven" data-wow-duration="600ms">
|
|
<div class="blog-image"><a href="blog-single-right-sidebar.html"><img src="http://placehold.it/800x500" alt=""/></a></div>
|
|
<div class="blog-details">
|
|
<div class="blog-date">Posted by <a href="blog-masonry-2columns.html">Paul Scrivens</a> | 02 January 2015</div>
|
|
<div class="blog-title"><a href="blog-single-right-sidebar.html">You Design It, They Do It</a></div>
|
|
<div class="blog-short-description">Lorem Ipsum is simply dummy text of the printing and typesetting industry.</div>
|
|
<div class="separator-line bg-black no-margin-lr"></div>
|
|
</div>
|
|
</div>
|
|
<!-- end post item -->
|
|
<!-- post item -->
|
|
<div class="col-md-4 col-sm-4 col-xs-12 blog-listing wow fadeInUp" data-wow-duration="900ms">
|
|
<div class="blog-image"><a href="blog-single-right-sidebar.html"><img src="http://placehold.it/800x500" alt=""/></a></div>
|
|
<div class="blog-details">
|
|
<div class="blog-date">Posted by <a href="blog-masonry-2columns.html">Nathan Ford</a> | 02 January 2015</div>
|
|
<div class="blog-title"><a href="blog-single-right-sidebar.html">For A More Readable Web Page</a></div>
|
|
<div class="blog-short-description">Lorem Ipsum is simply dummy text of the printing and typesetting industry.</div>
|
|
<div class="separator-line bg-black no-margin-lr"></div>
|
|
</div>
|
|
</div>
|
|
<!-- end post item -->
|
|
</div>
|
|
<div class="row">
|
|
<div class="col-md-12 text-center">
|
|
<a href="blog-grid-full-width.html" class="btn btn-black btn-small margin-four no-margin-bottom">View All Blog</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
<!-- end blog section -->
|
|
<!-- testimonial section -->
|
|
<section id="testimonial" class="fix-background" style="background-image:url('http://placehold.it/1920x1100');">
|
|
<div class="opacity-full bg-dark-gray"></div>
|
|
<div class="container">
|
|
<div class="col-md-6 text-center center-col position-relative wow fadeIn xs-no-padding">
|
|
<div class="carousel slide jumbotron testimonial" id="slider-content">
|
|
<ol class="carousel-indicators">
|
|
<li data-slide-to="0" data-target="#slider-content" class="active"></li>
|
|
<li data-slide-to="1" data-target="#slider-content" class=""></li>
|
|
<li data-slide-to="2" data-target="#slider-content" class=""></li>
|
|
</ol>
|
|
<div class="carousel-inner">
|
|
<!-- testimonial item -->
|
|
<div class="item active">
|
|
<div class="col-md-11 testimonial-style2 center-col text-center">
|
|
<img src="http://placehold.it/300x300" alt=""/>
|
|
<p class="white-text text-med">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.</p>
|
|
<span class="name white-text text-med font-weight-400">John Carmack - Google</span>
|
|
<i class="fa fa-quote-left small-icon yellow-text display-block margin-five no-margin-bottom"></i>
|
|
</div>
|
|
</div>
|
|
<!-- end testimonial item -->
|
|
<!-- testimonial item -->
|
|
<div class="item">
|
|
<div class="col-md-11 testimonial-style2 center-col text-center">
|
|
<img src="http://placehold.it/300x300" alt=""/>
|
|
<p class="white-text text-med">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.</p>
|
|
<span class="name white-text text-med font-weight-400">Dallas Groot - Facebook</span>
|
|
<i class="fa fa-quote-left small-icon yellow-text display-block margin-five no-margin-bottom"></i>
|
|
</div>
|
|
</div>
|
|
<!-- end testimonial item -->
|
|
<!-- testimonial item -->
|
|
<div class="item">
|
|
<div class="col-md-11 testimonial-style2 center-col text-center">
|
|
<img src="http://placehold.it/300x300" alt=""/>
|
|
<p class="white-text text-med">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.</p>
|
|
<span class="name white-text text-med font-weight-400">Adario Strange - Apple</span>
|
|
<i class="fa fa-quote-left small-icon yellow-text display-block margin-five no-margin-bottom"></i>
|
|
</div>
|
|
</div>
|
|
<!-- end testimonial item -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
<!-- end testimonial section -->
|
|
<!-- contact us section -->
|
|
<section id="contact">
|
|
<div class="container">
|
|
<div class="row">
|
|
<div class="col-md-12 text-center no-padding">
|
|
<h3 class="section-title">Contact Us</h3>
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="col-md-9 text-center center-col">
|
|
<div class="col-md-4 col-sm-4 text-center xs-margin-bottom-ten"><i class="icon-phone medium-icon black-text"></i><h6 class="black-text margin-two no-margin-bottom">123-456-7890</h6></div>
|
|
<div class="col-md-4 col-sm-4 text-center xs-margin-bottom-ten"><i class="icon-map-pin medium-icon black-text"></i><h6 class="black-text margin-two no-margin-bottom">Victoria, United States</h6></div>
|
|
<div class="col-md-4 col-sm-4 text-center"><i class="icon-envelope medium-icon black-text"></i><h6 class="black-text margin-two no-margin-bottom"><a href="mailto:no-reply@domain.com" class="black-text">no-reply@domain.com</a></h6></div>
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<!-- form -->
|
|
<form id="contactusform" action="javascript:void(0)" method="post">
|
|
<div class="col-md-10 col-sm-12 center-col">
|
|
<div class="row"><div class="col-md-12 col-sm-12"><div class="wide-separator-line margin-ten"></div></div>
|
|
<div class="col-md-12 col-sm-12"><div id="success"></div></div>
|
|
</div>
|
|
<div class="col-md-6 col-sm-12">
|
|
<input name="name" type="text" placeholder="Your Name" />
|
|
<input name="email" type="text" placeholder="Your Email" />
|
|
</div>
|
|
<div class="col-md-6 col-sm-12">
|
|
<textarea name="comment" placeholder="Your Message" ></textarea>
|
|
</div>
|
|
<div class="col-md-12 col-sm-12">
|
|
<div class="col-md-6 col-sm-6 no-padding-left"><span class="required">*Please complete all fields correctly</span></div>
|
|
<div class="col-md-3 col-sm-6 f-right no-padding-right"><input id="contact-us-button" name="send message" type="button" value="send message" class="btn btn-black no-margin-top f-right no-margin-lr"></div>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
<!-- end form -->
|
|
</div>
|
|
</div>
|
|
</section>
|
|
<!-- end contact us section -->
|
|
<!-- piechart section -->
|
|
<section id="piechart" class="bg-black">
|
|
<div class="container">
|
|
<div class="row">
|
|
<div class="col-md-10 text-center center-col">
|
|
<!-- piechart item -->
|
|
<div class="col-md-3 col-sm-3 xs-margin-bottom-ten">
|
|
<div class="chart-percent"><span class="chart white-text" data-percent="75"><span class="percent"></span> </span></div>
|
|
<div class="chart-text">
|
|
<h5 class="white-text">Consulting</h5>
|
|
<p>Expert, 7 years</p>
|
|
</div>
|
|
</div>
|
|
<!-- end piechart item -->
|
|
<!-- piechart item -->
|
|
<div class="col-md-3 col-sm-3 xs-margin-bottom-ten">
|
|
<div class="chart-percent"><span class="chart white-text" data-percent="88"><span class="percent"></span></span></div>
|
|
<div class="chart-text">
|
|
<h5 class="white-text">Planning</h5>
|
|
<p>Expert, 9 years</p>
|
|
</div>
|
|
</div>
|
|
<!-- end piechart item -->
|
|
<!-- piechart item -->
|
|
<div class="col-md-3 col-sm-3 xs-margin-bottom-ten">
|
|
<div class="chart-percent"><span class="chart white-text" data-percent="90"><span class="percent"></span> </span></div>
|
|
<div class="chart-text">
|
|
<h5 class="white-text">Design</h5>
|
|
<p>Expert, 5 years</p>
|
|
</div>
|
|
</div>
|
|
<!-- end piechart item -->
|
|
<!-- piechart item -->
|
|
<div class="col-md-3 col-sm-3">
|
|
<div class="chart-percent"><span class="chart white-text" data-percent="96"><span class="percent"></span> </span></div>
|
|
<div class="chart-text">
|
|
<h5 class="white-text">Building</h5>
|
|
<p>Expert, 4 years</p>
|
|
</div>
|
|
</div>
|
|
<!-- end piechart item -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
<!-- end piechart section -->
|
|
<!-- footer -->
|
|
<footer>
|
|
<div class=" bg-white footer-top">
|
|
<div class="container">
|
|
<div class="row margin-four">
|
|
<!-- phone -->
|
|
<div class="col-md-4 col-sm-4 text-center"><i class="icon-phone small-icon black-text"></i><h6 class="black-text margin-two no-margin-bottom">123-456-7890</h6></div>
|
|
<!-- end phone -->
|
|
<!-- address -->
|
|
<div class="col-md-4 col-sm-4 text-center"><i class="icon-map-pin small-icon black-text"></i><h6 class="black-text margin-two no-margin-bottom">Victoria, United States</h6></div>
|
|
<!-- end address -->
|
|
<!-- email -->
|
|
<div class="col-md-4 col-sm-4 text-center"><i class="icon-envelope small-icon black-text"></i><h6 class="margin-two no-margin-bottom"><a href="mailto:no-reply@domain.com" class="black-text">no-reply@domain.com</a></h6></div>
|
|
<!-- end email -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="container onepage-footer-middle">
|
|
<div class="row">
|
|
<div class="col-md-12 col-sm-12 footer-social text-right text-center">
|
|
<!-- social media link -->
|
|
<a target="_blank" href="https://www.facebook.com/"><i class="fa fa-facebook"></i></a>
|
|
<a target="_blank" href="https://twitter.com/"><i class="fa fa-twitter"></i></a>
|
|
<a target="_blank" href="https://plus.google.com"><i class="fa fa-google-plus"></i></a>
|
|
<a target="_blank" href="https://dribbble.com/"><i class="fa fa-dribbble"></i></a>
|
|
<a target="_blank" href="https://www.youtube.com/"><i class="fa fa-youtube"></i></a>
|
|
<a target="_blank" href="https://www.linkedin.com/"><i class="fa fa-linkedin"></i></a>
|
|
<!-- end social media link -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="container-fluid bg-dark-gray footer-bottom">
|
|
<div class="container">
|
|
<div class="row margin-three">
|
|
<!-- copyright -->
|
|
<div class="col-md-6 col-sm-6 col-xs-12 copyright text-left letter-spacing-1 xs-text-center xs-margin-bottom-one">
|
|
© 2015 H-Code is proudly powered by ThemeZaa.
|
|
</div>
|
|
<!-- end copyright -->
|
|
<!-- logo -->
|
|
<div class="col-md-6 col-sm-6 col-xs-12 footer-logo text-right xs-text-center">
|
|
<a href="index.html"><img src="images/logo-light-gray.png" alt=""/></a>
|
|
</div>
|
|
<!-- end logo -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- scroll to top -->
|
|
<a href="javascript:;" class="scrollToTop"><i class="fa fa-angle-up"></i></a>
|
|
<!-- scroll to top end... -->
|
|
</footer>
|
|
<!-- end footer -->
|
|
<!-- javascript libraries / javascript files set #2 -->
|
|
<script type="text/javascript" src="js/jquery.min.js"></script>
|
|
<script type="text/javascript" src="js/modernizr.js"></script>
|
|
<script type="text/javascript" src="js/bootstrap.js"></script>
|
|
<script type="text/javascript" src="js/jquery.easing.1.3.js"></script>
|
|
<script type="text/javascript" src="js/skrollr.min.js"></script>
|
|
<script type="text/javascript" src="js/jquery.viewport.mini.js"></script>
|
|
<script type="text/javascript" src="js/smooth-scroll.js"></script>
|
|
<!-- jquery appear -->
|
|
<script type="text/javascript" src="js/jquery.appear.js"></script>
|
|
<!-- animation -->
|
|
<script type="text/javascript" src="js/wow.min.js"></script>
|
|
<!-- page scroll -->
|
|
<script type="text/javascript" src="js/page-scroll.js"></script>
|
|
<!-- easy piechart-->
|
|
<script type="text/javascript" src="js/jquery.easypiechart.js"></script>
|
|
<!-- parallax -->
|
|
<script type="text/javascript" src="js/jquery.parallax-1.1.3.js"></script>
|
|
<!--portfolio with shorting tab -->
|
|
<script type="text/javascript" src="js/jquery.isotope.min.js"></script>
|
|
<!-- owl slider -->
|
|
<script type="text/javascript" src="js/owl.carousel.min.js"></script>
|
|
<!-- magnific popup -->
|
|
<script type="text/javascript" src="js/jquery.magnific-popup.min.js"></script>
|
|
<script type="text/javascript" src="js/popup-gallery.js"></script>
|
|
<!-- text effect -->
|
|
<script type="text/javascript" src="js/text-effect.js"></script>
|
|
<!-- revolution slider -->
|
|
<script type="text/javascript" src="js/jquery.tools.min.js"></script>
|
|
<script type="text/javascript" src="js/jquery.revolution.js"></script>
|
|
<!-- counter -->
|
|
<script type="text/javascript" src="js/counter.js"></script>
|
|
<!-- countTo -->
|
|
<script type="text/javascript" src="js/jquery.countTo.js"></script>
|
|
<!-- fit videos -->
|
|
<script type="text/javascript" src="js/jquery.fitvids.js"></script>
|
|
<!-- imagesloaded -->
|
|
<script type="text/javascript" src="js/imagesloaded.pkgd.min.js"></script>
|
|
<!-- hamburger menu-->
|
|
<script type="text/javascript" src="js/classie.js"></script>
|
|
<script type="text/javascript" src="js/hamburger-menu.js"></script>
|
|
<!-- one page navigation -->
|
|
<script type="text/javascript" src="js/one-page-main.js"></script>
|
|
<!-- setting -->
|
|
<script type="text/javascript" src="js/main.js"></script>
|
|
</body>
|
|
</html> |