<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>DesignPortfolio</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="">
<meta name="author" content="">
<!-- Styles -->
<link href='http://fonts.useso.com/css?family=Open+Sans:400,700' rel='stylesheet' >
<link href="css/bootstrap.css" rel="stylesheet">
<link href="css/responsive.bootstrap.css" rel="stylesheet">
<link href="css/screen.css" rel="stylesheet">
<!--[if lt IE 9]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<!-- Faviocon and touch -->
<link rel="apple-touch-icon-precomposed" sizes="144x144" href="#">
<link rel="apple-touch-icon-precomposed" sizes="114x114" href="#">
<link rel="apple-touch-icon-precomposed" sizes="72x72" href="#">
<link rel="apple-touch-icon-precomposed" href="#">
<link rel="shortcut icon" href="img/favicon/favicon.ico">
</head>
<body>
<!-- START SETTINGS BOX -->
<div class="customPanel customPanelClosed">
<div class="customPanelOptions">
Site Color<br />
<div class="customPanelOptionsPickerButton customPanelOptionsPickerButtonSite"></div>
<div style="clear:both;"></div>
</div>
<div class="customPanelOptionsPicker customPanelOptionsPickerBackground"></div>
<div class="customPanelOptionsPicker customPanelOptionsPickerSite"></div>
<div class="customPanelButton"></div>
</div>
<!-- END SETTINGS BOX -->
<header>
<div class="navTop">
<div class="container">
<div class="row">
<nav class="span12">
<ul class="clearfix unstyled pull-right">
<li>
<a href="#" title="twitter">Twitter</a>
</li>
<li>
<a href="#" title="Flckr">Flckr</a>
</li>
<li>
<a href="#" title="Facebook">Facebook</a>
</li>
<li>
<a href="#" title="Google+">Google+</a>
</li>
</ul>
</nav><!-- /nav -->
</div><!-- /.row [TopNavigation] -->
</div><!-- /.container -->
</div><!-- /.navTop -->
<div class="mainNav">
<div class="container">
<div class="row">
<div class="span4">
<a href="index-2.html" class="brand">Design Portfolio</a>
</div>
<nav class="span8 clearfix navbar-inner">
<a class="btn btn-color menuMobile" data-toggle="collapse" data-target=".nav-collapse">menu</a>
<div class="nav-collapse collapse">
<ul class="nav inline pull-right menu">
<li>
<a href="#">Home</a>
<ul class="unstyled">
<li><a href="index-2.html">Home default</a></li>
<li><a href="home_1.html">Home var1</a></li>
<li><a href="home_2.html">Home var2</a></li>
</ul>
</li>
<li class="active">
<a href="#">Pages</a>
<ul class="unstyled">
<li><a href="about_us.html">About us</a></li>
<li><a href="service.html">Services</a></li>
<li><a href="faq.html">Faq</a></li>
<li><a href="features.html">Features</a></li>
<li><a href="error_404.html">error 404</a></li>
<li><a href="full_width.html">Full width</a></li>
<li><a href="right_sidebar.html">Right sidebar</a></li>
<li><a href="left_sidebar.html">Left sidebar</a></li>
</ul>
</li>
<li>
<a href="#">GALLERY</a>
<ul class="unstyled">
<li><a href="gallery_2.html">Gallery 2 columns</a></li>
<li><a href="gallery_3.html">Gallery 3 columns</a></li>
<li><a href="gallery_4.html">Gallery 4 columns</a></li>
</ul>
</li>
<li>
<a href="#">PORTFOLIO</a>
<ul class="unstyled">
<li><a href="portfolio_2.html">Portfolio 2 columns</a></li>
<li><a href="portfolio_3.html">Portfolio 3 columns</a></li>
<li><a href="portfolio_4.html">Portfolio 4 columns</a></li>
</ul>
</li>
<li>
<a href="#">BLOG</a>
<ul class="unstyled">
<li><a href="blog_right_sidebar.html">Right sidebar</a></li>
<li><a href="blog_left_sidebar.html">Left sidebar</a></li>
<li><a href="blog.html">Full width</a></li>
<li><a href="blog_single_post.html">Single post</a></li>
</ul>
</li>
<li><a href="contacts.html">CONTACTS</a></li>
</ul>
</div>
</nav><!-- /nav.span6 [MainNavigation] -->
</div><!-- /.row [Logo, MainNavigation] -->
</div><!-- /.container -->
</div><!-- /.mainNav -->
</header><!-- /header -->
<div class="container-fluid topImage">
<div class="container">
<div class="row">
<div class="span12">
<h1>Features</h1>
</div>
</div>
<div class="row">
<div class="span12">
<ul class="breadcrumb">
<li><a href="#">Home</a> <span class="divider">/</span></li>
<li class="active">Features</li>
</ul>
</div>
</div>
</div><!-- /.container -->
</div><!-- /.container-fluid [topImage] -->
<div class="container">
<div class="row">
<div class="span12 headings">
<h1>Headings</h1>
<h1>H1 heading</h1>
<p>
Donec condimentum viverra rutrum. Etiam at cursus sem. Nullam ut ipsum urna, quis interdum libero. Fusce luctus lobortis velit, vitae aliquet ante lacinia et. Nunc venenatis porta arcu ut tempor. Aenean mollis tellus a risus lobortis a adipiscing lorem vehicula. In eget aliquam leo.
</p>
<h2>H1 heading</h2>
<p>
Donec condimentum viverra rutrum. Etiam at cursus sem. Nullam ut ipsum urna, quis interdum libero. Fusce luctus lobortis velit, vitae aliquet ante lacinia et. Nunc venenatis porta arcu ut tempor. Aenean mollis tellus a risus lobortis a adipiscing lorem vehicula. In eget aliquam leo.
</p>
<h3>H1 heading</h3>
<p>
Donec condimentum viverra rutrum. Etiam at cursus sem. Nullam ut ipsum urna, quis interdum libero. Fusce luctus lobortis velit, vitae aliquet ante lacinia et. Nunc venenatis porta arcu ut tempor. Aenean mollis tellus a risus lobortis a adipiscing lorem vehicula. In eget aliquam leo.
</p>
</div>
<div class="span12">
<hr>
</div>
</div><!-- /.row [headings] -->
<div class="row">
<div class="span12">
<h1>HTML style</h1>
<p>
Donec condimentum viverra rutrum. <em class="colored">Etiam at cursus sem.</em> Nullam ut ipsum urna, quis interdum libero. Fusce luctus lobortis velit, vitae aliquet ante lacinia et. Nunc venenatis porta arcu ut tempor. Aenean mollis tellus a risus lobortis a adipiscing lorem vehicula. In eget aliquam leo.
</p>
</div>
<div class="span12">
<hr>
</div>
</div><!-- /.row [htmlStyle] -->
<div class="row">
<div class="span12">
<h1>Testimonials</h1>
<blockquote>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus faucibus, metus vitae hendrerit porttitor, felis nulla aliquet nisi, eget pretium justo velit eu ipsum. Fusce id lorem enim. Aliquam in rhoncus ipsum. Etiam purus justo, aliquet ac fermentum scelerisque, facilisis dictum urna.
</p>
<small>Someone famous <cite title="Source Title">Source Title</cite></small>
</blockquote>
</div>
<div class="span12">
<hr>
</div>
</div><!-- /.row [testimonials] -->
<div class="row">
<div class="span12">
<h1>Columns</h1>
<p>
Donec condimentum viverra rutrum. Etiam at cursus sem. Nullam ut ipsum urna, quis interdum libero. Fusce luctus l