View file mairala-pack/smartphone/index.html

File size: 16.2Kb
<!DOCTYPE HTML>
<html>
  <head>
  	<title>Mairala website for Iphone, Android &nbsp; Smartphone Mobile Website Template | Home :: w3layouts</title>
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
		<script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false); function hideURLbar(){ window.scrollTo(0,1); } </script>
    	<link href='http://fonts.googleapis.com/css?family=Raleway:400,100,200,300,500,600,700,800,900' rel='stylesheet' type='text/css'>
    	<link href="smartphone/css/style.css" rel="stylesheet" type="text/css" media="all" />
		<!--  jquery plguin -->
	    <script type="text/javascript" src="smartphone/js/jquery.min.js"></script>
		<!--start slider -->
	    <link rel="stylesheet" href="smartphone/css/fwslider.css" media="all">
		<script src="smartphone/js/jquery-ui.min.js"></script>
		<script src="smartphone/js/css3-mediaqueries.js"></script>
		<script src="smartphone/js/fwslider.js"></script>
	<!--end slider -->
	 <script type="text/javascript">
			$(document).ready(function() {
			
				var defaults = {
		  			containerID: 'toTop', // fading element id
					containerHoverID: 'toTopHover', // fading element hover id
					scrollSpeed: 1200,
					easingType: 'linear' 
		 		};
				
				
				$().UItoTop({ easingType: 'easeOutQuart' });
				
			});
		</script>
		<!-- start testimonials -->
		<!-- da-slider -->
		<link rel="stylesheet" type="text/css" href="smartphone/css/slider.css" />
		<script type="text/javascript" src="smartphone/js/modernizr.custom.28468.js"></script>
<script type="text/javascript" src="smartphone/js/jquery.cslider.js"></script>
	<script type="text/javascript">
			$(function() {

				$('#da-slider').cslider({
					autoplay : true,
					bgincrement : 450
				});

			});
		</script>
		<script type="text/javascript">
			$(function() {

				$('#da-slider1').cslider({
					autoplay : true,
					bgincrement : 450
				});

			});
		</script>


</head>
<body>
<!-- start header -->
<div class="header_bg">
<div class="header">
		<div class="container">
		      <header id="topnav">
			        <nav>
			        		 <ul>
			        		 	<li class="active"><a href="#home" class="scroll">Home</a></li>
								<li><a href="#team" class="scroll">Team</a></li>
								<li><a href="#ourstory" class="scroll">Our story</a></li>
								<li><a href="#blog" class="scroll">Blog</a></li>
								<li><a href="#contact" class="scroll">Contact</a></li>								
								<div class="clear"> </div>
							</ul>
		        	</nav>
		        	<h1><a href="index.html"><img src="smartphone/images/logo.png" alt=""/></a></h1> 
			        	<a href="#" id="navbtn">Nav Menu</a>
			        <div class="clear"> </div>
		        </header>
		    </div>
		</div>
		<!-----script------------->
		<script type="text/javascript"  src="smartphone/js/menu.js"></script>

