<!--A Design by W3layouts
Author: W3layout
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>The Coorp 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="Coorp 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" />
<link href='http://fonts.googleapis.com/css?family=Open+Sans:400,300,600,700,800' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Open+Sans+Condensed:300' rel='stylesheet' type='text/css'>
<script src="smartphone/js/jquery-1.9.1.min.js"></script>
<script src="smartphone/js/mobile.js"></script>
</script><script type="text/javascript">window.onload = function() { w3Init(); };</script>
<script src="smartphone/js/hover_pack.js"></script>
<!---strat-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>
<!---//end-slider---->
<script type="text/javascript" src="smartphone/js/jquery.openCarousel.js"></script>
<script src="smartphone/js/easyResponsiveTabs.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function () {
$('#horizontalTab').easyResponsiveTabs({
type: 'default', //Types: default, vertical, accordion
width: 'auto', //auto or any width like 600px
fit: true // 100% fit in a container
});
});
</script>
</head>
<body>
<div class="top-header">
<p class="m_1">0-800-3456-5558<span class="m_2"> office hours from 8am-6pm</span></p>
<div class="clear"> </div>
</div>
<div class="bottom-header">
<div id="w3-masthead">
<div id="w3-universal-nav">
<ul id="header-top">
<a href="index.html"><img src="smartphone/images/logo.png" alt=""/></a>
</ul>
<div id="w3-mobile-options">
<li id="w3-menu-trigger">
<a href="">Menu</a></li>
<li id="w3-search-trigger">
<a href="#">Search</a>
</li>
</div>
<ul id="w3-menu-links" style="display: none;">
<li><a href="index.html">About</a></li>
<li><a href="topics.html">Topics</a></li>
<li><a href="community.html">Community</a></li>
<li><a href="contact.html">Contact</a></li>
</ul>
<div id="w3-search-module" style="display: none;">
<form id="w3-search-form" action="/Search/" method="get">
<p>
<label for="q">
<span class="w3-access">Search</span>
</label>
<input accesskey="s" type="text" maxlength="100" value="" name="q" id="q"><input type="hidden" value="17" name="v">
<input type="hidden" value="utf" name="en"><input type="hidden" value="en" name="lang">
<input type="hidden" value="in" name="cc">
<input type="submit" id="w3-search" class="w3-btn-search" value="Submit" name="Submit">
</p>
</form>
</div>
</div>
</div>
</div>
<div class="slider">
<!---start-da-slider----->
<div id="da-slider" class="da-slider">
<div class="da-slide">
<h1>Important <span class="m_3">image</span> related</h1>
<a href="#about" class="da-link">Read More</a>
</div>
<div class="da-slide">
<h1>Important <span class="m_3">image</span> related</h1>
<a href="#about" class="da-link">Read More</a>
</div>
<div class="da-slide">
<h1>Important <span class="m_3">image</span> related</h1>
<a href="#about" class="da-link">Read More</a>
</div>
<div class="da-slide">
<h1>Important <span class="m_3">image</span> related</h1>
<a href="#about" class="da-link">Read More</a>
</div>
</div>
</div>
<div class="main">
<div class="content-top">
<div class="row content_grid1">
<div class="col-md-4 popular_topics">
<ul class="topic_grid">
<li class="list1"><i class="speech"> </i><h3 class="m_3">Popular <span class="m_4">Topics</span></h3><div class="clear5"></div></li>
<li class="list2"><a href="#">The most popular topic</a>
<form action="" class="sky-form">
<fieldset>
<section>
<div class="rating">
<input type="radio" name="stars-rating" id="stars-rating-5">
<label for="stars-rating-5"><i class="icon-star"></i></label>
<input type="radio" name="stars-rating" id="stars-rating-4">
<label for="stars-rating-4"><i class="icon-star"></i></label>
<input type="radio" name="stars-rating" id="stars-rating-3">
<label for="stars-rating-3"><i class="icon-star"></i></label>
<input type="radio" name="stars-rating" id="stars-rating-2">
<label for="stars-rating-2"><i class="icon-star"></i></label>
<input type="radio" name="stars-rating" id="stars-rating-1">
<label for="stars-rating-1"><i class="icon-star"></i></label>
</div>
</section>
</fieldset>
</form>
</li>
<li class="list3"><a href="#">Social media awareness</a>
<p class="list_desc">Lorem ipsum dolor sit amet, consectetuer</p>
</li>
<li class="list4"><a href="#">Cloud computing</a>
<p class="list_desc">Lorem ipsum dolor sit amet, consectetuer</p>
</li>
</ul>
</div>
<div class="col-md-4 popular_topics1">
<ul class="topic_grid">
<li class="list1"><i class="book"> </i><h3 class="m_3">Recent <span class="m_4">Posts</span></h3><div class="clear5"></div></li>
</ul>
<div class="menu_vertical">
<section class="accordation_menu">
<div>
<input id="label-1" name="lida" type="radio" checked/>
<label for="label-1" id="item1"><i class="ferme"> </i>By <span class="m_5">lorem ipsum</span> / 5 Comments<i class="icon-plus-sign i-right1"></i><i class="icon-minus-sign i-right2"></i></label>
<div class="content" id="a1">
<ul class="news_list">
<li class="date">
09<br><span class="highlight">May</span><br><span class="light_color">2014</span>
</li>
<li class="date_desc">
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</p>
</li>
<div class="clear"> </div>
</ul>
</div>
</div>
<div>
<input id="label-2" name="lida" type="radio"/>
<label for="label-2" id="item2"><i class="icon-leaf" id="i2"></i>By <span class="m_5">lorem ipsum</span> / 5 Comments<i class="icon-plus-sign i-right1"></i><i class="icon-minus-sign i-right2"></i></label>
<div class="content" id="a2">
<ul class="news_list">
<li class="date">
09<br><span class="highlight">May</span><br><span class="light_color">2014</span>
</li>
<li class="date_desc">
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet.</p>
</li>
<div class="clear"> </div>
</ul>
</div>
</div>
</section>
</div>
</div>
</div>
</div>
<div class="content_middle">
<div class="content_middle_desc">
<h3>Any specific call out text <span class="m_8">goes here!</span></h3>
<p>Enter your email addressa and we'll contact you.</p>
<div class="content_search"><span class="left_line1"> </span> <input type="text" value="">
<input type="submit" value="Sign up"><span class="right_line1"> </span></div>
</div>
</div>
<div class="content_middle-bottom">
<div class="row">
<div class="col-md-3 bottom_grid1">
<a href="single.html" class="b-link-diagonal b-animate-go thickbox">
<img src="smartphone/images/pic1.jpg" class="img-responsive" alt=""/><div class="b-wrapper"><h2 class="b-animate b-from-left b-delay03 "><img src="smartphone/images/hover_search.png" alt=""/></h2><p class="b-animate b-from-right b-delay03 "> </p></div></a>
<div class="grid_desc">
<h4><a href="#">Admits only one person</a></h4>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh.</p>
</div>
</div>
<div class="col-md-3 bottom_grid1">
<a href="single.html" class="b-link-diagonal b-animate-go thickbox">
<img src="smartphone/images/pic2.jpg" class="img-responsive" alt=""/><div class="b-wrapper"><h2 class="b-animate b-from-left b-delay03 "><img src="smartphone/images/hover_search.png" alt=""/></h2><p class="b-animate b-from-right b-delay03 "> </p></div></a>
<div class="grid_desc">
<h4><a href="#">Find the perfect place</a></h4>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh.</p>
</div>
</div>
<div class="col-md-3 bottom_grid1">
<a href="single.html" class="b-link-diagonal b-animate-go thickbox">
<img src="smartphone/images/pic3.jpg" class="img-responsive" alt=""/><div class="b-wrapper"><h2 class="b-animate b-from-left b-delay03 "><img src="smartphone/images/hover_search.png" alt=""/></h2><p class="b-animate b-from-right b-delay03 "> </p></div></a>
<div class="grid_desc">
<h4><a href="#">The perfect DNA</a></h4>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh.</p>
</div>
</div>
<div class="col-md-3 bottom_grid2">
<a href="#" class="b-link-diagonal b-animate-go thickbox">
<img src="smartphone/images/pic4.jpg" class="img-responsive" alt=""/><div class="b-wrapper"><h2 class="b-animate b-from-left b-delay03 "><img src="smartphone/images/hover_search.png" alt=""/></h2><p class="b-animate b-from-right b-delay03 "> </p></div></a>
<div class="grid_desc">
<h4><a href="#">Creative innovative person</a></h4>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh.</p>
</div>
</div>
</div>
</div>
<div class="tweets">
<div class="row">
<div class="col-md-5 tweet_grid">
<h3 class="m_9">Latest <span class="m_10">Tweets</span></h3><span class="follow"><a href="#">+ Follow Us</a></span><div class="clear"></div>
<ul class="tweet_list">
<div class="tweet_list-top"><li><a href="#">Lorem ipsum dolor sit amet, consectetuer <span class="m_11">@adipiscing</span> elit, sed</a></li>
<div class="m_12"><span class="left_line2"> </span><div class="hour"><p>12h ago</p></div><span class="right_line2"> </span></div></div>
<div class="tweet_list-top"><li><a href="#">diam nonummy nibh euismod <span class="m_11">dolor sit </span> amet, consectetuer @adipiscing</a></li>
<div class="m_12"><span class="left_line2"> </span><div class="hour"><p>12h ago</p></div><span class="right_line2"> </span></div></div>
</ul>
<h3 class="m_15">Useful <span class="m_16">Links</span></h3>
<ul class="useful_list">
<li><a href="#">nostrud exerci tation ullamcorper suscipit</a></li>
<li><a href="#">Lorem ipsum dolor sit amet, consectetuer</a></li>
<li><a href="#">soluta nobis eleifend option congue nihil</a></li>
</ul>
</div>
<div class="col-md-7">
<h3 class="m_13"><span class="m_14">Why </span> Sign up with coorp?</h3>
<div class="sap_tabs">
<div id="horizontalTab" style="display: block; width: 100%; margin: 0px;">
<ul class="resp-tabs-list">
<li class="resp-tab-item" aria-controls="tab_item-0" role="tab"><span>Free Updates</span></li>
<li class="resp-tab-item" aria-controls="tab_item-1" role="tab"><span>Content</span></li>
<li class="resp-tab-item" aria-controls="tab_item-2" role="tab"><span>International</span></li>
<li class="resp-tab-item" aria-controls="tab_item-3" role="tab"><span>Commodities</span></li>
<div class="clear"></div>
</ul>
<div class="resp-tabs-container">
<div class="tab-1 resp-tab-content" aria-labelledby="tab_item-0">
<div class="facts">
<h4><a href="#">Lorem ipsum dolor sit amet</a></h4>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam.</p>
<ul class="tab_list">
<li><a href="#">diam nonummy nibh euismod</a></li>
<li><a href="#">hendrerit in vulputate velit</a></li>
</ul>
</div>
</div>
<div class="tab-2 resp-tab-content" aria-labelledby="tab_item-1">
<div class="facts">
<h4><a href="#">Lorem ipsum dolor sit amet</a></h4>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam.</p>
<ul class="tab_list">
<li><a href="#">diam nonummy nibh euismod</a></li>
<li><a href="#">hendrerit in vulputate velit</a></li>
<li><a href="#">diam nonummy nibh euismod</a></li>
</ul>
</div>
</div>
<div class="tab-3 resp-tab-content" aria-labelledby="tab_item-2">
<div class="facts">
<h4><a href="#">Lorem ipsum dolor sit amet</a></h4>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam.</p>
<ul class="tab_list">
<li><a href="#">diam nonummy nibh euismod</a></li>
<li><a href="#">hendrerit in vulputate velit</a></li>
</ul>
</div>
</div>
<div class="tab-4 resp-tab-content" aria-labelledby="tab_item-3">
<div class="facts">
<h4><a href="#">Lorem ipsum dolor sit amet</a></h4>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam.</p>
<ul class="tab_list">
<li><a href="#">diam nonummy nibh euismod</a></li>
<li><a href="#">hendrerit in vulputate velit</a></li>
<li><a href="#">diam nonummy nibh euismod</a></li>
</ul>
</div>
</div>
</div>
</div>
</div>
<ul class="quotation">
<i class="quot"> </i>
<p class="m_17">seacula quarta decima et quinta decima. Eodem modo typi, qui nunc nobis videntu.</p>
<div class="clear"></div>
<div class="m_12"><span class="left_line2"> </span><div class="quot_view"><p>hendrerit in vulputate</p></div><span class="right_line2"> </span></div>
</ul>
</div>
</div>
</div>
</div>
<div class="footer">
<div class="row">
<div class="col-md-4">
<ul class="footer_list">
<li><i class="phone"> </i><p class="ph-no">0-800-200-2564 - From 8am-6pm</p> <div class="clear"></div></li>
<li><i class="pin"> </i><p class="ph-no">2536., lorem ipsum</p> <div class="clear"></div></li>
<li><i class="msg"> </i><p class="address">contact@coorp.com</p> <div class="clear"></div></li>
</ul>
</div>
<div class="col-md-8 footer_box">
<ul class="footer_list1">
<h4 class="m_7">About</h4>
<li><a href="#">nonummy euismod</a></li>
<li><a href="#">hendrerit vul</a></li>
<li><a href="#">quod mazim</a></li>
</ul>
<ul class="footer_list1">
<h4 class="m_7">Topics</h4>
<li><a href="#">Mirum est</a></li>
<li><a href="#">parum claram</a></li>
<li><a href="#">nunc nobis</a></li>
<li><a href="#">placerat facer</a></li>
</ul>
<ul class="footer_list1">
<h4 class="m_7">Community</h4>
<li><a href="#">quinta decima</a></li>
<li><a href="#">hendrerit in</a></li>
<li><a href="#">augue duis </a></li>
</ul>
<ul class="footer_list1">
<h4 class="m_7">Schedule</h4>
<li><a href="#">Mirum est</a></li>
<li><a href="#">parum claram</a></li>
<li><a href="#">nunc nobis</a></li>
<li><a href="#">placerat facer</a></li>
</ul>
<div class="clear"></div>
</div>
</div>
</div>
<div class="footer_bottom">
<ul class="footer_bottom-list">
<li><a href="#">Terms of use</a></li>
<li><a href="#">Privacy policy</a></li>
<li><a href="#">FAQs</a></li>
</ul>
<div class="copy">
<p>© 2014 Template by <a href="http://w3layouts.com" target="_blank"> w3layouts</a></p>
</div>
<div class="clear"></div>
</div>
</body>
</html>