<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>ONIX Responsive Business &amp; Portfolio Template</title>
    <!-- Mobile Specific Metas -->
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="">
    <meta name="author" content="">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">

    <!-- CSS files begin-->
    <link href='http://fonts.googleapis.com/css?family=Oswald:400,300,700|Open+Sans+Condensed:700,300,300italic|Open+Sans:400,300italic,400italic,600,600italic,700,700italic,800,800italic|PT+Sans:400,400italic,700,700italic' rel='stylesheet' type='text/css'>
    <link href="assets/css/bootstrap.css" rel="stylesheet">
    <link href="assets/css/bootstrap-responsive.css" rel="stylesheet">
    <link href="assets/css/docs.css" rel="stylesheet">
    <link href="assets/js/google-code-prettify/prettify.css" rel="stylesheet">
    <link href="assets/css/responsiveslides.css" rel="stylesheet">
    <link rel="stylesheet" href="assets/css/prettyPhoto.css" type='text/css'>
    <link rel="stylesheet" href="assets/build/mediaelementplayer.min.css" />
	<link rel="stylesheet" type="text/css" media="screen" href="assets/css/slide-in.css" />
	<!--[if lt IE 9]><link rel="stylesheet" type="text/css" media="screen" href="assets/css/slide-in.ie.css" /><![endif]-->
    <link href="assets/css/style.css" rel="stylesheet">
    <!-- Color Style Setting CSS file-->
    <link href="assets/css/color-theme/color-sgrey.css" rel="stylesheet">

    <!-- HTML5 shim, for IE6-8 support of HTML5 elements -->
    <!--[if lt IE 9]>
      <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->

    <!-- fav and touch icons -->
    <link rel="shortcut icon" href="assets/ico/favicon.ico">
    <link rel="apple-touch-icon-precomposed" sizes="144x144" href="assets/ico/apple-touch-icon-144-precomposed.png">
    <link rel="apple-touch-icon-precomposed" sizes="114x114" href="assets/ico/apple-touch-icon-114-precomposed.png">
    <link rel="apple-touch-icon-precomposed" sizes="72x72" href="assets/ico/apple-touch-icon-72-precomposed.png">
    <link rel="apple-touch-icon-precomposed" href="assets/ico/apple-touch-icon-57-precomposed.png">
   
</head>

<body>

<!-- Head
================================================== -->
<div class="top-bar">
    <div class="container">
        <div class="row">
            <div class="span6">
                <!-- text widget begin here -->
                <ul class="info-text pull-left">
                    <li>
                        <a href="#">Lorem ipsum dolor sit amet, consectetuer adipiscing elit Aenean commodo ligula eget.</a>
                    </li>
                    <li>
                        <a href="#">
                            This informational text widget - Buy this theme now !
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            Lorem ipsum dolor sit
                        </a>
                        amet, consectetuer adipiscing elit. Aenean commodo ligula eget.
                    </li>
                </ul>
            </div>
            <div class="span6">
                <!-- social begin here -->
                <ul class="socicon right top-w">
                    <li>
                        <a href="#" class="share-icon">
                        </a>
                    </li>
                    <li>
                        <a href="#" class="google">
                        </a>
                    </li>
                    <li>
                        <a href="#" class="facebook">
                        </a>
                    </li>
                    <li>
                        <a href="#" class="twitter">
                        </a>
                    </li>
                    <li>
                        <a href="#" class="flickr">
                        </a>
                    </li>
                    <li>
                        <a href="#" class="dribbble">
                        </a>
                    </li>
                    <li>
                        <a href="#" class="linkedin">
                        </a>
                    </li>
                    <li class="last">
                        <a href="#" class="vimeo">
                        </a>
                    </li>
                </ul>
                <form class="navbar-search pull-right" action="">
                    <input class="search-query" type="text">
                </form>
            </div>
        </div>
    </div>
