mirror of
https://github.com/dawidolko/Website-Templates.git
synced 2025-10-27 07:53:11 +01:00
481 lines
18 KiB
HTML
481 lines
18 KiB
HTML
<!DOCTYPE html>
|
||
<!--[if lt IE 7 ]> <html class="ie ie6 no-js" lang="en"> <![endif]-->
|
||
<!--[if IE 7 ]> <html class="ie ie7 no-js" lang="en"> <![endif]-->
|
||
<!--[if IE 8 ]> <html class="ie ie8 no-js" lang="en"> <![endif]-->
|
||
<!--[if IE 9 ]> <html class="ie ie9 no-js" lang="en"> <![endif]-->
|
||
<!--[if gt IE 9]><!-->
|
||
<html class="no-js" lang="en">
|
||
<!--<![endif]-->
|
||
<head>
|
||
|
||
<meta charset="UTF-8"/>
|
||
|
||
<title>Eat Restaurant Bootstrap HTML5 Responsive Template</title>
|
||
|
||
<meta name="description" content="Eat Restaurant Bootstrap Template">
|
||
|
||
<meta name="author" content="webthemez">
|
||
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
|
||
<link rel="stylesheet" type="text/css" media="screen" href="css/bootstrap.css">
|
||
<link rel="stylesheet" href="css/font-awesome.css">
|
||
<link rel="stylesheet" href="css/animate.css">
|
||
<link rel="stylesheet" href="css/styles.css">
|
||
|
||
<link href='http://fonts.googleapis.com/css?family=Droid+Sans:400,700' rel='stylesheet' type='text/css'>
|
||
<link href='http://fonts.googleapis.com/css?family=Open+Sans:400,700' rel='stylesheet' type='text/css'>
|
||
|
||
|
||
</head>
|
||
<body>
|
||
<!--wrapper start-->
|
||
<div class="wrapper">
|
||
<!--header-->
|
||
<header id="header">
|
||
<div class="carousel fade-carousel slide" data-ride="carousel" data-interval="4000" id="bs-carousel">
|
||
<!-- Overlay -->
|
||
<div class="overlay"></div>
|
||
|
||
<!-- Indicators -->
|
||
<ol class="carousel-indicators">
|
||
<li data-target="#bs-carousel" data-slide-to="0" class="active"></li>
|
||
<li data-target="#bs-carousel" data-slide-to="1"></li>
|
||
<li data-target="#bs-carousel" data-slide-to="2"></li>
|
||
</ol>
|
||
|
||
<!-- Wrapper for slides -->
|
||
<div class="carousel-inner">
|
||
<div class="item slides active">
|
||
<div class="slide-1"></div>
|
||
<div class="hero">
|
||
<hgroup>
|
||
<img src="img/logo.png" alt="logo"/>
|
||
<h1>We are creative</h1>
|
||
<h3>Get start your next awesome project</h3>
|
||
</hgroup>
|
||
<a class="btn btn-hero btn-lg" href="#service">Eat & Chat</a>
|
||
</div>
|
||
</div>
|
||
<div class="item slides">
|
||
<div class="slide-2"></div>
|
||
<div class="hero">
|
||
<hgroup>
|
||
<img src="img/logo.png" alt="logo"/>
|
||
<h1>We are smart</h1>
|
||
<h3>Get start your next awesome project</h3>
|
||
</hgroup>
|
||
<a class="btn btn-hero btn-lg" href="#service">Eat & Chat</a>
|
||
</div>
|
||
</div>
|
||
<div class="item slides">
|
||
<div class="slide-3"></div>
|
||
<div class="hero">
|
||
<hgroup>
|
||
<img src="img/logo.png" alt="logo"/>
|
||
<h1>We are amazing</h1>
|
||
<h3>Get start your next awesome project</h3>
|
||
</hgroup>
|
||
<a class="btn btn-hero btn-lg" href="#service">Eat & Chat</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
|
||
<div class="menu">
|
||
<nav class="navbar navbar-wrapper">
|
||
<div class="container">
|
||
<div class="navbar-header">
|
||
<button type="button" id="nav-toggle" class="navbar-toggle" data-toggle="collapse" data-target="#main-nav"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button>
|
||
</div>
|
||
<div id="main-nav" class="collapse navbar-collapse">
|
||
<ul class="nav navbar-nav">
|
||
<li><a href="#header" class="scroll-link">Home</a></li>
|
||
<li><a href="#service" class="scroll-link">Our Services</a></li>
|
||
<li><a href="#aboutUs" class="scroll-link">About Us</a></li>
|
||
<li><a href="#gallery" class="scroll-link">Gallery</a></li>
|
||
<li><a href="#feedback" class="scroll-link">Feedback</a></li>
|
||
<li><a href="#contact" class="scroll-link">Contact</a></li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</nav>
|
||
</div>
|
||
</header>
|
||
|
||
<section class="service page-section" id="service">
|
||
<div class="container text-center">
|
||
<div class="heading">
|
||
<h2>Eat & Chat</h2>
|
||
<h3>Phasellus non dolor nibh. Nullam elementum tellus pretium feugiat.<br>
|
||
Cras dictum tellus dui, vitae sollicitudin ipsum tincidunt in. Sed tincidunt tristique enim sed sollcitudin.</h3>
|
||
</div>
|
||
|
||
<div class="row">
|
||
<div class="col-md-4">
|
||
<div class="box-area">
|
||
<div class="box-area-icon">
|
||
<i class="fa fa-heart"></i>
|
||
</div>
|
||
<h3>Streets Best</h3>
|
||
<div class="box-area-text">Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat.</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-4">
|
||
<div class="box-area">
|
||
<div class="box-area-icon">
|
||
<i class="fa fa-users"></i>
|
||
</div>
|
||
<h3>Continental</h3>
|
||
<div class="box-area-text">Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat.</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-4">
|
||
<div class="box-area">
|
||
<div class="box-area-icon">
|
||
<i class="fa fa-fire"></i>
|
||
</div>
|
||
<h3>Daily Dishes</h3>
|
||
<div class="box-area-text">Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat.</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-4">
|
||
<div class="box-area">
|
||
<div class="box-area-icon">
|
||
<i class="fa fa-film"></i>
|
||
</div>
|
||
<h3>Cookies</h3>
|
||
<div class="box-area-text">Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat.</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-4">
|
||
<div class="box-area">
|
||
<div class="box-area-icon">
|
||
<i class="fa fa-cubes"></i>
|
||
</div>
|
||
<h3>Cakes</h3>
|
||
<div class="box-area-text">Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat.</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-4">
|
||
<div class="box-area">
|
||
<div class="box-area-icon">
|
||
<i class="fa fa-envelope"></i>
|
||
</div>
|
||
<h3>Meeting point</h3>
|
||
<div class="box-area-text">Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat.</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!--about us-->
|
||
<section class="aboutus page-section" id="aboutUs">
|
||
<div class="container">
|
||
<div class="heading">
|
||
<h2>Who we are</h2>
|
||
<h3>Phasellus non dolor nibh. Nullam elementum tellus pretium feugiat.<br>
|
||
Cras dictum tellus dui, vitae sollicitudin ipsum tincidunt in. Sed tincidunt tristique enim sed sollcitudin.</h3>
|
||
</div>
|
||
|
||
<div class="content">
|
||
|
||
<p>Then I'll write a little about yourself, your brief biography and why I started doing this and still continue.</p><p>
|
||
|
||
I love to travel and are constantly taking pictures and doing all the sketches, I'm madly in love because our world is so beautiful;)</p><p>
|
||
|
||
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam ornare sem sit amet mauris bibendum, ac fringilla quam eleifend. Praesent elit tellus, venenatis in lorem ac, porta accumsan sapien. Cras malesuada feugiat magnum.</p><p>
|
||
|
||
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam ornare sem sit amet mauris bibendum, ac fringilla quam eleifend. Praesent elit tellus, venenatis in lorem ac, porta accumsan sapien. Cras malesuada feugiat magnum.</p>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!--gallery-->
|
||
<section class="gallery page-section" id="gallery">
|
||
<div class="container">
|
||
<div class="heading">
|
||
<h2>Our Gallery</h2>
|
||
<h3>Phasellus non dolor nibh. Nullam elementum tellus pretium feugiat.<br>
|
||
Cras dictum tellus dui, vitae sollicitudin ipsum tincidunt in. Sed tincidunt tristique enim sed sollcitudin.</h3>
|
||
</div>
|
||
|
||
<div id="grid-gallery" class="grid-gallery">
|
||
|
||
<section class="grid-wrap">
|
||
<ul class="grid">
|
||
<li class="grid-sizer"></li><!-- for Masonry column width -->
|
||
<li>
|
||
<figure>
|
||
<img src="img/gallery/img1.jpg" alt=""/>
|
||
<figcaption><h3>Thundercats level</h3> </figcaption>
|
||
</figure>
|
||
</li>
|
||
<li>
|
||
<figure>
|
||
<img src="img/gallery/img2.jpg" alt=""/>
|
||
<figcaption><h3>Bushwick selvage</h3></figcaption>
|
||
</figure>
|
||
</li>
|
||
<li>
|
||
<figure>
|
||
<img src="img/gallery/img3.jpg" alt=""/>
|
||
<figcaption><h3>Bottle wayfarers</h3></figcaption>
|
||
</figure>
|
||
</li>
|
||
<li>
|
||
<figure>
|
||
<img src="img/gallery/img4.jpg" alt=""/>
|
||
<figcaption><h3>Letterpress</h3></figcaption>
|
||
</figure>
|
||
</li>
|
||
<li>
|
||
<figure>
|
||
<img src="img/gallery/img5.jpg" alt=""/>
|
||
<figcaption><h3>Vice velit chia</h3></figcaption>
|
||
</figure>
|
||
</li>
|
||
<li>
|
||
<figure>
|
||
<img src="img/gallery/img6.jpg" alt=""/>
|
||
<figcaption><h3>Brunch semiotics</h3></figcaption>
|
||
</figure>
|
||
</li>
|
||
|
||
<li>
|
||
<figure>
|
||
<img src="img/gallery/img7.jpg" alt=""/>
|
||
<figcaption><h3>Brunch semiotics</h3></figcaption>
|
||
</figure>
|
||
</li>
|
||
|
||
<li>
|
||
<figure>
|
||
<img src="img/gallery/img8.jpg" alt=""/>
|
||
<figcaption><h3>Brunch semiotics</h3></figcaption>
|
||
</figure>
|
||
</li>
|
||
|
||
</ul>
|
||
</section><!-- // end small images -->
|
||
|
||
<section class="slideshow">
|
||
<ul>
|
||
<li>
|
||
<figure>
|
||
<img src="img/gallery/img1.jpg" alt=""/>
|
||
<figcaption><h3>Thundercats next level</h3><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam ornare sem sit amet mauris bibendum, ac fringilla quam eleifend.</p></figcaption>
|
||
</figure>
|
||
</li>
|
||
<li>
|
||
<figure>
|
||
<img src="img/gallery/img2.jpg" alt=""/>
|
||
<figcaption><h3>Bushwick selvage synth</h3><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam ornare sem sit amet mauris bibendum, ac fringilla quam eleifend.</p></figcaption>
|
||
</figure>
|
||
</li>
|
||
<li>
|
||
<figure>
|
||
<img src="img/gallery/img3.jpg" alt=""/>
|
||
<figcaption><h3>Bottle wayfarers locavore</h3><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam ornare sem sit amet mauris bibendum, ac fringilla quam eleifend.</p></figcaption>
|
||
</figure>
|
||
</li>
|
||
<li>
|
||
<figure>
|
||
<img src="img/gallery/img4.jpg" alt=""/>
|
||
<figcaption><h3>Letterpress asymmetrical</h3><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam ornare sem sit amet mauris bibendum, ac fringilla quam eleifend.</p></figcaption>
|
||
</figure>
|
||
</li>
|
||
<li>
|
||
<figure>
|
||
<img src="img/gallery/img5.jpg" alt=""/>
|
||
<figcaption><h3>Vice velit chia</h3><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam ornare sem sit amet mauris bibendum, ac fringilla quam eleifend.</p></figcaption>
|
||
</figure>
|
||
</li>
|
||
<li>
|
||
<figure>
|
||
<img src="img/gallery/img6.jpg" alt=""/>
|
||
<figcaption><h3>Brunch semiotics</h3><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam ornare sem sit amet mauris bibendum, ac fringilla quam eleifend.</p></figcaption>
|
||
</figure>
|
||
</li>
|
||
|
||
<li>
|
||
<figure>
|
||
<img src="img/gallery/img7.jpg" alt=""/>
|
||
<figcaption><h3>Brunch semiotics</h3><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam ornare sem sit amet mauris bibendum, ac fringilla quam eleifend.</p></figcaption>
|
||
</figure>
|
||
</li>
|
||
|
||
<li>
|
||
<figure>
|
||
<img src="img/gallery/img8.jpg" alt=""/>
|
||
<figcaption><h3>Brunch semiotics</h3><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam ornare sem sit amet mauris bibendum, ac fringilla quam eleifend.</p></figcaption>
|
||
</figure>
|
||
</li>
|
||
</ul>
|
||
<nav>
|
||
<span class="icon nav-prev"></span>
|
||
<span class="icon nav-next"></span>
|
||
<span class="icon nav-close"></span>
|
||
</nav>
|
||
|
||
</section><!-- // end slideshow -->
|
||
|
||
</div><!-- // grid-gallery -->
|
||
</div>
|
||
</section>
|
||
|
||
<!--feedback-->
|
||
<section class="feedback page-section" id="feedback">
|
||
<div class="container">
|
||
<div class="heading">
|
||
|
||
<h2>What Our Client Say</h2>
|
||
|
||
<h3>Phasellus non dolor nibh. Nullam elementum tellus pretium feugiat.<br>
|
||
Cras dictum tellus dui, vitae sollicitudin ipsum tincidunt in. Sed tincidunt tristique enim sed sollcitudin.</h3>
|
||
</div>
|
||
|
||
<div class='row'>
|
||
<div class='col-md-12'>
|
||
<div class="carousel slide" data-ride="carousel" id="quote-carousel">
|
||
<!-- Bottom Carousel Indicators -->
|
||
<ol class="carousel-indicators">
|
||
<li data-target="#quote-carousel" data-slide-to="0" class="active"></li>
|
||
<li data-target="#quote-carousel" data-slide-to="1"></li>
|
||
<li data-target="#quote-carousel" data-slide-to="2"></li>
|
||
</ol>
|
||
|
||
<!-- Carousel Slides / Quotes -->
|
||
<div class="carousel-inner">
|
||
|
||
<!-- Quote 1 -->
|
||
<div class="item active">
|
||
<blockquote>
|
||
<div class="row">
|
||
<div class="col-sm-3 text-center">
|
||
<img class="img-circle" src="https://s3.amazonaws.com/uifaces/faces/twitter/kolage/128.jpg" style="width: 100px;height:100px;">
|
||
</div>
|
||
<div class="col-sm-9">
|
||
<p>Neque porro quisquam est qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit!</p>
|
||
<small>Someone famous</small>
|
||
</div>
|
||
</div>
|
||
</blockquote>
|
||
</div>
|
||
<!-- Quote 2 -->
|
||
<div class="item">
|
||
<blockquote>
|
||
<div class="row">
|
||
<div class="col-sm-3 text-center">
|
||
<img class="img-circle" src="https://s3.amazonaws.com/uifaces/faces/twitter/mijustin/128.jpg" style="width: 100px;height:100px;">
|
||
</div>
|
||
<div class="col-sm-9">
|
||
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam auctor nec lacus ut tempor. Mauris.</p>
|
||
<small>Someone famous</small>
|
||
</div>
|
||
</div>
|
||
</blockquote>
|
||
</div>
|
||
<!-- Quote 3 -->
|
||
<div class="item">
|
||
<blockquote>
|
||
<div class="row">
|
||
<div class="col-sm-3 text-center">
|
||
<img class="img-circle" src="https://s3.amazonaws.com/uifaces/faces/twitter/keizgoesboom/128.jpg" style="width: 100px;height:100px;">
|
||
</div>
|
||
<div class="col-sm-9">
|
||
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut rutrum elit in arcu blandit, eget pretium nisl accumsan. Sed ultricies commodo tortor, eu pretium mauris.</p>
|
||
<small>Someone famous</small>
|
||
</div>
|
||
</div>
|
||
</blockquote>
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
|
||
</div>
|
||
</section>
|
||
|
||
<!--feedback-->
|
||
<section class="contact page-section" id="contact">
|
||
<div class="container">
|
||
<div class="heading">
|
||
|
||
<h2>Contact Us</h2>
|
||
|
||
<h3>Phasellus non dolor nibh. Nullam elementum tellus pretium feugiat.<br>
|
||
Cras dictum tellus dui, vitae sollicitudin ipsum tincidunt in. Sed tincidunt tristique enim sed sollcitudin.</h3>
|
||
</div>
|
||
</div>
|
||
<div class="container w960">
|
||
<div class="row">
|
||
<div class="done">
|
||
<div class="alert alert-success">
|
||
<button type="button" class="close" data-dismiss="alert">×</button>
|
||
Your message has been sent. Thank you!
|
||
</div>
|
||
</div>
|
||
<form method="post" action="contact.php" id="contactform">
|
||
<input name="name" type="text" class="contact col-md-6" placeholder="Your Name *" >
|
||
<input name="email" type="email" class="contact noMarr col-md-6" placeholder="E-mail address *" >
|
||
<textarea name="comment" class="contact col-md-12" placeholder="Message *"></textarea>
|
||
<input type="submit" id="submit" class="contact submit" value="Send message">
|
||
</form>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!--footer-->
|
||
<section class="footer" id="footer">
|
||
<p class="text-center">
|
||
<a href="#header" class="gototop"><i class="fa fa-angle-double-up fa-2x"></i></a>
|
||
</p>
|
||
<div class="container">
|
||
<ul>
|
||
<li><a href="#"><i class="fa fa-twitter"></i></a></li>
|
||
<li><a href="#"><i class="fa fa-facebook"></i></a></li>
|
||
<li><a href="#"><i class="fa fa-linkedin"></i></a></li>
|
||
<li><a href="#"><i class="fa fa-pinterest"></i></a></li>
|
||
<li><a href="#"><i class="fa fa-flickr"></i></a></li>
|
||
</ul>
|
||
<p>
|
||
© 2015 Copyright Your Website Template by <a href="http://webthemez.com">Webthemez.com</a>
|
||
</p>
|
||
</div>
|
||
</section>
|
||
|
||
</div><!--wrapper end-->
|
||
|
||
<!--Javascripts-->
|
||
<script src="js/jquery.js"></script>
|
||
<script src="js/modernizr.js"></script>
|
||
<script src="js/bootstrap.js"></script>
|
||
<script src="js/jquery-scrolltofixed.js"></script>
|
||
<script src="js/jquery.nav.js"></script>
|
||
<script src="js/jquery.easing.1.3.js"></script>
|
||
<script src="js/menustick.js"></script>
|
||
<script src="js/easing.js"></script>
|
||
<script src="js/wow.js"></script>
|
||
<script src="js/smoothscroll.js"></script>
|
||
<script src="js/masonry.js"></script>
|
||
<script src="js/imgloaded.js"></script>
|
||
<script src="js/classie.js"></script>
|
||
<script src="js/colorfinder.js"></script>
|
||
<script src="js/gridscroll.js"></script>
|
||
<script src="js/contact.js"></script>
|
||
<script src="js/custom.js"></script>
|
||
|
||
<script type="text/javascript">
|
||
jQuery(function($) {
|
||
$(document).ready( function() {
|
||
$('.navbar-wrapper').stickUp();
|
||
});
|
||
});
|
||
</script>
|
||
</body>
|
||
</html> |