View file index.html

File size: 19.89Kb
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="description" content="FlatBest - Responsive One Page Fast Loading">
<meta name="keywords" content="One Page, Bootstrap, Website, Business, Resume, Portfolio, Template, Unlimited Colors">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">

<!-- ===== Site Title===== -->
<title>Love - Wedding Template</title>

<!-- ===== Google Fonts ===== -->

<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Source+Sans+Pro:400,700,400italic|Raleway:500,600,700">

<link href='https://fonts.googleapis.com/css?family=Pacifico' rel='stylesheet' type='text/css'>

<!-- ===== Favicon Icon ===== -->
<link rel="icon" href="images/favicon.ico">

<!-- ===== Bootstrap ===== -->
<link rel="stylesheet" href="css/bootstrap.min.css">

<!-- ===== Font Icons ===== -->
<link rel="stylesheet" href="assets/font-awesome/css/font-awesome.min.css">

<!-- ===== Corousel and Lightbox ===== -->
<link rel="stylesheet" href="css/owl.theme.css">
<link rel="stylesheet" href="css/owl.carousel.css">
<link rel="stylesheet" href="css/nivo-lightbox.css">
<link rel="stylesheet" href="css/themes/default/default.css">

<!-- ===== Colors ===== -->
<link rel="stylesheet" href="css/colors/pink.css"> 


<!-- ===== Preloader ===== -->
<link rel="stylesheet" href="css/preloader.css">

<!-- ===== style.css ===== -->
<link rel="stylesheet" href="css/style.css">

<!-- ===== Responsive CSS ===== -->
<link rel="stylesheet" href="css/responsive.css">

<!--[===== if lt IE 9]>
			<script src="js/html5shiv.js"></script>
			<script src="js/respond.min.js"></script>
<![endif]===== -->
     
</head>

<body>
<!-- ===== preloader ===== -->
<div class="preloaders">
  <div class="preloaders-gif">&nbsp;</div>
</div>


<!-- ===== Header ===== -->
<header id="home">

<!-- ===== Over color Image ===== -->
<div class="background-overlay">
	
	<div class="container-header">
		
		<!-- ===== Sticky Navigation ===== -->
		<div class="navbar navbar-inverse bs-docs-nav navbar-fixed-top sticky-navigation bgc-two">
			<div class="container">
				<div class="navbar-header">
					
					<!-- ===== Logo on Sticky Navigation Bar ===== -->
					<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#onepage-navigation">
					<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="#"><i class="fa fa-heart"></i>LOVE</a>
					
				</div>
				
				<!-- ===== Navigation Menu ===== -->
				<div class="navbar-collapse collapse" id="onepage-navigation">
					<ul class="nav navbar-nav navbar-right main-navigation">
						<li><a href="#home">Home</a></li>
						<li><a href="#section-about">John & Jeny</a></li>
						<li><a href="#section-features">Events</a></li>
						<li><a href="#section-pricing">Scedule</a></li>
						<li><a href="#section-portfolio">Galerry</a></li>
						<li><a href="#section-contact">Contact</a></li>
					</ul>
				</div>
				
			</div>
			
		</div>
		
		<!-- ===== End Sticky Navigation ===== -->
		
	</div>
	
	<!-- ===== Welcome ===== -->
	<div class="container">
		
		<div class="row">
			
			<div class="col-md-10 col-md-offset-1 distance-header">
				
				<h1>
                    <strong>LOVE</strong> - Wedding Template
				</h1>

				 <i class="fa fa-heart"></i>
				 <div class="underline"></div>
				<div id="getting-started"></div>
				
				
			</div>

		</div>
		
	</div>
	<!-- ===== End Welcome ===== -->
	
</div>

</header>


