448 lines
27 KiB
HTML
448 lines
27 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="en">
|
||
<head>
|
||
<meta charset="utf-8">
|
||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
|
||
<title>ABRILLIX - Creative Photography Blog HTML Template</title>
|
||
<!-- font -->
|
||
<link href="https://fonts.googleapis.com/css?family=Montserrat:400,700" rel="stylesheet">
|
||
<link href="https://fonts.googleapis.com/css?family=Playfair+Display:400,400i,700,700i,900,900i" rel="stylesheet">
|
||
<link href="css/font-awesome.css" rel="stylesheet">
|
||
<!-- Bootstrap -->
|
||
<link href="css/bootstrap.css" rel="stylesheet">
|
||
<!-- slick -->
|
||
<link href="css/slick.css" rel="stylesheet">
|
||
<!-- prettrphoto -->
|
||
<link href="css/prettyPhoto.css" rel="stylesheet">
|
||
<!-- animate -->
|
||
<link href="css/animate.css" rel="stylesheet">
|
||
<!-- Main -->
|
||
<link href="style.css" rel="stylesheet">
|
||
|
||
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
|
||
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
|
||
<!--[if lt IE 9]>
|
||
<script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
|
||
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
|
||
<![endif]-->
|
||
</head>
|
||
<body>
|
||
<div id="wrapper" class="homepage-3"><!-- wrapper -->
|
||
<div id="header"><!-- header -->
|
||
<div class="container">
|
||
<div class="row">
|
||
<div class="col-md-3">
|
||
<div class="logo">
|
||
<a href="index.html"><img src="images/lg3.png" alt="" class="img-responsive"></a>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-9">
|
||
<div class="main-navigation"><!-- menu -->
|
||
|
||
<nav class="navbar navbar-default">
|
||
<div>
|
||
<!-- Brand and toggle get grouped for better mobile display -->
|
||
<div class="navbar-header">
|
||
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
|
||
<span class="sr-only">Toggle navigation</span>
|
||
<span class="icon-bar"></span>
|
||
<span class="icon-bar"></span>
|
||
<span class="icon-bar"></span>
|
||
</button>
|
||
</div>
|
||
<!-- Collect the nav links, forms, and other content for toggling -->
|
||
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
|
||
<ul class="nav navbar-nav">
|
||
<li class="active"><a href="index.html">Home</a></li>
|
||
<li><a href="blog.html">Blog</a></li>
|
||
<li><a href="about.html">About me</a></li>
|
||
<li><a href="#">Works</a></li>
|
||
<li class="dropdown">
|
||
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Pages</a>
|
||
<ul class="dropdown-menu">
|
||
<li><a href="home-2.html">Homepage 2</a></li>
|
||
<li><a href="home-3.html">Homepage 3</a></li>
|
||
<li><a href="blog.html">Blog 1</a></li>
|
||
<li><a href="blog2.html">Blog 2</a></li>
|
||
<li><a href="single-blog.html">Single blog 1</a></li>
|
||
<li><a href="single-blog2.html">Single blog 2</a></li>
|
||
<li><a href="404.html">404 Pages</a></li>
|
||
</ul>
|
||
</li>
|
||
<li><a href="contact.html">Contact</a></li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</nav>
|
||
</div><!-- menu -->
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div><!-- header -->
|
||
<div class="page-header">
|
||
<div class="container">
|
||
<div class="text-center">
|
||
<h2>PHOTOGRAPHY<span><i class="one-round"></i></span><span>Home / Photography / Post</span></h2>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<section id="blog-detail" class="wow fadeInUp">
|
||
<div class="container">
|
||
<div class="blog-detail-title">
|
||
<div class="meta-cat">
|
||
<span>in</span> Photography
|
||
</div>
|
||
<h3>It’s about finding something interesting in an ordinary place. I’ve found it has little to do with the things you see and everything to do with the way you see them.</h3>
|
||
<div class="meta-post">
|
||
Dec 2, 20016 / 2 Comments / Adrian Cusnir
|
||
</div>
|
||
</div>
|
||
<div class="blog-thumb">
|
||
<div id="blog-thumb">
|
||
<div class="item">
|
||
<img src="images/404.jpg" alt="" class="img-responsive">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="excerpt">
|
||
<p>Fusce sed quam tristique, auctor libero non, tincidunt nunc. Nunc porttitor dui nec hendrerit tincidunt. In in nulla ante. Nulla vestibulum, lacus ut lacinia vehicula, est tellus lacinia lectus, id gravida tortor lectus in odio. Pellentesque quis viverra nulla. Proin id interdum purus, at feugiat neque. Fusce suscipit sapien diam, fermentum luctus elit placerat sit amet. Integer nec neque feugiat, porttitor ipsum in, faucibus leo.
|
||
</p>
|
||
<p>Suspendisse aliquam magna nec orci bibendum feugiat. Nulla posuere varius odio, et consequat magna. Nulla pellentesque tincidunt urna nec sodales. Maecenas ligula lacus, rutrum quis scelerisque feugiat, congue et massa. Pellentesque condimentum suscipit lorem, vel porttitor nunc. Mauris elit erat, interdum ac elit at, feugiat vehicula libero. Etiam facilisis rhoncus accumsan.
|
||
</p>
|
||
<div class="row">
|
||
<div class="col-md-3">
|
||
<img src="images/db.jpg" alt="" class="img-responsive">
|
||
</div>
|
||
<div class="col-md-3">
|
||
<img src="images/db.jpg" alt="" class="img-responsive">
|
||
</div>
|
||
<div class="col-md-3">
|
||
<img src="images/db.jpg" alt="" class="img-responsive">
|
||
</div>
|
||
<div class="col-md-3">
|
||
<img src="images/db.jpg" alt="" class="img-responsive">
|
||
</div>
|
||
</div>
|
||
<p>Donec tincidunt nunc eu dolor bibendum bibendum. Etiam eu risus non sem imperdiet molestie sed ut ex. Nulla sodales auctor egestas. Aenean sed orci ac est pretium laoreet quis commodo.
|
||
</p>
|
||
<blockquote>
|
||
It’s about reacting to what you see, hopefully without preconception. You can find pictures anywhere. It’s simply a matter of noticing things and organising them.
|
||
</blockquote>
|
||
<p>Fusce sed quam tristique, auctor libero non, tincidunt nunc. Nunc porttitor dui nec hendrerit tincidunt. In in nulla ante. Nulla vestibulum, lacus ut lacinia vehicula, est tellus lacinia lectus, id gravida tortor lectus in odio. Pellentesque quis viverra nulla. Proin id interdum purus, at feugiat neque. Fusce suscipit sapien diam, fermentum luctus elit placerat sit amet. Integer nec neque feugiat, porttitor ipsum in, faucibus leo.. Vivamus egestas mauris sagittis gravida sagittis. Nunc vehicula gravida nibh eu maximus. Aliquam vel neque non dui tempor porta nec a lorem. </p>
|
||
</div>
|
||
<div class="meta-tag">
|
||
<div class="left">
|
||
<ul>
|
||
<li>Tags:</li>
|
||
<li><a href="">photography</a></li>
|
||
<li><a href="">Blogger</a></li>
|
||
</ul>
|
||
</div>
|
||
<div class="right">
|
||
<ul>
|
||
<li><a href=""><i class="fa fa-heart-o"></i> 7</a></li>
|
||
<li><a href=""><i class="fa fa-share-alt"></i> 4</a></li>
|
||
<li><a href=""><i class="fa fa-facebook-square"></i></a></li>
|
||
<li><a href=""><i class="fa fa-twitter-square"></i></a></li>
|
||
<li><a href=""><i class="fa fa-instagram"></i></a></li>
|
||
</ul>
|
||
</div>
|
||
<div class="clearfix"></div>
|
||
</div>
|
||
<div class="author">
|
||
<div class="left">
|
||
<div class="img-author">
|
||
<img src="images/author.jpg" alt="" class="img-responsive">
|
||
</div>
|
||
</div>
|
||
<div class="left">
|
||
<div class="author-ct">
|
||
<h4>Adrian Cusnir</h4>
|
||
<p>To photograph: it is to put on the same line of sight the head, the eye and the heart.</p>
|
||
<ul>
|
||
<li><a href=""><i class="fa fa-facebook-square"></i></a></li>
|
||
<li><a href=""><i class="fa fa-twitter-square"></i></a></li>
|
||
<li><a href=""><i class="fa fa-instagram"></i></a></li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
<div class="clearfix"></div>
|
||
</div>
|
||
<div class="page-nav">
|
||
<div class="row div-table">
|
||
<div class="col-md-6 div-table-cell">
|
||
<div class="text-left">
|
||
<a href="">I like to photograph anyone before...<span><i class="fa fa-angle-double-left"></i> PREVIOUS POST</span></a>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-6 div-table-cell">
|
||
<div class="text-right">
|
||
<a href="">To me, photography is an art of ...<span>NEXT POST <i class="fa fa-angle-double-right"></i></span></a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="related">
|
||
<div class="text-center">
|
||
<h4>You may also like</h4>
|
||
<div class="row">
|
||
<div class="col-md-3 related-items">
|
||
<a href=""><img src="images/rel.jpg" alt="" class="img-responsive"></a>
|
||
<h3><a href="">A picture is a secret about a secret, the more it tells...</a></h3>
|
||
<div class="date">Dec 2, 2016</div>
|
||
</div>
|
||
<div class="col-md-3 related-items">
|
||
<a href=""><img src="images/rel.jpg" alt="" class="img-responsive"></a>
|
||
<h3><a href="">A picture is a secret about a secret, the more it tells...</a></h3>
|
||
<div class="date">Dec 2, 2016</div>
|
||
</div>
|
||
<div class="col-md-3 related-items">
|
||
<a href=""><img src="images/rel.jpg" alt="" class="img-responsive"></a>
|
||
<h3><a href="">A picture is a secret about a secret, the more it tells...</a></h3>
|
||
<div class="date">Dec 2, 2016</div>
|
||
</div>
|
||
<div class="col-md-3 related-items">
|
||
<a href=""><img src="images/rel.jpg" alt="" class="img-responsive"></a>
|
||
<h3><a href="">A picture is a secret about a secret, the more it tells...</a></h3>
|
||
<div class="date">Dec 2, 2016</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="comment-list">
|
||
<div class="text-center">
|
||
<h4>3 Comments</h4>
|
||
</div>
|
||
<ul class="comment-lists">
|
||
<li>
|
||
<div class="author div-table">
|
||
<div class="left div-table-cell">
|
||
<div class="img-author">
|
||
<img src="images/author.jpg" alt="" class="img-responsive">
|
||
</div>
|
||
</div>
|
||
<div class="left div-table-cell">
|
||
<div class="author-ct">
|
||
<div class="name clearfix"><div class="left">Adrian Cusnir</div><div class="right"><a href="">REPLY</a></div></div>
|
||
<div class="date">18:50, Dec 2, 2016</div>
|
||
<p>I am using the Fudenosuke and the Tombow markers. You will find links to both on the first part of the article published last week. :-)</p>
|
||
|
||
|
||
</div>
|
||
<ul>
|
||
<li>
|
||
<div class="author div-table">
|
||
<div class="left div-table-cell">
|
||
<div class="img-author">
|
||
<img src="images/author.jpg" alt="" class="img-responsive">
|
||
</div>
|
||
</div>
|
||
<div class="left div-table-cell">
|
||
<div class="author-ct">
|
||
<div class="name clearfix"><div class="left">Adrian Cusnir</div><div class="right"><a href="">REPLY</a></div></div>
|
||
<div class="date">18:50, Dec 2, 2016</div>
|
||
<p>I am using the Fudenosuke and the Tombow markers. You will find links to both on the first part of the article published last week. :-)</p>
|
||
|
||
</div>
|
||
</div>
|
||
<div class="clearfix"></div>
|
||
</div>
|
||
</li>
|
||
</ul>
|
||
|
||
</div>
|
||
<div class="clearfix"></div>
|
||
</div>
|
||
</li>
|
||
<li>
|
||
<div class="author div-table">
|
||
<div class="left div-table-cell">
|
||
<div class="img-author">
|
||
<img src="images/author.jpg" alt="" class="img-responsive">
|
||
</div>
|
||
</div>
|
||
<div class="left div-table-cell">
|
||
<div class="author-ct">
|
||
<div class="name clearfix"><div class="left">Adrian Cusnir</div><div class="right"><a href="">REPLY</a></div></div>
|
||
<div class="date">18:50, Dec 2, 2016</div>
|
||
<p>I am using the Fudenosuke and the Tombow markers. You will find links to both on the first part of the article published last week. :-)</p>
|
||
</div>
|
||
</div>
|
||
<div class="clearfix"></div>
|
||
</div>
|
||
</li>
|
||
<li>
|
||
<div class="author div-table">
|
||
<div class="left div-table-cell">
|
||
<div class="img-author">
|
||
<img src="images/author.jpg" alt="" class="img-responsive">
|
||
</div>
|
||
</div>
|
||
<div class="left div-table-cell">
|
||
<div class="author-ct">
|
||
<div class="name clearfix"><div class="left">Adrian Cusnir</div><div class="right"><a href="">REPLY</a></div></div>
|
||
<div class="date">18:50, Dec 2, 2016</div>
|
||
<p>I am using the Fudenosuke and the Tombow markers. You will find links to both on the first part of the article published last week. :-)</p>
|
||
</div>
|
||
</div>
|
||
<div class="clearfix"></div>
|
||
</div>
|
||
</li>
|
||
</ul>
|
||
<form class="form-horizontal">
|
||
<div class="form-group">
|
||
<div class="col-sm-6">
|
||
<input type="text" class="form-control" id="name" placeholder="Name">
|
||
</div>
|
||
<div class="col-sm-6">
|
||
<input type="email" class="form-control" id="email" placeholder="Email">
|
||
</div>
|
||
</div>
|
||
<div class="form-group">
|
||
<div class="col-sm-12">
|
||
<textarea class="form-control" rows="5" placeholder="your comments"></textarea>
|
||
</div>
|
||
</div>
|
||
<div class="form-group">
|
||
<div class="col-sm-12">
|
||
<div class="text-center">
|
||
<button type="submit" class="btn btn-link">SEND MESSAGE!</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</form>
|
||
</div>
|
||
|
||
</div>
|
||
</section>
|
||
|
||
<footer>
|
||
<div class="instagram-section wow fadeInUp">
|
||
<div class="container">
|
||
<div class="row">
|
||
<div class="col-md-2 col-sm-3">
|
||
<a href="#">
|
||
<img src="images/ig-1.jpg" alt="" class="img-responsive">
|
||
</a>
|
||
</div>
|
||
<div class="col-md-2 col-sm-3">
|
||
<a href="#">
|
||
<img src="images/ig-1.jpg" alt="" class="img-responsive">
|
||
</a>
|
||
</div>
|
||
<div class="col-md-2 col-sm-3">
|
||
<a href="#">
|
||
<img src="images/ig-1.jpg" alt="" class="img-responsive">
|
||
</a>
|
||
</div>
|
||
<div class="col-md-2 col-sm-3">
|
||
<a href="#">
|
||
<img src="images/ig-1.jpg" alt="" class="img-responsive">
|
||
</a>
|
||
</div>
|
||
<div class="col-md-2 col-sm-3">
|
||
<a href="#">
|
||
<img src="images/ig-1.jpg" alt="" class="img-responsive">
|
||
</a>
|
||
</div>
|
||
<div class="col-md-2 col-sm-3">
|
||
<div class="follow">
|
||
<img src="images/ig-1.jpg" alt="" class="img-responsive">
|
||
<div class="acount">
|
||
<div class="div-table">
|
||
<div class="div-table-cell">
|
||
Follow me
|
||
@abrilix
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="footer-logo wow fadeInUp">
|
||
<div class="container">
|
||
<div class="text-center">
|
||
<a href="index.html"><img src="images/logob.png" alt="" class="img-responsive"></a>
|
||
<ul class="ft-soc">
|
||
<li><a href=""><i class="fa fa-facebook-square"></i></a></li>
|
||
<li><a href=""><i class="fa fa-twitter-square"></i></a></li>
|
||
<li><a href=""><i class="fa fa-instagram"></i></a></li>
|
||
<li><a href=""><i class="fa fa-google-plus-square"></i></a></li>
|
||
<li><a href=""><i class="fa fa-search"></i></a></li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="footer-widget wow fadeInUp">
|
||
<div class="container">
|
||
<div class="row">
|
||
<div class="col-md-3 col-sm-6 wow fadeInUp">
|
||
<div class="text-center">
|
||
<h4>About</h4>
|
||
<ul>
|
||
<li><a href="">Our Story</a></li>
|
||
<li><a href="">Our Team</a></li>
|
||
<li><a href="">FAQ</a></li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-3 col-sm-6 wow fadeInUp">
|
||
<div class="text-center">
|
||
<h4>our work</h4>
|
||
<ul>
|
||
<li><a href="">Galleries</a></li>
|
||
<li><a href="">Blog</a></li>
|
||
<li><a href="">Testimonials</a></li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-3 col-sm-6 wow fadeInUp">
|
||
<div class="text-center">
|
||
<h4>Services</h4>
|
||
<ul>
|
||
<li><a href="">Wedding Photo</a></li>
|
||
<li><a href="">Shop</a></li>
|
||
<li><a href="">Fashion Photo</a></li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-3 col-sm-6 wow fadeInUp">
|
||
<div class="text-right">
|
||
<div class="excerpt">
|
||
<p>Whenever I have an idea I write it down, even if it’s not a very good idea. Sometimes the bad ideas will lead to better ones.</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="footer-credits wow fadeInUp">
|
||
<div class="container">
|
||
<div class="text-center">
|
||
© 2016 Copyright Abrillix
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</footer>
|
||
|
||
|
||
</div><!-- wrapper -->
|
||
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
|
||
<script src="js/lib.js"></script>
|
||
<!-- Include all compiled plugins (below), or include individual files as needed -->
|
||
<script src="js/bootstrap.js"></script>
|
||
<script src="js/slick.min.js"></script>
|
||
<script src="js/jquery.prettyPhoto.js"></script>
|
||
<script src="js/wow.min.js"></script>
|
||
<script src="js/imagesload.js"></script>
|
||
<script src="js/masonry.js"></script>
|
||
<script src="js/themescript.js"></script>
|
||
</body>
|
||
</html> |