View file onepageportfolio-pack/mobile/index.html

File size: 9.55Kb
<!--
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 PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN"
"http://www.wapforum.org/DTD/xhtml-mobile10.dtd">
<html>
<head>
<title>ONE PAGE PORTFOLIO for high end mobiles, like samsung, nokia, lg,  sony ericsson, htc mobile website templates for free | Home :: w3layouts</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
<link href="mobile/css/style.css" media="all" rel="stylesheet" type="text/css" />
</head>
<body>
  <!-- header-section-starts -->
    <div class="header">
	       <div class="header-top">
		   <div class="container">
		       <div class="logo">
			      <a href=""><img src="mobile/images/logo.png" alt="" /></a>
			   </div>
			   <div class="top-menu">
			   <span onclick="location.href='#menu'" class="menu"> </span>
			     
			   </div>
			   <div class="clear"></div>
		   </div>
	   </div>
    
	<div class="index-banner">
	  <div class="container">
			   <div class="wmuSliderWrapper">
				   	<div class="banner-wrap">
				   	       <div class="bannertop_box">
				   		 		<h1>HELLO,<span>I'M YOUR NAME</span></h1>
								<label>graphic / web / motion designer</label>
								<p>Slider for your work.pictures yours recent projects or something like that.</p>
				   		 	    <p>You can put your own stuff such as other text information, images etc. </p>
							    <p>That's absolutely <span class="bold">free</span> template. Ihope you enjoy it!<span class="bold block">Thank you.</span></p>
							</div>
							
				   		 	<div class="banner_right">
				   		 		<img src="mobile/images/slider-img2.jpg" alt="" />
				   		 	</div>
				   		 	<div class="clear"></div>
				   	  </div>
            </div>           	      
      </div>
	  </div>
	  </div>
  <!-- header-section-ends -->
  <!-- content-starts -->
  <div class="content">
  <!-- about-section-starts -->
    <div class="about-section" id="aboutus">
	    <div class="about-section-head text-center">
		   <div class="container">
		      <h3>ABOUT ME</h3>
			  <p>Well, you can write something yourself. For example,geolocation and etc.Your is focused on Web / Motion design.</p>
		   </div>
		</div>
		<div class="about-section-grids">
		    <div class="about-section-top-grid">
			   <div class="container">
			       <div class="col-md-3 about-section-top-left-grid">
				      <h4>Software</h4>
				   </div>
				   <div class="col-md-9 about-section-top-right-grid">
				      <p>Ps | Ai | Id | Ae | Mu | Cinema4d | 3dsMax + Vray</p>
				   </div>
				   <div class="clear"></div>
			   </div>
			</div>
			<div class="about-section-middle-grid">
			   <div class="container">
			       <div class="col-md-3 about-section-middle-left-grid">
				      <h4>Skills</h4>
				   </div>
				   <div class="col-md-9 about-section-middle-right-grid">
				      <p>Conceptual thinking | Web | Illustration | Identity | Team work</p>
				   </div>
				   <div class="clear"></div>
			   </div>
			</div>
			<div class="about-section-bottom-grid">
			   <div class="container">
			       <div class="col-md-3 about-section-bottom-left-grid">
				      <h4>Hobby</h4>
				   </div>
				   <div class="col-md-9 about-section-bottom-right-grid">
				      <p>Music | Movies | Sport | Art | Photography</p>
				   </div>
				   <div class="clear"></div>
			   </div>
			</div>
		</div>
	</div>
	<!-- about-section-ends -->
	<!-- work-section-starts -->
	<div class="work-section" id="work">
	    <div class="container">
		  <div class="work-section-head text-center">
		     <h3>WORK</h3>
		  </div>
		  <div id="portfoliolist">
					<div class="portfolio card mix_all" style="display: inline-block; opacity: 1;">
						 <div class="portfolio-wrapper">	
							<a class="lightbox" href="#">
								   <img src="mobile/images/pic1.jpg" class="img-responsive" alt="" />
						  	
								</a> 
						 </div>

					</div>				
					<div class="portfolio app mix_all" style="display: inline-block; opacity: 1;">
						<div class="portfolio-wrapper">		
							<a class="lightbox" href="#">
								   <img src="mobile/images/pic2.jpg" class="img-responsive" alt="" />
						  
								</a> 
					    </div>
					</div>		
					<div class="portfolio web mix_all" style="display: inline-block; opacity: 1;">
						<div class="portfolio-wrapper">		
							<a class="lightbox" href="#">
								   <img src="mobile/images/pic3.jpg" class="img-responsive" alt="" />
	
								</a>

					</div>	