</div>
<!----start-images-slider---->
		<div class="images-slider">
			<!-- start slider -->
		    <div id="fwslider">
		        <div class="slider_container">
		            <div class="slide"> 
		                <!-- Slide image -->
		                    <img src="smartphone/images/background.jpg" alt=""/>
		                <!-- /Slide image -->
		                <!-- Texts container -->
		                <div class="slide_content">
		                    <div class="slide_content_wrap">
		                    	 <!-- Text description -->
		                        <p class="description">GRAB YOUR COPY OF</p>
		                        <!-- /Text description -->
		                        <!-- Text title -->
		                        <h4 class="title">THE <span>PREMIUM</span> QUALITY<br>
		                         PSD TEMPLATE FOR <span>FREE</span></h4>
		                        <!-- /Text title -->		                      
		                        <div class="slide-btns description">	                      
		                        </div>
		                    </div>
		                </div>
		                 <!-- /Texts container -->
		            </div>
		            <!-- /Duplicate to create more slides -->
		            <div class="slide">
		                <img src="smartphone/images/background1.jpg" alt=""/>
		                 <div class="slide_content">
		                    <div class="slide_content_wrap">
		                    	 <!-- Text description -->
		                        <p class="description">GRAB YOUR COPY OF</p>
		                        <!-- /Text description -->
		                        <!-- Text title -->
		                        <h4 class="title">THE <span>PREMIUM</span> QUALITY<br>
		                         PSD TEMPLATE FOR <span>FREE</span></h4>
		                        <!-- /Text title -->
		                        <div class="slide-btns description">	                      
		                        </div>
		                    </div>
		                </div>
		            </div>
		            <!--/slide -->
		        </div>
		        <div class="timers"> </div>
		        <div class="slidePrev"><span> </span></div>
		        <div class="slideNext"><span> </span></div>
		    </div>
		    <!--/slider -->
		</div>
<!-- about -->
<div class="about" id="about">
    <div class="container">
		<div class="row">
		    <div class="col-md-12">			
		        <h3>KNOW ABOUT US</h3>
		        <span></span>
		        <p>Lorem Ipsum is simply dummy text of the printing and typesetting.</p>
			</div>
		</div>		
	</div>
</div>	
<div class="about-bottom">
	 <div class="container">
		<div class="about-left pull-left">
			<h4>WE ARE THE BEST</h4>
			<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry Lorem Ipsum </p>
			<p><a href="index.html">READ MORE</a></p>
		</div>	
	</div>	
</div>
<!-- service -->
<div class="service text-center">
	<div class="container">
        <h3>SERVICES WE PROVIDE</h3>
        <p>There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration.</p>
       <div class="service-bottom">
	        <div class="row">
			    <div class="col-md-41">	
			    	<img src="smartphone/images/contact.png" alt=""/>		
			        <h4><a href="index.html">CONSULTANCY</a></h4>
			        <p>Lorem Ipsum is simply dummy text of the printing and typesetting.</p>
				</div>
				<div class="col-md-41">	
					<img src="smartphone/images/flag.png" alt=""/>		
			        <h4><a href="index.html">MARKETING</a></h4>
			        <p>Lorem Ipsum is simply dummy text of the printing and typesetting.</p>
				</div>
				<div class="col-md-41">	
					<img src="smartphone/images/fl.png" alt=""/>		
			        <h4><a href="index.html">RESEARCH</a></h4>
			        <p>Lorem Ipsum is simply dummy text of the printing and typesetting.</p>
				</div>
			</div>	
		</div>	
   </div>
</div>
<!-- portfolio -->
<div class="portfilio" id="portfolio">
	<div class="container">
		<div class="about">	   
				<div class="row">
				    <div class="col-md-12">			
				        <h3>SOME RECENT PROJECTS</h3>
				        <span></span>
				        <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry.</p>
					</div>
				</div>		
		</div>	
	</div>	
	 <div class="port">
       		<ul>
					<li><div class="view view-fourth">
						     <img src="smartphone/images/port1.jpg" alt=""/>
							 <div class="mask">	
							      <div class="border">                   
									   <h2>PAPERCLIPS</h2>
									   <span></span>
									   <p class="a">BRANDING</p>		                       
								  </div>                                                 
							 </div>		
						</div>	
					</li>
					<li><div class="view view-fourth">
						     <img src="smartphone/images/port2.jpg" alt=""/>
							 <div class="mask">	
							      <div class="border">                   
									   <h2>PAPERCLIPS</h2>
									   <span></span>
									   <p class="a">BRANDING</p>		                       
								  </div>                                                 
							 </div>		
						</div>	
					</li>									
			</ul>	
     </div>
     <div class="port-text">
       		<h4>LATEST FROM TWITTER</h4>
       		<p>Lorem Ipsum is simply dummy text of the printing and typesetting.</p>
     </div>
     <div class="port">
       		<ul>
					<li><div class="view view-fourth">
						     <img src="smartphone/images/port1.jpg" alt=""/>
							 <div class="mask">	
							      <div class="border">                   
									   <h2>PAPERCLIPS</h2>
									   <span></span>
									   <p class="a">BRANDING</p>		                       
								  </div>                                                 
							 </div>		
						</div>	
					</li>
					<li><div class="view view-fourth">
						     <img src="smartphone/images/port2.jpg" alt=""/>
							 <div class="mask">	
							      <div class="border">                   
									   <h2>PAPERCLIPS</h2>
									   <span></span>
									   <p class="a">BRANDING</p>		                       
								  </div>                                                 
							 </div>		
						</div>	
					</li>										
			</ul>	
			<p><a href="index.html">SEE ALL<span> </span></a></p>
     </div>
