mirror of
https://github.com/dawidolko/Website-Templates.git
synced 2025-10-27 16:03:10 +01:00
723 lines
33 KiB
HTML
723 lines
33 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">
|
|
|
|
<!-- Template Title -->
|
|
<title>Foodz one page responsive HTML5 mobile landing page</title>
|
|
|
|
<link rel="icon" href="" type="image/x-icon"/>
|
|
|
|
<!-- Bootstrap 3.3.0 stylesheet -->
|
|
<link href="css/bootstrap.min.css" rel="stylesheet">
|
|
|
|
<!-- Font Awesome Icon stylesheet -->
|
|
<link href="css/font-awesome.min.css" rel="stylesheet">
|
|
|
|
<!-- Owl Carousel stylesheet -->
|
|
<link href="css/owl.carousel.css" rel="stylesheet">
|
|
|
|
<!-- Pretty Photo stylesheet -->
|
|
<link href="css/prettyPhoto.css" rel="stylesheet">
|
|
|
|
<!-- Custom stylesheet -->
|
|
<link href="css/style.css" rel="stylesheet">
|
|
|
|
|
|
<!-- Custom Responsive stylesheet -->
|
|
<link href="css/responsive.css" rel="stylesheet">
|
|
|
|
<!-- HTML5 Shim and Respond.js 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.2/html5shiv.min.js"></script>
|
|
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
|
|
<![endif]-->
|
|
</head>
|
|
<body>
|
|
<!-- ====== Header Section ====== -->
|
|
<header id="top">
|
|
<div class="bg-color">
|
|
<div class="top section-padding">
|
|
<div class="container">
|
|
<div class="row">
|
|
|
|
<div class="col-sm-7 col-md-7">
|
|
<div class="content">
|
|
<h1><strong>Food</strong> Template</h1>
|
|
<h2>Best Mobile App bootstrap landing page.</h2>
|
|
<div class="button" id="download-app1">
|
|
<a href="#download" class="btn btn-default btn-lg custom-btn">Download App</a>
|
|
</div> <!-- end .button -->
|
|
</div> <!-- end .content -->
|
|
</div> <!-- end .top > .container> .row> .col-md-7 -->
|
|
|
|
<div class="col-sm-5 col-md-5">
|
|
<div class="photo-slide">
|
|
<div id="carousel" class="carousel slide" data-ride="carousel">
|
|
<ol class="carousel-indicators">
|
|
<li data-target="#carousel" data-slide-to="0" class="active"></li>
|
|
<li data-target="#carousel" data-slide-to="1" class=""></li>
|
|
<li data-target="#carousel" data-slide-to="2" class=""></li>
|
|
</ol>
|
|
<div class="carousel-inner">
|
|
<div class="item">
|
|
<img src="images/phone.png" alt="">
|
|
</div>
|
|
<div class="item active left">
|
|
<img src="images/phone.png" alt="">
|
|
</div>
|
|
<div class="item next left">
|
|
<img src="images/phone.png" alt="">
|
|
</div>
|
|
</div> <!-- end .carousel-inner -->
|
|
</div> <!-- end #carousel -->
|
|
</div> <!-- end .photo-slide -->
|
|
</div> <!-- end .top > .container> .row> .col-md-5 -->
|
|
|
|
</div> <!-- end .top> .container> .row -->
|
|
</div> <!-- end .top> .container -->
|
|
</div> <!-- end .top -->
|
|
</div> <!-- end .bg-color -->
|
|
</header>
|
|
<!-- ====== End Header Section ====== -->
|
|
|
|
|
|
<!-- ====== Menu Section ====== -->
|
|
<section id="menu">
|
|
<div class="navigation">
|
|
<div id="main-nav" class="navbar navbar-default" role="navigation">
|
|
<div class="container">
|
|
|
|
<div class="navbar-header">
|
|
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
|
|
<span class="sr-only">Toggle navigation</span>
|
|
<span class="icon-bar"></span>
|
|
<span class="icon-bar"></span>
|
|
<span class="icon-bar"></span>
|
|
</button>
|
|
<a class="navbar-brand" href="">Foodz</a>
|
|
</div> <!-- end .navbar-header -->
|
|
|
|
<div class="navbar-collapse collapse">
|
|
<ul id="ulnav" class="nav navbar-nav navbar-right">
|
|
<li class="active"><a href="#top">Home</a></li>
|
|
<li><a href="#aboutApp">About App</a></li>
|
|
<li><a href="#features">Features</a></li>
|
|
<li><a href="#screenshots">Screenshots</a></li>
|
|
<li><a href="#testimonial">Reviews</a></li>
|
|
<li><a href="#team">Team</a></li>
|
|
<li><a href="#price">Pricing</a></li>
|
|
<li><a href="#download">Download</a></li>
|
|
<li><a href="#contact">Contact</a></li>
|
|
</ul>
|
|
</div><!-- end .navbar-collapse -->
|
|
|
|
</div> <!-- end .container -->
|
|
</div> <!-- end #main-nav -->
|
|
</div> <!-- end .navigation -->
|
|
</section>
|
|
<!-- ====== End Menu Section ====== -->
|
|
|
|
<!-- ====== aboutApp Section ====== -->
|
|
<section id="aboutApp">
|
|
<div class="aboutApp">
|
|
<div class="aboutApp-one section-padding">
|
|
<div class="container">
|
|
<div class="row">
|
|
<div class="col-sm-5 col-md-6">
|
|
<div class="app-image">
|
|
<img src="images/duel-phone-big1.png" alt="">
|
|
</div>
|
|
</div>
|
|
<div class="col-sm-7 col-md-6">
|
|
<div class="content">
|
|
<h1>Our Mobile App</h1>
|
|
<h4>Lorem ipsum dolor sit amet</h4>
|
|
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eligendi aspernatur sit, officiis sunt voluptate dolorum odit quam. Recusandae tempore excepturi pariatur provident corrupti est quisquam ratione, consectetur nam omnis eius.
|
|
<br>
|
|
<br>
|
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ducimus aut non tempore, explicabo aliquam harum odio et libero.
|
|
<br>
|
|
<br>
|
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eligendi aspernatur sit, officiis sunt voluptate dolorum odit quam. Recusandae tempore excepturi pariatur provident corrupti est quisquam ratione, consectetur nam omnis eius.
|
|
<br>
|
|
</div>
|
|
</div>
|
|
</div> <!-- .container> .row -->
|
|
</div> <!-- .container -->
|
|
</div> <!-- end .aboutApp-one -->
|
|
</div> <!-- end .aboutApp -->
|
|
</section>
|
|
<!-- ====== End aboutApp Section ====== -->
|
|
|
|
<!-- ====== Features Section ====== -->
|
|
<section id="features">
|
|
<div class="features section-padding dark-bg">
|
|
<div class="container">
|
|
|
|
<div class="header">
|
|
<h1>Amazing Features</h1>
|
|
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Facilis nesciunt eos, ipsum id, architecto velit sequi fuga minima commodi, porro vitae officiis, voluptatibus minus voluptates ab. Dolore, dolor repellat quasi.</p>
|
|
<div class="underline">
|
|
</div>
|
|
</div> <!-- end .container> .header -->
|
|
<div class="row"> <!-- row -->
|
|
|
|
<div class="col-md-5 text-right"> <!-- Left Content Col 6 -->
|
|
<div class="media service"> <!-- Service #1 -->
|
|
<div class="media-body">
|
|
|
|
<h4 class="media-heading">Brand Identity</h4>
|
|
<p>Nullam quis risus eget urna mollis ornare vel eu leo. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.</p>
|
|
</div>
|
|
<div class="media-right media-middle">
|
|
<i class="fa fa-users"></i>
|
|
</div>
|
|
</div><!-- End Service #1 -->
|
|
|
|
<div class="media service"> <!-- Service #2 -->
|
|
<div class="media-body">
|
|
|
|
<h4 class="media-heading">Graphics Design</h4>
|
|
<p>Nullam quis risus eget urna mollis ornare vel eu leo. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.</p>
|
|
</div>
|
|
<div class="media-right media-middle">
|
|
<i class="fa fa-arrows"></i>
|
|
</div>
|
|
</div><!-- End Service #2 -->
|
|
|
|
<div class="media service"> <!-- Service #3 -->
|
|
<div class="media-body">
|
|
|
|
<h4 class="media-heading">Videography</h4>
|
|
<p>Nullam quis risus eget urna mollis ornare vel eu leo. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.</p>
|
|
</div>
|
|
<div class="media-right media-middle">
|
|
<i class="fa fa-camera-retro"></i>
|
|
</div>
|
|
</div> <!-- End Service #3 -->
|
|
</div> <!-- End Left Content Col 6 -->
|
|
<div class="col-md-2">
|
|
<div class="featured-item-img">
|
|
<img src="images/phone.png" alt="">
|
|
</div>
|
|
</div>
|
|
<div class="col-md-5"> <!-- Right Content Col 6 -->
|
|
<div class="media service"> <!-- Service #4 -->
|
|
<div class="media-left media-middle">
|
|
<i class="fa fa-android"></i>
|
|
</div>
|
|
<div class="media-body">
|
|
<h4 class="media-heading">UI/UX Design</h4>
|
|
<p>Nullam quis risus eget urna mollis ornare vel eu leo. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.</p>
|
|
</div>
|
|
|
|
</div><!-- end Service #4 -->
|
|
|
|
<div class="media service"> <!-- Service #5 -->
|
|
|
|
<div class="media-left media-middle">
|
|
<i class="fa fa-apple"></i>
|
|
</div>
|
|
<div class="media-body">
|
|
<h4 class="media-heading">Application</h4>
|
|
<p>Nullam quis risus eget urna mollis ornare vel eu leo. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.</p>
|
|
</div>
|
|
</div> <!-- end Service #5 -->
|
|
|
|
<div class="media service"> <!-- Service #6 -->
|
|
<div class="media-left media-middle">
|
|
<i class="fa fa-play"></i>
|
|
</div>
|
|
<div class="media-body">
|
|
<h4 class="media-heading">SEO/Online Marketing</h4>
|
|
<p>Nullam quis risus eget urna mollis ornare vel eu leo. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.</p>
|
|
</div>
|
|
</div> <!-- end Service #6 -->
|
|
</div><!-- end Right Content Col 6 -->
|
|
|
|
</div>
|
|
|
|
</div> <!-- end .container -->
|
|
</div> <!-- end .features -->
|
|
</section>
|
|
<!-- ====== End Features Section ====== -->
|
|
|
|
|
|
<!-- ====== Screenshots Section ====== -->
|
|
<section id="screenshots">
|
|
<div class="screenshots section-padding">
|
|
<div class="container">
|
|
|
|
<div class="header">
|
|
<h1>App Screenshots</h1>
|
|
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Facilis nesciunt eos, ipsum id, architecto velit sequi fuga minima commodi, porro vitae officiis, voluptatibus minus voluptates ab. Dolore, dolor repellat quasi.</p>
|
|
<div class="underline"></div>
|
|
</div>
|
|
|
|
<div class="owl-carousel owl-theme">
|
|
<div class="item">
|
|
<a href="images/app.jpg" data-rel="prettyPhoto"><img src="images/app.jpg" alt="item photo"></a>
|
|
</div> <!-- end item -->
|
|
<div class="item">
|
|
<a href="images/app2.jpg" data-rel="prettyPhoto"><img src="images/app2.jpg" alt="item photo"></a>
|
|
</div> <!-- end item -->
|
|
<div class="item">
|
|
<a href="images/app.jpg" data-rel="prettyPhoto"><img src="images/app.jpg" alt="item photo"></a>
|
|
</div> <!-- end item -->
|
|
<div class="item">
|
|
<a href="images/app2.jpg" data-rel="prettyPhoto"><img src="images/app2.jpg" alt="item photo"></a>
|
|
</div> <!-- end item -->
|
|
<div class="item">
|
|
<a href="images/app.jpg" data-rel="prettyPhoto"><img src="images/app.jpg" alt="item photo"></a>
|
|
</div> <!-- end item -->
|
|
<div class="item">
|
|
<a href="images/app2.jpg" data-rel="prettyPhoto"><img src="images/app2.jpg" alt="item photo"></a>
|
|
</div> <!-- end item -->
|
|
</div> <!-- end owl carousel -->
|
|
|
|
</div> <!-- .container -->
|
|
</div> <!-- end .screenshots -->
|
|
</section>
|
|
<!-- ====== End Screenshots Section ====== -->
|
|
|
|
<!-- ====== Testimonial Section ====== -->
|
|
<section id="testimonial">
|
|
<div class="bg-color bg-testimonial">
|
|
<div class="testimonial section-padding">
|
|
<div class="container">
|
|
<div class="testimonial-slide">
|
|
<div id="carousel-testimonial" class="carousel slide" data-ride="carousel">
|
|
<ol class="carousel-indicators">
|
|
<li data-target="#carousel-testimonial" data-slide-to="0" class="active"></li>
|
|
<li data-target="#carousel-testimonial" data-slide-to="1" class=""></li>
|
|
<li data-target="#carousel-testimonial" data-slide-to="2" class=""></li>
|
|
</ol>
|
|
<div class="carousel-inner">
|
|
|
|
<div class="item">
|
|
<div class="image">
|
|
<img src="images/01.jpg" alt="">
|
|
</div> <!-- end .image -->
|
|
<div class="content">
|
|
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ut dignissimos ipsam obcaecati corrupti modi, deserunt facere asperiores. Voluptatum laudantium ut, minus nam. Libero facilis aspernatur cumque, quisquam quod sint odit.</p>
|
|
<h4>Jon Doe</h4>
|
|
<h5>Web developer</h5>
|
|
</div> <!-- end .content -->
|
|
</div> <!-- end .item (1) -->
|
|
|
|
<div class="item active left">
|
|
<div class="image">
|
|
<img src="images/02.jpg" alt="">
|
|
</div> <!-- end .image -->
|
|
<div class="content">
|
|
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ut dignissimos ipsam obcaecati corrupti modi, deserunt facere asperiores. Voluptatum laudantium ut, minus nam. Libero facilis aspernatur cumque, quisquam quod sint odit.</p>
|
|
<h4>Jon Doe</h4>
|
|
<h5>Web developer</h5>
|
|
</div> <!-- end .content -->
|
|
</div> <!-- end .item (2) -->
|
|
|
|
<div class="item next left">
|
|
<div class="image">
|
|
<img src="images/03.jpg" alt="">
|
|
</div> <!-- end .image -->
|
|
<div class="content">
|
|
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ut dignissimos ipsam obcaecati corrupti modi, deserunt facere asperiores. Voluptatum laudantium ut, minus nam. Libero facilis aspernatur cumque, quisquam quod sint odit.</p>
|
|
<h4>Jon Doe</h4>
|
|
<h5>Web developer</h5>
|
|
</div> <!-- end .content -->
|
|
</div> <!-- end .item (3) -->
|
|
|
|
</div> <!-- end .carousel-inner -->
|
|
</div> <!-- end #carousel-testimonial -->
|
|
</div> <!-- end .testimonial-slide -->
|
|
</div> <!-- end .container -->
|
|
</div> <!-- end .testimonial -->
|
|
</div> <!-- end .bg-testimonial -->
|
|
</section>
|
|
<!-- ====== End Testimonial Section ====== -->
|
|
|
|
|
|
<!-- ====== Team Section ====== -->
|
|
<section id="team">
|
|
<div class="team section-padding">
|
|
<div class="container">
|
|
|
|
<div class="header">
|
|
<h1>Who develop the App</h1>
|
|
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Qui hic laboriosam odio doloribus suscipit error nostrum totam dignissimos esse numquam voluptatum, aspernatur est.</p>
|
|
<div class="underline"></div>
|
|
</div> <!-- end .container> .header -->
|
|
|
|
<div class="row">
|
|
<div class="app-dev">
|
|
|
|
<div class="col-sm-6 col-md-6 col-lg-3 info">
|
|
<div class="member">
|
|
<img src="images/01.jpg" alt="">
|
|
<div class="details">
|
|
<div class="social icon">
|
|
<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-google-plus"></i></a></li>
|
|
</ul>
|
|
</div> <!-- end .icon -->
|
|
</div> <!-- end .details -->
|
|
</div> <!-- end .member -->
|
|
<div class="title">
|
|
<h4>Kristin Doe</h4>
|
|
<h5>General Manager</h5>
|
|
</div> <!-- end .title -->
|
|
</div> <!-- end .info (1) -->
|
|
|
|
<div class="col-sm-6 col-md-6 col-lg-3 info">
|
|
<div class="member">
|
|
<img src="images/02.jpg" alt="">
|
|
<div class="details">
|
|
<div class="social icon">
|
|
<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-google-plus"></i></a></li>
|
|
</ul>
|
|
</div> <!-- end .icon -->
|
|
</div> <!-- end .details -->
|
|
</div> <!-- end .member -->
|
|
<div class="title">
|
|
<h4>Michelline</h4>
|
|
<h5>Developer</h5>
|
|
</div> <!-- end .title -->
|
|
</div> <!-- end .info (2) -->
|
|
|
|
<div class="col-sm-6 col-md-6 col-lg-3 info">
|
|
<div class="member">
|
|
<img src="images/03.jpg" alt="">
|
|
<div class="details">
|
|
<div class="social icon">
|
|
<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-google-plus"></i></a></li>
|
|
</ul>
|
|
</div> <!-- end .icon -->
|
|
</div> <!-- end .details -->
|
|
</div> <!-- end .member -->
|
|
<div class="title">
|
|
<h4>John Doe</h4>
|
|
<h5>Front End Developer</h5>
|
|
</div> <!-- end .title -->
|
|
</div> <!-- end .info (3) -->
|
|
|
|
<div class="col-sm-6 col-md-6 col-lg-3 info">
|
|
<div class="member">
|
|
<img src="images/04.jpg" alt="">
|
|
<div class="details">
|
|
<div class="social icon">
|
|
<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-google-plus"></i></a></li>
|
|
</ul>
|
|
</div> <!-- end .icon -->
|
|
</div> <!-- end .details -->
|
|
</div> <!-- end .member -->
|
|
<div class="title">
|
|
<h4>Harry Potter</h4>
|
|
<h5>Manager</h5>
|
|
</div> <!-- end .title -->
|
|
</div> <!-- end .info (4) -->
|
|
|
|
</div> <!-- end .app-dev -->
|
|
</div> <!-- end .container> .row -->
|
|
|
|
</div> <!-- end .container -->
|
|
</div> <!-- end .team -->
|
|
</section>
|
|
<!-- ====== Team Section ====== -->
|
|
|
|
|
|
<!-- ====== Price Section ====== -->
|
|
<section id="price">
|
|
<div class="price section-padding dark-bg">
|
|
<div class="container"> <!-- container -->
|
|
<div class="header">
|
|
<h1>Pricing</h1>
|
|
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Qui hic laboriosam odio doloribus suscipit error nostrum totam dignissimos esse numquam voluptatum, aspernatur est.</p>
|
|
<div class="underline"></div>
|
|
</div> <!-- end .container> .header -->
|
|
|
|
<div class="row"> <!-- outer row -->
|
|
<div class="col-md-10 col-md-offset-1"> <!-- col 10 with offset 1 to centered -->
|
|
<div class="row"> <!-- nested row -->
|
|
|
|
<div class="col-md-4 nopadding"><!-- Price table #1 -->
|
|
<div class="panel panel-default price"> <!-- pricing table wrapper -->
|
|
<div class="panel-heading">Basic Plan</div>
|
|
<div class="panel-body">
|
|
<h1><sup>$</sup>25<small>/mon</small></h1> <!-- Plan Price -->
|
|
</div>
|
|
|
|
<!-- Plan Feature Lists -->
|
|
<ul class="list-unstyled">
|
|
<li>60 Users</li>
|
|
<li>Unlimited Forums</li>
|
|
<li>Unlimited Reports</li>
|
|
<li>3,000 Entries per Month</li>
|
|
<li>200 MB Storage</li>
|
|
<li>
|
|
<button type="button" class="btn btn-primary btn-block tf-btn">Get Started Now</button>
|
|
<small class="text-uppercase">30 Days Free Trial</small>
|
|
</li>
|
|
</ul><!-- end Plan Feature Lists -->
|
|
</div><!-- end pricing table wrapper -->
|
|
</div><!-- end Price table #1 -->
|
|
|
|
<div class="col-md-4 nopadding"><!-- Price table #2 -->
|
|
<div class="panel panel-default price featured"><!-- pricing table wrapper -->
|
|
<div class="panel-heading">Best Plan</div>
|
|
<div class="panel-body">
|
|
<h1><sup>$</sup>49<small>/mon</small></h1><!-- Plan Price -->
|
|
</div>
|
|
|
|
<!-- Plan Feature Lists -->
|
|
<ul class="list-unstyled">
|
|
<li>60 Users</li>
|
|
<li>Unlimited Forums</li>
|
|
<li>Unlimited Reports</li>
|
|
<li>3,000 Entries per Month</li>
|
|
<li>200 MB Storage</li>
|
|
<li>
|
|
<button type="button" class="btn btn-primary btn-block tf-btn color">Get Started Now</button>
|
|
<small class="text-uppercase">30 Days Free Trial</small>
|
|
</li>
|
|
</ul><!-- end Plan Feature Lists -->
|
|
</div><!-- end pricing table wrapper -->
|
|
</div><!-- end Price table #2 -->
|
|
|
|
<div class="col-md-4 nopadding"> <!-- Price table #3 -->
|
|
<div class="panel panel-default price"> <!-- pricing table wrapper -->
|
|
<div class="panel-heading">Premium Plan</div>
|
|
<div class="panel-body">
|
|
<h1><sup>$</sup>99<small>/mon</small></h1><!-- Plan Price -->
|
|
</div>
|
|
|
|
<!-- Plan Feature Lists -->
|
|
<ul class="list-unstyled">
|
|
<li>60 Users</li>
|
|
<li>Unlimited Forums</li>
|
|
<li>Unlimited Reports</li>
|
|
<li>3,000 Entries per Month</li>
|
|
<li>200 MB Storage</li>
|
|
<li>
|
|
<button type="button" class="btn btn-primary btn-block tf-btn">Get Started Now</button>
|
|
<small class="text-uppercase">30 Days Free Trial</small>
|
|
</li>
|
|
</ul><!-- end Plan Feature Lists -->
|
|
</div><!-- end pricing table wrapper -->
|
|
</div><!-- end Price table #3 -->
|
|
|
|
</div> <!-- end nested row -->
|
|
</div> <!-- end col 10 with offset 1 to centered -->
|
|
</div> <!-- end outer row -->
|
|
</div>
|
|
</div> <!-- end .price -->
|
|
</section>
|
|
<!-- ====== End Price Section ====== -->
|
|
|
|
|
|
<!-- ====== Subscribe Section ====== -->
|
|
<section id="subscribe">
|
|
<div class="subscribe section-padding">
|
|
<div class="container">
|
|
<div class="subscribe-header">
|
|
<h1>Newsletter</h1>
|
|
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
|
|
<form action="" class="form subscribe-form">
|
|
<div class="form-group">
|
|
<div class="input-group">
|
|
<label for="f-name" class="sr-only">Newsletter</label>
|
|
<input type="text" class="form-control" id="f-name" placeholder="Enter your email address">
|
|
<div class="input-group-addon">
|
|
<button class="" type="submit">SUBMIT</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
<div class="social">
|
|
<ul>
|
|
<li><a class="twitter" href=""><i class="fa fa-twitter"></i></a></li>
|
|
<li><a class="facebook" href=""><i class="fa fa-facebook"></i></a></li>
|
|
<li><a class="google-plus" href=""><i class="fa fa-google-plus"></i></a></li>
|
|
<li><a class="youtube" href=""><i class="fa fa-youtube"></i></a></li>
|
|
<li><a class="linkedin" href=""><i class="fa fa-linkedin"></i></a></li>
|
|
<li><a class="pinterest" href=""><i class="fa fa-pinterest"></i></a></li>
|
|
<li><a class="dribbble" href=""><i class="fa fa-dribbble"></i></a></li>
|
|
<li><a class="flickr" href=""><i class="fa fa-flickr"></i></a></li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
<!-- ====== End Subscribe Section ====== -->
|
|
|
|
|
|
<!-- ====== Download Section ====== -->
|
|
<section id="download">
|
|
<div class="bg-color">
|
|
<div class="download section-padding">
|
|
<div class="container">
|
|
|
|
<div class="header">
|
|
<h1>Start Download <strong>Mobile App</strong></h1>
|
|
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Numquam voluptatum hic, facere adipisci, placeat ipsa corporis suscipit officiis labore ipsam, laudantium earum ducimus.</p>
|
|
<div class="underline"></div>
|
|
</div> <!-- end .container > .header -->
|
|
|
|
<div class="row download-area">
|
|
|
|
<div class="col-xs-12 col-sm-6 col-md-6 col-lg-3">
|
|
<a href="" class="btn btn-default custom-btn download-btn">
|
|
<i class="fa fa-mobile"></i>
|
|
<div class="app-download">
|
|
<span>Download on the</span><strong>App Store</strong>
|
|
</div>
|
|
</a>
|
|
</div> <!-- end .download-area> .col-lg-3 (1) -->
|
|
|
|
<div class="col-xs-12 col-sm-6 col-md-6 col-lg-3">
|
|
<a href="" class="btn btn-default custom-btn download-btn">
|
|
<img src="images/playstore.png" alt="">
|
|
<div class="app-download">
|
|
<span>GET IT ON</span><strong>Google Play</strong>
|
|
</div></a>
|
|
</div> <!-- end .download-area> .col-lg-3 (2) -->
|
|
|
|
<div class="col-xs-12 col-sm-6 col-md-6 col-lg-3">
|
|
<a href="" class="btn btn-default custom-btn download-btn">
|
|
<i class="fa fa-windows"></i>
|
|
<div class="app-download">
|
|
<span>Available for</span>Windows Phone
|
|
</div>
|
|
</a>
|
|
</div> <!-- end .download-area> .col-lg-3 (3) -->
|
|
|
|
<div class="col-xs-12 col-sm-6 col-md-6 col-lg-3">
|
|
<a href="" class="btn btn-default custom-btn download-btn">
|
|
<img src="images/amazon.png" alt="">
|
|
<div class="app-download">
|
|
<span>Available at</span><strong>Aamazon</strong>
|
|
</div>
|
|
</a>
|
|
</div> <!-- end .download-area> .col-lg-3 (4) -->
|
|
|
|
</div> <!-- end .container > .row/.download-area -->
|
|
|
|
</div> <!-- end .container -->
|
|
</div> <!-- end .download -->
|
|
</div> <!-- end .bg-color -->
|
|
</section>
|
|
<!-- ====== End Download Section ====== -->
|
|
|
|
|
|
<!-- ====== Contact Section ====== -->
|
|
<footer id="contact">
|
|
<div class="footer section-padding">
|
|
<div class="container">
|
|
<h1>Contact Us</h1>
|
|
<form action="" class="form contact">
|
|
|
|
<div class="row">
|
|
<div class="col-xs-12 col-md-6">
|
|
<div class="form-group">
|
|
<label for="name" class="sr-only">Name</label>
|
|
<input type="text" class="form-control" id="name" placeholder="Name">
|
|
</div> <!-- end .form-group -->
|
|
|
|
<div class="form-group">
|
|
<label for="email" class="sr-only">Email</label>
|
|
<input type="email" class="form-control" id="email" placeholder="Email">
|
|
</div> <!-- end .form-group -->
|
|
|
|
<div class="form-group">
|
|
<label for="subject" class="sr-only">Subject</label>
|
|
<input type="text" class="form-control" id="subject" placeholder="Subject">
|
|
</div> <!-- end .form-group -->
|
|
</div> <!-- end .form> .row> .col-md-4 -->
|
|
|
|
<div class="col-xs-12 col-md-6">
|
|
<div class="form-group">
|
|
<label for="message" class="sr-only">Message</label>
|
|
<textarea name="message" id="message" placeholder="Message"></textarea>
|
|
</div> <!-- end .form-group -->
|
|
</div>
|
|
</div> <!-- end .form> .row -->
|
|
|
|
<button class="btn btn-default contact-submit custom-btn" type="submit">SUBMIT</button>
|
|
</form> <!-- end .form -->
|
|
</div> <!-- end .container -->
|
|
</div> <!-- end .footer -->
|
|
</footer>
|
|
<!-- ====== End Contact Section ====== -->
|
|
|
|
|
|
<!-- ====== Copyright Section ====== -->
|
|
<section class="copyright dark-bg">
|
|
<div class="container">
|
|
<p>© 2016 <a href="#">Mobile App</a>, All Rights Reserved - Template By: <a href="http://webthemez.com">Webthemez</a></p>
|
|
</div> <!-- end .container -->
|
|
</section>
|
|
<!-- ====== End Copyright Section ====== -->
|
|
|
|
|
|
<!-- jQuery -->
|
|
<script src="http://code.jquery.com/jquery.min.js"></script>
|
|
<script src="js/jquery.js"></script>
|
|
|
|
<!-- Modernizr js -->
|
|
<script src="js/modernizr-latest.js"></script>
|
|
|
|
<!-- Bootstrap 3.2.0 js -->
|
|
<script src="js/bootstrap.min.js"></script>
|
|
|
|
<!-- Owl Carousel plugin -->
|
|
<script src="js/owl.carousel.min.js"></script>
|
|
|
|
<!-- ScrollTo js -->
|
|
<script src="js/jquery.scrollto.min.js"></script>
|
|
|
|
<!-- LocalScroll js -->
|
|
<script src="js/jquery.localScroll.min.js"></script>
|
|
|
|
<!-- jQuery Parallax plugin -->
|
|
<script src="js/jquery.parallax-1.1.3.js"></script>
|
|
|
|
<!-- Skrollr js plugin -->
|
|
<script src="js/skrollr.min.js"></script>
|
|
|
|
<!-- jQuery One Page Nav Plugin -->
|
|
<script src="js/jquery.nav.js"></script>
|
|
|
|
<!-- jQuery Pretty Photo Plugin -->
|
|
<script src="js/jquery.prettyPhoto.js"></script>
|
|
|
|
|
|
<!-- Custom JS -->
|
|
<script src="js/main.js"></script>
|
|
|
|
<script>
|
|
jQuery(document).ready(function($) {
|
|
"use strict";
|
|
jQuery("a[data-rel^='prettyPhoto']").prettyPhoto({social_tools:false});
|
|
});
|
|
</script>
|
|
</body>
|
|
</html> |