yogiwhere/public/frontend/blog-fullwidth.html

697 lines
23 KiB
HTML

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0">
<!-- FONTS -->
<link href='https://fonts.googleapis.com/css?family=Work+Sans:400,300,500,600,700' rel='stylesheet' type='text/css'>
<link href='https://fonts.googleapis.com/css?family=Philosopher:400,400italic,700,700italic' rel='stylesheet' type='text/css'>
<link href='https://fonts.googleapis.com/css?family=Bilbo+Swash+Caps' rel='stylesheet' type='text/css'>
<!-- STYLESHEETS -->
<link href="css/bootstrap.css" rel="stylesheet" type="text/css">
<link rel="stylesheet" href="font-awesome/css/font-awesome.min.css">
<link href="css/vertical.min.css" rel="stylesheet" type="text/css">
<link href="css/magnific-popup.css" rel="stylesheet" type="text/css">
<link rel="stylesheet" href="css/flaticon.css">
<link rel="stylesheet" href="css/owl.carousel.css">
<link rel="stylesheet" href="css/ihover.css">
<link rel="stylesheet" type="text/css" href="revslider/css/settings.css" media="screen">
<link href="css/styles.css" rel="stylesheet" type="text/css">
<title>Relish</title>
</head>
<body>
<!-- PAGE -->
<div class="page" id="top">
<!-- preloader -->
<div id="preloader">
<div class="preloader-wave"></div>
</div>
<!-- / preloader -->
<!-- site top panel -->
<div class="site-top-panel">
<div class="container">
<div class="row">
<div class="col-md-6 col-sm-8">
<div class="tel-wrap">
<address>
<a href="tel:475-1969996"><i class="fa fa-phone"></i>(475) 196-9996</a>
<span>|</span>
<a href="mailto:relish.support@gmail.com"><i class="fa fa-envelope"></i>relish.support@gmail.com</a>
</address>
</div>
</div>
<div class="col-md-6 col-sm-4">
<div class="lang-wrap">
<div class="currency">
<select name="billing_lang" class="cur-change">
<option value="">USD</option>
<option value="eur">EUR</option>
<option value="gbp">GBP</option>
<option value="au">AUD</option>
</select>
</div>
<span>|</span>
<div class="lang-bar">
<div>
<ul>
<li>
<a href="#" class="lang-sel icl-en">
<img src="images/flag/us.png" class="icflag" alt>
&nbsp;EN
</a>
<ul>
<li class="icl-fr">
<a href="#">
<img src="images/flag/fr.png" class="icflag" alt>
&nbsp;FR
</a>
</li>
<li class="icl-de">
<a href="#">
<img src="images/flag/de.png" class="icflag" alt>
&nbsp;DE
</a>
</li>
</ul>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- /site top panel -->
<!-- sticky menu -->
<header class='sticky-header js-stick top-fixed'>
<div class="container">
<nav class="main-nav">
<div class="full-wrapper align-center">
<!-- logo sticky -->
<div class="nav-logo-wrap-sticky">
<a href="index.html" class="logo">
<img src="images/logo.png" data-at2x="images/logo@2x.png" alt>
</a>
</div>
<!-- / logo sticky -->
<!-- menu mobile bars -->
<div class="mobile-nav">
<i class="fa fa-bars"></i>
</div>
<!-- / menu mobile bars -->
<div class="inner-nav desktop-nav">
<ul class="clearlist">
<li>
<a href="index.html" class="nav-submenu">Home</a>
</li>
<li class="sep">
<a>/</a>
</li>
<li>
<a href="#" class="nav-submenu">Pages</a>
<!-- submenu -->
<ul class="submenu submenu-mega">
<li class="submenu-mega-col">
<a class="submenu-mega-title font-alt">Pages</a>
<ul>
<li>
<a href="home-1.html">Home 2</a>
</li>
<li>
<a href="home-2.html">Home 3</a>
</li>
<li>
<a href="about-1.html">About us 1</a>
</li>
<li>
<a href="team.html">Our Team</a>
</li>
</ul>
</li>
<li class="submenu-mega-col">
<a class="submenu-mega-title font-alt">Content</a>
<ul>
<li>
<a href="pricing-tables.html">Pricing</a>
</li>
<li>
<a href="reservation.html">Reservation</a>
</li>
<li>
<a href="services.html">Services</a>
</li>
<li>
<a href="shortcodes.html">Shortcodes</a>
</li>
<li>
<a href="typography.html">Typography</a>
</li>
</ul>
</li>
<li class="submenu-mega-col">
<a class="submenu-mega-title font-alt">Portfolio</a>
<ul>
<li>
<a href="gallery-fullwidth-filter.html">Filter</a>
</li>
<li>
<a href="gallery-right-sidebar.html">Right Sidebar</a>
</li>
<li>
<a href="gallery-one-column.html">One Column</a>
</li>
<li>
<a href="gallery-two-column.html">Two Column</a>
</li>
<li>
<a href="gallery-three-column.html">Three Column</a>
</li>
</ul>
</li>
<li class="submenu-mega-col">
<a class="submenu-mega-title font-alt">Blog</a>
<ul>
<li>
<a href="blog-default.html">Default</a>
</li>
<li>
<a href="blog-post.html">Blog Post</a>
</li>
<li>
<a href="blog-two-col.html">Two Columns</a>
</li>
<li>
<a href="blog-three-col.html">Three Columns</a>
</li>
<li>
<a href="blog-fullwidth.html">Full Width</a>
</li>
</ul>
</li>
</ul>
<!-- / submenu -->
</li>
<li class="sep">
<a>/</a>
</li>
<li>
<a href="#" class="nav-submenu">Gallery</a>
<!-- submenu -->
<ul class="submenu">
<li>
<a href="gallery-fullwidth.html">Full Width</a>
</li>
<li>
<a href="gallery-fullwidth-filter.html">Filter</a>
</li>
<li>
<a href="gallery-right-sidebar.html">Right Sidebar</a>
</li>
<li>
<a href="gallery-one-column.html">One Column</a>
</li>
<li>
<a href="gallery-two-column.html">Two Column</a>
</li>
<li>
<a href="gallery-three-column.html">Three Column</a>
</li>
</ul>
<!-- / submenu -->
</li>
<!-- logo menu -->
<li class="nav-logo-wrap">
<a href="index.html" class="logo">
<img src="images/logo.png" data-at2x="images/logo@2x.png" alt>
</a>
</li>
<!-- / logo menu -->
<li>
<a href="#" class="nav-submenu active">Blog</a>
<!-- submenu -->
<ul class="submenu">
<li>
<a href="blog-default.html">Default</a>
</li>
<li>
<a href="blog-post.html">Blog Post</a>
</li>
<li>
<a href="blog-two-col.html">Two Columns</a>
</li>
<li>
<a href="blog-three-col.html">Three Columns</a>
</li>
<li>
<a href="blog-fullwidth.html">Full Width</a>
</li>
</ul>
<!-- / submenu -->
</li>
<li class="sep">
<a>/</a>
</li>
<li>
<a href="#" class="nav-submenu">Shop</a>
<!-- submenu -->
<ul class="submenu">
<li>
<a href="shop-product-list.html">Product List</a>
</li>
<li>
<a href="shop-single-item.html">Single Item</a>
</li>
<li>
<a href="shop-cart.html">Shop Cart</a>
</li>
<li>
<a href="shop-checkout.html">Checkout</a>
</li>
</ul>
<!-- / submenu -->
</li>
<li class="sep">
<a>/</a>
</li>
<li>
<a href="contact.html">Location</a>
</li>
</ul>
<div class="menu-rect">
<img src="images/lines/rectangle-1.png" data-at2x="images/lines/rectangle-1@2x.png" alt>
</div>
</div>
</div>
</nav>
</div>
</header>
<!-- / sticky menu -->
<!-- breadcrumb -->
<section class="breadcrumb-section" data-background="images/section-bg/section-bg-4.jpg">
<div class="container align-center">
<nav class="breadcrumb">
<a href="index.html">Home</a>
<a href="#">Blog</a>
<a href="#">Full Width</a>
</nav>
</div>
</section>
<!-- /breadcrumb -->
<hr class="mt-0 mb-0 alt-2" />
<!-- page section -->
<section class="page-section">
<div class="container align-center">
<!-- blog item -->
<div class="blog-item">
<a href="images/blog/fullwidth/img-1.jpg" class="lightbox-single mfp-image">
<div class="blog-media mb-20">
<img src="images/blog/fullwidth/img-1.jpg" data-at2x="images/blog/fullwidth/img-1@2x.jpg" alt>
</div>
</a>
<h3 class="blog-title font-alt">Proin vehicula elit eu metus posuere, eget iaculis mauris aliquam</h3>
<div class="img-line">
<img src="images/lines/img-line-26.png" data-at2x="images/lines/img-line-26@2x.png" alt>
</div>
<p>Phasellus ullamcorper, lectus et tristique semper, magna nunc vestibulum purus, efficitur tincidunt nisi diam id erat. Donec congue ipsum id neque faucibus conv. Vestibulum metus metus, viverra at neque nec, suscipit luctus ex. Nunc in turpis dolor. Aliquam velit libero, luctus in ligula vitae, consectetur fermentum sap. Pellentesque vel venenatis mi. Proin velit ante, ornare tincidunt ultricies sed, sodales ut justo.</p>
<div class="blog-date">
by Jane Doe &nbsp;/&nbsp; Dec 10, 2016 &nbsp;/&nbsp; <i class="fa fa-heart-o"></i> 2 &nbsp;/&nbsp; <i class="fa fa-comment-o"></i> 10
</div>
<a href="#" class="button small">Read More</a>
</div>
<!-- /blog item -->
<hr class="mt-30 mb-60 alt-2" />
<!-- blog item -->
<div class="blog-item">
<h3 class="blog-title font-alt">Phasellus non lorem mattis, commodo purus quis</h3>
<div class="img-line">
<img src="images/lines/img-line-26.png" data-at2x="images/lines/img-line-26@2x.png" alt>
</div>
<p>Aenean quis velit quis risus vulputate fermentum vitae sit amet mauris. Ut rhoncus ac nunc eget laoreet. Sed faucibus mattis odio eu gravida. Praesent luctus diam cursus odio commodo sodales. Vivamus convallis nibh eget augue elementum, eu fringilla neque fringilla. Cras congue euismod tempor. Donec cursus tempor orci. Pellentesque justo mi, dignissim nec accumsan a, hendrerit eget felis.</p>
<div class="blog-comment">
<p>Curabitur luctus mauris in faucibus mattis. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere.</p>
</div>
<p>Curae; In hac habitasse platea dictumst. Duis sagittis varius dolor non pretium. Vivamus et ex blandit, molestie justo at, ullamcorper est. Morbi malesuada orci in dui accumsan, eget placerat dolor bibendum. Curabitur mollis ex ut metus bibendum, ut pharetra odio accumsan. Nullam non ultricies enim. Suspendisse potenti. Nulla tincidunt odio a enim consequat commodo. Aliquam a viverra elit. Aliquam sed ullamcorper justo, ut condimentum dui. Pellentesque posuere feugiat velit eu rhoncus. Vivamus quis auctor elit.</p>
<div class="blog-date">
by Jane Doe &nbsp;/&nbsp; Dec 10, 2016 &nbsp;/&nbsp; <i class="fa fa-heart-o"></i> 2 &nbsp;/&nbsp; <i class="fa fa-comment-o"></i> 10
</div>
<a href="#" class="button small">Read More</a>
</div>
<!-- /blog item -->
<hr class="mt-30 mb-60 alt-2" />
<!-- blog item -->
<div class="blog-item">
<div class="blog-media video mb-20">
<iframe width="1118" height="659" src="https://www.youtube.com/embed/WjoDEQqyTig" allowfullscreen></iframe>
</div>
<h3 class="blog-title font-alt">Quisque vel mauris vitae urna convallis scelerisque pellentesque</h3>
<div class="img-line">
<img src="images/lines/img-line-26.png" data-at2x="images/lines/img-line-26@2x.png" alt>
</div>
<p>Phasellus ullamcorper, lectus et tristique semper, magna nunc vestibulum purus, efficitur tincidunt nisi diam id erat. Donec congue ipsum id neque faucibus conv. Vestibulum metus metus, viverra at neque nec, suscipit luctus ex. Nunc in turpis dolor. Aliquam velit libero, luctus in ligula vitae, consectetur fermentum sap. Pellentesque vel venenatis mi.</p>
<div class="blog-date">
by Jane Doe &nbsp;/&nbsp; Dec 10, 2016 &nbsp;/&nbsp; <i class="fa fa-heart-o"></i> 2 &nbsp;/&nbsp; <i class="fa fa-comment-o"></i> 10
</div>
<a href="#" class="button small">Read More</a>
</div>
<!-- /blog item -->
<hr class="mt-30 mb-60 alt-2" />
<!-- blog item -->
<div class="blog-item">
<h3 class="blog-title font-alt link"><i class="flaticon-link"></i><a href="#">Duis consectetur augue quis leo bibendum, eu laoreet arcu facilisis</a></h3>
<div class="blog-date">
by Jane Doe &nbsp;/&nbsp; Dec 10, 2016 &nbsp;/&nbsp; <i class="fa fa-heart-o"></i> 2 &nbsp;/&nbsp; <i class="fa fa-comment-o"></i> 10
</div>
<a href="#" class="button small">Read More</a>
</div>
<!-- /blog item -->
<hr class="mt-30 mb-60 alt-2" />
<!-- blog item -->
<div class="blog-item">
<div class="slider-2 nav-alt mb-20">
<a href="images/blog/fullwidth/img-2.jpg" class="lightbox mfp-image">
<div class="blog-media">
<img src="images/blog/fullwidth/img-2.jpg" data-at2x="images/blog/fullwidth/img-2@2x.jpg" alt>
</div>
</a>
<a href="images/blog/fullwidth/img-3.jpg" class="lightbox mfp-image">
<div class="blog-media">
<img src="images/blog/fullwidth/img-3.jpg" data-at2x="images/blog/fullwidth/img-3@2x.jpg" alt>
</div>
</a>
<a href="images/blog/fullwidth/img-1.jpg" class="lightbox mfp-image">
<div class="blog-media">
<img src="images/blog/fullwidth/img-1.jpg" data-at2x="images/blog/fullwidth/img-1@2x.jpg" alt>
</div>
</a>
</div>
<h3 class="blog-title font-alt">Quisque vel mauris vitae urna convallis scelerisque pellentesque</h3>
<div class="img-line">
<img src="images/lines/img-line-26.png" data-at2x="images/lines/img-line-26@2x.png" alt>
</div>
<p>Phasellus ullamcorper, lectus et tristique semper, magna nunc vestibulum purus, efficitur tincidunt nisi diam id erat. Donec congue ipsum id neque faucibus conv. Vestibulum metus metus, viverra at neque nec, suscipit luctus ex. Nunc in turpis dolor. Aliquam velit libero, luctus in ligula vitae, consectetur fermentum sap. Pellentesque vel venenatis mi.</p>
<div class="blog-date">
by Jane Doe &nbsp;/&nbsp; Dec 10, 2016 &nbsp;/&nbsp; <i class="fa fa-heart-o"></i> 2 &nbsp;/&nbsp; <i class="fa fa-comment-o"></i> 10
</div>
<a href="#" class="button small">Read More</a>
</div>
<!-- /blog item -->
<hr class="mt-30 mb-60 alt-2" />
<!-- blog item -->
<div class="blog-item">
<h3 class="blog-title font-alt">Quisque vel mauris vitae urna convallis scelerisque.</h3>
<div class="img-line">
<img src="images/lines/img-line-26.png" data-at2x="images/lines/img-line-26@2x.png" alt>
</div>
<div class="blog-audio">
<audio controls="">
<source src="audio/audio.mp3" type="audio/mpeg">
</audio>
</div>
<div class="blog-date">
by Jane Doe &nbsp;/&nbsp; Dec 10, 2016 &nbsp;/&nbsp; <i class="fa fa-heart-o"></i> 2 &nbsp;/&nbsp; <i class="fa fa-comment-o"></i> 10
</div>
<a href="#" class="button small">Read More</a>
</div>
<!-- /blog item -->
<hr class="mt-30 mb-60 alt-2" />
<!-- blog item -->
<div class="blog-item">
<div class="blog-quote">
<h3 class="blog-title font-alt">Vivamus aliquet libero sed ex tincidunt a ullamcorper.</h3>
<div class="img-line">
<img src="images/lines/img-line-26.png" data-at2x="images/lines/img-line-26@2x.png" alt>
</div>
<blockquote>
<p class="align-center">In hac habitasse platea dictumst. Duis sagittis varius dolor non pretium. Vivamus et ex blandit, molestie justo at, ullamcorper est. Morbi malesuada orci in dui accumsan, eget placerat dolor bibendum. Curabitur mollis ex ut metus bibendum, ut pharetra odio accumsan. Nullam non ultricies enim. Suspendisse potenti. Nulla tincidunt odio a enim consequat commodo. Aliquam a viverra elit. Aliquam sed ullamcorper justo, ut condimentum dui. Pellentesque posuere feugiat velit eu rhoncus.</p>
<footer>Jone Doe</footer>
</blockquote>
<div class="blog-date">
by Jane Doe &nbsp;/&nbsp; Dec 10, 2016 &nbsp;/&nbsp; <i class="fa fa-heart-o"></i> 2 &nbsp;/&nbsp; <i class="fa fa-comment-o"></i> 10
</div>
<a href="#" class="button small">Read More</a>
</div>
</div>
<!-- /blog item -->
<hr class="mt-30 mb-60 alt-2" />
<!-- pagination -->
<div class="pagination">
<div class="pag-prev"></div>
<div class="pag-next"></div>
</div>
<!-- /pagination -->
</div>
</section>
<!-- /page section -->
<hr class="mt-0 mb-0 alt-2" />
<!-- footer -->
<footer>
<div class="footer-rect">
<img src="images/lines/rectangle-3.png" data-at2x="images/lines/rectangle-3@2x.png" alt>
</div>
<!-- footer top -->
<div class="footer-section">
<div class="container">
<div class="row">
<!-- footer about -->
<div class="col-md-4 col-xs-12 mb-lg-30">
<div class="footer-about align-center">
<h3 class="footer-title font-alt">About Relish</h3>
<div class="img-line">
<img src="images/lines/img-line-1.png" data-at2x="images/lines/img-line-1@2x.png" alt>
</div>
<p class="align-left mb-40">Lorem ipsum dolor sit amet, consectetuer adipiscing no. Aenean comodo ligula eget dolor. Senean masas, cum sociis natoque nean comodo.</p>
<h3 class="footer-title-small font-alt">NEWSLETTER SIGNUP</h3>
<form class="form">
<input type="email" class="input-sm mb-20" value="" placeholder="Your Email">
<button class="button small button-newsletter" name="submit" type="submit" >OK</button>
</form>
</div>
</div>
<!-- / footer about -->
<!-- footer tweets -->
<div class="col-md-4 col-xs-12 mb-lg-30">
<div class="footer-tweets align-center">
<h3 class="footer-title font-alt">Latest Tweets</h3>
<div class="img-line">
<img src="images/lines/img-line-1.png" data-at2x="images/lines/img-line-1@2x.png" alt>
</div>
<div class="twitter-footer align-left"></div>
</div>
</div>
<!-- / footer tweets -->
<!-- footer contacts -->
<div class="col-md-4 col-xs-12 mb-lg-30">
<div class="footer-contact align-center">
<h3 class="footer-title font-alt">Contacts</h3>
<div class="img-line">
<img src="images/lines/img-line-1.png" data-at2x="images/lines/img-line-1@2x.png" alt>
</div>
<p>Little Lonsdale St, Talay Victoria 8011 Philippines</p>
E-mail: <a href="#">mail@mail.com</a><br />
Tel: <a href="#">+4723-000-5555</a><br />
Fax: <a href="#">+4723-000-5556</a>
<h3 class="footer-title-small font-alt">Working Hours</h3>
Mon - Fr: 9:00 - 19:00 <br />
Sat: 10:00 - 15:00
</div>
</div>
<!-- / footer contacts -->
</div>
</div>
</div>
<!-- / footer top -->
<!-- footer bottom -->
<div class="bottom-footer">
<div class="container">
<!-- footer copy -->
<div class="footer-copy">
Copyright © 2016 relish.com. All rights reserved. Terms of Use l Privacy Policy
</div>
<!-- / footer copy -->
<!-- footer social -->
<div class="footer-soc-links">
<a href="#">
<i class="flaticon-social"></i>
</a>
<a href="#">
<i class="flaticon-social-4"></i>
</a>
<a href="#">
<i class="flaticon-social-5"></i>
</a>
<a href="#">
<i class="flaticon-connection"></i>
</a>
<a href="#">
<i class="flaticon-social-2"></i>
</a>
</div>
<!-- / footer social -->
</div>
</div>
<!-- / footer bottom -->
</footer>
<!-- / footer -->
<!-- scroll-top -->
<div id="scroll-top">
<i class="fa fa-angle-up"></i>
top
</div>
<!-- / scroll-top -->
</div>
<!-- / PAGE -->
<!-- SCRIPTS -->
<script src="js/jquery.min.js"></script>
<script src="js/jquery.easing.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/owl.carousel.min.js"></script>
<script src="js/isotope.pkgd.min.js"></script>
<script src="js/jquery.fitvids.js"></script>
<script src="js/jquery.magnific-popup.js"></script>
<script src="js/imagesloaded.pkgd.min.js"></script>
<script src="js/masonry.pkgd.min.js"></script>
<script src="js/jquery.sticky.js"></script>
<script src="js/jquery.form.min.js"></script>
<script src="js/jquery.validate.min.js"></script>
<script src="js/jquery.parallax.min.js"></script>
<script src="js/jquery.appear.js"></script>
<script src="js/retina.min.js"></script>
<script type='text/javascript' src='revslider/js/jquery.themepunch.tools.min.js'></script>
<script type='text/javascript' src='revslider/js/jquery.themepunch.revolution.min.js'></script>
<script type='text/javascript' src='revslider/js/jquery.themepunch.tools.min.js'></script>
<script type='text/javascript' src='revslider/js/jquery.themepunch.revolution.min.js'></script>
<script type="text/javascript" src="revslider/js/extensions/revolution.extension.slideanims.min.js"></script>
<script type="text/javascript" src="revslider/js/extensions/revolution.extension.layeranimation.min.js"></script>
<script type="text/javascript" src="revslider/js/extensions/revolution.extension.navigation.min.js"></script>
<script type="text/javascript" src="revslider/js/extensions/revolution.extension.parallax.min.js"></script>
<script type="text/javascript" src="revslider/js/extensions/revolution.extension.video.min.js"></script>
<script type="text/javascript" src="revslider/js/extensions/revolution.extension.actions.min.js"></script>
<script type="text/javascript" src="revslider/js/extensions/revolution.extension.kenburn.min.js"></script>
<script type="text/javascript" src="revslider/js/extensions/revolution.extension.migration.min.js"></script>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false&amp;language=en"></script>
<script src="js/gmap3.min.js"></script>
<script src="js/jquery.ui.min.js"></script>
<script src="js/jquery.tweet.js"></script>
<script src="js/scripts.js"></script>
<!-- / SCRIPTS -->
</body>
</html>