<!-- ===== Section About ===== -->
<section class="section-about" id="section-about">
<div class="container">
    
    <h2>John & Jeny</h2>

     <i class="fa fa-heart"></i>
     <div class="underline">
    </div>

    <p>
        Lorem ipsum dolor sit amet, consectetur adipisicing elit. Molestiae, quia. Obcaecati quod ab mollitia maiores ducimus, dolor natus qui quaerat illum praesentium iste quia voluptate delectus distinctio blanditiis sit totam.
    </p>
				
	
	<div class="row">
		<div class="col-md-6">
			<!-- ===== Images ===== -->
			<div class="side-images">
				<img src="images/john.jpg" alt="Feature" class="img-responsive">
			</div>
		</div>
		<div class="col-md-6">
			
			<!-- ===== Images ===== -->
			<div class="side-images">
				<img src="images/jeny.jpg" alt="Feature" class="img-responsive">
			</div>
		</div>
		
	</div>
	
</div> 

</section>

<!-- ===== Section Video ===== -->
<section id="section-video" class="section-video bgc-two">

<div class="container">
	
	<!-- ===== Video ===== -->
	<div class="row">
		<div class="col-md-6">
		    <div class="container-video">
		    	<h3>John</h3>
				<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Incidunt asperiores maiores quos corrupti expedita ducimus quibusdam amet, dolore ipsum cumque ad eum praesentium aut numquam laborum, id voluptatem dolorem doloribus.</p>
				<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sit tempora iste explicabo illo tenetur minima vitae animi optio eveniet temporibus ducimus, sequi molestias rem alias consectetur totam mollitia obcaecati est.</p>
				<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nisi explicabo inventore dicta error officia ratione dolore illo iusto sunt atque. Consectetur alias dolorum perspiciatis mollitia obcaecati, ab distinctio, doloribus asperiores?</p>
			</div>
		</div>
		<div class="col-md-6">
			
			<div class="container-video">
				<h3>Jeny</h3>
				<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Incidunt asperiores maiores quos corrupti expedita ducimus quibusdam amet, dolore ipsum cumque ad eum praesentium aut numquam laborum, id voluptatem dolorem doloribus.</p>
				<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sit tempora iste explicabo illo tenetur minima vitae animi optio eveniet temporibus ducimus, sequi molestias rem alias consectetur totam mollitia obcaecati est.</p>
				<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nisi explicabo inventore dicta error officia ratione dolore illo iusto sunt atque. Consectetur alias dolorum perspiciatis mollitia obcaecati, ab distinctio, doloribus asperiores?</p>
				
			</div>
		</div>
	</div>
	
</div> 

</section>

<!-- ===== Section Features ===== -->
<section id="section-features" class="section-features bgc-one">