</div>					
					<div class="portfolio icon mix_all" style="display: inline-block; opacity: 1;">
						<div class="portfolio-wrapper">		
							<a class="lightbox" href="#">
								   <img src="mobile/images/pic4.jpg" class="img-responsive" alt="" /></a> 
						  	</div>
								
					    </div>

					</div>
					<div class="portfolio icon mix_all" style="display: inline-block; opacity: 1;">
						<div class="portfolio-wrapper">		
							<a class="lightbox" href="#">
								   <img src="mobile/images/pic5.jpg" class="img-responsive" alt="" />
	
								</a>  
					    </div>

					</div>
					<div class="portfolio app mix_all" style="display: inline-block; opacity: 1;">
						<div class="portfolio-wrapper">		
							<a class="lightbox" href="#">
								   <img src="mobile/images/pic6.jpg" class="img-responsive" alt=""/>
								</a> 
					    </div>
					</div>			
					<div class="portfolio card mix_all" style="display: inline-block; opacity: 1;">
						<div class="portfolio-wrapper">		
							<a class="lightbox" href="#">
								   <img src="mobile/images/pic7.jpg" class="img-responsive" alt=""/>
								</a> 
					    </div>
					</div>	
					<div class="portfolio card mix_all" style="display: inline-block; opacity: 1;">
						<div class="portfolio-wrapper">		
							<a class="lightbox" href="#">
								   <img src="mobile/images/pic8.jpg" class="img-responsive" alt=""/>
								</a> 
					    </div>
					</div>	
<div class="clear"></div>					
				</div>
		  <div class="clear"></div>
		  <span class="more">MORE ON <a href="#">BEHANCE</a></span>

		  </div>
		  </div>
    <!-- work-section-ends -->
	<!-- clients-section-starts -->
	   <div class="clients-section" id="clients">
	      <div class="container">
		    <div class="clients-section-head text-center">
			   <h3>CLIENTS</h3>
			</div>
			<div class="clients-section-grids text-center">
			   <div class="col-md-4 client-section-grid">
			    <img src="mobile/images/client1.png" alt="" />
			 </div>
			 <div class="col-md-4 client-section-grid">
			    <img src="mobile/images/client2.png" alt="" />
			 </div>
			 <div class="col-md-4 client-section-grid">
			    <img src="mobile/images/client3.png" alt="" />
			 </div>
			 <div class="clear"></div>
			 <div class="col-md-4 client-section-grid">
			    <img src="mobile/images/client2.png" alt="" />
			 </div>
			 <div class="col-md-4 client-section-grid">
			    <img src="mobile/images/client3.png" alt="" />
			 </div>
			 <div class="col-md-4 client-section-grid">
			    <img src="mobile/images/client1.png" alt="" />
			 </div>
			 <div class="clear"></div>
			 <div class="col-md-4 client-section-grid">
			    <img src="mobile/images/client3.png" alt="" />
			 </div>
			 <div class="col-md-4 client-section-grid">
			    <img src="mobile/images/client1.png" alt="" />
			 </div>
			 <div class="col-md-4 client-section-grid">
			    <img src="mobile/images/client2.png" alt="" />
			 </div>
			 <div class="clear"></div>
			</div>
		  </div>
	   </div>
	   <div class="clear"></div>
	<!-- clients-section-ends -->
	
	 <!--top-links-->
	  <div class="top-menu" id="menu">
	      <ul>
			 <li><a href="#aboutus">About Me</a></li>
		     <li><a href="#work">Work</a></li>
			 <li><a href="#clients">Clients</a></li>
			 <li><a href="#contact">Let's talk</a></li>
		  </ul>
	  </div>
	  <div class="clear"></div>
     <!--top-links-->
	<!-- contect-section-starts -->
	<div class="contact-section" id="contact">
	<div class="container">
	    <div class="contact-section-head text-center">
		   <h3>LET'S TALK</h3>
		</div>
		<div class="comments-area">
		    <form>
			   <p> 
			   <label>YOUR NAME</label>
			   <input type="text" value="" >
			   </p>
			   <p> 
			   <label>YOUR EMAIL</label>
			   <input type="text" value="" >
			   </p>
			   <p> 
			   <label>YOUR MESSAGE</label>
			   <textarea></textarea>
			   </p>
			   <div class="submit">
			     <input type="submit" value="submit">
			   </div>
			</form>
		</div>
		<div class="social-icons">
		  <a href="#"><img src="mobile/images/behance.png" alt="" /></a>
		  <a href="#"><img src="mobile/images/dribble.png" alt="" /></a>
		  <a href="#"><img src="mobile/images/linkein.png" alt="" /></a>
		  <a href="#"><img src="mobile/images/vimeo.png" alt="" /></a>
		  <a href="#"><img src="mobile/images/twitter.png" alt="" /></a>
		  <a href="#"><img src="mobile/images/facebook.png" alt="" /></a>
		  <a href="#"><img src="mobile/images/skype.png" alt="" /></a>
		</div>
	</div>
	</div>
	<!-- contect-section-ends -->
  <!-- content-ends -->
     <!-- footer-->
	<div class="footer">
		<div class="container">
			<div class="copyright">
				<p> &copy; 2014 OnePagePortfolio. All rights reserved | Template by <a href="http://w3layouts.com/">W3layouts</a></p>
			</div>
		</div>
	</div>
    <!-- footer-->
</body>
</html>