Team:UANL Mty-Mexico/tupapa

From 2014.igem.org

(Difference between revisions)
Line 1: Line 1:
-
{{:Team:UANL_Mty-Mexico/CCS-skel}}
+
{{CSS/Main}}
-
{{:Team:UANL_Mty-Mexico/CCS-style}}
+
 
-
{{:Team:UANL_Mty-Mexico/CCS-style-mobile}}
+
-
{{:Team:UANL_Mty-Mexico/CCS-style-narrow}}
+
-
{{:Team:UANL_Mty-Mexico/CCS-style-narrower}}
+
-
{{:Team:UANL_Mty-Mexico/CCS-style-normal}}
+
-
{{:Team:UANL_Mty-Mexico/CCS-style-noscript}}
+
-
{{:Team:UANL_Mty-Mexico/js-initil}}
+
-
{{:Team:UANL_Mty-Mexico/js-2}}
+
-
{{:Team:UANL_Mty-Mexico/js-3}}
+
-
{{:Team:UANL_Mty-Mexico/js-4}}
+
-
{{:Team:UANL_Mty-Mexico/js-5}}
+
-
{{:Team:UANL_Mty-Mexico/js-6}}
+
-
{{:Team:UANL_Mty-Mexico/js-7}}
+
-
{{:Team:UANL_Mty-Mexico/cssr}}
+
<html>
<html>
<head>
<head>
-
+
<title>TXT by HTML5 UP</title>
 +
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
 +
<meta name="description" content="" />
 +
<meta name="keywords" content="" />
 +
<!--[if lte IE 8]><script src="css/ie/html5shiv.js"></script><![endif]-->
 +
<script src="js/jquery.min.js"></script>
 +
<script src="js/jquery.dropotron.min.js"></script>
 +
<script src="js/skel.min.js"></script>
 +
<script src="js/skel-layers.min.js"></script>
 +
<script src="js/init.js"></script>
 +
<noscript>
 +
<link rel="stylesheet" href="css/skel.css" />
 +
<link rel="stylesheet" href="css/style.css" />
 +
<link rel="stylesheet" href="css/style-desktop.css" />
 +
</noscript>
 +
<!--[if lte IE 8]><link rel="stylesheet" href="css/ie/v8.css" /><![endif]-->
</head>
</head>
<body class="homepage">
<body class="homepage">
<!-- Header -->
<!-- Header -->
-
<div id="header">
+
<header id="header">
-
+
<div class="logo container">
-
<!-- Inner -->
+
<div>
-
<div class="inner">
+
<h1><a href="index.html" id="logo">TXT</a></h1>
-
<header>
+
<p>A responsive site template by HTML5 UP</p>
-
<h1><a href="index.html" id="logo">IGEM</a></h1>
+
-
<hr/>
+
-
<p>UANL-Mty-MEXICO</p>
+
-
</header>
+
-
<footer>
+
-
<a href="#banner" class="button circled scrolly">Start</a>
+
-
</footer>
+
</div>
</div>
-
+
</div>
-
<!-- Nav -->
+
</header>
-
<nav id="nav">
+
 
 +
<!-- Nav -->
 +
<nav id="nav" class="skel-layers-fixed">
 +
<ul>
 +
<li class="current"><a href="index.html">Home</a></li>
 +
<li>
 +
<a href="">Dropdown</a>
<ul>
<ul>
-
<li><a href="index.html">Home</a></li>
+
<li><a href="#">Lorem ipsum dolor</a></li>
 +
<li><a href="#">Magna phasellus</a></li>
<li>
<li>
-
<a href="">PROJECT</a>
+
<a href="">Phasellus consequat</a>
<ul>
<ul>
<li><a href="#">Lorem ipsum dolor</a></li>
<li><a href="#">Lorem ipsum dolor</a></li>
 +
<li><a href="#">Phasellus consequat</a></li>
<li><a href="#">Magna phasellus</a></li>
<li><a href="#">Magna phasellus</a></li>
<li><a href="#">Etiam dolore nisl</a></li>
<li><a href="#">Etiam dolore nisl</a></li>
-
<li>
 
-
<a href="">And a submenu &hellip;</a>
 
-
<ul>
 
-
<li><a href="#">Lorem ipsum dolor</a></li>
 