<div class="container">
	
	<h2>Events</h2>
	
	 <i class="fa fa-heart"></i>
	 <div class="underline">
	</div>
	
	<div class="sub-sub">
		Lorem ipsum dolor sit amet, consectetur adipisicing elit Reprehenderit.
	</div>
	
	<div class="features">
		
		<div class="row">
			
			<!-- ===== Feature Post===== -->
			<div class="col-md-4">
				<div class="feature">
					<div class="icon">
						<i class="fa fa-laptop"></i>
					</div>
					<h4>Fully Responsive</h4>
					<p>
						Lorem ipsum dolor sit amet, consectetur adipisicing elit. Deserunt sit nostrum eveniet aut et, impedit harum itaque ipsam error dolore ad aspernatur id iusto, cum eos reiciendis fuga vitae quaerat.
					</p>
				</div>
			</div>
			
			<!-- ===== Feature Post===== -->
			<div class="col-md-4">
				<div class="feature">
					<div class="icon">
						<i class="fa fa-cog"></i>
					</div>
					<h4>Easy Edit</h4>
					<p>
						Lorem ipsum dolor sit amet, consectetur adipisicing elit. Expedita nisi temporibus dolorum quis, explicabo distinctio iusto in amet libero perferendis, quae laboriosam aliquid! Repudiandae libero quam deserunt, vel, magnam aliquid.
					</p>
				</div>
			</div>
			
			<!-- ===== Feature Post===== -->
			<div class="col-md-4">
				<div class="feature">
					<div class="icon">
						<i class="fa fa-heart"></i>
					</div>
					<h4>I Love You</h4>
					<p>
						Lorem ipsum dolor sit amet, consectetur adipisicing elit. Voluptates sequi, voluptatum, dolor quidem atque autem recusandae aliquam ex dolorum consectetur ipsum vitae, eos eveniet inventore iste illum architecto laboriosam aut.
					</p>
				</div>
			</div>
		</div>
		
		<div class="row">
			
			<!-- ===== Feature Post===== -->
			<div class="col-md-4">
				<div class="feature">
					<div class="icon">
						<i class="fa fa-thumbs-up"></i>
					</div>
					<h4>9300 Likes</h4>
					<p>
						Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quisquam nam porro, magni, ducimus perferendis sequi dolore quae maiores vel nobis odit facere voluptatem perspiciatis. Ea dicta nobis provident consectetur quidem.
				</div>
			</div>
			
			<!-- ===== Feature Post===== -->
			<div class="col-md-4">
				<div class="feature">
					<div class="icon">
						<i class="fa fa-envelope"></i>
					</div>
					<h4>free Support</h4>
					<p>
						Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nihil, ipsum nisi error aspernatur rem nam, ducimus libero mollitia. Quasi delectus ipsam, laborum repellendus autem quisquam accusamus, assumenda commodi amet eum.
					</p>
				</div>
			</div>
			
			<!-- ===== Feature Post===== -->
			<div class="col-md-4">
				<div class="feature">
					<div class="icon">
						<i class="fa fa-coffee"></i>
					</div>
					<h4>Enjoy</h4>
					<p>
						Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quibusdam quod dicta incidunt quaerat, ut ex, repellendus reiciendis necessitatibus deserunt! Eos, ut laboriosam necessitatibus velit explicabo veritatis tempore mollitia. Voluptatibus, repellat.
					</p>
				</div>
			</div>
		</div> 
	</div>
	
</div> 
</section>

<!-- ===== Section Pricing ===== -->
<section id="section-pricing" class="section-pricing bgc-two">
<div class="container ss">
	
	<h2>Wedding Scedule</h2>
	 <i class="fa fa-heart"></i>
	 <div class="underlines">
	</div>
	
	<div class="sub-sub">
		Lorem ipsum dolor sit amet, consectetur adipisicing elit. Laboriosam.
	</div>
	
	<div class="pricing-table">
		
		<!-- ===== Pricing Table ===== -->
		<div class="row">
			
			<!-- ===== Pricing one ===== -->
			<div class="col-md-4">
				<div class="package background-color-white">
					<div class="header-dark">
						<h3>Friday</h3>
						
					</div>
					
					<!-- ===== Package Details ===== -->
					<div class="package-features">
						<ul>
							<li>
							    10:30 a.m Lorem Ipsum dolor
							</li>
							<li>
							    14:30 a.m Lorem Ipsum dolor
							</li>
							<li>
							    16:00 a.m Dolor Ipsum dolor
							</li>
							<li>
							    19:30 p.m Ipsum Ipsum dolor
							</li>
							<li>
							   20:30 p.m Lorem Ipsum dolor
							</li>
							<li>
							   23:00 p.m Ipsum Ipsum dolor
							</li>
						</ul>
						
					</div>
				</div>
			</div> <!-- ===== End Pricing One ===== -->
			
			<!-- ===== Pricing Two ===== -->
			<div class="col-md-4">
				<div class="package-center background-color-white">
					<div class="header">
						<h3>Saturday</h3>
						
					</div>
					
					<!-- ===== Package Details ===== -->
					<div class="package-features">
						<ul>
							<li>
							    10:30 a.m Lorem Ipsum dolor
							</li>
							<li>
							    14:30 a.m Lorem Ipsum dolor
							</li>
							<li>
							    16:00 a.m Dolor Ipsum dolor
							</li>
							<li>
							    19:30 p.m Ipsum Ipsum dolor
							</li>
							<li>
							   20:30 p.m Lorem Ipsum dolor
							</li>
							<li>
							   23:00 p.m Ipsum Ipsum dolor
							</li>
						</ul>
						
					</div>
				</div>
			</div> <!-- ===== End Pricing Two ===== -->
			
			<!-- ===== Pricing three ===== -->
			<div class="col-md-4">
				<div class="package background-color-white">
					<div class="header-dark">
						<h3>Sunday</h3>
						
					</div>
					
					<!-- ===== Package Details ===== -->
					<div class="package-features">
						<ul>
							<li>
							    10:30 a.m Lorem Ipsum dolor
							</li>
							<li>
							    14:30 a.m Lorem Ipsum dolor
							</li>
							<li>
							    16:00 a.m Dolor Ipsum dolor
							</li>
							<li>
							    19:30 p.m Ipsum Ipsum dolor
							</li>
							<li>
							   20:30 p.m Lorem Ipsum dolor
							</li>
							<li>
							   23:00 p.m Ipsum Ipsum dolor
							</li>
						</ul>
						
					</div>
				</div>
			</div> <!-- ===== End Pricing Three ===== -->
			
			
		</div> 
	</div>
	
