451 lines
25 KiB
HTML
451 lines
25 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"><!-- wrapper -->
|
||
<div id="header"><!-- header -->
|
||
<div class="logo">
|
||
<div class="container">
|
||
<div class="text-center">
|
||
<a href="index.html"><img src="images/logo.png" alt="" class="img-responsive"></a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="slider">
|
||
<div id="mainslider">
|
||
<div class="item">
|
||
<img src="images/slide-1.jpg" alt="" class="img-responsive">
|
||
</div>
|
||
<div class="item">
|
||
<img src="images/slide-2.jpg" alt="" class="img-responsive">
|
||
</div>
|
||
</div>
|
||
<div class="onslidername">
|
||
<div class="container">
|
||
<div class="onslidername-ct">
|
||
<span>john & ashley</span>
|
||
<span><i></i></span>
|
||
<span class="smalltext">photography is intelligence made visible</span>
|
||
</div>
|
||
<div class="slidernav">
|
||
<div class="slidernav-inner">
|
||
<div class="prev"></div>
|
||
<div class="next"></div>
|
||
<div class="clearfix"></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div><!-- header -->
|
||
<div class="main-navigation wow fadeInUp"><!-- menu -->
|
||
<div class="container">
|
||
<div class="row">
|
||
<div class="col-md-10 col-md-offset-1">
|
||
<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>
|
||
</div>
|
||
</div>
|
||
</div><!-- menu -->
|
||
<section id="home-about" class="wow fadeInUp">
|
||
<div class="container">
|
||
<div class="text-center">
|
||
<div class="main-title">
|
||
<h2>i'm glad to help you</h2>
|
||
<div class="three-round"></div>
|
||
</div>
|
||
<div class="row">
|
||
<div class="col-md-10 col-md-offset-1">
|
||
<div class="excerpt">
|
||
<p>You don't make a photograph just with a camera. You bring to the act of photography all the pictures you have seen, the books you have read, the music you have heard, the people you have loved.</p>
|
||
</div>
|
||
<a href="#" class="btn btn-link">VIEW MORE</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
<div class="videobox wow fadeInUp">
|
||
<div class="container">
|
||
<div class="vid-thumb">
|
||
<img src="images/vbox.jpg" alt="" class="img-responsive">
|
||
<div class="vid-control">
|
||
<div class="text-center">
|
||
<a href="https://youtu.be/zob2JFNe_JE" data-rel="prettyPhoto[video]" class="play-btn"></a>
|
||
<div class="vid-caption">
|
||
<h1>Walter & Anna</h1>
|
||
<div class="short-divider"></div>
|
||
<div class="shortext">The Wedding Film</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<section id="last-work" class="wow fadeInUp">
|
||
<div class="container">
|
||
<div class="main-title">
|
||
<h2><span>meet my last works</span></h2>
|
||
</div>
|
||
<div class="excerpt">
|
||
<p>A professor I had in college used to tell me that if someone won’t listen to what you have to say because you’re not wearing a tie, then put on a tie, ’cause what you have to say is more important than not wearing a tie. He was right.</p>
|
||
</div>
|
||
<div class="last-work-gallery">
|
||
<div class="row marg-5">
|
||
<div class="col-md-4 pad-5">
|
||
<div class="item">
|
||
<img src="images/lw-1.jpg" alt="" class="img-responsive">
|
||
</div>
|
||
<div class="item">
|
||
<img src="images/lw-2.jpg" alt="" class="img-responsive">
|
||
</div>
|
||
</div>
|
||
<div class="col-md-4 pad-5">
|
||
<div class="item">
|
||
<img src="images/lw-2.jpg" alt="" class="img-responsive">
|
||
</div>
|
||
<div class="item">
|
||
<img src="images/lw-1.jpg" alt="" class="img-responsive">
|
||
</div>
|
||
</div>
|
||
<div class="col-md-4 pad-5">
|
||
<div class="item">
|
||
<img src="images/lw-1.jpg" alt="" class="img-responsive">
|
||
</div>
|
||
<div class="item">
|
||
<img src="images/lw-2.jpg" alt="" class="img-responsive">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section id="stories" class="wow fadeInUp">
|
||
<div class="container">
|
||
<div class="text-center">
|
||
<div class="main-title">
|
||
<h2><span>sweet stories</span></h2>
|
||
</div>
|
||
</div>
|
||
<div class="stories-items">
|
||
<div class="row">
|
||
<div class="col-md-4">
|
||
<div class="stories-item">
|
||
<img src="images/lw-1.jpg" alt="" class="img-responsive">
|
||
<div class="down-content">
|
||
<h3>You don't make a photograph just...</h3>
|
||
<div class="meta">
|
||
<div class="div-table">
|
||
<div class="div-table-cell">
|
||
dec 10, 2016
|
||
</div>
|
||
<div class="div-table-cell">
|
||
Wedding - Photography
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="meta-comment">
|
||
<ul>
|
||
<li><i class="fa fa-heart"></i>5 likes</li>
|
||
<li><i class="fa fa-comment-o"></i>3 comments</li>
|
||
<li><i class="fa fa-eye"></i>20 views</li>
|
||
</ul>
|
||
</div>
|
||
<div class="text-center">
|
||
<div class="excerpt">
|
||
<p>To the complaint, 'There are no people in these photographs I respond, There are always...</p>
|
||
</div>
|
||
<a href="#" class="btn btn-bordered">View More</a>
|
||
</div>
|
||
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-4">
|
||
<div class="stories-item">
|
||
<img src="images/lw-1.jpg" alt="" class="img-responsive">
|
||
<div class="down-content">
|
||
<h3>You don't make a photograph just...</h3>
|
||
<div class="meta">
|
||
<div class="div-table">
|
||
<div class="div-table-cell">
|
||
dec 10, 2016
|
||
</div>
|
||
<div class="div-table-cell">
|
||
Wedding - Photography
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="meta-comment">
|
||
<ul>
|
||
<li><i class="fa fa-heart"></i>5 likes</li>
|
||
<li><i class="fa fa-comment-o"></i>3 comments</li>
|
||
<li><i class="fa fa-eye"></i>20 views</li>
|
||
</ul>
|
||
</div>
|
||
<div class="text-center">
|
||
<div class="excerpt">
|
||
<p>To the complaint, 'There are no people in these photographs I respond, There are always...</p>
|
||
</div>
|
||
<a href="#" class="btn btn-bordered">View More</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-4">
|
||
<div class="stories-item">
|
||
<img src="images/lw-1.jpg" alt="" class="img-responsive">
|
||
<div class="down-content">
|
||
<h3>You don't make a photograph just...</h3>
|
||
<div class="meta">
|
||
<div class="div-table">
|
||
<div class="div-table-cell">
|
||
dec 10, 2016
|
||
</div>
|
||
<div class="div-table-cell">
|
||
Wedding - Photography
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="meta-comment">
|
||
<ul>
|
||
<li><i class="fa fa-heart"></i>5 likes</li>
|
||
<li><i class="fa fa-comment-o"></i>3 comments</li>
|
||
<li><i class="fa fa-eye"></i>20 views</li>
|
||
</ul>
|
||
</div>
|
||
<div class="text-center">
|
||
<div class="excerpt">
|
||
<p>To the complaint, 'There are no people in these photographs I respond, There are always...</p>
|
||
</div>
|
||
<a href="#" class="btn btn-bordered">View More</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
<div class="btn-cover">
|
||
<a href="" class="btn btn-link">
|
||
<span>SHOW</span>
|
||
<span><i></i></span>
|
||
<span>MORE</span>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section id="personal" class="wow fadeInUp">
|
||
<div class="container">
|
||
<div class="text-right">
|
||
<div class="main-title">
|
||
<h2><span>personal photographer</span></h2>
|
||
</div>
|
||
<div class="excerpt">
|
||
<p>A portrait is not a likeness. The moment an emotion or fact is transformed into a photograph it is no longer a fact but an opinion. There is no such thing as inaccuracy in a photograph. All photographs are accurate. None of them is the truth.</p>
|
||
</div>
|
||
</div>
|
||
<div class="personal-notes">
|
||
<img src="images/personalbg.jpg" alt="" class="img-responsive">
|
||
<div class="prsnl-nts-ct">
|
||
<div class="div-table">
|
||
<div class="div-table-cell">
|
||
<div class="excerpt">
|
||
<p>There is only one happiness in this life, to love and be loved. Be happy with what you have and are, be generous with both, and you won't have to hunt for happiness.</p>
|
||
<a href="#" class="btn btn-fill">VIEW MORE</a>
|
||
</div>
|
||
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</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> |