</div>
<!-- Logo / Menu
================================================== -->
<header class="header">
    <div class="container strip-line">
        <div class="row">
            <div class="span4">
                <a href="index.html" class="logo">
                    <img src="assets/img/logo.png" alt="">
                </a>
            </div>
            <div class="span8">
                <nav>
                    <ul class="right">
                        <li>
                            <a href="index.html">
                                home
                            </a>
                             <ul>
                                <li>
                                  <a href="index_2.html">
                                    home two
                                  </a>
                                </li>
                                </ul>
                        </li>
                        <li>
                            <a href="about.html">
                                about
                            </a>
                        </li>
                        <li>
                            <a href="features.html">
                                features
                            </a>
                        </li>
                        <li class="current">
                            <a href="portfolio.html">
                                portfolio
                            </a>
                            <ul>
                                <li>
                                    <a href="portfolio-two.html">
                                        portfolio two
                                    </a>
                                </li>
                                <li>
                                    <a href="portfolio-three.html">
                                        portfolio three
                                    </a>
                                </li>
                                <li>
                                    <a href="portfolio-single.html">
                                        single portfolio
                                    </a>
                                </li>
                                <li>
                                    <a href="portfolio-single-2.html">
                                        single portfolio slider
                                    </a>
                                </li>
                                <li>
                                    <a href="portfolio-single-3.html">
                                        single portfolio video
                                    </a>
                                </li>
                            </ul>
                        </li>
                        <li>
                            <a href="blog.html">
                                blog
                            </a>
                            <ul>
                                <li>
                                    <a href="blog_rs.html">
                                        blog right sidebar
                                    </a>
                                  </li>
                                <li>
                                    <a href="single-post.html">
                                        single post
                                    </a>
                                    <ul>
                                        <li>
                                            <a href="#">
                                                example level
                                            </a>
                                        </li>
                                        <li>
                                            <a href="#">
                                                example level
                                            </a>
                                        </li>
                                    </ul>
                                </li>
                            </ul>
                        </li>
                        <li>
                            <a href="contact.html">
                                contact
                            </a>
                        </li>
                    </ul>
                </nav>
            </div>
        </div>
    </div>
</header>

<div class="slider-cont">

<div class="container">

<header id="pagehead">
<h1>Portfolio <small>&nbsp; &frasl; &nbsp;&nbsp;Lorem ipsum dolor sit amet, consectetuer adipiscing elit. </small></h1>

</header>
</div>
</div>

 <div class="container">

<!-- Portfolio filter
================================================== -->
<section>
<div class="row">
 <ul id="portfolio-filter" class="span12">
                    <li>
                        <a href="javascript:void(0)" title="" class="currents">All</a>
                    </li>
                    <li>
                        <a href="javascript:void(0)" title="">Web</a>
                    </li>
                    <li>
                        <a href="javascript:void(0)" title="">Video</a>
                    </li>
                    <li>
                        <a href="javascript:void(0)" title="">Audio</a>
                    </li>
                </ul>
  </div>
  
<!-- Portfolio item
================================================== -->
 
