View file aluspisan-pack/smartphone/about.html

File size: 12.82Kb
<!--
Author: W3layouts
Author URL: http://w3layouts.com
License: Creative Commons Attribution 3.0 Unported
License URL: http://creativecommons.org/licenses/by/3.0/
-->
<!DOCTYPE HTML>
<html>
<head>
<title>Aluspisan for Iphone, Android & Smartphone Mobile Website Template | Home :: w3layouts</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="keywords" content="Aluspisan Iphone web template, Andriod web template, Smartphone web template, free webdesigns for Nokia, Samsung, LG, SonyErricsson, Motorola web design" />
<script type="application/x-javascript"> addEventListener("load", function() { setTimeout(
hideURLbar, 0); }, false); function hideURLbar(){ window.scrollTo(0,1); } </script>
<link href="smartphone/css/style.css" rel="stylesheet" type="text/css" media="all" />
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href='http://fonts.googleapis.com/css?family=Roboto:400,300,500,700,900' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Open+Sans:600italic,400,700,300' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="smartphone/css/flexslider.css" type="text/css" media="screen" />
<script src="smartphone/js/jquery.min.js"></script>	
</head>
<body>
<!-- header -->
<div class="banner1">
	<div class="container">
		<div class="logo">
			<a href="index.html"><img src="smartphone/images/logo.png" alt="" /></a>
		</div>
		<div class="head-nav">
			<span class="menu"> </span>
				<ul>
					<li><a href="index.html">home</a></li>
					<li class="active"><a href="about.html">About</a></li>
					<li><a href="services.html">Services</a></li>
					<li><a href="portfolio.html">portfolio</a></li>
					<li><a href="blog.html">blog</a></li>
					<li><a href="contact.html">contact</a></li>
						<div class="clear"> </div>
				</ul>
		</div>
		<!-- script-for-nav -->
					<script>
						$( "span.menu" ).click(function() {
						  $( ".head-nav ul" ).slideToggle(300, function() {
							// Animation complete.
						  });
						});
					</script>
				<!-- script-for-nav -->		
				<div class="clear"> </div>	
			<h1>about</h1>	
	</div>
</div>
<!-- header -->
<!-- about-section -->
	<div class="about-section">
		<div class="container">
			<div class="col-md-8 about-left1">
				<h3> Duis autem vel eum iriure </h3>
				<div class="left">
					<div class="left-top">
						<img src="smartphone/images/img7.jpg"  class="img-responsive" alt="" />
					</div>
					<div class="left-top1">
						<h4>Lorem ipsum dolor</h4>
						<p>Claritas est etiam processus dynamicus, qui sequitur mutationem consuetudium lectorum.</p>
						<a class="read" href="#">Read more</a>
					</div>
					<div class="clear"> </div>
				</div>
				<div class="left">	
					<div class="left-bottom">
						<img src="smartphone/images/img8.jpg"  class="img-responsive" alt="" />
					</div>
					<div class="left-bottom1">
						<h4>Lorem ipsum dolor</h4>
						<p>Claritas est etiam processus dynamicus, qui sequitur mutationem consuetudium lectorum.</p>
						<a class="read" href="#">Read more</a>
					</div>
					<div class="clear"> </div>
				</div>
			</div>
			<div class="col-md-4  about-right1">
				<h3> Duis autem vel  </h3>
				<div class="right-bottom">
					<h5><a href="#">Lorem ipsum dolor</a></h5>
					<p>Claritas est etiam processus dynamicus,</p>
				</div>
				<div class="right-bottom">
					<h5><a href="#">Lorem ipsum dolor</a></h5>
					<p>Claritas est etiam processus dynamicus, qui sequitur mutationem consuetudium lectorum.</p>
				</div>
				<div class="right-bottom">
					<h5><a href="#">Lorem ipsum dolor</a></h5>
					<p>Claritas est etiam processus dynamicus, qui sequitur mutationem consuetudium lectorum.</p>
				</div>
			</div>
				<div class="clear"> </div>
		</div>
	</div>