-
<li><a href="#">Phasellus consequat</a></li>
 
-
<li><a href="#">Magna phasellus</a></li>
 
-
<li><a href="#">Etiam dolore nisl</a></li>
 
-
</ul>
 
-
</li>
 
-
<li><a href="#">Veroeros feugiat</a></li>
 
</ul>
</ul>
</li>
</li>
-
<li><a href="left-sidebar.html">MODELING</a></li>
+
<li><a href="#">Veroeros feugiat</a></li>
-
<li><a href="right-sidebar.html">RESULTS</a></li>
+
-
<li><a href="no-sidebar.html">FUTURE</a></li>
+
</ul>
</ul>
-
</nav>
+
</li>
-
 
+
<li><a href="left-sidebar.html">Left Sidebar</a></li>
 +
<li><a href="right-sidebar.html">Right Sidebar</a></li>
 +
<li><a href="no-sidebar.html">No Sidebar</a></li>
 +
</ul>
 +
</nav>
 +
 +
<!-- Banner -->
 +
<div id="banner-wrapper">
 +
<section id="banner">
 +
<h2>Welcome to TXT by HTML5 UP</h2>
 +
<p>A free responsive site template built on HTML5, CSS3, skel, and some other stuff</p>
 +
<a href="#" class="button">Alright let's go</a>
 +
</section>
</div>
</div>
-
 
-
<!-- Banner -->
 
-
<section id="banner">
 
-
<header>
 
-
<h2>WELCOME.</h2>
 
-
<p>
 
-
A (free) responsive site template by <a href="http://html5up.net">HTML5 UP</a>.
 
-
Built on <strong>skel</strong> and released under the <a href="http://html5up.net/license">CCA</a> license.
 
-
</p>
 
-
</header>
 
-
</section>
 
-
<!-- Carousel -->
 
-
<section class="carousel">
 
-
<div class="reel">
 
-
 
-
<article>
 
-
<a href="#" class="image featured"><img src="images/pic01.jpg" alt="" /></a>
 
-
<header>
 
-
<h3><a href="#">Pulvinar sagittis congue</a></h3>
 
-
</header>
 
-
<p>Commodo id natoque malesuada sollicitudin elit suscipit magna.</p>
 
-
</article>
 
-
 
-
<article>
 
-
<a href="#" class="image featured"><img src="images/pic02.jpg" alt="" /></a>
 
-
<header>
 
-
<h3><a href="#">Fermentum sagittis proin</a></h3>
 
-
</header>
 
-
<p>Commodo id natoque malesuada sollicitudin elit suscipit magna.</p>
 
-
</article>
 
-
 
-
<article>
 
-
<a href="#" class="image featured"><img src="images/pic03.jpg" alt="" /></a>
 
-
<header>
 
-
<h3><a href="#">Sed quis rhoncus placerat</a></h3>
 
-
</header>
 
-
<p>Commodo id natoque malesuada sollicitudin elit suscipit magna.</p>
 
-
</article>
 
-
 
-
<article>
 
-
<a href="#" class="image featured"><img src="images/pic04.jpg" alt="" /></a>
 
-
<header>
 
-
<h3><a href="#">Ultrices urna sit lobortis</a></h3>
 
-
</header>
 
-
<p>Commodo id natoque malesuada sollicitudin elit suscipit magna.</p>
 
-
</article>
 
-
 
-
<article>
 
-
<a href="#" class="image featured"><img src="images/pic05.jpg" alt="" /></a>
 
-
<header>
 
-
<h3><a href="#">Varius magnis sollicitudin</a></h3>
 
-
</header>
 
-
<p>Commodo id natoque malesuada sollicitudin elit suscipit magna.</p>
 
-
</article>
 
-
 
-
<article>
 
-
<a href="#" class="image featured"><img src="images/pic01.jpg" alt="" /></a>
 
-
<header>
 
-
<h3><a href="#">Pulvinar sagittis congue</a></h3>
 
-
</header>
 
-
<p>Commodo id natoque malesuada sollicitudin elit suscipit magna.</p>
 
-
</article>
 
-
 
-
<article>
 
-
<a href="#" class="image featured"><img src="images/pic02.jpg" alt="" /></a>
 
-
<header>
 
