<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta name="description" content="">
	<meta name="keywords" content=""> 
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<title>LUMI</title>
	<link href='http://fonts.googleapis.com/css?family=Roboto:400,300,100,700,300italic' rel='stylesheet' type='text/css'>
	<link href="./public/css/flexslider.css" rel="stylesheet" media="screen">
	<link href="./public/css/jquery.simplyscroll.css" rel="stylesheet" media="screen">
	<link rel="stylesheet" href="./public/css/main.css">
</head>
<body>
	<div class="wrapper">
		<header>
			<div class="cell">
				<div class="container clearfix">
					<h1 class="logo"><a href="index.html"><img src="./public/images/logotype.png" alt="LUMI"></a></h1>
					<nav>
						<ul class="clearfix">
							<li><a href="#">Home</a></li>
							<li><a href="#">What We Do</a></li>
							<li><a href="#">How It Works</a></li>
							<li><a href="#">Services</a></li>
							<li><a href="#">Contact Us</a></li>
						</ul>
					</nav>
					<div class="search-box">
						<form action="#">
							<div class="wrap-search">
								<input type="text" name="search" id="search" placeholder="Search">
								<button type="submit" class="search">&nbsp;</button>
							</div>
						</form>
					</div>
				</div>
			</div>
		</header>
		
		<!-- Content -->
		<div id="content">
			<div class="cell">
				<div class="wrap-slider-area">
					<div class="slider-area">
						<div class="container">
							<div class="flexslider">
								<ul class="slides">
									<li class="clearfix">
										<div class="wrap">
											<div class="text-box">
												<h3>Suspendisse</h3>
												<p>Suspendisse tempus tincidunt pretium. Vivamus pretium metus eget tincidunt congue. Cras porttitor id sem ut vulputate.</p>
											</div>
											<div class="wrap-img">
												<div class="img-box">
													<img src="./public/images/pictures/slide-1.png" alt="Picture">
												</div>
											</div>
										</div>
									</li>	
									<li class="clearfix">
										<div class="wrap">
											<div class="text-box">
												<h3>Suspendisse</h3>
												<p>Suspendisse tempus tincidunt pretium. Vivamus pretium metus eget tincidunt congue. Cras porttitor id sem ut vulputate.</p>
											</div>
											<div class="wrap-img">
												<div class="img-box">
													<img src="./public/images/pictures/slide-1.png" alt="Picture">
												</div>
											</div>
										</div>
									</li>	
									<li class="clearfix">
										<div class="wrap">
											<div class="text-box">
												<h3>Suspendisse</h3>
												<p>Suspendisse tempus tincidunt pretium. Vivamus pretium metus eget tincidunt congue. Cras porttitor id sem ut vulputate.</p>
											</div>
											<div class="wrap-img">
												<div class="img-box">
													<img src="./public/images/pictures/slide-1.png" alt="Picture">
												</div>
											</div>
										</div>
									</li>		
								</ul>
							</div>
						</div>
					</div>
				</div>
				<div class="row-box position-left">
					<div class="container clearfix">
						<div class="wrap-img">
							<img src="./public/images/pictures/pic-1.jpg" alt="Picture">
						</div>
						<div class="text-box">
							<h3>Aliquam Semper</h3>
							<h4>Praesent Pulvinar Necue</h4>
							<p>Vivamus pretium metus eget tincidunt congue. Cras porttitor id sem ut vulputate. Integer vel hendrerit risus, eget accumsan lorem. Donec malesuada augue sit amet pulvinar malesuada. Sed et sem laoreet mauris imperdiet sollicitudin. Duis cursus, enim non mattis fermentum, diam leo ultrices nisi, at rhoncus turpis felis eget sapien. Curabitur non ornare lacus. Ut at dolor nunc. In at tortor et est facilisis auctor eget non sem. Aliquam at aliquam tortor, in viverra sapien.</p>
							<div class="wrap-link"><a href="#"><span>More Info</span></a></div>
						</div>
					</div>
				</div>		
				<div class="row-box position-right bg-box">
					<div class="container clearfix">
						<div class="text-box">
							<h3>Pellentesque Habitant</h3>
							<h4>Vestibulum Ante Ipsum</h4>
							<p>Sed molestie facilisis tristique. Ut urna turpis, ultricies in fringilla ut, blandit et erat. Maecenas vel magna lobortis, cursus nisl et, varius nibh. Sed consequat, velit vel dignissim porta, lorem nibh eleifend est, ac rhoncus magna massa nec lectus. Donec ultrices lectus fermentum tristique mollis. Nunc tortor non augue, sagittis et felis at, ultrices laoreet nibh.</p>
							<div class="wrap-link"><a href="#"><span>More Info</span></a></div>
						</div>
						<div class="wrap-img">
							<img src="./public/images/pictures/pic-2.jpg" alt="Picture">
						</div>
					</div>
				</div>
				<div class="carousel-area">
					<div id="scroller">
						<div>
							<div class="cell-box">
								<a href="#" class="bg-1">
									<blockquote>“Maecenas vel magna lobortis, cursus nisl et, varius nibh.  Donec ultrices lectus fermentum tristique mollis. Nunc tortor non augue, sagittis et felis at, ultrices laoreet nibh.”</blockquote>
									<h6>Charles Ross</h6>
								</a>
								<a href="#"><img src="./public/images/pictures/img-1.jpg" alt="Picture"></a>
							</div>		
							<div class="cell-box">
								<a href="#"><img src="./public/images/pictures/img-4.jpg" alt="Picture"></a>
								<a href="#" class="bg-2">
									<blockquote>“Sed sed ante in ligula scelerisque congue vitae vel neque. Sed magna erat, rhoncus interdum adipiscing a, pellentesque nec turpis. Donec nec facilisis elit.”</blockquote>
									<h6>Ruth C. Stark</h6>
								</a>
							</div>		
							<div class="cell-box">
								<a href="#" class="bg-3">
									<blockquote>“Maecenas vel magna lobortis, cursus nisl et, varius nibh.  Donec ultrices lectus fermentum tristique mollis. Nunc tortor non augue, sagittis et felis at, ultrices laoreet nibh.”</blockquote>
									<h6>Charles Ross</h6>
								</a>
								<a href="#"><img src="./public/images/pictures/img-7.jpg" alt="Picture"></a>
							</div>
						</div>				
						<div>
							<div class="cell-box">
								<a href="#" class="bg-4">
									<blockquote>“Fusce sollicitudin malesuada aliquet. Sed vel feugiat dolor, in convallis mauris. Aliquam erat volutpat. Nam consequat ante et rhoncus faucibus. ”</blockquote>
									<h6>Ruth C. Stark</h6>
								</a>
								<a href="#"><img src="./public/images/pictures/img-2.jpg" alt="Picture"></a>
							</div>		
							<div class="cell-box">
								<a href="#"><img src="./public/images/pictures/img-5.jpg" alt="Picture"></a>
								<a href="#" class="bg-5">
									<blockquote>“Maecenas vel magna lobortis, cursus nisl et, varius nibh.  Donec ultrices lectus fermentum tristique mollis. Nunc tortor non augue, sagittis et felis at, ultrices laoreet nibh.”</blockquote>
									<h6>Ruth C. Stark</h6>
								</a>
							</div>		
							<div class="cell-box">
								<a href="#" class="bg-6">
									<blockquote>“Vivamus ullamcorper augue orci, vel venenatis diam bibendum ac. In hac habitasse platea dictumst. In placerat nisi enim, in iaculis libero pellentesque sit amet. Praesent gravida sem eget iaculis tincidunt.”</blockquote>
									<h6>Ruth C. Stark</h6>
								</a>
								<a href="#"><img src="./public/images/pictures/img-8.jpg" alt="Picture"></a>
							</div>		
						</div>			
						<div>
							<div class="cell-box">
								<a href="#" class="bg-7">
									<blockquote>“Vestibulum non elit id ligula venenatis hendrerit. Nam at nibh nec nisl euismod pharetra ac at felis. Cras pharetra lectus ac dictum tincidunt.”</blockquote>
									<h6>Irwin M. Garcia</h6>
								</a>
								<a href="#"><img src="./public/images/pictures/img-3.jpg" alt="Picture"></a>
							</div>		
							<div class="cell-box">
								<a href="#"><img src="./public/images/pictures/img-6.jpg" alt="Picture"></a>
								<a href="#" class="bg-8">
									<blockquote>“Maecenas vel magna lobortis, cursus nisl et, varius nibh.  Donec ultrices lectus fermentum tristique mollis. Nunc tortor non augue, sagittis et felis at, ultrices laoreet nibh.”</blockquote>
									<h6>Ruth C. Stark</h6>
								</a>
							</div>		
							<div class="cell-box">
								<a href="#" class="bg-9">
									<blockquote>“Donec ultrices lectus fermentum tristique mollis. Nunc tortor non augue, sagittis et felis at, ultrices laoreet nibh.”</blockquote>
									<h6>Irwin M. Garcia</h6>
								</a>
								<a href="#"><img src="./public/images/pictures/img-9.jpg" alt="Picture"></a>
							</div>		
						</div>
					</div>
				</div>
				<div class="row-box position-left bg-box">
					<div class="container clearfix">
						<div class="wrap-img">
							<img src="./public/images/pictures/pic-3.png" alt="Picture">
						</div>
						<div class="text-box">
							<h3>Nunc Accumsan</h3>
							<h4>Cras Pharetra Lectus</h4>
							<p>Vivamus pretium metus eget tincidunt congue. Cras porttitor id sem ut vulputate. Integer vel hendrerit risus, eget accumsan lorem. Donec malesuada augue sit amet pulvinar malesuada. Sed et sem laoreet mauris imperdiet sollicitudin. Duis cursus, enim non mattis fermentum, diam leo ultrices nisi, at rhoncus turpis felis eget sapien. Curabitur non ornare lacus. Ut at dolor nunc. In at tortor et est facilisis auctor eget non sem. Aliquam at aliquam tortor, in viverra sapien.</p>
							<div class="wrap-link"><a href="#"><span>More Info</span></a></div>
						</div>
					</div>
				</div>
				<div class="large-box">
					<div class="container clearfix">
						<h2>Choose Yours</h2>
						<p>Vivamus pretium metus eget tincidunt congue. Cras porttitor id sem ut vulputate. Integer vel hendrerit risus, eget accumsan lorem. Donec malesuada augue sit amet pulvinar malesuada. Sed et sem laoreet mauris imperdiet sollicitudin. Duis cursus, enim non mattis fermentum, diam leo ultrices nisi, at rhoncus turpis felis eget sapien. Curabitur non ornare lacus. Ut at dolor nunc. In at tortor et est facilisis auctor eget non sem. Aliquam at aliquam tortor, in viverra sapien.</p>
						<div class="wrap-img">
							<img src="./public/images/pictures/pic-4.jpg" alt="Picture">
						</div>
						<ul class="steps-box">
							<li>
								<div class="wrap">
									<div class="cell-box step">
										<span>1</span>
									</div>	
									<div class="cell-box">
										<h5>Cras porttitor id sem</h5>
										<p>Integer vel hendrerit risus, eget dolor accumsan loremmalesuada augue sit.</p>
									</div>
								</div>
							</li>			
							<li>
								<div class="wrap">
									<div class="cell-box step">
										<span>2</span>
									</div>	
									<div class="cell-box">
										<h5>Nulla tempus</h5>
										<p>Integer vel hendrerit risus, eget dolor accumsan loremmalesuada augue sit.</p>
									</div>
								</div>
							</li>		
							<li>
								<div class="wrap">
									<div class="cell-box step">
										<span>3</span>
									</div>	
									<div class="cell-box">
										<h5>Vestibulum non elit id ligula</h5>
										<p>Integer vel hendrerit risus, eget dolor accumsan loremmalesuada augue sit.</p>
									</div>
								</div>
							</li>
						</ul>
					</div>
				</div>
			</div>
		</div>
		<!-- Footer -->
		<footer>
			<div class="cell">
				<div class="top-footer">
					<div class="container">
						<ul class="menu">
							<li>
								<h3>Quisque Auctor</h3>
								<ul>
									<li><a href="#">Vivamus pretium metus</a></li>
									<li><a href="#">Cras porttitor id sem ut vulputate</a></li>
									<li><a href="#">Integer vel hendrerit risus</a></li>
									<li><a href="#">Donec malesuada</a></li>
									<li><a href="#">Sed et sem laoreet mauris</a></li>
									<li><a href="#">Duis cursus enim</a></li>
									<li><a href="#">Curabitur non ornare lacus</a></li>
									<li><a href="#">Ut at dolor nunc</a></li>
								</ul>
							</li>	
							<li>
								<h3>Pellentesque Habitant</h3>
								<ul>
									<li><a href="#">Aenean volutpat placerat dui</a></li>
									<li><a href="#">Quisque hendrerit at purus a tristique</a></li>
									<li><a href="#">Sed molestie tellus id aliquam porta </a></li>
									<li><a href="#">Sed vel diam odio</a></li>
									<li><a href="#">Sed vulputate odio velit</a></li>
									<li><a href="#">Quisque eleifend laoreet sem</a></li>
									<li><a href="#">Duis at mauris lorem</a></li>
									<li><a href="#">Nunc accumsan odio ante</a></li>
								</ul>
							</li>		
							<li>
								<h3>Vivamus Nunc Orci</h3>
								<ul>
									<li><a href="#">Vivamus pretium metus</a></li>
									<li><a href="#">Cras porttitor id sem ut vulputate</a></li>
									<li><a href="#">Integer vel hendrerit risus</a></li>
									<li><a href="#">Donec malesuada</a></li>
									<li><a href="#">Sed et sem laoreet mauris</a></li>
									<li><a href="#">Duis cursus enim</a></li>
									<li><a href="#">Curabitur non ornare lacus</a></li>
									<li><a href="#">Ut at dolor nunc</a></li>
								</ul>
							</li>			
							<li>
								<h3>Pellentesque Habitant</h3>
								<ul>
									<li><a href="#">Aenean volutpat placerat dui</a></li>
									<li><a href="#">Quisque hendrerit at purus a tristique</a></li>
									<li><a href="#">Sed molestie tellus id aliquam porta </a></li>
									<li><a href="#">Sed vel diam odio</a></li>
									<li><a href="#">Sed vulputate odio velit</a></li>
									<li><a href="#">Quisque eleifend laoreet sem</a></li>
									<li><a href="#">Duis at mauris lorem</a></li>
									<li><a href="#">Nunc accumsan odio ante  </a></li>
								</ul>
							</li>
						</ul>
					</div>
				</div>
				<div class="bottom-footer">
					<div class="container clearfix">
						<p class="copyright">&copy; 2014 Lumi. All rights reserved.</p>
						<ul class="social">
							<li class="fb"><a href="https://www.facebook.com/">&nbsp;</a></li>
							<li class="tw"><a href="https://twitter.com/">&nbsp;</a></li>
							<li class="in"><a href="https://www.linkedin.com/">&nbsp;</a></li>
							<li class="sk"><a href="http://www.skype.com/">&nbsp;</a></li>
							<li class="be"><a href="#">&nbsp;</a></li>
							<li class="vm"><a href="https://vimeo.com/">&nbsp;</a></li>
							<li class="b"><a href="#">&nbsp;</a></li>
						</ul>
					</div>
				</div>
			</div>
		</footer>
	</div>
	<!--End Footer -->
 	<script type="text/javascript" src="./public/js/jquery.js"></script>
	<script type="text/javascript" src="./public/js/jquery.flexslider-min.js"></script>
	<script type="text/javascript" src="./public/js/jquery.simplyscroll.min.js"></script>
	<script type="text/javascript" src="./public/js/owl.carousel.min.js"></script>
  	<script type="text/javascript" src="./public/js/main.js"></script>
	<!--[if lt IE 10]>
		<script type="text/javascript" src="./public/js/jquery.placeholder.min.js"></script>
		<script>$('input, textarea').placeholder();</script>
	<![endif]-->
</body>
</html>