</div>
<div class="team" id="team">
	<div class="container">
		<div class="about">	   
				<div class="row">
				    <div class="col-md-12">			
				        <h3>OUR TEAM MEMBERS</h3>
				        <span> </span>
				        <p>Lorem Ipsum is simply dummy text of the printing and typesetting.</p>
					</div>
				</div>		
		</div>	
		<div class="team-member">
			<ul>
				<li><div class="view1 view-fourth1">
						     <img src="smartphone/images/team.jpg" alt=""/>
							 <div class="mask1">	
							      <div class="border1">                   
									   <div class="social-icons-set">
											<ul>
												<li><a class="facebook" href="#"> </a></li>
												<li><a class="twitter" href="#"> </a></li>
												<li><a class="vimeo" href="#"> </a></li>								
												<div class="clear"> </div>
											</ul>
										</div>		                       
								  </div>                                                 
							 </div>	
					</div>	
					<div class="clear"></div>
					 <P><a href="#">Lorem Ipsum<br><label>Typesetting industry</label></a></P>
				</li>
				<li><div class="view1 view-fourth1">
						     <img src="smartphone/images/team1.jpg" alt=""/>
							 <div class="mask1">	
							      <div class="border1">                   
									   <div class="social-icons-set">
											<ul>
												<li><a class="facebook" href="#"> </a></li>
												<li><a class="twitter" href="#"> </a></li>
												<li><a class="vimeo" href="#"> </a></li>								
												<div class="clear"> </div>
											</ul>
										</div>			                       
								  </div>                                                 
							 </div>		
					</div>	
					<div class="clear"></div>
					<P><a href="#">Lorem Ipsum<br><label>Typesetting industry</label></a></P>
				</li>												
			</ul>		
		</div>		
	</div>									
</div>
<div class="slider">
	<div id="da-slider1" class="da-slider">
							<!-- da-slider -->
							<div class="da-slide">
								<h2>What our Clients</h2>
								<p>Lorem Ipsum is simply dummy text of the printing.</p>							    
							</div>
							<div class="da-slide">
								<h2>Clean & Flat Design</h2>
								<p>Lorem Ipsum is simply dummy text of the printing.</p>							    
							</div>
							<div class="da-slide">
								<h2>Clean & Flat Design</h2>
								<p>Lorem Ipsum is simply dummy text of the printing.</p>						    
							</div>
							<div class="da-slide">
								<h2>Flat Design websites</h2>
								<p>Lorem Ipsum is simply dummy text of the printing.</p>							    
							</div>
	</div><!-- da-slider -->			
