File size: 17.38Kb
<!--
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 "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html>
<head>
<title>Butterfly website for high end mobiles,like samsung nokia mobile website templates for free | Home :: w3layouts</title>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<link href="mobile/css/theme-style.css" rel="stylesheet" type="text/css" media="all" />
<meta name="keywords" content="Butterfly iphone web template, Andriod web template, Smartphone web template, free webdesigns for Nokia, Samsung, LG, SonyErricsson, Motorola web design" />
</head>
<body>
<!----start-header--->
<div id="top" class="header">
<!----start-container---->
<div class="container">
<div class="logo navbar-header">
<a href="#page-top">
<a href="#"> <img src="mobile/images/logo.png" title="Butterfly" /></a>
</a>
</div>
<!--top-nav-->
<nav class="top-nav">
<a href="#menu" id="pull"><img src="mobile/images/nav-icon.png" title="menu" /></a>
</nav>
<!--//top-nav-->
</div>
</div>
<!----//End-header--->
<!----start-slider---->
<!---start-image-slider---->
<div class="slider">
<img src="mobile/images/slider-bg.png" title="img" />
<!---End-image-slider---->
</div>
<!----//End-slider---->
<!----start-about-us---->
<div id="about" class="container about">
<div class="text-center div-head">
<h2>ABOUT US</h2>
<p>Butterfly is a modern psd theme made to look awesome on any size of screen. single page templet for creative agency .</p>
</div>
<div class="row about-grids text-center">
<div class="col-md-3 about-grid">
<a class="a-coin1" href="#">
<span> </span>
</a>
<a href="#"><h3>Modern</h3></a>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing..</p>
</div>
<div class="col-md-3 about-grid">
<a class="a-coin2" href="#">
<span> </span>
</a>
<a href="#"><h3>Clean</h3></a>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing..</p>
</div>
<div class="col-md-3 about-grid">
<a class="a-coin3" href="#">
<span> </span>
</a>
<a href="#"><h3>Responsive</h3></a>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing..</p>
</div>
<div class="col-md-3 about-grid">
<a class="a-coin4" href="#">
<span> </span>
</a>
<a href="#"><h3>Simple</h3></a>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing..</p>
</div>
<div class="clearfix"> </div>
</div>
</div>
<!----//End-about-us---->
<!----start-skillls---->
<div id="skills" class="skills">
<div class="container">
<div class="text-center div-head skills-head">
<h2>OUR SKILLS</h2>
<p>Butterfly is a modern psd theme made to look awesome on any size of screen. single page templet for creative agency .</p>
</div>
<div class="row skills-grids">
<div class="col-md-3 skills-grid text-center">
<span class="s-icon1"><strong>80%</strong></span>
<h3>Web Design</h3>
<p>Lorem ipsum dolor sit amet,consectetur adipisicing..</p>
</div>
<div class="col-md-3 skills-grid text-center">
<span class="s-icon2"><strong>65%</strong></span>
<h3>WordPress</h3>
<p>Lorem ipsum dolor sit amet,consectetur adipisicing..</p>
</div>
<div class="col-md-3 skills-grid text-center">
<span class="s-icon3"><strong>50%</strong></span>
<h3>JQuery</h3>
<p>Lorem ipsum dolor sit amet,consectetur adipisicing..</p>
</div>
<div class="col-md-3 skills-grid text-center">
<span class="s-icon4"><strong>90%</strong></span>
<h3>HTML</h3>
<p>Lorem ipsum dolor sit amet,consectetur adipisicing..</p>
</div>
<div class="clearfix"> </div>
</div>
</div>
</div>
<!----//End-skillls---->
<!----start-portfolio---->
<div id="port" class="container portfolio-main">
<div class="text-center div-head">
<h2>OUR PORTFOLIO</h2>
<p>Butterfly is a modern psd theme made to look awesome on any size of screen. single page templet for creative agency .</p>
</div>
</script>
<!----//End-portfolio-script----->
<ul id="filters" class="clearfix">
<li><span class="filter active" data-filter="app card icon logo web">All</span></li>
<li><span class="filter" data-filter="app">DESIGN</span></li>
<li><span class="filter" data-filter="card">PHOTOGRAPHY</span></li>
<li><span class="filter" data-filter="icon">VIDEO</span></li>
<li><span class="filter" data-filter="app">PRINT</span></li>
</ul>
<div id="portfoliolist">
<div class="portfolio logo1 mix_all" data-cat="logo" style="display: inline-block; opacity: 1;">
<div class="portfolio-wrapper">
<a data-toggle="modal" data-target=".bs-example-modal-md" href="#" class="b-link-stripe b-animate-go thickbox">
<img class="p-img" src="mobile/images/p1.jpg" /><div class="b-wrapper"><h2 class="b-animate b-from-left b-delay03 "><img src="mobile/images/link-ico.png" alt=""/></h2>
</div></a>
</div>
</div>
<div class="portfolio app mix_all" data-cat="app" style="display: inline-block; opacity: 1;">
<div class="portfolio-wrapper">
<a data-toggle="modal" data-target=".bs-example-modal-md" href="#" class="b-link-stripe b-animate-go thickbox">
<img class="p-img" src="mobile/images/p2.jpg" /><div class="b-wrapper"><h2 class="b-animate b-from-left b-delay03 "><img src="mobile/images/link-ico.png" alt=""/></h2>
</div></a>
</div>
</div>
<div class="portfolio web mix_all" data-cat="web" style="display: inline-block; opacity: 1;">
<div class="portfolio-wrapper">
<a data-toggle="modal" data-target=".bs-example-modal-md" href="#" class="b-link-stripe b-animate-go thickbox">
<img class="p-img" src="mobile/images/p3.jpg" /><div class="b-wrapper"><h2 class="b-animate b-from-left b-delay03 "><img src="mobile/images/link-ico.png" alt=""/></h2>
</div></a>
</div>
</div>
<div class="portfolio icon mix_all" data-cat="icon" style="display: inline-block; opacity: 1;">
<div class="portfolio-wrapper">
<a data-toggle="modal" data-target=".bs-example-modal-md" href="#" class="b-link-stripe b-animate-go thickbox">
<img class="p-img" src="mobile/images/p4.jpg" /><div class="b-wrapper"><h2 class="b-animate b-from-left b-delay03 "><img src="mobile/images/link-ico.png" alt=""/></h2>
</div></a>
</div>
</div>
<div class="portfolio app mix_all" data-cat="app" style="display: inline-block; opacity: 1;">
<div class="portfolio-wrapper">
<a data-toggle="modal" data-target=".bs-example-modal-md" href="#" class="b-link-stripe b-animate-go thickbox">
<img class="p-img" src="mobile/images/p5.jpg" /><div class="b-wrapper"><h2 class="b-animate b-from-left b-delay03 "><img src="mobile/images/link-ico.png" alt=""/></h2>
</div></a>
</div>
</div>
<div class="portfolio card mix_all" data-cat="card" style="display: inline-block; opacity: 1;">
<div class="portfolio-wrapper">
<a data-toggle="modal" data-target=".bs-example-modal-md" href="#" class="b-link-stripe b-animate-go thickbox">
<img class="p-img" src="mobile/images/p6.jpg" /><div class="b-wrapper"><h2 class="b-animate b-from-left b-delay03 "><img src="mobile/images/link-ico.png" alt=""/></h2>
</div></a>
</div>
</div>
<div class="clearfix"> </div>
<a class="more-ports text-center" href="#"><span> </span></a>
</div>
</div>
<!----//End-portfolio---->
<!----start-words---->
<div class="words">
<div class="container text-center">
<h3><span class="frist-quit"> </span> Design For Life <span class="second-quit"> </span></h3>
<h4>- Ahmed Emad -</h4>
</div>
</div>
<!----//End-words---->
<!----start-our-team---->
<div id="team" class="container our-team">
<div class="text-center div-head">
<h2>OUR TEAM</h2>
<p>Butterfly is a modern psd theme made to look awesome on any size of screen. single page templet for creative agency .</p>
</div>
<!----start-team-member-script-files---->
<!----//End-team-member-script-files---->
<div class="row our-team-grids">
<div class="col-md-4 our-team-grid holder smooth">
<img src="mobile/images/t1.jpg" alt="">
<div class="go-top">
<ul class="team-memmber-social list-unstyled list-inline">
<li><a href="#"> <span class="facebook"> </span></a></li>
<li><a href="#"> <span class="twitter"> </span></a></li>
<li><a href="#"> <span class="chaton"> </span></a></li>
</ul>
</div>
</div>
<div class="col-md-4 our-team-grid holder smooth">
<img src="mobile/images/t2.jpg" alt="">
<div class="go-top">
<ul class="team-memmber-social list-unstyled list-inline">
<li><a href="#"> <span class="facebook"> </span></a></li>
<li><a href="#"> <span class="twitter"> </span></a></li>
<li><a href="#"> <span class="chaton"> </span></a></li>
</ul>
</div>
</div>
<div class="col-md-4 our-team-grid holder smooth">
<img src="mobile/images/t3.jpg" alt="">
<div class="go-top">
<ul class="team-memmber-social list-unstyled list-inline">
<li><a href="#"> <span class="facebook"> </span></a></li>
<li><a href="#"> <span class="twitter"> </span></a></li>
<li><a href="#"> <span class="chaton"> </span></a></li>
</ul>
</div>
</div>
<div class="clearfix"> </div>
<!----team-member-note---->
<div class="member-note text-center">
<h3>Lorem Ipsum</h3>
<p>Butterfly is a modern psd theme made to look awesome on any size of screen. single page templet for creative agency .</p>
</div>
<!----//End-member-note---->
</div>
</div>
<!----//End-our-team---->
<!-----start-blog---->
<div id="blog" class="blog">
<div class="container">
<div class="text-center div-head">
<h2>OUR BLOG</h2>
<p>Butterfly is a modern psd theme made to look awesome on any size of screen. single page templet for creative agency .</p>
</div>
<!----start-post-grids---->
<div class="col-md-12 post-grids">
<div class="col-md-6 post-grid">
<div class="col-md-5 post-pic">
<a href="#"><img src="mobile/images/blog-people-pic1.png" title="post-pic-name" /></a>
</div>
<div class="col-md-7 post-info">
<h3><a href="#">DESIGN</a> <span> 15 \2\2014</span></h3>
<p>Butterfly is a modern psd theme madeto look awesome on any size of screen. single page templet for creative agency</p>
<ul class="post-share list-unstyled list-inline text-right">
<li><a href="#"><span class="post-chat-icon"> </span></a></li>
<li><a href="#"><span class="post-heart-icon"> </span></a></li>
</ul>
</div>
</div>
<div class="col-md-6 post-grid">
<div class="col-md-5 post-pic">
<a href="#"><img src="mobile/images/blog-people-pic2.png" title="post-pic-name" /></a>
</div>
<div class="col-md-7 post-info">
<h3><a href="#">DESIGN</a> <span> 15 \2\2014</span></h3>
<p>Butterfly is a modern psd theme madeto look awesome on any size of screen. single page templet for creative agency</p>
<ul class="post-share list-unstyled list-inline text-right">
<li><a href="#"><span class="post-chat-icon"> </span></a></li>
<li><a href="#"><span class="post-heart-icon"> </span></a></li>
</ul>
<label class="post-label"> </label>
</div>
</div>
<div class="col-md-6 post-grid">
<div class="col-md-5 post-pic">
<a href="#"><img src="mobile/images/blog-people-pic2.png" title="post-pic-name" /></a>
</div>
<div class="col-md-7 post-info">
<h3><a href="#">DESIGN</a> <span> 15 \2\2014</span></h3>
<p>Butterfly is a modern psd theme madeto look awesome on any size of screen. single page templet for creative agency</p>
<ul class="post-share list-unstyled list-inline text-right">
<li><a href="#"><span class="post-chat-icon"> </span></a></li>
<li><a href="#"><span class="post-heart-icon"> </span></a></li>
</ul>
</div>
</div>
<div class="col-md-6 post-grid">
<div class="col-md-5 post-pic">
<a href="#"><img src="mobile/images/blog-people-pic1.png" title="post-pic-name" /></a>
</div>
<div class="col-md-7 post-info">
<h3><a href="#">DESIGN</a> <span> 15 \2\2014</span></h3>
<p>Butterfly is a modern psd theme madeto look awesome on any size of screen. single page templet for creative agency</p>
<ul class="post-share list-unstyled list-inline text-right">
<li><a href="#"><span class="post-chat-icon"> </span></a></li>
<li><a href="#"><span class="post-heart-icon"> </span></a></li>
</ul>
</div>
</div>
</div>
</div>
</div>
<!----//End-post-grids---->
<!----start-get-in-touch---->
<div id="contact" class="get-in-touch">
<div class="container">
<div class="text-center div-head">
<h2>GET IN TOUCH</h2>
<p>Feel free to contact us in any time</p>
<ul class="list-unstyled list-inline get-share text-center">
<li><a href="#"><span class="face"> </span> </a></li>
<li><a href="#"><span class="twitt"> </span> </a></li>
<li><a href="#"><span class="gplus"> </span> </a></li>
<li><a href="#"><span class="you"> </span> </a></li>
<li><a href="#"><span class="in"> </span> </a></li>
<li><a href="#"><span class="be"> </span> </a></li>
<li><a href="#"><span class="ta"> </span> </a></li>
</ul>
</div>
<div class="col-md-7 text-center text-boxs">
<form>
<input type="text" placeholder="Name" required />
<input type="text" placeholder="Email" required />
<textarea>Message</textarea>
<input type="submit" value=" " />
</form>
</div>
<div class="col-md-5 address">
<h3>BUTTER FLY</h3>
<p>Aweasome creative agency asingle templet page feel free to contact us we will help you in any time.</p>
<ul class="list-unstyled list-inline">
<li><a href="#"> <span class="map-pin"> </span></a></li>
<li><p> Mansoura , Egypt . <br /> El nile st , near university .</p></li>
</ul>
<ul class="list-unstyled list-inline">
<li><a href="#"> <span class="mobile"> </span></a></li>
<li><p>+ 01012426202</p></li>
</ul>
<ul class="list-unstyled list-inline">
<li><a href="#"> <span class="msg"> </span></a></li>
<li><p> <a href="#">info@butterfly.com</a></p></li>
</ul>
</div>
</div>
</div>
<!----//End-get-in-touch---->
<!----start-nav-links---->
<div class="navgation-links">
<a name="menu"> </a>
<ul>
<li class="active"><a href="#home">Home</a></li>
<li class="page-scroll"><a href="#about">About</a></li>
<li class="page-scroll"><a href="#skills">Skills</a></li>
<li class="page-scroll"><a href="#port">Portfolio</a></li>
<li class="page-scroll"><a href="#team">Team</a></li>
<li class="page-scroll"><a class="subNavBtn" href="#blog">Blog</a></li>
<li class="page-scroll"><a href="#contact">Contact</a></li>
</ul>
</div>
<!----start-nav-links---->
<!----start-copy-right--->
<div class="copy-right text-center">
<p>Template By <a href="http://w3layouts.com/">W3layouts</a></p>
</div>
<a href="#top" id="toTop" style="display: block;"><span id="toTopHover" style="opacity: 1;"> </span></a>
<!----//End-copy-right--->
<!----//End-container---->
</body>
</html>