</div> 

</section>

<!-- ===== Section Portfolio ===== -->
<section id="section-portfolio" class="section-portfolio bgc-one">
<div class="container">
	
	<h2>Gallery</h2>
	 <i class="fa fa-heart"></i>
	 <div class="underline">
	</div>
	
	<div class="sub-sub">
		Lorem ipsum dolor sit amet, consectetur adipisicing elit. Similique accusantium laborum veniam nisi inventore neque commodi odit repellat dignissimos iste ratione illo sint, magnam sapiente autem. Suscipit nostrum, nesciunt similique.
	</div>
	
	<!-- ===== Portfolio ===== -->
	<div class="row portfolio">
		
		<div id="portfolio" class="owl-carousel owl-theme">
			
			<div class="portfolio-images">
				<a href="images/portfolio/1.jpg" data-lightbox-gallery="portfolio-gallery"><img src="images/portfolio/1.jpg" alt="portfolio"></a>
			</div>
			
			<div class="portfolio-images">
				<a href="images/portfolio/2.png" data-lightbox-gallery="portfolio-gallery"><img src="images/portfolio/2.png" alt="portfolio"></a>
			</div>
			
			<div class="portfolio-images">
				<a href="images/portfolio/3.jpg" data-lightbox-gallery="portfolio-gallery"><img src="images/portfolio/3.jpg" alt="portfolio"></a>
			</div>
			
			<div class="portfolio-images">
				<a href="images/portfolio/4.jpg" data-lightbox-gallery="portfolio-gallery"><img src="images/portfolio/4.jpg" alt="portfolio"></a>
			</div>
		</div>
		
	</div> <!-- ===== End Portfolio ===== -->
	
</div>

</section>