<ul class="thumbnails portfolio" id="containment-portfolio">
    <li class="span3 item-block web all">
     <a href="assets/img/bootstrap-mdo-sfmoma-01.jpg" class="zoom" rel="prettyPhoto" title="Image Title"></a>
     <a href="#" class="link"></a>
      <a class="thumbnail" href="portfolio-single.html">
        <img src="assets/img/example-sites/example1.jpg" alt="example-item">
      </a>
      <div class="desc">
      <a href="portfolio-single-2.html"> Images </a>
       <p> <em>Portfolio Item Images</em> </p>
      </div>
    </li>
    <li class="span3 item-block video all">
     <iframe src="http://player.vimeo.com/video/28220269?title=0&amp;byline=0&amp;portrait=0" width="270" height="130" frameborder="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe>
      <div class="desc">
      <a href="portfolio-single-3.html">Vimeo Video </a>
       <p> <em>Portfolio Item Vimeo</em> </p>
      </div>
    </li>
   <li class="span3 item-block web all">
     <a href="assets/img/bootstrap-mdo-sfmoma-01.jpg" class="zoom" rel="prettyPhoto" title="Image Title"></a>
     <a href="#" class="link"></a>
      <a class="thumbnail" href="#">
        <img src="assets/img/example-sites/example1.jpg" alt="example-item">
      </a>
      <div class="desc">
      <a href="portfolio-single.html"> Images </a>
       <p> <em>Portfolio Item Images</em> </p>
      </div>
    </li>
    <li class="span3 item-block">
     <a href="assets/img/bootstrap-mdo-sfmoma-01.jpg" class="zoom" rel="prettyPhoto" title="Image Title"></a>
     <a href="#" class="link"></a>
      <a class="thumbnail" href="#">
        <img src="assets/img/example-sites/example2.jpg" alt="example-item">
      </a>
      <div class="desc">
      <a href="portfolio-single-2.html"> Images </a>
       <p> <em>Portfolio Item Images</em> </p>
      </div>
    </li>
    <li class="span3 item-block audio all">
     <audio src="assets/media/adg3com_electrofreak.mp3" type="audio/mp3" controls="controls"></audio>
      <div class="desc">
      <a href="portfolio-single.html">Local Audio </a>
       <p> <em>Portfolio Item Audio</em> </p>
      </div>
    </li>
    <li class="span3 item-block">
     <a href="assets/img/bootstrap-mdo-sfmoma-01.jpg" class="zoom" rel="prettyPhoto" title="Image Title"></a>
     <a href="#" class="link"></a>
      <a class="thumbnail" href="#">
        <img src="assets/img/example-sites/example2.jpg" alt="example-item">
      </a>
      <div class="desc">
      <a href="portfolio-single.html"> Images </a>
       <p> <em>Portfolio Item Images</em> </p>
      </div>
    </li>
   <li class="span3 item-block">
     <a href="assets/img/bootstrap-mdo-sfmoma-01.jpg" class="zoom" rel="prettyPhoto" title="Image Title"></a>
     <a href="#" class="link"></a>
      <a class="thumbnail" href="#">
        <img src="assets/img/example-sites/example1.jpg" alt="example-item">
      </a>
      <div class="desc">
      <a href="portfolio-single.html"> Images </a>
       <p> <em>Portfolio Item Images</em> </p>
      </div>
    </li>
    <li class="span3 item-block video all">
     <div class="row">
      <div class="span3">
     <video src="assets/media/VH_videoAsset.flv" type="video/flv" controls="controls"></video>
     </div>
     </div>
      <div class="desc">
      <a href="portfolio-single-3.html"> Local Video </a>
       <p> <em>Portfolio Item Local Video</em> </p>
      </div>
    </li>
    <li class="span3 item-block web all">
     <a href="assets/img/bootstrap-mdo-sfmoma-01.jpg" class="zoom" rel="prettyPhoto" title="Image Title"></a>
     <a href="#" class="link"></a>
      <a class="thumbnail" href="portfolio-single.html">
        <img src="assets/img/example-sites/example1.jpg" alt="example-item">
      </a>
      <div class="desc">
      <a href="portfolio-single-2.html"> Images </a>
       <p> <em>Portfolio Item Images</em> </p>
      </div>
    </li>
    <li class="span3 item-block video all">
     <iframe src="http://player.vimeo.com/video/28220269?title=0&amp;byline=0&amp;portrait=0" width="270" height="130" frameborder="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe>
      <div class="desc">
      <a href="portfolio-single-3.html">Vimeo Video </a>
       <p> <em>Portfolio Item Vimeo</em> </p>
      </div>
    </li>
   <li class="span3 item-block web all">
     <a href="assets/img/bootstrap-mdo-sfmoma-01.jpg" class="zoom" rel="prettyPhoto" title="Image Title"></a>
     <a href="#" class="link"></a>
      <a class="thumbnail" href="#">
        <img src="assets/img/example-sites/example1.jpg" alt="example-item">
      </a>
      <div class="desc">
      <a href="portfolio-single.html"> Images </a>
       <p> <em>Portfolio Item Images</em> </p>
      </div>
    </li>
    <li class="span3 item-block">
     <a href="assets/img/bootstrap-mdo-sfmoma-01.jpg" class="zoom" rel="prettyPhoto" title="Image Title"></a>
     <a href="#" class="link"></a>
      <a class="thumbnail" href="#">
        <img src="assets/img/example-sites/example2.jpg" alt="example-item">
      </a>
      <div class="desc">
      <a href="portfolio-single-2.html"> Images </a>
       <p> <em>Portfolio Item Images</em> </p>
      </div>
    </li>
  </ul>