-
<h3><a href="#">Fermentum sagittis proin</a></h3>
 
-
</header>
 
-
<p>Commodo id natoque malesuada sollicitudin elit suscipit magna.</p>
 
-
</article>
 
-
 
-
<article>
 
-
<a href="#" class="image featured"><img src="images/pic03.jpg" alt="" /></a>
 
-
<header>
 
-
<h3><a href="#">Sed quis rhoncus placerat</a></h3>
 
-
</header>
 
-
<p>Commodo id natoque malesuada sollicitudin elit suscipit magna.</p>
 
-
</article>
 
-
 
-
<article>
 
-
<a href="#" class="image featured"><img src="images/pic04.jpg" alt="" /></a>
 
-
<header>
 
-
<h3><a href="#">Ultrices urna sit lobortis</a></h3>
 
-
</header>
 
-
<p>Commodo id natoque malesuada sollicitudin elit suscipit magna.</p>
 
-
</article>
 
-
 
-
<article>
 
-
<a href="#" class="image featured"><img src="images/pic05.jpg" alt="" /></a>
 
-
<header>
 
-
<h3><a href="#">Varius magnis sollicitudin</a></h3>
 
-
</header>
 
-
<p>Commodo id natoque malesuada sollicitudin elit suscipit magna.</p>
 
-
</article>
 
-
 
-
</div>
 
-
</section>
 
-
 
<!-- Main -->
<!-- Main -->
-
<div class="wrapper style2">
+
<div id="main-wrapper">
 +
<div id="main" class="container">
 +
<div class="row double">
 +
<div class="12u">
 +
 +
<!-- Highlight -->
 +
<section class="box highlight">
 +
<ul class="special">
 +
<li><a href="#" class="icon fa-search"><span class="label">Magnifier</span></a></li>
 +
<li><a href="#" class="icon fa-tablet"><span class="label">Tablet</span></a></li>
 +
<li><a href="#" class="icon fa-flask"><span class="label">Flask</span></a></li>
 +
<li><a href="#" class="icon fa-cog"><span class="label">Cog?</span></a></li>
 +
</ul>
 +
<header>
 +
<h2>A random assortment of icons in circles</h2>
 +
<p>And some text that attempts to explain their significance</p>
 +
</header>
 +
<p>
 +
Phasellus quam turpis, feugiat sit amet ornare in, hendrerit in lectus. Praesent semper mod quis eget mi. Etiam eu<br />
 +
ante risus. Aliquam erat volutpat. Aliquam luctus et mattis lectus amet pulvinar. Nam nec turpis consequat.
 +
</p>
 +
</section>
-
<article id="main" class="container special">
+
</div>
-
<a href="#" class="image featured"><img src="images/pic06.jpg" alt="" /></a>
+
</div>
-
<header>
+
<div class="row double">
-
<h2><a href="#">Sed massa imperdiet magnis</a></h2>
+
<div class="12u">
-
<p>
+
-
Sociis aenean eu aenean mollis mollis facilisis primis ornare penatibus aenean. Cursus ac enim
+
-
pulvinar curabitur morbi convallis. Lectus malesuada sed fermentum dolore amet.
+
-
</p>
+
-
</header>
+
-
<p>
+
-
Commodo id natoque malesuada sollicitudin elit suscipit. Curae suspendisse mauris posuere accumsan massa
+
-
posuere lacus convallis tellus interdum. Amet nullam fringilla nibh nulla convallis ut venenatis purus
+
-
sit arcu sociis. Nunc fermentum adipiscing tempor cursus nascetur adipiscing adipiscing. Primis aliquam
+
-
mus lacinia lobortis phasellus suscipit. Fermentum lobortis non tristique ante proin sociis accumsan
+
-
lobortis. Auctor etiam porttitor phasellus tempus cubilia ultrices tempor sagittis. Nisl fermentum
+
-
consequat integer interdum integer purus sapien. Nibh eleifend nulla nascetur pharetra commodo mi augue
+
-
interdum tellus. Ornare cursus augue feugiat sodales velit lorem. Semper elementum ullamcorper lacinia
+
-
natoque aenean scelerisque.
+
-
</p>
+
-
<footer>
+
-
<a href="#" class="button">Continue Reading</a>
+
-
</footer>
+
-
</article>
+
-
</div>
+
<!-- Features -->
 +
