<!DOCTYPE html>
<!--[if IE 8]> <html class="ie ie8"> <![endif]-->
<!--[if IE 9]> <html class="ie ie9"> <![endif]-->
<!--[if gt IE 9]><!--> <html> <!--<![endif]-->
<head>
<meta charset="utf-8">
<title>Agency Parallax Responsive HTML5/CSS3 Template | FIFO THEMES</title>
<meta name="description" content="Agency Parallax Responsive HTML5/CSS3 Template from FIFOTHEMES.COM">
<meta name="author" content="FIFOTHEMES.COM">
<!-- Mobile Metas -->
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- Google Fonts -->
<link href='http://fonts.googleapis.com/css?family=Open+Sans:400,300,600,700' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Raleway:400,500,600,700' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Pacifico' rel='stylesheet' type='text/css'>
<link rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/css?family=Tangerine" />
<!-- Library CSS -->
<link rel="stylesheet" href="css/bootstrap.min.css">
<link rel="stylesheet" href="css/bootstrap-theme.min.css">
<link rel="stylesheet" href="css/team-member.css" media="screen">
<link rel="stylesheet" href="css/fonts/font-awesome/css/font-awesome.css">
<link rel="stylesheet" href="css/animations.css" media="screen">
<link rel="stylesheet" href="css/prettyPhoto.css" media="screen">
<!-- Theme CSS -->
<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="css/global.css">
<!-- Skin -->
<link rel="stylesheet" href="css/colors/blue.css" class="colors">
<!-- Favicons -->
<link rel="shortcut icon" href="img/ico/favicon.ico">
<link rel="apple-touch-icon" href="img/ico/apple-touch-icon.png">
<link rel="apple-touch-icon" sizes="72x72" href="img/ico/apple-touch-icon-72.png">
<link rel="apple-touch-icon" sizes="114x114" href="img/ico/apple-touch-icon-114.png">
<link rel="apple-touch-icon" sizes="144x144" href="img/ico/apple-touch-icon-144.png">
<!-- The HTML5 shim, for IE6-8 support of HTML5 elements -->
<!--[if lt IE 9]>
<script src="//html5shim.googlecode.com/svn/trunk/html5.js"></script>
<script src="js/respond.min.js"></script>
<![endif]-->
</head>
<body data-spy="scroll" data-target="#navigation" data-offset="75">
<!-- Page Preloader -->
<div class="page-mask">
<div class="page-loader">
<div class="spinner"></div>
</div>
</div>
<!-- /Page Preloader -->
<!-- Warpper -->
<div class="wrap">
<!-- Header -->
<header id="section1">
<!-- Navigation -->
<div id="navigation">
<nav class="navbar navbar-custom cl-effect-21" role="navigation">
<div class="container">
<div class="row">
<div class="col-md-2 mob-logo">
<div class="row">
<div class="site-logo">
<a href="index-image-slider.html"><img src="img/logo.png" alt="Agency"></a>
</div>
</div>
</div>
<div class="col-md-10 mob-menu">
<div class="row">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#menu">
<i class="fa fa-bars"></i>
</button>
</div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse" id="menu">
<ul class="nav navbar-nav navbar-right">
<li class="active"><a class="external" href="index-image-slider.html#section1">Home</a></li>
<li><a class="external" href="index-image-slider.html#section2">About Us</a></li>
<li><a class="external" href="index-image-slider.html#section3">Portfolio</a></li>
<li><a class="external" href="index-image-slider.html#section4">Services</a></li>
<li><a class="external" href="index-image-slider.html#section5">Clients</a></li>
<li><a class="external" href="index-image-slider.html#section6">Pricing</a></li>
<li class="dropdown nav-toggle">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Blog<b class="caret"></b></a>
<ul class="dropdown-menu">
<li><a class="external" href="blog.html">Blog</a></li>
<li><a href="#section1">Blog Large</a></li>
<li><a class="external" href="single-post.html">Single Page</a></li>
</ul>
</li>
<li><a class="external" href="index-image-slider.html#section7">Contact</a></li>
</ul>
</div>
<!-- /.Navbar-collapse -->
</div>
</div>
</div>
</div>
<!-- /.container -->
</nav>
</div>
<!-- /Navigation -->
</header>
<!-- /Header -->
<section id="section2" class="page-title">
<!-- Title row -->
<div class="row">
<div class="col-md-12 big-title">
<h2>The Blog</h2>
</div>
</div>
<!-- /Title row -->
</section>
<!-- Section 3 -->
<section id="section3" class="blog">
<!-- Main Content start-->
<div class="content">
<div class="container">
<div class="row">
<div class="posts-block col-lg-9 col-md-9 col-sm-8 col-xs-12">
<article class="post hentry">
<div class="post-image">
<a href="img/blog/blog-post1.jpg" data-rel="prettyPhoto">
<img class="img-responsive" src="img/blog/blog-post1.jpg" alt="">
</a>
</div>
<div class="post-content-wrap">
<header class="post-header">
<h3 class="content-title">Blog post title</h3>
<div class="blog-entry-meta">
<div class="blog-entry-meta-date">
<i class="fa fa-clock-o"></i>
<span class="blog-entry-meta-date-month">November</span>
<span class="blog-entry-meta-date-day">23,</span>
<span class="blog-entry-meta-date-year">2014</span>
</div>
<div class="blog-entry-meta-author">
<i class="fa fa-user"></i>
<a href="#" class="blog-entry-meta-author">John Doe</a>
</div>
<div class="blog-entry-meta-tags">
<i class="fa fa-tags"></i>
<a href="#">Web Design</a>,
<a href="#">Branding</a>
</div>
<div class="blog-entry-meta-comments">
<i class="fa fa-comments"></i>
<a href="#" class="blog-entry-meta-comments">3 comments</a>
</div>
</div>
</header>
<div class="post-content">
<p>
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. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.
</p>
</div>
<footer class="post-footer">
<a href="#" class="btn btn-2 btn-2c">Read More</a>
</footer>
</div>
<div class="clearfix"></div>
</article>
<div class="blog-divider"></div>
<article class="post hentry">
<div class="post-image">
<a href="img/blog/blog-post2.jpg" data-rel="prettyPhoto">
<img class="img-responsive" src="img/blog/blog-post2.jpg" alt="">
</a>
</div>
<div class="post-content-wrap">
<header class="post-header">
<h3 class="content-title">Blog post title</h3>
<div class="blog-entry-meta">
<div class="blog-entry-meta-date">
<i class="fa fa-clock-o"></i>
<span class="blog-entry-meta-date-month">October</span>
<span class="blog-entry-meta-date-day">23,</span>
<span class="blog-entry-meta-date-year">2014</span>
</div>
<div class="blog-entry-meta-author">
<i class="fa fa-user"></i>
<a href="#" class="blog-entry-meta-author">John Doe</a>
</div>
<div class="blog-entry-meta-tags">
<i class="fa fa-tags"></i>
<a href="#">Web Design</a>,
<a href="#">Branding</a>
</div>
<div class="blog-entry-meta-comments">
<i class="fa fa-comments"></i>
<a href="#" class="blog-entry-meta-comments">3 comments</a>
</div>
</div>
</header>
<div class="post-content">
<p>
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. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.
</p>
</div>
<footer class="post-footer">
<a href="#" class="btn btn-2 btn-2c">Read More</a>
</footer>
</div>
<div class="clearfix"></div>
</article>
<div class="blog-divider"></div>
<article class="post hentry">
<div class="post-image">
<a href="img/blog/blog-post3.jpg" data-rel="prettyPhoto">
<img class="img-responsive" src="img/blog/blog-post3.jpg" alt="">
</a>
</div>
<div class="post-content-wrap">
<header class="post-header">
<h3 class="content-title">Blog post title</h3>
<div class="blog-entry-meta">
<div class="blog-entry-meta-date">
<i class="fa fa-clock-o"></i>
<span class="blog-entry-meta-date-month">September</span>
<span class="blog-entry-meta-date-day">23,</span>
<span class="blog-entry-meta-date-year">2014</span>
</div>
<div class="blog-entry-meta-author">
<i class="fa fa-user"></i>
<a href="#" class="blog-entry-meta-author">John Doe</a>
</div>
<div class="blog-entry-meta-tags">
<i class="fa fa-tags"></i>
<a href="#">Web Design</a>,
<a href="#">Branding</a>
</div>
<div class="blog-entry-meta-comments">
<i class="fa fa-comments"></i>
<a href="#" class="blog-entry-meta-comments">3 comments</a>
</div>
</div>
</header>
<div class="post-content">
<p>
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. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.
</p>
</div>
<footer class="post-footer">
<a href="#" class="btn btn-2 btn-2c">Read More</a>
</footer>
</div>
<div class="clearfix"></div>
</article>
<div class="blog-divider"></div>
<div class="pagination-centered">
<ul class="pagination">
<li class="disabled"><a href="#">«</a></li>
<li class="active"><a href="#">1</a></li>
<li><a href="#">2</a></li>
<li><a href="#">3</a></li>
<li><a href="#">4</a></li>
<li><a href="#">5</a></li>
<li><a href="#">»</a></li>
</ul>
</div>
</div>
<!-- Sidebar Start -->
<div class="sidebar col-lg-3 col-md-3 col-sm-4 col-xs-12">
<!-- Search Widget Start -->
<div class="widget search-form">
<div class="input-group">
<input type="text" value="Search..." onfocus="if(this.value=='Search...')this.value='';" onblur="if(this.value=='')this.value='Search...';" class="search-input form-control">
<span class="input-group-btn">
<button type="submit" class="subscribe-btn btn"><i class="fa fa-search"></i></button>
</span>
</div>
<!-- /input-group -->
</div>
<!-- /Search Widget -->
<!-- Tab Start -->
<div class="widget tabs">
<div id="horizontal-tabs">
<ul class="tabs">
<li id="tab1" class="current">Popular</li>
<li id="tab2">Recent</li>
<li id="tab3">Comments</li>
</ul>
<div class="contents">
<div class="tabscontent" id="content1" style="display: block;">
<ul class="posts">
<li>
<a href="#"><img class="img-thumbnail recent-post-img" alt="" src="img/recent-post-img.jpg"></a>
<p><a href="#">Lorem Ipsum is simply dummy text.</a></p>
<span class="color">27 February 2014</span>
</li>
<li>
<a href="#"><img class="img-thumbnail recent-post-img" alt="" src="img/recent-post-img.jpg"></a>
<p><a href="#">Lorem Ipsum is simply dummy text.</a></p>
<span class="color">1 March 2013</span>
</li>
</ul>
</div>
<div class="tabscontent" id="content2">
<ul class="posts">
<li>
<a href="#"><img class="img-thumbnail recent-post-img" alt="" src="img/recent-post-img.jpg"></a>
<p><a href="#">Lorem Ipsum is simply dummy text.</a></p>
<span class="color">27 February 2014</span>
</li>
<li>
<a href="#"><img class="img-thumbnail recent-post-img" alt="" src="img/recent-post-img.jpg"></a>
<p><a href="#">Lorem Ipsum is simply dummy text.</a></p>
<span class="color">1 March 2013</span>
</li>
</ul>
</div>
<div class="tabscontent" id="content3">
<ul class="posts">
<li>
<a href="#"><img class="img-thumbnail recent-post-img" alt="" src="img/recent-post-img.jpg"></a>
<p><a href="#">Lorem Ipsum is simply dummy text.</a></p>
by <span class="color">wptuts+</span>
</li>
<li>
<a href="#"><img class="img-thumbnail recent-post-img" alt="" src="img/recent-post-img.jpg"></a>
<p><a href="#">Lorem Ipsum is simply dummy text.</a></p>
by <span class="color">wptuts+</span>
</li>
</ul>
</div>
</div>
</div>
</div>
<!-- Tab End -->
<!-- Testimonials Widget Start -->
<div class="widget testimonials">
<div class="row">
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
<div class="testimonials-title">
<h3 class="title">Testimonials</h3>
</div>
</div>
<div class="clearfix"></div>
<div id="testimonials-carousel" class="testimonials-carousel-widget carousel slide">
<div class="carousel-inner">
<div class="item active">
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
<div class="testimonial item">
<p>
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.
</p>
<div class="testimonials-arrow"></div>
<div class="author">
<div class="testimonial-image ">
<img alt="" src="img/testimonial/team-member-1.jpg">
</div>
<div class="testimonial-author-info">
<a href="#"><span class="color">Monica Sing</span></a> FIFO Themes
</div>
</div>
</div>
</div>
</div>
<div class="item">
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
<div class="testimonial item">
<p>
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.
</p>
<div class="testimonials-arrow"></div>
<div class="author">
<div class="testimonial-image ">
<img alt="" src="img/testimonial/team-member-2.jpg">
</div>
<div class="testimonial-author-info">
<a href="#"><span class="color">Monzurul Haque</span></a> FIFO Themes
</div>
</div>
</div>
</div>
</div>
<div class="item">
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
<div class="testimonial item">
<p>
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.
</p>
<div class="testimonials-arrow"></div>
<div class="author">
<div class="testimonial-image ">
<img alt="" src="img/testimonial/team-member-3.jpg">
</div>
<div class="testimonial-author-info">
<a href="#"><span class="color">Carol Johansen</span></a> FIFO Themes
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Category Widget Start -->
<div class="widget category">
<h3 class="title">Categories</h3>
<ul class="category-list slide">
<li><a href="#">Web Design</a></li>
<li><a href="#">Graphic Design</a></li>
<li><a href="#">Illustration</a></li>
<li><a href="#">Logo Design</a></li>
<li><a href="#">Wordpress Themes</a></li>
</ul>
</div>
<!-- /Category Widget -->
<!-- Ads Widget Start -->
<div class="widget ads">
<h3 class="title">Advertisement</h3>
<div class="ads-img row">
<div class="col-lg-6 col-md-6 col-sm-6 col-xs-12">
<img class="img-thumbnail" alt="" src="img/ads-small.jpg">
</div>
<div class="col-lg-6 col-md-6 col-sm-6 col-xs-12">
<img class="img-thumbnail" alt="" src="img/ads-small.jpg">
</div>
</div>
<div class="ads-img row">
<div class="col-lg-6 col-md-6 col-sm-6 col-xs-12">
<img class="img-thumbnail" alt="" src="img/ads-small.jpg">
</div>
<div class="col-lg-6 col-md-6 col-sm-6 col-xs-12">
<img class="img-thumbnail" alt="" src="img/ads-small.jpg">
</div>
</div>
</div>
<!-- Ads Widget End -->
</div>
<!-- /Sidebar End -->
</div>
</div>
</div>
<!-- Main Content end-->
</section>
<!-- /Section 3 -->
<footer class="footer-wrap text-center">
<div class="container">
<ul class="social social-icons-footer-bottom">
<li class="facebook"><a href="#" data-toggle="tooltip" title="Facebook"><i class="fa fa-facebook"></i></a></li>
<li class="twitter"><a href="#" data-toggle="tooltip" title="Twitter"><i class="fa fa-twitter"></i></a></li>
<li class="dribbble"><a href="#" data-toggle="tooltip" title="Dribble"><i class="fa fa-dribbble"></i></a></li>
<li class="linkedin"><a href="#" data-toggle="tooltip" title="LinkedIn"><i class="fa fa-linkedin"></i></a></li>
<li class="rss"><a href="#" data-toggle="tooltip" title="Rss"><i class="fa fa-rss"></i></a></li>
</ul>
<p class="site-info"> © 2014 FifoThemes</p>
</div>
</footer>
<!-- Scroll To Top -->
<a href="#" class="scrollup"><i class="fa fa-angle-up"></i></a>
</div>
<!-- /Warpper -->
<!-- The Scripts -->
<script src="js/jquery.min.js"></script>
<script src="js/jquery-migrate-1.0.0.js"></script>
<script src="js/jquery-ui.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/jquery.parallax.js"></script>
<script src="js/jquery.hparallax.js"></script>
<script src="js/jquery.wait.js"></script>
<script src="js/appear.js"></script>
<script src="js/fappear.js"></script>
<script src="js/modernizr-2.6.2.min.js"></script>
<script src="js/jquery.bxslider.min.js"></script>
<script src="js/jquery.maximage.js"></script>
<script src="js/jquery.cycle.all.js"></script>
<script src="js/jquery.prettyPhoto.js"></script>
<script src="js/jquery.sticky.js"></script>
<script src="js/jquery.isotope.js"></script>
<script src="js/imagesloaded.pkgd.min.js"></script>
<script src="js/jquery.countTo.js"></script>
<script src="js/skrollr.min.js"></script>
<script src="js/jquery.scrollTo.min.js"></script>
<script src="js/jquery.nav.js"></script>
<script src="js/wow.js"></script>
<script src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script src="js/jquery.gmap.min.js"></script>
<script src="js/jquery.mb.YTPlayer.js"></script>
<script src="js/tytabs.js"></script>
<script src="js/custom.js"></script>
</body>
</html>