</div>
<div class="blog" id="blog">
	<div class="container">
		<div class="about">	   
				<div class="row">
				    <div class="col-md-12">			
				        <h3>OUR BLOG</h3>
				        <span></span>
				        <p>Lorem Ipsum is simply dummy text of the printing and typesetting.</p>
					</div>
				</div>		
		</div>	
		 <div class="blog-bottom">
	        <div class="blog-left">
	        	<img src="smartphone/images/camera.jpg" alt=""/>
	        </div>	       
	         <div class="blog-right">       	
	        	<h6>10 April 2014</h6>
	        	<h4>Printing and typesetting</h4>
	        	<p>Lorem Ipsum is simply dummy text of the printing.</p>
	        </div>
	        <div class="clear"></div>
         </div>
          <div class="blog-bottom">
	        <div class="blog-left">
	        	<img src="smartphone/images/camera.jpg" alt=""/>
	        </div>	     
	         <div class="blog-right">       	
	        	<h6>10 April 2014</h6>
	        	<h4>Printing and typesetting</h4>
	        	<p>Lorem Ipsum is simply dummy text of the printing.</p>
	        </div>
	        <div class="clear"> </div>
         </div>        
	</div>
</div>
<!---start-contact---->
<div class="contact s4" id="contact">
	<div class="container">
		<h3>CONTACT</h3>
		<div class="row">
			<div class="col-md-12">
				<form>
					<input type="text" class="textbox" value="Name" onfocus="this.value = '';" onblur="if (this.value == '') {this.value = 'Name';}">
					<input type="text" class="textbox" value="Email" onfocus="this.value = '';" onblur="if (this.value == '') {this.value = 'Email';}">
					<textarea value="Message" onfocus="this.value = '';" onblur="if (this.value == '') {this.value = 'Message';}">Message</textarea>
					<input type="submit" value="Submit">
				</form>
			</div>
		</div>
	</div>
</div>
<!---End-contact---->
<div class="footer-top">
	<div class="container">
		<div class="row">
			<div class="col-md-3">
				<a href="index.html"><img src="smartphone/images/logo1.png" alt=""/></a>
			    <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry</p>
			</div>	
			<div class="col-md-3">
				<h4>RECENT POSTS</h4>
				<div class="foot">
					<span>24 march 2014</span>
					<p><a href="#">Printing and typesetting</a></p>
				</div>
				<div class="foot">
					<span>24 march 2014</span>
					<p>Printing and typesetting</p><p><a href="#">Printing and typesetting</a></p>
				</div>
				<div class="foot">
					<span>24 march 2014</span>
					<p><a href="#">Printing and typesetting</a></p>
				</div>
			</div>	
			<div class="col-md-3">
				<h4>TWITTER FEEDS</h4>
				<div class="foot">
					<span>industry@info.com</span>
					<p><a href="#">Printing and typesetting</a></p>
				</div>
				<div class="foot">
					<span>industry@info.com</span>
					<p><a href="#">Printing and typesetting</a></p>
				</div>
				<div class="foot">
					<span>industry@info.com</span>
					<p><a href="#">Printing and typesetting</a></p>
				</div>
			</div>	
			<div class="col-md-3">
				<h4 class="a">RECENT POSTS</h4>
	        	<p class="a">Lorem Ipsum is simply dummy text of the printing and typesetting industry.</p>
			    <address>
			    	<p class="b">Typesetting industry</p>
			    	<p class="b">Lorem Ipsum has</p>
			    	<p class="b">Phone : 466,348457,7459</p>
			    </address>
			</div>	
		</div>
	</div>
</div>
<div class="footer">
	<div class="container">
		<div class="row">
 			<div class="col-md-12">	
				<div class="copy-right">
					<p>&#169 Copyright 2014 All Rights Reserved  Template <a href="http://w3layouts.com/">  w3layouts.com</a></p>	
				</div>	
			</div>
		</div>
    </div>
</div>
 <!-- scroll_top_btn -->
		<script type="text/javascript" src="smartphone/js/move-top.js"></script>
		<script type="text/javascript" src="smartphone/js/easing.js"></script>
		<script type="text/javascript">
		jQuery(document).ready(function($) {
			$(".scroll").click(function(event){		
				event.preventDefault();
				$('html,body').animate({scrollTop:$(this.hash).offset().top},1200);
			});
		});
	</script>

		 <a href="#" id="toTop" style="display: block;"><span id="toTopHover" style="opacity: 1;"></span></a>
</body>
</html>