<section class="box features">
 +
<h2 class="major"><span>A Major Heading</span></h2>
 +
<div>
 +
<div class="row">
 +
<div class="3u">
 +
 +
<!-- Feature -->
 +
<section class="box feature">
 +
<a href="#" class="image featured"><img src="images/pic01.jpg" alt="" /></a>
 +
<h3><a href="#">A Subheading</a></h3>
 +
<p>
 +
Phasellus quam turpis, feugiat sit amet ornare in, a hendrerit in
 +
lectus dolore. Praesent semper mod quis eget sed etiam eu ante risus.
 +
</p>
 +
</section>
 +
 +
</div>
 +
<div class="3u">
 +
 +
<!-- Feature -->
 +
<section class="box feature">
 +
<a href="#" class="image featured"><img src="images/pic02.jpg" alt="" /></a>
 +
<h3><a href="#">Another Subheading</a></h3>
 +
<p>
 +
Phasellus quam turpis, feugiat sit amet ornare in, a hendrerit in
 +
lectus dolore. Praesent semper mod quis eget sed etiam eu ante risus.
 +
</p>
 +
</section>
 +
 +
</div>
 +
<div class="3u">
 +
 +
<!-- Feature -->
 +
<section class="box feature">
 +
<a href="#" class="image featured"><img src="images/pic03.jpg" alt="" /></a>
 +
<h3><a href="#">And Another</a></h3>
 +
<p>
 +
Phasellus quam turpis, feugiat sit amet ornare in, a hendrerit in
 +
lectus dolore. Praesent semper mod quis eget sed etiam eu ante risus.
 +
</p>
 +
</section>
 +
 +
</div>
 +
<div class="3u">
 +
 +
<!-- Feature -->
 +
<section class="box feature">
 +
<a href="#" class="image featured"><img src="images/pic04.jpg" alt="" /></a>
 +
<h3><a href="#">And One More</a></h3>
 +
<p>
 +
Phasellus quam turpis, feugiat sit amet ornare in, a hendrerit in
 +
lectus dolore. Praesent semper mod quis eget sed etiam eu ante risus.
 +
</p>
 +
</section>
 +
 +
</div>
 +
</div>
 +
<div class="row">
 +
<div class="12u">
 +
<ul class="actions">
 +
<li><a href="#" class="button big">Do Something</a></li>
 +
<li><a href="#" class="button alt big">Think About It</a></li>
 +
</ul>
 +
</div>
 +
</div>
 +
</div>
 +
</section>
-
<!-- Features -->
+
</div>
-
<div class="wrapper style1">
+
-
+
-
<section id="features" class="container special">
+
-
<header>
+
-
<h2>Morbi ullamcorper et varius leo lacus</h2>
+
-
<p>Ipsum volutpat consectetur orci metus consequat imperdiet duis integer semper magna.</p>
+
-
</header>
+
-
<div class="row">
+
-
<article class="4u special">
+
-
<a href="#" class="image featured"><img src="images/pic07.jpg" alt="" /></a>
+
-
<header>
+
-
<h3><a href="#">Gravida aliquam penatibus</a></h3>
+
-
</header>
+
-
<p>
+
-
Amet nullam fringilla nibh nulla convallis tique ante proin sociis accumsan lobortis. Auctor etiam
+
-
porttitor phasellus tempus cubilia ultrices tempor sagittis. Nisl fermentum consequat integer interdum.
+
-
</p>
+
-
</article>
+
-
<article class="4u special">
+
-
<a href="#" class="image featured"><img src="images/pic08.jpg" alt="" /></a>
+
-
<header>
+
-
<h3><a href="#">Sed quis rhoncus placerat</a></h3>
+
-
</header>
+
-
<p>
+
-
Amet nullam fringilla nibh nulla convallis tique ante proin sociis accumsan lobortis. Auctor etiam
+
-
porttitor phasellus tempus cubilia ultrices tempor sagittis. Nisl fermentum consequat integer interdum.
+
-
</p>
+
-
</article>
+
-
<article class="4u special">
+
-
<a href="#" class="image featured"><img src="images/pic09.jpg" alt="" /></a>
+
-
<header>
+
-
<h3><a href="#">Magna laoreet et aliquam</a></h3>
+
-
</header>
+
-
<p>
+
-
Amet nullam fringilla nibh nulla convallis tique ante proin sociis accumsan lobortis. Auctor etiam
+
-
porttitor phasellus tempus cubilia ultrices tempor sagittis. Nisl fermentum consequat integer interdum.
+
-
</p>
+
-
</article>
+
</div>
</div>
-
</section>
+
<div class="row double">
 +