<!-- ===== Testimonial Section ===== -->
<section id="section-testimonial" class="bgc-two">
      
    <div class="bg-color bg-testimonial">
        <div class="section-testimonial section-padding">
            <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/testimonials/doe1.jpg" alt="">
                        </div>                  
                        <div class="content">
                            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Praesentium minus, earum optio amet consequatur vero ipsum saepe quis accusantium! Illum soluta impedit odio fugiat maiores fuga nostrum, molestiae vero sit.</p>
                           <h4>Joni Doe</h4>
                           <h5>Friend</h5>
                        </div>                   
                    </div> 

                    <div class="item active left">
                        <div class="image">
                          <img src="images/testimonials/doe2.jpg" alt="">
                        </div>                  
                        <div class="content">
                          <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolorum delectus sed distinctio provident laboriosam culpa, cumque quasi omnis sit illum velit doloribus voluptate quibusdam laudantium in. Rerum autem, ipsum fugit.</p>
                          <h4>Jonathan Doe</h4>
                          <h5>Friends</h5>
                        </div>                  
                    </div> 

                    <div class="item next left">
                        <div class="image">
                          <img src="images/testimonials/doe3.jpg" alt="">
                        </div>                  
                        <div class="content">
                          <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Earum quis quod eos placeat iusto, aliquid, dicta odit ipsum facere tenetur aperiam commodi sit nostrum libero reiciendis accusantium, cumque tempora deleniti.</p>
                          <h4>William Doe</h4>
                          <h5>Friend</h5>
                        </div>                  
                    </div> 

                    </div> 
                </div>
            </div> 
        </div> 
    </div>

</section>
<!-- ===== End Testimonial Section ===== -->

<!-- ===== Contact Us ===== -->
<section id="section-contact" class="section-contact bgc-one">
<div class="container">
	
	<div class="row">
		<div class="col-md-8 col-md-offset-2">
			
			<h2>Contact</h2>
			 <i class="fa fa-heart"></i>
			 <div class="underline"></div>
			<div class="sub-sub">
			    Lorem ipsum dolor sit amet, consectetur adipisicing elitRepellat, ea laudantium.
			</div>
			
            <!-- ===== Form ===== -->
            <form class="contact-form" id="contact" role="form">

                <!-- ===== Succes Send Email ===== -->
                <h6 class="success">
                <span class="olored-text icon_check"></span> Your message successfully. </h6>

                <!-- ===== Error Send Email ===== -->
                <h6 class="error">
                <span class="colored-text icon_error-circle_alt"></span> your message sent pending. </h6>

                <div class="field-wrapper col-md-6">
                    <input class="form-control input-box" id="contact-form-name" type="text" name="contact-form-name" placeholder="Your Name">
                </div>

                <div class="field-wrapper col-md-6">
                    <input class="form-control input-box" id="contact-form-email" type="email" name="contact-form-email" placeholder="Email">
                </div>

                <div class="field-wrapper col-md-12">
                    <input class="form-control input-box" id="contact-form-subject" type="text" name="contact-form-subject" placeholder="Subject">
                </div>

                <div class="field-wrapper col-md-12">
                    <textarea class="form-control textarea-box" id="contact-form-message" rows="7" name="contact-form-message" placeholder="Your Message"></textarea>
                </div>

                <button class="btn standard-button" type="submit" id="contact-form-submit" name="submit" data-style="expand-left">Send Message</button>
            </form>
            <!-- ===== End Form ===== -->
			
		</div>
	</div>
	
</div>

</section>


<!-- ===== Footer ===== -->
<footer class="bgc-two">
<div class="container">
	
	<div class="copyright">
		 ©2015
	</div>
</div>
</footer>


<!-- ===== Script Javascript ===== -->
<script src="js/jquery.min.js"></script>
<script src="js/preloader.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/retina.js"></script>
<script src="js/SmoothScroll.js"></script>
<script src="js/jquery.scrollTo.min.js"></script>
<script src="js/jquery.localScroll.min.js"></script>
<script src="js/owl.carousel.min.js"></script>
<script src="js/nivo-lightbox.min.js"></script>
<script src="js/simple-expand.min.js"></script>
<script src="js/jquery.nav.js"></script>
<script src="js/jquery.fitvids.js"></script>
<script src="js/jquery.ajaxchimp.min.js"></script>
<script src="js/jquery.countdown.min.js"></script>
<script src="js/custom.js"></script>

 <script type="text/javascript">
   $("#getting-started")
   .countdown("2016/01/01", function(event) {
     $(this).text(
       event.strftime('%D Days %H Hours %M Min %S Sec')
     );
   });
 </script>

</body>
</html>