<!-- about-section -->
<div class="case-studies">
<div class="container">
	<h2>case studies</h2>
	<p class="stud">Lorem ipsum dolor sit amet, consectetur.</p>
	<div class="studies">
		<div class="wmuSlider example1 section" id="section-1">
			   <article style="position: absolute; width: 100%; opacity: 0;"> 
							<div class="data">
								<h4>Lorem ipsum llc</h4>
								<a class="read-more" href="#">read more</a>
							</div>
							<div class="man">
								<img src="smartphone/images/device.png" alt="" />
							</div>
								<div class="clear"></div>
				   
				</article>
				<article style="position: absolute; width: 100%; opacity: 0;"> 
							<div class="data">
								<h4>Lorem ipsum llc</h4>
								<a class="read-more" href="#">read more</a>
							</div>
							<div class="man">
								<img src="smartphone/images/device1.jpg" alt="" />
							</div>
								<div class="clear"></div>
				  
				</article>
				<article style="position: absolute; width: 100%; opacity: 0;"> 
							<div class="data">
								 <h4>Lorem ipsum llc</h4>
								<a class="read-more" href="#">read more</a>
							</div>
							<div class="man">
								<img src="smartphone/images/device.png" alt="" />
							</div>
								<div class="clear"></div>
				</article>
				<article style="position: absolute; width: 100%; opacity: 0;"> 
							<div class="data">
								 <h4>Lorem ipsum llc</h4>
								<a class="read-more" href="#">read more</a>
							</div>
							<div class="man">
								<img src="smartphone/images/device1.jpg" alt="" />
							</div>
								<div class="clear"></div>
				</article>
				<ul class="wmuSliderPagination">
                	<li><a href="#" class="">0</a></li>
                	<li><a href="#" class="">1</a></li>
                	<li><a href="#" class="">2</a></li>
                </ul>
		  </div>
		  </div>
		  <!-- script -->
          <script src="smartphone/js/jquery.wmuSlider.js"></script> 
			<script>
       			$('.example1').wmuSlider();         
   		    </script>
			<!-- script -->	
		</div>
	</div>
	<!-- ourteam -->
<div class="ourteam">
			<div class="container">
				<h3>our team</h3>
				<p class="stud">Lorem ipsum dolor sit amet, consectetur.</p>
				<div class="team">
					  <ul id="flexiselDemo3">
						<li>
							<div class="team1">
								<a href="#small-dialog6" class="b-link-stripe b-animate-go  thickbox play-icon popup-with-zoom-anim">
								<img src="smartphone/images/man.jpg" class="img-responsive" alt="" />
								<div class="b-wrapper"><h5 class="b-animate b-from-left    b-delay03 "><i class="fff"> </i></h5>
								<p class="b-animate b-from-right    b-delay03 "></p></div></a>
								<h4>Bruce wayne</h4>
								<p>Lorem ipsum dolor sit amet.</p>
							</div>
						</li>
						<li>
							<div class="team1">
								<a href="#small-dialog6" class="b-link-stripe b-animate-go  thickbox play-icon popup-with-zoom-anim">
								<img src="smartphone/images/man1.jpg" class="img-responsive" alt="" />
								<div class="b-wrapper"><h5 class="b-animate b-from-left    b-delay03 "><i class="fff"> </i></h5>
								<p class="b-animate b-from-right    b-delay03 "></p></div></a>
								<h4>Tony Stark</h4>
								<p>Lorem ipsum dolor sit amet.</p>
							</div>
						</li>
						<li>
							<div class="team1">
								<a href="#small-dialog6" class="b-link-stripe b-animate-go  thickbox play-icon popup-with-zoom-anim">
								<img src="smartphone/images/man2.jpg" class="img-responsive" alt="" />
								<div class="b-wrapper"><h5 class="b-animate b-from-left    b-delay03 "><i class="fff"> </i></h5>
								<p class="b-animate b-from-right    b-delay03 "></p></div></a>
								<h4>Selina Kyle</h4>
								<p>Lorem ipsum dolor sit amet.</p>
							</div>
						</li>
						<li>
							<div class="team1">
								<a href="#small-dialog6" class="b-link-stripe b-animate-go  thickbox play-icon popup-with-zoom-anim">
								<img src="smartphone/images/man.jpg" class="img-responsive" alt="" />
								<div class="b-wrapper"><h5 class="b-animate b-from-left    b-delay03 "><i class="fff"> </i></h5>
								<p class="b-animate b-from-right    b-delay03 "></p></div></a>
								<h4>Bruce wayne</h4>
								<p>Lorem ipsum dolor sit amet.</p>
							</div>
					    </li>
						<li>
							<div class="team1">
								<a href="#small-dialog6" class="b-link-stripe b-animate-go  thickbox play-icon popup-with-zoom-anim">
								<img src="smartphone/images/man1.jpg" class="img-responsive" alt="" />
								<div class="b-wrapper"><h5 class="b-animate b-from-left    b-delay03 "><i class="fff"> </i></h5>
								<p class="b-animate b-from-right    b-delay03 "></p></div></a>
								<h4>Tony Stark</h4>
								<p>Lorem ipsum dolor sit amet.</p>
							</div>
					    </li>
					 </ul>
				</div>
				 <script type="text/javascript">
					$(window).load(function() {
						
						$("#flexiselDemo3").flexisel({
							visibleItems: 3,
							animationSpeed: 1000,
							autoPlay: true,
							autoPlaySpeed: 3000,    		
							pauseOnHover: true,
							enableResponsiveBreakpoints: true,
							responsiveBreakpoints: { 
								portrait: { 
									changePoint:480,
									visibleItems: 1
								}, 
								landscape: { 
									changePoint:640,
									visibleItems: 2
								},
								tablet: { 
									changePoint:768,
									visibleItems: 3
								}
							}
						});
						
					});
				    </script>
				    <script type="text/javascript" src="smartphone/js/jquery.flexisel.js"></script>
		</div>
	</div>