<div class="12u">
 +
<!-- Blog -->
 +
<section class="box blog">
 +
<h2 class="major"><span>Another Major Heading</span></h2>
 +
<div>
 +
<div class="row">
 +
<div class="9u">
 +
<div class="content content-left">
 +
 +
<!-- Featured Post -->
 +
<article class="box post">
 +
<header>
 +
<h3><a href="#">Here's a really big heading</a></h3>
 +
<p>With a smaller subtitle that attempts to elaborate</p>
 +
<ul class="meta">
 +
<li class="icon fa-clock-o">15 minutes ago</li>
 +
<li class="icon fa-comments"><a href="#">8</a></li>
 +
</ul>
 +
</header>
 +
<a href="#" class="image featured"><img src="images/pic05.jpg" alt="" /></a>
 +
<p>
 +
Phasellus quam turpis, feugiat sit amet ornare in, a hendrerit in lectus. Praesent
 +
semper mod quis eget mi. Etiam sed ante risus aliquam erat et volutpat. Praesent a
 +
dapibus velit. Curabitur sed nisi nunc, accumsan vestibulum lectus. Lorem ipsum
 +
dolor sit non aliquet sed, tempor et dolor.  Praesent a dapibus velit. Curabitur
 +
accumsan.
 +
</p>
 +
<a href="#" class="button">Continue Reading</a>
 +
</article>
 +
 +
</div>
 +
</div>
 +
<div class="3u">
 +
<div class="sidebar">
 +
 +
<!-- Archives -->
 +
<ul class="divided">
 +
<li>
 +
<article class="box post-summary">
 +
<h3><a href="#">A Subheading</a></h3>
 +
<ul class="meta">
 +
<li class="icon fa-clock-o">6 hours ago</li>
 +
<li class="icon fa-comments"><a href="#">34</a></li>
 +
</ul>
 +
</article>
 +
</li>
 +
<li>
 +
<article class="box post-summary">
 +
<h3><a href="#">Another Subheading</a></h3>
 +
<ul class="meta">
 +
<li class="icon fa-clock-o">9 hours ago</li>
 +
<li class="icon fa-comments"><a href="#">27</a></li>
 +
</ul>
 +
</article>
 +
</li>
 +
<li>
 +
<article class="box post-summary">
 +
<h3><a href="#">And Another</a></h3>
 +
<ul class="meta">
 +
<li class="icon fa-clock-o">Yesterday</li>
 +
<li class="icon fa-comments"><a href="#">184</a></li>
 +
</ul>
 +
</article>
 +
</li>
 +
<li>
 +
<article class="box post-summary">
 +
<h3><a href="#">And Another</a></h3>
 +
<ul class="meta">
 +
<li class="icon fa-clock-o">2 days ago</li>
 +
<li class="icon fa-comments"><a href="#">286</a></li>
 +
</ul>
 +
</article>
 +
</li>
 +
<li>
 +
<article class="box post-summary">
 +
<h3><a href="#">And One More</a></h3>
 +
<ul class="meta">
 +
<li class="icon fa-clock-o">3 days ago</li>
 +
<li class="icon fa-comments"><a href="#">8,086</a></li>
 +
</ul>
 +
</article>
 +
</li>
 +
</ul>
 +
<a href="#" class="button alt">Browse Archives</a>
 +
 +
</div>
 +
</div>
 +
</div>
 +
</div>
 +
</section>
 +
 +
</div>
 +
</div>
 +
