File size: 8.36Kb
<!--
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>Variety website for Iphone, Android Smartphone Mobile Website Template | Home :: w3layouts</title>
<!-- Custom files -->
<link href="smartphone/css/style.css" rel='stylesheet' type='text/css' />
<script src="smartphone/js/jquery.min.js"></script>
<!-- Custom Theme files -->
<meta name="viewport" content="width=device-width, initial-scale=1">
<script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false); function hideURLbar(){ window.scrollTo(0,1); } </script>
</script>
<!----//webfonts---->
<link href='http://fonts.googleapis.com/css?family=Rokkitt:400,700' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700,800' rel='stylesheet' type='text/css'>
<!----//webfonts---->
<script type="text/javascript">
$(function() {
$('a[href*=#]:not([href=#])').click(function() {
if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) {
var target = $(this.hash);
target = target.length ? target : $('[name=' + this.hash.slice(1) +']');
if (target.length) {
$('html,body').animate({
scrollTop: target.offset().top
}, 1000);
return false;
}
}
});
});
</script>
</head>
<body>
<div id="top" class="navbar navbar-inverse" role="navigation">
<div class="container">
<div class="navbar-header">
<a class="navbar-brand" href="#">Variety</a>
</div>
<!-- start smart_nav * -->
<nav class="nav">
<ul class="nav-list">
<li class="active"><a href="#">Start</a></li>
<li><a href="#about">About me</a></li>
<li><a href="#work">Work</a></li>
<li><a href="#portfolio">Portfolio</a></li>
<li><a href="#contact">Contact</a></li>
</ul>
</nav>
<script type="text/javascript" src="smartphone/js/responsive.menu.js"></script>
<!-- end smart_nav * -->
</div>
<!----start-slider---->
<!----slider-requried-files--->
<!----//slider-requried-files--->
<!---start-image-slider---->
<div class="slideshow">
<div>
<h1>May I introduce my self?</h1>
<span class="border"> </span>
<p>Fronted Design UI/UX Design</p>
</div>
<div>
<h1>May I introduce my self?</h1>
<span class="border"> </span>
<p>Fronted Design UI/UX Design</p>
</div>
</div>
<div class="go_btn">
<a class="button" href="#">Go Ahead</a>
</div>
<!-----start-slider-script---->
<script>
$(function() {
$(".slideshow > div:gt(0)").hide();
setInterval(function() {
$('.slideshow > div:first')
.fadeOut(1000)
.next()
.fadeIn(1000)
.end()
.appendTo('.slideshow');
}, 3000);
});
</script>
<!-----//End-slider-script---->
</div>
<!----//End-slider---->
<!----//End-container---->
<!----//-container---->
<div class="about me" id="about">
<div class="container">
<div class="row content-top">
<div class="col-md-12 text-center">
<h2>Rapgael Lechner.</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris egestas orci et blandit dictum. Interdum et malesuada fames ac ante ipsum primis in faucibus. </p
</div>
</div>
</div>
</div>
<!----//-container---->
<div class="work" id="work">
<div class="container">
<div class="row">
<div class="col-md-4 text-center">
<div class="grid ">
<img src="smartphone/images/icon1.png" alt=""/>
<h3>Sketching is fun</h3>
<p>Lorem ipsum dolor sit amet, lobortis scelerisque magna. Ut in nunc sem. Integer bibendum enim et erat molestie. </p>
</div>
</div>
<div class="col-md-4 text-center">
<div class="grid ">
<img src="smartphone/images/icon2.png" alt=""/>
<h3>Design afterwords</h3>
<p>Lorem ipsum dolor sit amet, lobortis scelerisque magna. Ut in nunc sem. ipsum dapibus elementum.</p>
</div>
</div>
<div class="col-md-4 text-center">
<div class="grid ">
<img src="smartphone/images/icon3.png" alt=""/>
<h3>Finalize</h3>
<p>Lorem ipsum dolor sit amet, lobortis scelerisque magna. Ut in nunc sem. ipsum dapibus elementum.</p>
</div>
</div>
<div class="clear"></div>
</div>
</div>
</div>
<link rel="stylesheet" type="text/css" href="smartphone/css/component.css" />
<script src="smartphone/js/modernizr.custom.js"></script>
<div class="portfolio" id="portfolio">
<div class="container demo-3">
<ul class="col-md-12 grid cs-style-3">
<li class="col-md-6">
<figure>
<img class="responsive-img img1" src="smartphone/images/pic1.png" alt="img03">
<figcaption>
<h4>Lorem ipsum dolor sit </h4>
<span>amet conseteter sadipscing elitr</span>
</figcaption>
</figure>
<a href="#"><label class="search-icon"> </label></a>
</li>
<li class="col-md-6">
<figure>
<img class="responsive-img img1" src="smartphone/images/pic2.png" alt="img01">
<figcaption>
<h4>Lorem ipsum dolor sit </h4>
<span>amet conseteter sadipscing elitr</span>
</figcaption>
</figure>
<a href="#"><label class="search-icon"> </label></a>
</li>
<li class="col-md-6">
<figure>
<img class="responsive-img img1" src="smartphone/images/pic3.png" alt="img02">
<figcaption>
<h4>Lorem ipsum dolor sit </h4>
<span>amet conseteter sadipscing elitr</span>
</figcaption>
</figure>
<a href="#"><label class="search-icon"> </label></a>
</li>
<li class="col-md-6">
<figure>
<img class="responsive-img img1" src="smartphone/images/pic4.png" alt="img04">
<figcaption>
<h4>Lorem ipsum dolor sit </h4>
<span>amet conseteter sadipscing elitr</span>
</figcaption>
</figure>
<a href="#"><label class="search-icon"> </label></a>
</li>
<li>
</ul>
<div class="view">
<a class="view-btn" href="#">View More <span> </span></a>
</div>
</div>
</div>
<!-- /container -->
<script src="smartphone/js/toucheffects.js"></script>
<!----//End-container---->
<div class="contact" id="contact">
<div class="container contact">
<h5>Get in touch!</h5>
<div class="row contact-form">
<form>
<div class="col-md-6 text-box">
<input type="text" placeholder="Name" />
</div>
<div class="col-md-6 text-box ">
<input type="text" placeholder="Email" />
</div>
<div class="col-md-12 textarea">
<textarea>How can I help you?</textarea>
</div>
<input class="con-button " type="submit" value="Send" />
</form>
</div>
</div>
</div>
<!----//End-contact---->
<div class="footer">
<div class="container">
<div class="row social-icons">
<div class="col-xs-4 text-center">
<a href="#"><img class="responsive-img" src="smartphone/images/footr-twb.png" alt=""/></a>
</div>
<div class="col-xs-4 text-center">
<a href="#"><img class="responsive-img" src="smartphone/images/footr-dbl.png" alt=""/> </a>
</div>
<div class="col-xs-4 text-center">
<a href="#"><img class="responsive-img" src="smartphone/images/footr-fb.png" alt=""/> </a>
</div>
<div class="clear"> </div>
</div>
<div class="row copy-right">
<div class="col-md-12 text-center">
<p>Copyright © 2014 All Rights Reserved |Template by <a href="http://w3layouts.com">W3Layouts</a></p>
</div>
</div>
</div>
</div>
<a href="#top" id="toTop" style="display: block;"><span id="toTopHover" style="opacity: 1;"> </span></a>
</body>
</html>