<!DOCTYPE html>
<html lang="en">
<!--[if IE 7]><html lang="en" class="ie7"><![endif]-->
<!--[if IE 8]><html lang="en" class="ie8"><![endif]-->
<!--[if IE 9]><html lang="en" class="ie9"><![endif]-->
<!--[if (gt IE 9)|!(IE)]><html lang="en"><![endif]-->
<!--[if !IE]><html lang="en"><![endif]-->
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<title>Absolute - Responsive One Page Theme</title>
<!-- Fonts -->
<link href="#css?family=Source+Sans+Pro:300,400,400italic,700" rel="stylesheet" type="text/css">
<!-- Essential stylesheets -->
<link rel="stylesheet" href="css/lib/font-awesome.min.css">
<link rel="stylesheet" href="css/lib/magnific-popup.css">
<link rel="stylesheet" href="css/lib/bxslider.css">
<link rel="stylesheet" href="css/lib/owl.carousel.css">
<link rel="stylesheet" href="css/lib/owl.theme.css">
<link rel="stylesheet" href="css/lib/base.css">
<!-- The stylesheet -->
<link rel="stylesheet" href="css/style.css">
<!-- The favicon -->
<link rel="shortcut icon" href="images/favicon.ico">
<script src="js/lib/modernizr.js"></script>
<!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
</head>
<body>
<!-- Top of the page -->
<div id="top"></div>
<!-- Top bar -->
<div class="top-bar tb-large tb-transp">
<div class="row">
<div class="twelve col">
<!-- Symbolic or typographic logo -->
<div class="tb-logo">
<h1><a href="#home" class="scrollto">Absolute</a></h1>
</div>
<!-- Menu toggle -->
<input type="checkbox" id="toggle" />
<label for="toggle" class="toggle"></label>
<!-- Menu items -->
<nav class="menu">
<ul>
<li><a href="#home" class="scrollto">Home</a></li>
<li><a href="#about" class="scrollto">About</a></li>
<li><a href="#work" class="scrollto">Work</a>
<li><a href="#services" class="scrollto">Services</a></li>
<li><a href="#process" class="scrollto">Process</a></li>
<li><a href="#team" class="scrollto">Our Team</a></li>
<li><a href="#contact" class="scrollto">Contact</a></li>
</ul>
</nav>
</div>
</div>
</div>
<!-- Home static background -->
<section id="home" class="home">
<div class="header large bg-img fixed background-one">
<div class="header-inner">
<!-- Content -->
<h2 class="bigtext text-white uber mb0">Absolute</h2>
<h6 class="serif bigtext text-white">Let Me Tell You Something</h6>
<a class="scrollto btn outline light grid-mt grid-ms" href="#about">LEARN MORE</a>
</div>
</div>
</section>
<div class="copyrights">Collect from <a href="http://www.moobnn.com/" >企业网站模板</a></div>
<!-- Introduction -->
<section id="about" class="about">
<!-- Title text -->
<div class="row">
<div class="eight col center text-center">
<h3>About Us</h3>
</div>
</div>
<!-- Icon navigation -->
<div class="row equal">
<!-- Icon -->
<div class="three col medium-three col small-six col">
<div class="icon-nav">
<a href="#" class="scrollto">
<i class="fa fa-desktop"></i>
<b>Professional Design </b>
<em>Contrary to popular belief, Lorem Ipsum is not simply random text.</em>
</a>
</div>
</div>
<!-- Icon -->
<div class="three col medium-three col small-six col">
<div class="icon-nav">
<a href="#" class="scrollto">
<i class="fa fa-comments-o"></i>
<b>Retina Ready</b>
<em>Contrary to popular belief, Lorem Ipsum is not simply random text.</em>
</a>
</div>
</div>
<!-- Icon -->
<div class="three col medium-three col small-six col">
<div class="icon-nav">
<a href="#" class="scrollto">
<i class="fa fa-gears"></i>
<b>7x24 Support</b>
<em>Contrary to popular belief, Lorem Ipsum is not simply random text.</em>
</a>
</div>
</div>
<!-- Icon -->
<div class="three col medium-three col small-six col">
<div class="icon-nav">
<a href="#" class="scrollto">
<i class="fa fa-flask"></i>
<b>Clean Coding</b>
<em>Contrary to popular belief, Lorem Ipsum is not simply random text.</em>
</a>
</div>
</div>
<div class="three col medium-three col small-six col">
<div class="icon-nav">
<a href="#" class="scrollto">
<i class="fa fa-tablet"></i>
<b>Responsive Design</b>
<em>Contrary to popular belief, Lorem Ipsum is not simply random text.</em>
</a>
</div>
</div>
<!-- Icon -->
<div class="three col medium-three col small-six col">
<div class="icon-nav">
<a href="#" class="scrollto">
<i class="fa fa-trophy"></i>
<b>Winning Award Theme</b>
<em>Contrary to popular belief, Lorem Ipsum is not simply random text.</em>
</a>
</div>
</div>
<!-- Icon -->
<div class="three col medium-three col small-six col">
<div class="icon-nav">
<a href="#" class="scrollto">
<i class="fa fa-thumbs-o-up"></i>
<b>Easy Customize</b>
<em>Contrary to popular belief, Lorem Ipsum is not simply random text.</em>
</a>
</div>
</div>
<!-- Icon -->
<div class="three col medium-three col small-six col">
<div class="icon-nav">
<a href="#" class="scrollto">
<i class="fa fa-cloud-download"></i>
<b>Free Download</b>
<em>Contrary to popular belief, Lorem Ipsum is not simply random text.</em>
</a>
</div>
</div>
</div>
</section>
<!-- Work -->
<section id="work" class="work section-slider">
<!-- Title text -->
<div class="row">
<div class="eight col center text-center">
<h3>Work</h3>
</div>
</div>
<!-- Work slider -->
<div class="row relative">
<div class="owlcarousel work-slider">
<!-- Work item -->
<div class="grid-ms">
<div class="overlay-item">
<a class="popup-gallery" href="images/portfolio-thumb-1.jpg">
<span class="o-hover">
<span>
<i class="fa fa-image fa-2x"></i>
</span>
</span>
<img src="images/portfolio-thumb-1.jpg" alt="portfolio-thumb-1" class="responsive-img">
</a>
</div>
<div class="e-info">
<h3>Web Design</h3>
<p>HTML</p>
</div>
</div>
<!-- Work item -->
<div class="grid-ms">
<div class="overlay-item">
<a class="popup-gallery" href="images/portfolio-thumb-2.jpg">
<span class="o-hover">
<span>
<i class="fa fa-image fa-2x"></i>
</span>
</span>
<img src="images/portfolio-thumb-2.jpg" alt="portfolio-thumb-2" class="responsive-img">
</a>
</div>
<div class="e-info">
<h3>Web Design</h3>
<p>HTML</p>
</div>
</div>
<!-- Work item -->
<div class="grid-ms">
<div class="overlay-item">
<a class="popup-gallery" href="images/portfolio-thumb-3.jpg">
<span class="o-hover">
<span>
<i class="fa fa-image fa-2x"></i>
</span>
</span>
<img src="images/portfolio-thumb-3.jpg" alt="portfolio-thumb-3" class="responsive-img">
</a>
</div>
<div class="e-info">
<h3>Web Design</h3>
<p>HTML</p>
</div>
</div>
<!-- Work item -->
<div class="grid-ms">
<div class="overlay-item">
<a class="popup-gallery" href="images/portfolio-thumb-4.jpg">
<span class="o-hover">
<span>
<i class="fa fa-image fa-2x"></i>
</span>
</span>
<img src="images/portfolio-thumb-4.jpg" alt="portfolio-thumb-4" class="responsive-img">
</a>
</div>
<d