</div>
</div>
</div>
<!-- Footer -->
<!-- Footer -->
-
<div id="footer">
+
<footer id="footer" class="container">
-
<div class="container">
+
<div class="row double">
-
<div class="row">
+
<div class="12u">
-
+
-
<!-- Tweets -->
+
-
<section class="4u">
+
-
<header>
+
-
<h2 class="icon fa-twitter circled"><span class="label">Tweets</span></h2>
+
-
</header>
+
-
<ul class="divided">
+
-
<li>
+
-
<article class="tweet">
+
-
Amet nullam fringilla nibh nulla convallis tique ante sociis accumsan.
+
-
<span class="timestamp">5 minutes ago</span>
+
-
</article>
+
-
</li>
+
-
<li>
+
-
<article class="tweet">
+
-
Hendrerit rutrum quisque.
+
-
<span class="timestamp">30 minutes ago</span>
+
-
</article>
+
-
</li>
+
-
<li>
+
-
<article class="tweet">
+
-
Curabitur donec nulla massa laoreet nibh. Lorem praesent montes.
+
-
<span class="timestamp">3 hours ago</span>
+
-
</article>
+
-
</li>
+
-
<li>
+
-
<article class="tweet">
+
-
Lacus natoque cras rhoncus curae dignissim ultricies. Convallis orci aliquet.
+
-
<span class="timestamp">5 hours ago</span>
+
-
</article>
+
-
</li>
+
-
</ul>
+
-
</section>
+
-
<!-- Posts -->
+
<!-- About -->
-
<section class="4u">
+
<section>
-
<header>
+
<h2 class="major"><span>What's this about?</span></h2>
-
<h2 class="icon fa-file circled"><span class="label">Posts</span></h2>
+
<p>
-
</header>
+
This is <strong>TXT</strong>, yet another free responsive site template designed by
-
<ul class="divided">
+
<a href="http://n33.co">AJ</a> for <a href="http://html5up.net">HTML5 UP</a>. It's released under the
-
<li>
+
<a href="http://html5up.net/license/">Creative Commons Attribution</a> license so feel free to use it for
-
<article class="post stub">
+
whatever you're working on (personal or commercial), just be sure to give us credit for the design.
-
<header>
+
That's basically it :)
-
<h3><a href="#">Nisl fermentum integer</a></h3>
+
</p>
-
</header>
+
-
<span class="timestamp">3 hours ago</span>
+
-
</article>
+
-
</li>
+
-
<li>
+
-
<article class="post stub">
+
-
<header>
+
-
<h3><a href="#">Phasellus portitor lorem</a></h3>
+
-
</header>
+
-
<span class="timestamp">6 hours ago</span>
+
-
</article>
+
-
</li>
+
-
<li>
+
-
<article class="post stub">
+
-
<header>
+
-
<h3><a href="#">Magna tempus consequat</a></h3>
+
-
</header>
+
-
<span class="timestamp">Yesterday</span>
+
-
</article>
+
-
</li>
+
-
<li>
+
-
<article class="post stub">
+
-
<header>
+
-
<h3><a href="#">Feugiat lorem ipsum</a></h3>
+
-
</header>
+
-
<span class="timestamp">2 days ago</span>
+
-
</article>
+
-
</li>
+
-
</ul>
+
-
</section>
+
-
 
+
-
<!-- Photos -->
+
-
<section class="4u">
+
-
<header>
+
-
<h2 class="icon fa-camera circled"><span class="label">Photos</span></h2>
+
-
</header>
+
-
<div class="row quarter no-collapse">
+
-
<div class="6u">
+
-
<a href="#" class="image fit"><img src="images/pic10.jpg" alt="" /></a>
+
-
</div>
+
-
<div class="6u">
+
-
<a href="#" class="image fit"><img src="images/pic11.jpg" alt="" /></a>
+
-
</div>
+
-
</div>
+
-
<div class="row quarter no-collapse">
+
-
<div class="6u">
+
-
<a href="#" class="image fit"><img src="images/pic12.jpg" alt="" /></a>
+
-
</div>
+
-
<div class="6u">
+
-
<a href="#" class="image fit"><img src="images/pic13.jpg" alt="" /></a>
+
-
</div>
+
-
</div>
+
-
<div class="row quarter no-collapse">
+
-
<div class="6u">
+
-
<a href="#" class="image fit"><img src="images/pic14.jpg" alt="" /></a>
+
-
</div>
+
-
<div class="6u">
+
-
<a href="#" class="image fit"><img src="images/pic15.jpg" alt="" /></a>
+
-
</div>
+
-
</div>
+
</section>
</section>
</div>
</div>
-
<hr />
+
</div>
-
<div class="row">
+
<div class="row double">
-
<div class="12u">
+
<div class="12u">
-
+
 