</section>
  <div class="divider"></div>

    </div><!-- /container -->

     <!-- Footer
      ================================================== -->
      <footer>
      <div class="container">
      <div class="row">
      
      <div class="span4">
      <h3>About</h3>
      <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem.</p>
      <h3>Connect With Us</h3>
      <!-- social begin here -->
                    <ul class="socicon left">
                       <li>
                            <a href="#" class="share-icon">
                            </a>
                        </li>
                        <li>
                            <a href="#" class="google">
                            </a>
                        </li>
                        <li>
                            <a href="#" class="facebook">
                            </a>
                        </li>
                        <li>
                            <a href="#" class="twitter">
                            </a>
                        </li>
                        <li>
                            <a href="#" class="flickr">
                            </a>
                        </li>
                        <li>
                            <a href="#" class="dribbble">
                            </a>
                        </li>
                        <li>
                            <a href="#" class="linkedin">
                            </a>
                        </li>
                        <li class="last">
                            <a href="#" class="vimeo">
                            </a>
                        </li>
                       
                    </ul>
                    
      </div>
      
      <!-- tweets begin here -->
      <div class="span4">
      <h3>Latest Tweets</h3>
       <div class="tweets">
                        <p>
                            Loading Tweets...
                        </p>
                        <ul id="tweet-list">
                        </ul>
                    </div>
      </div>
      
      <div class="span4">
      <!-- flickr begin here -->
      <h3>From Flickr</h3>
      
      <script type="text/javascript" src="http://www.flickr.com/badge_code_v2.gne?count=8&amp;source=user&amp;user=52617155@N08&amp;layout=x&amp;display=random&amp;size=s"></script> 

      </div>
      
      <div class="span12 copy">
       &copy; 2012 NLINE. All Rights Reserved.
      </div>

      </div>
      </div>
      </footer>

    <!-- JavaScript files begin-->
    <!-- Placed at the end of the document so the pages load faster -->
    <script src="assets/js/jquery.js"></script>
    <script src="http://maps.google.com/maps/api/js?sensor=false"></script>
    <script src="assets/js/jquery.form.js"></script>
    <script src="assets/js/jquery.ufvalidator-1.0.5.js"></script>
    <script src="assets/js/jquery.easing.1.3.js"></script>
    <script src="assets/js/jquery.cycle.all.js"></script>
    <script src="assets/js/jquery.prettyPhoto.js"></script>
    <script src="assets/js/google-code-prettify/prettify.js"></script>
    <script src="assets/js/bootstrap.min.js"></script>
    <script src="assets/js/application.js"></script>
    <script src="assets/js/responsiveslides.min.js"></script>
    <script src="assets/build/mediaelement-and-player.min.js"></script>
    <script src="assets/js/gmap3.min.js"></script>
    <script src="assets/js/custom.js"></script>
    <script src="assets/js/jquery.ui.totop.js" type="text/javascript"></script>
    <script type="text/javascript">
    $(document).ready(function() {
    $().UItoTop({ easingType: 'easeOutQuart' });
    });
    </script>


  </body>
</html>
