<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Green Template</title>
<link href='http://fonts.googleapis.com/css?family=Roboto:400,300,900,700' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Roboto+Slab:400,700' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="http://cdn.raulvalverde.com/css/reset.css" type="text/css" media="screen" />
<link rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.1.0/css/font-awesome.min.css" type="text/css" />
<link rel="stylesheet" href="css/main.css" type="text/css" media="screen" />
<script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/jquery.cycle2/20140216/jquery.cycle2.min.js"></script>
<script type="text/javascript" src="js/tinynav.min.js"></script>
<script type="text/javascript" src="js/main.js"></script>
</head>
<body>
<div id="container">
<header id="header">
<div class="width">
<div class="block">
<div class="logo">
<a href="#"><img alt="" src="images/logo.png" /></a>
</div>
<nav class="menu">
<ul id="nav">
<li class="active"><a href="#">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Services</a></li>
<li><a href="#">Work</a></li>
<li><a href="#">Contact</a></li>
</ul>
</nav>
</div>
</div>
</header>
<section>
<div class="title">
<div class="width">
<h1>Praesent Pacerat Risus Quis Eros</h1>
<h2>Integer vitae liberoac</h2>
</div>
</div>
<div id="slider">
<div class="width">
<div class="cycle-slideshow" data-cycle-fx="scrollHorz" data-cycle-timeout="0" data-cycle-prev="#prev" data-cycle-next="#next">
<img src="images/slider.jpg" />
<img src="images/slider.jpg" />
<img src="images/slider.jpg" />
</div>
<div class="pagenavi">
<span id="prev"><<Prev </span>
<span id="next"> Next>></span>
</div>
</div>
</div>
<div class="width">
<div id="featured" class="block">
<div class="item">
<span><i class="fa fa-dropbox"></i></span>
<h3>Corem icsum dol</h3>
<p>Duis aute irure</p>
</div>
<div class="item">
<span><i class="fa fa-graduation-cap"></i></span>
<h3>Nunc dignis sim</h3>
<p>Integer vitae lib</p>
</div>
<div class="item">
<span><i class="fa fa-paper-plane"></i></span>
<h3>Ras ornare tristi</h3>
<p>Vestibul commo</p>
</div>
<div class="item">
<span><i class="fa fa-cubes"></i></span>
<h3>Praesent placera</h3>
<p>Fusce lobortis lor</p>
</div>
</div>
<div id="blog">
<div class="post block">
<img alt="" src="images/post.jpg" class="alignright medium" />
<h2><a href="#">Donec nec justo <br />facilisis fermentum Aliqua</a></h2>
<h3>Cliquam erat volutpat nam duimi</h3>
<div class="item">
<h4><strong>Corem icsum doletac</strong></h4>
<p>Sed egestas, ante et vulputate volutpat, eros pede semper est, vitae luctus metus libero eu augue. Morbi purus libero, faucibus adipiscing, commodo quis, gravida id, est. Sed lectus. Praesent elementum hendrerit tortor. Sed semper lorem at felis. Vestibulum volutpat, lacus a ultrices sagittis lorem simorpitn lorem ipsum dolor vivamus laoreet vestibut raso ornate preasent placet...</p>
</div>
<p class="more"><a href="#">More</a></p>
</div>
</div>
<div id="search" class="block">
<h2>Preasent dapibus neque cursu</h2>
<form>
<input type="text" placeholder="enter email id ..." /> <input type="submit" value="Subscribe" />
</form>
</div>
<div id="options" class="block">
<div class="left">
<div id="tabs">
<ul>
<li><a href="#one">Tab One</a></li>
<li><a href="#two">Tab Two</a></li>
<li><a href="#three">Tab Three</a></li>
</ul>
<div id="one" class="content">
<div class="thumb">
<img alt="" src="images/thumb.jpg" class="alignleft" />
</div>
<div class="excerpt">
<h4><a href="#">Facibus Tortor</a></h4>
<p>Sed lectus. Praesent elementum hendrerit tortor. Sed semper lorem at felis. Vestibulum volutpat, lacus a ultrices sagittis lorem simorpitn lorem ipsum dolor vivamus</p>
<p class="more"><a href="#">More</a></p>
</div>
</div>
<div id="two" class="content">
<div class="thumb">
<img alt="" src="images/thumb.jpg" class="alignleft" />
</div>
<div class="excerpt">
<h4><a href="#">Facibus Tortor</a></h4>
<p>Sed lectus. Praesent elementum hendrerit tortor. Sed semper lorem at felis. Vestibulum volutpat, lacus a ultrices sagittis lorem simorpitn lorem ipsum dolor vivamus</p>
<p class="more"><a href="#">More</a></p>
</div>
</div>
<div id="three" class="content">
<div class="thumb">
<img alt="" src="images/thumb.jpg" class="alignleft" />
</div>
<div class="excerpt">
<h4><a href="#">Facibus Tortor</a></h4>
<p>Sed lectus. Praesent elementum hendrerit tortor. Sed semper lorem at felis. Vestibulum volutpat, lacus a ultrices sagittis lorem simorpitn lorem ipsum dolor vivamus</p>
<p class="more"><a href="#">More</a></p>
</div>
</div>
</div>
</div>
<div class="right">
<div id="accordion">
<h3 class="title"><a href="#">Accordion One</a></h3>
<div class="content">
<h4><a href="#">Aliquam egestatus</a></h4>
<p>Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan</p>
</div>
<h3 class="title"><a href="#">Accordion Two</a></h3>
<div class="content">
<h4><a href="#">Aliquam egestatus</a></h4>
<p>Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan</p>
</div>
<h3 class="title"><a href="#">Accordion Three</a></h3>
<div class="content">
<h4><a href="#">Aliquam egestatus</a></h4>
<p>Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan</p>
</div>
</div>
</div>
</div>
</div>
</section>
</div>
<footer id="footer">
<div id="footer">
<div class="width">
<div class="block">
<div class="item">
<h3>Setlec tus</h3>
<ul>
<li><a href="#">Phasellus ultrices</a></li>
<li><a href="#">Sed adipiscing lipsum</a></li>
<li><a href="#">Nulla sed leoniton</a></li>
</ul>
</div>
<div class="item">
<h3>Volup ino</h3>
<ul>
<li><a href="#">Phasellus ultrices</a></li>
<li><a href="#">Sed adipiscing lipsum</a></li>
<li><a href="#">Nulla sed leoniton</a></li>
</ul>
</div>
<div class="item">
<h3>Dapi busin</h3>
<ul>
<li><a href="#">Phasellus ultrices</a></li>
<li><a href="#">Sed adipiscing lipsum</a></li>
<li><a href="#">Nulla sed leoniton</a></li>
</ul>
</div>
<div class="item">
<h3>Tinciunt uit</h3>
<ul>
<li><a href="#">Phasellus ultrices</a></li>
<li><a href="#">Sed adipiscing lipsum</a></li>
<li><a href="#">Nulla sed leoniton</a></li>
</ul>
</div>
<div class="item">
<h3>Prasen tis</h3>
<ul>
<li><a href="#">Phasellus ultrices</a></li>
<li><a href="#">Sed adipiscing lipsum</a></li>
<li><a href="#">Nulla sed leoniton</a></li>
</ul>
</div>
<div class="item">
<h3>Magna eros</h3>
<ul>
<li><a href="#">Phasellus ultrices</a></li>
<li><a href="#">Sed adipiscing lipsum</a></li>
<li><a href="#">Nulla sed leoniton</a></li>
</ul>
</div>
</div>
<p>Copyright(c) website name. Designed by: www.alltemplateneeds.com / Images from: http://wallpaperswide.com</p>
</div>
</div>
</footer>
</body>
</html>