<!DOCTYPE HTML>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="user-scalable=no, initial-scale=1.0, maximum-scale=1.0 minimal-ui"/>
<meta name="apple-mobile-web-app-capable" content="yes"/>
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<link rel="apple-touch-icon-precomposed" sizes="114x114" href="images/splash/splash-icon.png">
<link rel="apple-touch-startup-image" href="images/splash/splash-screen.png" media="screen and (max-device-width: 320px)" />
<link rel="apple-touch-startup-image" href="images/splash/splash-screen_402x.png" media="(max-device-width: 480px) and (-webkit-min-device-pixel-ratio: 2)" />
<link rel="apple-touch-startup-image" sizes="640x1096" href="images/splash/splash-screen_403x.png" />
<link rel="apple-touch-startup-image" sizes="1024x748" href="images/splash/splash-screen-ipad-landscape" media="screen and (min-device-width : 481px) and (max-device-width : 1024px) and (orientation : landscape)" />
<link rel="apple-touch-startup-image" sizes="768x1004" href="images/splash/splash-screen-ipad-portrait.png" media="screen and (min-device-width : 481px) and (max-device-width : 1024px) and (orientation : portrait)" />
<link rel="apple-touch-startup-image" sizes="1536x2008" href="images/splash/splash-screen-ipad-portrait-retina.png" media="(device-width: 768px) and (orientation: portrait) and (-webkit-device-pixel-ratio: 2)"/>
<link rel="apple-touch-startup-image" sizes="1496x2048" href="images/splash/splash-screen-ipad-landscape-retina.png" media="(device-width: 768px) and (orientation: landscape) and (-webkit-device-pixel-ratio: 2)"/>
<title>Landor����������Ӧ��Ӧʽhtml5�ֻ�wap��վģ������-����ģ�塾http://www.htmldivcss.com/��</title>
<link href="styles/style.css" rel="stylesheet" type="text/css">
<link href="styles/framework.css" rel="stylesheet" type="text/css">
<link href="styles/owl.theme.css" rel="stylesheet" type="text/css">
<link href="styles/swipebox.css" rel="stylesheet" type="text/css">
<link href="styles/font-awesome.css" rel="stylesheet" type="text/css">
<link href="styles/animate.css" rel="stylesheet" type="text/css">
<script type="text/javascript" src="scripts/jquery.js"></script>
<script type="text/javascript" src="scripts/jqueryui.js"></script>
<script type="text/javascript" src="scripts/framework.plugins.js"></script>
<script type="text/javascript" src="scripts/custom.js"></script>
</head>
<body class="page-background">
<div id="preloader">
<div id="status">
<p class="center-text">
Loading the content...
<em>Loading depends on your connection speed!</em>
</p>
</div>
</div>
<ul class="menu">
<li><a href="index.html"><i class="fa fa-home"></i>Homepage<i class="fa fa-circle"></i></a></li>
<li>
<a class="has-submenu" href="#"><i class="fa fa-cog"></i>Features<i class="fa active-plus fa-plus"></i></a>
<ul class="submenu show-submenu">
<li><a href="features-type.html"><i class="fa fa-angle-right"></i>Type Features<i class="fa fa-circle"></i></a></li>
<li class="active-menu"><a href="features-jquery.html"><i class="fa fa-angle-right"></i>jQuery Features<i class="fa fa-circle"></i></a></li>
<li><a href="features-others.html"><i class="fa fa-angle-right"></i>Other Features<i class="fa fa-circle"></i></a></li>
</ul>
</li>
<li>
<a class="has-submenu" href="#"><i class="fa fa-files-o"></i>Pages<i class="fa fa-plus"></i></a>
<ul class="submenu">
<li><a href="page-error.html"><i class="fa fa-angle-right"></i>404 Page<i class="fa fa-circle"></i></a></li>
<li><a href="page-soon.html"><i class="fa fa-angle-right"></i>Soon Page<i class="fa fa-circle"></i></a></li>
<li><a href="page-profile.html"><i class="fa fa-angle-right"></i>Profile Page<i class="fa fa-circle"></i></a></li>
<li><a href="page-login.html"><i class="fa fa-angle-right"></i>Login Page<i class="fa fa-circle"></i></a></li>
<li><a href="page-updates.html"><i class="fa fa-angle-right"></i>Updates Page<i class="fa fa-circle"></i></a></li>
<li><a href="page-timeline.html"><i class="fa fa-angle-right"></i>Timeline Page<i class="fa fa-circle"></i></a></li>
</ul>
</li>
<li>
<a class="has-submenu" href="#"><i class="fa fa-camera"></i>Gallery<i class="fa fa-plus"></i></a>
<ul class="submenu">
<li><a href="gallery-round.html"><i class="fa fa-angle-right"></i>Round Gallery<i class="fa fa-circle"></i></a></li>
<li><a href="gallery-square.html"><i class="fa fa-angle-right"></i>Square Galery<i class="fa fa-circle"></i></a></li>
</ul>
</li>
<li>
<a class="has-submenu" href="#"><i class="fa fa-picture-o"></i>Portfolio<i class="fa fa-plus"></i></a>
<ul class="submenu">
<li><a href="portfolio-one.html"><i class="fa fa-angle-right"></i>One Column<i class="fa fa-circle"></i></a></li>
<li><a href="portfolio-two.html"><i class="fa fa-angle-right"></i>Two Columns<i class="fa fa-circle"></i></a></li>
</ul>
</li>
<li><a href="contact.html"><i class="fa fa-envelope-o"></i>Contact<i class="fa fa-circle"></i></a></li>
<li><a class="close-menu" href="#"><i class="fa fa-times"></i>Close<i class="fa fa-circle"></i></a></li>
</ul>
<div class="page-content">
<div class="page-header">
<a href="#" class="header-logo"></a>
<em class="logo-subtitle">
The way to show off your<br>
product on your mobile or tablet.
</em>
</div>
<div class="page-navigation-icons">
<a href="#" class="facebook"><i class="fa fa-facebook"></i></a>
<a href="#" class="navigation"><i class="fa fa-navicon"></i></a>
<a href="#" class="twitter"><i class="fa fa-twitter"></i></a>
</div>
<div class="content">
<div class="decoration"></div>
<div class="container no-bottom">
<h3>Mobile style switches!</h3>
<p>
Switches styled to bring a more natural feel to your mobile website with a native design.
</p>
</div>
<div class="decoration hide-if-responsive"></div>
<div class="one-third-responsive">
<!-- iOS Styled Toggles -->
<div class="container switch-box">
<h4>iOS Style 1</h4>
<a href="#" class="switch switch-1 switch-1-on">
<em>I</em>
<span></span>
<em>0</em>
</a>
<em class="switch-box-subtitle">
Optional subtitle can be added here, this message automatically hides when the content is shown!
</em>
<div class="switch-box-content">
<p class="no-bottom">
Switches can be used as content toggles, where you can add almost every feature from the page inside of them.
We also provided the styles, so if you want you can even convert these to checkboxes. By default, they function
as content toggles! An extra style for your device!
</p>
</div>
</div>
<div class="container switch-box">
<h4>iOS Style 2</h4>
<a href="#" class="switch-icon switch-1 switch-1-on">
<em><i class="fa fa-times"></i></em>
<span></span>
<em><i class="fa