<!-- ourteam -->
<!-- contactus -->
	<div class="contactus">
		<div class="container">
			<h3>contact us</h3>
				<div class="col-md-5">
						<h4>contact form</h4>
					<form>
						<input type="text" class="text" value="NAME" onfocus="this.value = '';" onblur="if (this.value == '') {this.value = 'NAME';}">
						<input type="text" class="text" value="EMAIL" onfocus="this.value = '';" onblur="if (this.value == '') {this.value = 'EMAIL';}">
						<textarea value="MESSAGE:" onfocus="if(this.value == 'MESSAGE') this.value='';" onblur="if(this.value == '') this.value='MESSAGE';">MESSAGE</textarea>		
					</form>
				</div>
				<div class="col-md-4 info">
						<h4>more info</h4>
							<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d106034.86973547915!2d151.21288358178987!3d-33.84869089455211!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x6b129838f39a743f%3A0x3017d681632a850!2sSydney+NSW%2C+Australia!5e0!3m2!1sen!2sin!4v1413550737925" width="" height="" frameborder="0" style="border:0"></iframe>
				</div>
				<div class="col-md-3 pisan">
					<div class="icon1">
						<i class="ph"> </i>
					</div>
					<div class="data1">
						<h5>+(123)456-789-1234</h5>
						<p>+(123)456-789-1234</p>
					</div>
						<div class="clear"></div>
					<div class="icon1">
						<i class="alu"> </i>
					</div>
					<div class="data1">
						<h5>Alus Pisan</h5>
						<p>23 Street BoulevardCity, WA 12345, USA</p>
					</div>
						<div class="clear"></div>
					<div class="icon1">
						<i class="msg"> </i>
					</div>
					<div class="data1">
						<h5><a href="#">contact@gmail.com</a></h5>
					</div>
						<div class="clear"></div>	
				</div>
					<div class="clear"></div>
		</div>
	</div>
<!-- contactus -->
<!-- keep in touch -->
	<div class="keep">
		<div class="container">
			<h3>keep in touch.</h3>
			<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit</p>
					<div class="col-md-7 text-field-email">
						<form>
							<input type="text" class="text" value="E-mail address" onfocus="this.value = '';" onblur="if (this.value == '') {this.value = 'E-mail address ';}">
						</form>
					</div>
					<div class="col-md-5 button1">
						<form>
							<input type="submit" value="subscribe">
						</form>
					</div>
						<div class="clear"> </div>
		</div>
	</div>
<!-- keep in touch -->
<!-- footer -->
<div class="footer">
		<div class="container">
		<div class="col-md-4">
			<p>Template by <a href="http://w3layouts.com" target="_blank"> w3layouts</a></p>
		</div>
		<div class="col-md-4 policy">
			<ul>
					<li><a href="#">Privacy Policy</li></a>
					<li><a href="#">Terms of Use</li></a>
					<li><a href="#">FAQs</li></a>
					<div class="clear"></div>
				</ul>
		</div>
			<div class="col-md-4 social">
				<ul>
					<li><a href="#"><i class="fb"> </i></li></a>
					<li><a href="#"><i class="twt"> </i></li></a>
					<li><a href="#"><i class="goog"> </i></li></a>
					<li><a href="#"><i class="in"> </i></li></a>
					<li><a href="#"><i class="pp"> </i></li></a>
					<div class="clear"></div>
				</ul>
			</div>
				<div class="clear"></div>
		</div>
	</div>
<!-- footer -->
</body>
</html>