-
<!-- Contact -->
+
<!-- Contact -->
-
<section class="contact">
+
<section>
-
<header>
+
<h2 class="major"><span>Get in touch</span></h2>
-
<h3>Nisl turpis nascetur interdum?</h3>
+
<ul class="contact">
-
</header>
+
<li><a class="icon fa-facebook" href="#"><span class="label">Facebook</span></a></li>
-
<p>Urna nisl non quis interdum mus ornare ridiculus egestas ridiculus lobortis vivamus tempor aliquet.</p>
+
<li><a class="icon fa-twitter" href="#"><span class="label">Twitter</span></a></li>
-
<ul class="icons">
+
<li><a class="icon fa-instagram" href="#"><span class="label">Instagram</span></a></li>
-
<li><a href="#" class="icon fa-twitter"><span class="label">Twitter</span></a></li>
+
<li><a class="icon fa-dribbble" href="#"><span class="label">Dribbble</span></a></li>
-
<li><a href="#" class="icon fa-facebook"><span class="label">Facebook</span></a></li>
+
<li><a class="icon fa-google-plus" href="#"><span class="label">Google+</span></a></li>
-
<li><a href="#" class="icon fa-instagram"><span class="label">Instagram</span></a></li>
+
</ul>
-
<li><a href="#" class="icon fa-pinterest"><span class="label">Pinterest</span></a></li>
+
</section>
-
<li><a href="#" class="icon fa-dribbble"><span class="label">Dribbble</span></a></li>
+
-
<li><a href="#" class="icon fa-linkedin"><span class="label">Linkedin</span></a></li>
+
-
</ul>
+
-
</section>
+
-
+
-
<!-- Copyright -->
+
-
<div class="copyright">
+
-
<ul class="menu">
+
-
<li>&copy; Untitled. All rights reserved.</li><li>Design: <a href="http://html5up.net">HTML5 UP</a></li>
+
-
</ul>
+
-
</div>
+
-
+
-
</div>
+
</div>
</div>
</div>
</div>
-
</div>
+
 
 +
<!-- Copyright -->
 +
<div id="copyright">
 +
<ul class="menu">
 +
<li>&copy; Untitled. All rights reserved</li><li>Design: <a href="http://html5up.net">HTML5 UP</a></li>
 +
</ul>
 +
</div>
 +
 
 +
</footer>
</body>
</body>
</html>
</html>

Revision as of 19:43, 6 October 2014

TXT by HTML5 UP

A random assortment of icons in circles

And some text that attempts to explain their significance

Phasellus quam turpis, feugiat sit amet ornare in, hendrerit in lectus. Praesent semper mod quis eget mi. Etiam eu
ante risus. Aliquam erat volutpat. Aliquam luctus et mattis lectus amet pulvinar. Nam nec turpis consequat.

A Major Heading

A Subheading

Phasellus quam turpis, feugiat sit amet ornare in, a hendrerit in lectus dolore. Praesent semper mod quis eget sed etiam eu ante risus.

Another Subheading

Phasellus quam turpis, feugiat sit amet ornare in, a hendrerit in lectus dolore. Praesent semper mod quis eget sed etiam eu ante risus.

And Another

Phasellus quam turpis, feugiat sit amet ornare in, a hendrerit in lectus dolore. Praesent semper mod quis eget sed etiam eu ante risus.

And One More

Phasellus quam turpis, feugiat sit amet ornare in, a hendrerit in lectus dolore. Praesent semper mod quis eget sed etiam eu ante risus.

Another Major Heading

Here's a really big heading

With a smaller subtitle that attempts to elaborate

  • 15 minutes ago
  • 8

Phasellus quam turpis, feugiat sit amet ornare in, a hendrerit in lectus. Praesent semper mod quis eget mi. Etiam sed ante risus aliquam erat et volutpat. Praesent a dapibus velit. Curabitur sed nisi nunc, accumsan vestibulum lectus. Lorem ipsum dolor sit non aliquet sed, tempor et dolor. Praesent a dapibus velit. Curabitur accumsan.

Continue Reading