Permalink
Switch branches/tags
Nothing to show
Find file
Fetching contributors…
Cannot retrieve contributors at this time
executable file 241 lines (177 sloc) 8.48 KB
<!doctype html>
<!-- paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/ -->
<!--[if lt IE 7]> <html class="no-js ie6 oldie" lang="en"> <![endif]-->
<!--[if IE 7]> <html class="no-js ie7 oldie" lang="en"> <![endif]-->
<!--[if IE 8]> <html class="no-js ie8 oldie" lang="en"> <![endif]-->
<!--[if IE 9]> <html class="no-js ie9 oldie" lang="en"> <![endif]-->
<!-- Consider adding an manifest.appcache: h5bp.com/d/Offline -->
<!--[if gt IE 8]><!--> <html class="no-js" lang="en"> <!--<![endif]-->
<head>
<meta charset="utf-8">
<!-- Use the .htaccess and remove these lines to avoid edge case issues.
More info: h5bp.com/b/378 -->
<title>Metro - Responsive Portfolio Theme</title>
<meta name="description" content="Metro is an extremely cool html theme for agency portfolios or business, with unique design elements and great features.">
<meta name="author" content="rubenbristian.com">
<!-- Mobile viewport optimized: j.mp/bplateviewport -->
<meta name="viewport" content="width=device-width,initial-scale=1">
<link id="windStyle" rel="stylesheet" href="css/style.dark.css">
<link rel="shortcut icon" href="images/favicon.ico">
<link rel="apple-touch-icon" href="images/apple-touch-icon.png">
<!--[if lt IE 9]><script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script><![endif]-->
</head>
<body>
<div id="wrapper" class="clearfix"><div id="main">
<header class="mainHeader clearfix">
<a href="index.html"><img id="logo" src="images/logo.png" alt="Metro Studio" /></a>
<nav id="menu">
<ul>
<li><a href="index.html" class="selected">Home</a>
<hr />
<ul>
<li><a href="index.html">Masonry</a></li>
<li><a href="index2.html">Traditional</a></li>
</ul>
</li>
<li><a href="about.html">About</a></li>
<li><a href="#">Features</a>
<hr />
<ul>
<li><a href="shortcodes.html">Shortcodes</a></li>
<li><a href="columns.html">Columns</a></li>
<li><a href="testimonials.html">Testimonials</a></li>
<li><a href="pricing.html">Pricing Table</a></li>
<li><a href="404.html">404</a></li>
</ul>
</li>
<li><a href="blog.html">Blog</a></li>
<li><a href="contact.html">Contact</a></li>
</ul>
</nav>
<h1><strong>Metro Studio.</strong> Creative Design Agency of the Decade.<br />
<span>We create clean, unique &amp; unforgettable digital brands.</span></h1>
</header>
<div class="columns">
<header class="leftSide"><div class="clearfix">
<h3 class="sectionHeader">Featured work</h3><hr />
<p id="nivoHeadline">Inspiring Web Magazine Design</p>
</div></header>
<div class="rightSide clearfix">
<div class="nivoSlider">
<img src="images/photos/pic105.jpg" title="The great heater guy" alt="" />
<img src="images/photos/pic106.jpg" title="Wonderful Alice" alt="" />
<img src="images/photos/pic107.jpg" title="Weird looking red queen" alt="" />
</div>
</div>
<header class="leftSide"><div class="clearfix">
<h3 class="sectionHeader">Recent projects</h3><hr /><p>If above you have a slider for anything, here you have our most recent work.</p>
</div></header>
<div class="rightSide folioGrid clearfix">
<ul>
<li>
<a href="project1.html">
<figure>
<img src="images/photos/pic91.jpg" alt="Impossible is nothing">
<figcaption><h2>Impossible is nothing</h2></figcaption>
</figure>
</a>
</li>
<li>
<a href="project2.html">
<figure>
<img src="images/photos/pic89.jpg" alt="Into Space">
<figcaption><h2>Into Space</h2></figcaption>
</figure>
</a>
</li>
<li>
<a href="project4.html">
<figure>
<img src="images/photos/pic87.jpg" alt="Nite">
<figcaption><h2>Nite</h2></figcaption>
</figure>
</a>
</li>
</ul>
</div>
<header class="leftSide"><div class="clearfix">
<h3 class="sectionHeader">Latest headlines</h3><hr /><p>Bits &amp; Bobs out of our grumpy heads</p>
</div></header>
<div class="rightSide clearfix">
<section class="col2-3">
<h3 class="sectionHeader">From the Blog</h3><hr />
<header>
<h2><a href="#">Apple CEO finally steps down from the lead</a></h2>
<p class="nullLinks">By <a href="#">Ruben Bristian</a> on <a href="#">June 17th</a> in <a href="#">Daily Stuff</a></p>
</header>
<p>The tradition goes back to the beginning of time, awaited by the festival goers: the rabbit.. in the preview of the Festival.</p>
<p class="moreLink"><a href="#">Read more &rarr;</a></p>
</section>
<section class="col1-3 noMargin">
<h3 class="sectionHeader">From Twitter</h3><hr />
<div id="twitterFeed">
<em>wait for it...</em>
</div>
</section>
</div>
<header class="leftSide"><div class="clearfix">
<h3 class="sectionHeader">About us</h3><hr /><p>If you love our work, you must read a bit about us</p>
</div></header>
<div class="rightSide clearfix">
<section class="col1-2">
<h2 class="sectionHeader">Who we are &amp; what we do</h2><hr />
<p>Quisque convallis orci ut lacus sed imperdiet eget lobortis dolor tellus pharetra. In hac dolor habitasse platea dictumst. Integer sedelor risus sit mi ligula. Lorem ipsum dolor sit amet platea in distumst. Quisque convallis orci ut lacus sed imperdiet eget lobortis dolor tellus pharetra.</p>
<p class="moreLink"><a href="about.html">Read more &rarr;</a></p>
</section>
<section class="col1-2 noMargin">
<h2 class="sectionHeader">Testimonials</h2><hr class="invisible" />
<blockquote class="clearfix"><p>It was a real pleasure to work with Metro.. Every time we had a problem they would kindly explain us that they have the best designers in the world!
<em class="cite">Julia Robson, Google CEO</em></p></blockquote>
</section>
</div>
<header class="leftSide"><div class="clearfix">
<h4 class="sectionHeader">Images list</h4><hr /><p>More projects or stuff that can be shown with row images</p>
</div></header>
<div class="rightSide clearfix">
<section class="col1-4">
<a href="images/photos/pic134.jpg" title="Energy" data-rel="prettyPhoto[folio]" class="prettyHover sectionImage"><img src="images/photos/pic102.jpg" alt="Energy" /></a>
<p>Quisque convallis orci ut lacus sed imperdiet eget lobortis dolor tellus.</p>
</section>
<section class="col1-4">
<a href="images/photos/pic131.jpg" title="Nite" data-rel="prettyPhoto[folio]" class="prettyHover sectionImage"><img src="images/photos/pic103.jpg" alt="Nite" /></a>
<p>Quisque convallis orci ut lacus sed imperdiet eget lobortis dolor tellus.</p>
</section>
<section class="col1-4">
<a href="images/photos/pic132.jpg" title="Nike" data-rel="prettyPhoto[folio]" class="prettyHover sectionImage"><img src="images/photos/pic104.jpg" alt="Nike" /></a>
<p>Quisque convallis orci ut lacus sed imperdiet eget lobortis dolor tellus.</p>
</section>
<section class="col1-4 noMargin">
<a href="images/photos/pic133.jpg" title="Wolf x Leopard" data-rel="prettyPhoto[folio]" class="prettyHover sectionImage"><img src="images/photos/pic128.jpg" alt="Wolf x Leopard" /></a>
<p>Quisque convallis orci ut lacus sed imperdiet eget lobortis dolor tellus.</p>
</section>
</div>
</div>
</div></div>
<footer class="clearfix"><div>
<p>Copyright 2011 @ Made by <a href="http://rubenbristian.com">Ruben Bristian</a></p>
<p class="right">
Powered by WordPress. Just kidding! It's an HTML Theme
</p>
</div></footer>
<!--! end of #container -->
<!-- JavaScript at the bottom for fast page loading -->
<!-- Grab Google CDN's jQuery, with a protocol relative URL; fall back to local if offline -->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="js/libs/jquery-1.6.2.min.js"><\/script>')</script>
<!-- scripts concatenated and minified via ant build script-->
<script defer src="js/plugins.min.js"></script>
<script defer src="js/script.min.js"></script>
<!-- end scripts-->
<!-- Prompt IE 6 users to install Chrome Frame. Remove this if you want to support IE 6.
chromium.org/developers/how-tos/chrome-frame-getting-started -->
<!--[if lt IE 7 ]>
<script src="http://ajax.googleapis.com/ajax/libs/chrome-frame/1.0.3/CFInstall.min.js"></script>
<script>window.attachEvent('onload',function(){CFInstall.check({mode:'overlay'})})</script>
<![endif]-->
</body>
</html>