Template:Team:UFMG Brazil/barra

From 2013.igem.org

(Difference between revisions)
 
(101 intermediate revisions not shown)
Line 2: Line 2:
<html>
<html>
-
 
<!-- END Content wrappers -->
<!-- END Content wrappers -->
Line 12: Line 11:
<!-- START Home button -->
<!-- START Home button -->
<ul id="footer-menu" class="dropdown dropdown-basic dropdown-up">
<ul id="footer-menu" class="dropdown dropdown-basic dropdown-up">
-
<li><div class="main-item first"><a href="#" class="home icon tooltip">&#xf015;<span>Home page</span></a></div></li>
+
<li><div class="main-item first"><a href="https://2013.igem.org/Team:UFMG_Brazil" class="home icon tooltip">&#xf015;<span>Home page</span></a></div></li>
</ul>
</ul>
<!-- END Home button -->
<!-- END Home button -->
Line 18: Line 17:
<!-- START Simple menu -->
<!-- START Simple menu -->
<ul id="footer-menu" class="dropdown dropdown-basic dropdown-up">
<ul id="footer-menu" class="dropdown dropdown-basic dropdown-up">
-
<li><div class="main-item">Cardbio <span>+</span></div>
+
<li><div class="main-item"><a href="https://2013.igem.org/Team:UFMG_Brazil/Cardbio" class="mnn">Cardbio <span>+</span></a></div>
<ul class="fade-in">
<ul class="fade-in">
<div class="dropdown-box lvl-1">
<div class="dropdown-box lvl-1">
<!-- First level -->
<!-- First level -->
-
<li><a href="https://2013.igem.org/Team:UFMG_Brazil/Cardbio#The_Problem" class="menu"><span class="icon basic">&#xf0f1;</span>The problem</a></li>
+
<li><a href="https://2013.igem.org/Team:UFMG_Brazil/Theproblem" class="menu"><span class="icon basic">&#xf0f1;</span>The problem</a></li>
-
<li><a href="https://2013.igem.org/Team:UFMG_Brazil/Cardbio#CardBio:_The_Project" class="menu"><span class="icon basic">&#xf044;</span>THe Project</a></li>
+
<li><a href="https://2013.igem.org/Team:UFMG_Brazil/Ourdesign" class="menu"><span class="icon basic">&#xf085;</span>Our design</a></li>
-
<li><a href="https://2013.igem.org/Team:UFMG_Brazil/Cardbio#Our_Design" class="menu"><span class="icon basic">&#xf085;</span>Our design</a></li>
+
                                                <li><a href="https://2013.igem.org/Team:UFMG_Brazil/Biomarkers" class="menu"><i class="icon-screenshot"></i> Biomarkers</a></li>
</div>
</div>
Line 31: Line 30:
</ul>
</ul>
<!-- END Simple menu -->
<!-- END Simple menu -->
 +
<!-- START Left menu -->
 +
<ul id="footer-menu" class="dropdown dropdown-basic dropdown-up">
 +
<li><div class="main-item"><a href="https://2013.igem.org/Team:UFMG_Brazil/Inthelab" class="mnn">In the Lab <span>+</span></a></div>
 +
<!-- First level -->
 +
<ul class="fade-in">
 +
<div class="dropdown-box lvl-1">
 +
                                                                       
 +
<li><a href="https://2013.igem.org/Team:UFMG_Brazil/Notebook" class="menu"><span class="icon basic">&#xf040;</span>Notebook</a>
 +
<!-- Second level -->
 +
 +
</li>
 +
<li><a href="https://2013.igem.org/Team:UFMG_Brazil/Protocols" class="menu"><span class="icon basic">&#xf0cb;</span>Protocols</a></li>
 +
 +
<li><a href="https://2013.igem.org/Team:UFMG_Brazil/Safety" class="menu"><span class="icon basic">&#xf14a;</span>Safety</a>
 +
 +
</li>
 +
 +
<li><a href="https://2013.igem.org/Team:UFMG_Brazil/Results" class="menu"><span class="icon basic">&#xf080;</span>Results</a></li>
 +
 +
</div>
 +
</ul>
 +
</li>
 +
</ul>
 +
<!-- END Left menu -->
<!-- START Extended menu -->
<!-- START Extended menu -->
<ul id="footer-menu" class="dropdown dropdown-basic dropdown-up">
<ul id="footer-menu" class="dropdown dropdown-basic dropdown-up">
-
<li><div class="main-item">Human Practice <span>+</span></div>
+
<li><div class="main-item"><a href="https://2013.igem.org/Team:UFMG_Brazil/Humanpractices" class="mnn">Human Practice <span>+</span></a></div>
<ul class="fade-in">
<ul class="fade-in">
<div class="dropdown-box lvl-1">
<div class="dropdown-box lvl-1">
<!-- First level -->
<!-- First level -->
-
<li class="has-menu"><a href="#" class="menu"><span class="icon">&#xf013;</span>Card Game</a>
+
<li><a href="https://2013.igem.org/Team:UFMG_Brazil/Talks" class="menu"><span><i class="icon-comments-alt"></i></span>Our Talks</a>
-
<!-- Second level -->
+
-
<ul class="fade-in">
+
-
<div class="dropdown-box lvl-2">
+
-
<li><a href="#" class="menu"><span class="icon">&#xf0ac;</span>Webdesign & development</a></li>
+
-
<li class="has-menu"><a href="#" class="menu"><span class="icon">&#xf0d0;</span>Graphic and Stationary</a>
+
-
<ul class="fade-in">
+
-
<div class="dropdown-box lvl-3">
+
-
<li><a href="#" class="menu"><span class="icon">&#xf00c;</span>Logo design</a></li>
+
-
<li><a href="#" class="menu"><span class="icon">&#xf00c;</span>Identity design</a></li>
+
-
<li><a href="#" class="menu"><span class="icon">&#xf00c;</span>Stationary and print</a></li>
+
-
<li class="menu-title"><span>&#xf0d0;</span>Submenu 2</li>
+
-
</div>
+
-
</ul>
+
-
</li>
+
-
<li><a href="#" class="menu"><span class="icon">&#xf0b1;</span>Branding & Marketing</a></li>
+
-
<li class="has-menu"><a href="#" class="menu"><span class="icon">&#xf030;</span>Photography & Editing</a>
+
-
<!-- Third level -->
+
-
<ul class="fade-in">
+
-
<div class="dropdown-box lvl-3">
+
-
<li class="content-full-width">
+
-
<div id="inner-block-1">
+
-
<a href="#" class="overlay-img">
+
-
<img src="http://bios.ligamedica.com/ufmg/images/photography/pic-1.jpg" />
+
-
<div class="overlay-icon icon">&#xf002;</div>
+
-
</a>
+
-
<div class="content">
+
-
<div class="title">My newest photo</div>
+
-
<p>Lorem Ipsum is simply dummy text of the printing and typesetting text.</p>
+
-
<!-- START - Buttons with hover -->
+
-
<p>
+
-
<a href="#" class="button-1 icon tooltip clrfx-2">&#xf0c1;<span>Open Portfolio</span></a>
+
-
<a href="#" class="button-1 icon tooltip clrfx-2">&#xf16d;<span>Visit on Instagram</span></a>
+
-
<a href="http://facebook.com/igemufmg" class="button-1 icon tooltip clrfx-2" target="_blank">&#xf09a;<span>Share on Facebook</span></a>
+
-
<a href="https://twitter.com/iGEMUFMG" class="button-1 icon tooltip clrfx-2" target="_blank">&#xf099;<span>Post it on Twitter</span></a>
+
-
</p>
+
-
<!-- END - Buttons with hover -->
+
-
</div>
+
-
</div>
+
-
</li>
+
-
<li class="content-full-width">
+
-
<div id="inner-block-1">
+
-
<a href="#" class="overlay-img">
+
-
<img src="http://bios.ligamedica.com/ufmg/images/photography/pic-2.jpg" />
+
-
<div class="overlay-icon icon">&#xf002;</div>
+
-
</a>
+
-
<div class="content">
+
-
<div class="title">My other photo</div>
+
-
<p>Lorem Ipsum is simply dummy text of the printing and typesetting text.</p>
+
-
<!-- START - Buttons with hover -->
+
-
<p>
+
-
<a href="#" class="button-1 icon tooltip clrfx-2">&#xf0c1;<span>Open Portfolio</span></a>
+
-
<a href="#" class="button-1 icon tooltip clrfx-2">&#xf16d;<span>Visit on Instagram</span></a>
+
-
<a href="http://facebook.com/igemufmg" class="button-1 icon tooltip clrfx-2" target="_blank">&#xf09a;<span>Share on Facebook</span></a>
+
-
<a href="https://twitter.com/iGEMUFMG" class="button-1 icon tooltip clrfx-2" target="_blank">&#xf099;<span>Post it on Twitter</span></a>
+
-
</p>
+
-
<!-- END - Buttons with hover -->
+
-
</div>
+
-
</div>
+
-
<div class="clrfx-1"></div>
+
-
</li>
+
-
<li class="menu-title"><span>&#xf030;</span>Submenu 2</li>
+
-
</div>
+
-
</ul>
+
-
</li>
+
-
<li><a href="#" class="menu"><span class="icon">&#xf00e;</span>Custom solutions</a></li>
+
-
<li class="menu-title"><span>&#xf013;</span>Submenu 1</li>
+
-
</div>
+
-
</ul>
+
-
</li>
+
-
<li class="has-menu"><a href="#" class="menu"><span class="icon">&#xf04b;</span>MetaLab</a>
+
-
<!-- Second level -->
+
</li>
</li>
-
<li><a href class="menu"><span class="icon">&#xf004;</span>Augmented Reality app</a></li>
+
-
<li class="has-menu"><a href="#" class="menu"><span class="icon">&#xf0ac;</span>BiOS</a>
+
<li><a href="https://2013.igem.org/Team:UFMG_Brazil/Divulgation" class="menu"><span><i class="icon-bullhorn"></i> </span>Divulgation</a></li>
 +
                                                <li><a href="https://2013.igem.org/Team:UFMG_Brazil/Outsidethebox" class="menu"><span><i class="icon-qrcode"></i></span>Thinking Outside of the Box</a></li>
 +
                                               
 +
                                             
<ul class="fade-in">
<ul class="fade-in">
<div class="dropdown-box lvl-2">
<div class="dropdown-box lvl-2">
Line 186: Line 141:
</ul>
</ul>
</li>
</li>
-
<li class="has-menu"><a href="#" class="menu"><span class="icon">&#xf0e0;</span>Seminars</a>
+
-
<!-- Second level -->
+
-
<ul class="fade-in">
+
-
<div class="dropdown-box lvl-2">
+
-
<li class="no-hover">
+
-
<div id="form-1">
+
-
<p class="title">Hi there</p>
+
-
<p class="form-intro">Display your visitors quick contact form so they can get in touch easily.</p>
+
-
<!-- START contact form -->
+
-
<form action="" autocomplete="on" name="contact-1" id="contact-1" method="post">
+
-
<div class="field">
+
-
<select name="subject" id="subject">
+
-
<option disabled="disabled" selected="selected" class="disabled">Regarding</option>
+
-
<option value="Sales">1. We need an offer</option>
+
-
<option value="Marketing">2. We have a proposal</option>
+
-
<option value="Tech support">3. Support and help</option>
+
-
</select>
+
-
<div id="arrow-select"></div>
+
-
<svg id="arrow-select-svg"></svg>
+
-
<p class="icon">&#xf15b;</p>
+
-
</div>
+
-
<div class="field">
+
-
<input name="name" placeholder="Your name" type="text" id="name" class="form-1" required />
+
-
<p class="icon">&#xf007;</p>
+
-
</div>
+
-
<div class="field">
+
-
<input name="email" placeholder="Email address" type="email" id="email" class="form-1" required />
+
-
<p class="icon">&#xf0e0;</p>
+
-
</div>
+
-
<div class="field">
+
-
<input name="company" placeholder="Company" type="text" id="company" class="form-1" required />
+
-
<p class="icon">&#xf0b1;</p>
+
-
</div>
+
-
<div class="field">
+
-
<textarea name="message" placeholder="Enter your message" id="message" class="message" required /></textarea>
+
-
</div>
+
-
<input type="submit" value="Send" class="send" form="contact-1" />
+
-
<input type="checkbox" id="send-copy" name="send-copy" class="check" />
+
-
<label for="send-copy" class="check"><span></span>Send a copy to my email</label>
+
-
</form>
+
-
<!-- END contact form -->
+
-
</div>
+
-
</li>
+
-
<li class="menu-title"><span>&#xf0e0;</span>Contact form</li>
+
-
</div>
+
-
</ul>
+
</li>
</li>
</div>
</div>
Line 238: Line 148:
</ul>
</ul>
<!-- END Extended menu -->
<!-- END Extended menu -->
-
 
+
-
<!-- START Left menu -->
+
 +
<!-- START Right menu -->
<ul id="footer-menu" class="dropdown dropdown-basic dropdown-up">
<ul id="footer-menu" class="dropdown dropdown-basic dropdown-up">
-
<li><div class="main-item">In the Lab <span>+</span></div>
+
<li><div class="main-item"><a href="https://2013.igem.org/Team:UFMG_Brazil/Modeling" class="mnn">Modeling <span>+</span></div>
<!-- First level -->
<!-- First level -->
-
<ul class="fade-in">
+
<ul class="fade-in right">
-
<div class="dropdown-box lvl-1">
+
<div class="dropdown-box lvl-1 right">
-
                                                                        <li><a href="https://2013.igem.org/Team:UFMG_Brazil/lab#Parts" class="menu"><span class="icon basic">&#xf013;</span>Parts</a></li>
+
<li><a href="https://2013.igem.org/Team:UFMG_Brazil/TMAO" class="menu"><span><i class="icon-signal"></i></span>TMAO</a></li>
-
                                                                        <li><a href="https://2013.igem.org/Team:UFMG_Brazil/lab#Notebook" class="menu"><span class="icon basic">&#xf040;</span>Notebook</a></li>
+
<li><a href="https://2013.igem.org/Team:UFMG_Brazil/IMA" class="menu"><span><i class="icon-signal"></i></span>IMA</a></li>
-
                        <li><a href="https://2013.igem.org/Team:UFMG_Brazil/lab#Protocols" class="menu"><span class="icon basic">&#xf0cb;</span>Protocols</a></li>
+
-
                                                                        <li class="has-menu"><a href="https://2013.igem.org/Team:UFMG_Brazil/lab#Safety" class="menu"><span class="icon basic">&#xf14a;</span>Safety</a>
+
                                               
-
<!-- Second level -->
+
-
<ul class="fade-in">
+
-
<div class="dropdown-box lvl-2">
+
-
                                                                                                                          <li><a href="#" class="menu"><span class="icon basic">&#xf0da;</span>Course</a></li>
+
-
<li><a href="#" class="menu"><span class="icon basic">&#xf0da;</span>Hazard</a></li>
+
-
<li><a href="#" class="menu"><span class="icon basic">&#xf0da;</span>Provision</a></li>
+
-
<li class="menu-title"><span>&#xf124;</span>Safety</li>
+
-
</div>
+
-
</ul>
+
-
</li>
+
-
+
-
<li><a href="https://2013.igem.org/Team:UFMG_Brazil/lab#Experiments" class="menu"><span class="icon basic">&#xf043;</span>Experiments</a></li>
+
-
<li><a href="https://2013.igem.org/Team:UFMG_Brazil/lab#Results" class="menu"><span class="icon basic">&#xf080;</span>Results</a></li>
+
-
+
</div>
</div>
</ul>
</ul>
</li>
</li>
</ul>
</ul>
-
<!-- END Left menu -->
+
<!-- END Right menu -->
-
<!-- START Right menu -->
+
<!-- START Right menu -->
<ul id="footer-menu" class="dropdown dropdown-basic dropdown-up">
<ul id="footer-menu" class="dropdown dropdown-basic dropdown-up">
-
<li><div class="main-item">Modeling <span>+</span></div>
+
<li><div class="main-item"><a href="https://2013.igem.org/Team:UFMG_Brazil/Ourteam" class="mnn">Our team <span>+</span></div>
<!-- First level -->
<!-- First level -->
<ul class="fade-in right">
<ul class="fade-in right">
<div class="dropdown-box lvl-1 right">
<div class="dropdown-box lvl-1 right">
-
<li><a href="#" class="menu"><span class="icon basic">&#xf0da;</span>Home</a></li>
+
<li><a href="https://2013.igem.org/Team:UFMG_Brazil/UFMG" class="menu"><span class="icon basic">&#xf136;</span>Get to Know UFMG</a></li>
-
<li class="has-menu right"><a href="#" class="menu"><span class="icon basic">&#xf0da;</span>Our services</a>
+
<li><a href="https://2013.igem.org/Team:UFMG_Brazil/Team" class="menu"><span class="icon basic">&#xf0c0;</span>Team</a>
-
<!-- Second level -->
+
-
<ul class="fade-in right">
+
-
<div class="dropdown-box lvl-2 right">
+
-
<li><a href="#" class="menu"><span class="icon basic">&#xf0da;</span>Webdesign and development</a></li>
+
-
<li><a href="#" class="menu"><span class="icon basic">&#xf0da;</span>Graphic and Stationary design</a></li>
+
-
<li><a href="#" class="menu"><span class="icon basic">&#xf0da;</span>Logo design</a></li>
+
-
<li><a href="#" class="menu"><span class="icon basic">&#xf0da;</span>Identity design</a></li>
+
-
<li><a href="#" class="menu"><span class="icon basic">&#xf0da;</span>Stationary and print</a></li>
+
-
<li class="menu-title"><span>&#xf124;</span>Submenu with title</li>
+
-
</div>
+
-
</ul>
+
-
</li>
+
-
<li><a href="#" class="menu"><span class="icon basic">&#xf0da;</span>Portfolio</a></li>
+
-
<li><a href="#" class="menu"><span class="icon basic">&#xf0da;</span>News</a></li>
+
-
<li><a href="#" class="menu"><span class="icon basic">&#xf0da;</span>Meet the team</a></li>
+
-
<li><a href="#" class="menu"><span class="icon basic">&#xf0da;</span>Contact us</a></li>
+
-
<li><a href="#" class="menu"><span class="icon basic">&#xf0da;</span>Daily specials</a></li>
+
-
</div>
+
-
</ul>
+
-
</li>
+
-
</ul>
+
-
 
+
-
 
+
-
<!-- START Content in tabs preview -->
+
-
<ul id="footer-menu" class="dropdown dropdown-basic dropdown-up">
+
-
<li><div class="main-item">Our Team <span>+</span></div>
+
-
<!-- First level -->
+
-
<ul class="fade-in center">
+
-
<div class="dropdown-box lvl-1 center">
+
-
<li class="no-hover">
+
-
<div id="columns">
+
-
<div class="column-820 no-margin-padding">
+
-
<div id="tabs">
+
-
<!-- START tabs pagination -->
+
-
<input id="tab-1-wide" type="radio" class="tab-1-wide-selector first" name="tab-group-2" checked="checked" />
+
-
<label for="tab-1-wide" class="tab-label-1">1</label>
+
-
 
+
-
<input id="tab-2-wide" type="radio" class="tab-2-wide-selector second" name="tab-group-2" />
+
-
<label for="tab-2-wide" class="tab-label-2">2</label>
+
-
 
+
-
<input id="tab-3-wide" type="radio" class="tab-3-wide-selector third" name="tab-group-2" />
+
-
<label for="tab-3-wide" class="tab-label-3">3</label>
+
-
 
+
-
<input id="tab-4-wide" type="radio" class="tab-4-wide-selector fourth" name="tab-group-2" />
+
-
<label for="tab-4-wide" class="tab-label-4">4</label>
+
-
<!-- END tabs pagination -->
+
-
 
+
-
<!-- START tabs content -->
+
-
<div class="tab-wrapper wide">
+
-
<!-- First tab -->
+
-
<div class="tab-1-wide no-margin-padding">
+
-
<a href="#" class="overlay-img">
+
-
<img src="http://bios.ligamedica.com/ufmg/images/tabs/pic-1.jpg" />
+
-
<div class="overlay-text">
+
-
<span class="icon">&#xf002;</span>
+
-
<div class="overlay-title">Image title</div>
+
-
<p>with a short and snappy caption</p>
+
-
</div>
+
-
</a>
+
-
<div class="column-397 no-margin-padding">
+
-
<div class="title">Content elements</div>
+
-
<div class="category">Posted in <a href="#" class="link-1">Lorem ipsum category</a></div>
+
-
<p>Display any content with style <b class="dark">within CSS3 animated tabs</b>, which can hold videos, images, text or tables for clean and visible content <b class="color">presentation</b> or as a single element in your layout.</p>
+
-
<cite class="bubble-2">This is a simple bubble for additional visual impact for some special content.</cite>
+
-
<cite class="bubble-3">This is another speach bubble with different background, which can be easily changed.</cite>
+
-
<div class="clrfx-3"></div>
+
-
<cite class="cite-1">This is a cite, which can be used for various purpouses for content and important messages highlighting.</cite>
+
-
<cite class="cite-2">This is another cite with different background which can be used for various purpouses for content and important messages highlighting.</cite>
+
-
</div>
+
-
</div>
+
-
<!-- Second tab -->
+
-
<div class="tab-2-wide no-margin-padding">
+
-
<div class="title">Clean tables</div>
+
-
<p>Display your data or quick info within <b class="dark">transparent and clean</b> table view.</p>
+
-
<div class="clrfx-4"></div>
+
-
<div id="table">
+
-
<!-- Table column titles -->
+
-
<div class="table-row column-title">
+
-
<div class="cell first column-title">Headline</div>
+
-
<div class="cell column-title">Title 1</div>
+
-
<div class="cell column-title">Title 2</div>
+
-
<div class="cell column-title">Title 3</div>
+
-
<div class="cell column-title">Title 4</div>
+
-
<div class="cell column-title dark">Title 5</div>
+
-
<div class="cell column-title dark">Title 6</div>
+
-
<div class="cell column-title">Title 7</div>
+
-
<div class="cell column-title">Title 8</div>
+
-
</div>
+
-
<!-- Row 1 -->
+
-
<div class="table-row">
+
-
<div class="cell first">1. Data<span class="icon">&#xf0b1;</span></div>
+
-
<div class="cell">Data 1</div>
+
-
<div class="cell">Data 2</div>
+
-
<div class="cell">Data 3</div>
+
-
<div class="cell">Data 4</div>
+
-
<div class="cell dark">Data 5<span class="icon">&#xf00c;</span></div>
+
-
<div class="cell dark">Data 6<span class="icon">&#xf00c;</span></div>
+
-
<div class="cell">Data 7</div>
+
-
<div class="cell">Data 8</div>
+
-
</div>
+
-
<!-- Row 2 -->
+
-
<div class="table-row even">
+
-
<div class="cell first even">2. Data<span class="icon">&#xf011;</span></div>
+
-
<div class="cell">Data 1</div>
+
-
<div class="cell">Data 2</div>
+
-
<div class="cell">Data 3</div>
+
-
<div class="cell">Data 4</div>
+
-
<div class="cell dark">Data 5<span class="icon">&#xf00c;</span></div>
+
-
<div class="cell dark">Data 6<span class="icon">&#xf00c;</span></div>
+
-
<div class="cell">Data 7</div>
+
-
<div class="cell">Data 8</div>
+
-
</div>
+
-
<!-- Row 3 -->
+
-
<div class="table-row">
+
-
<div class="cell first">3. Data<span class="icon">&#xf02f;</span></div>
+
-
<div class="cell">Data 1</div>
+
-
<div class="cell">Data 2</div>
+
-
<div class="cell">Data 3</div>
+
-
<div class="cell">Data 4</div>
+
-
<div class="cell dark">Data 5<span class="icon">&#xf00c;</span></div>
+
-
<div class="cell dark">Data 6<span class="icon">&#xf00c;</span></div>
+
-
<div class="cell">Data 7</div>
+
-
<div class="cell">Data 8</div>
+
-
</div>
+
-
<!-- Row 4 -->
+
-
<div class="table-row even">
+
-
<div class="cell first even">4. Data<span class="icon">&#xf06b;</span></div>
+
-
<div class="cell">Data 1</div>
+
-
<div class="cell">Data 2</div>
+
-
<div class="cell">Data 3</div>
+
-
<div class="cell">Data 4</div>
+
-
<div class="cell dark">Data 5<span class="icon">&#xf00c;</span></div>
+
-
<div class="cell dark">Data 6<span class="icon">&#xf00c;</span></div>
+
-
<div class="cell">Data 7</div>
+
-
<div class="cell">Data 8</div>
+
-
</div>
+
-
<!-- Row 5 -->
+
-
<div class="table-row">
+
-
<div class="cell first">5. Data<span class="icon">&#xf079;</span></div>
+
-
<div class="cell">Data 1</div>
+
-
<div class="cell">Data 2</div>
+
-
<div class="cell">Data 3</div>
+
-
<div class="cell">Data 4</div>
+
-
<div class="cell dark">Data 5<span class="icon">&#xf00c;</span></div>
+
-
<div class="cell dark">Data 6<span class="icon">&#xf00c;</span></div>
+
-
<div class="cell">Data 7</div>
+
-
<div class="cell">Data 8</div>
+
-
</div>
+
-
<!-- Row 6 -->
+
-
<div class="table-row even">
+
-
<div class="cell first even">6. Data<span class="icon">&#xf06c;</span></div>
+
-
<div class="cell">Data 1</div>
+
-
<div class="cell">Data 2</div>
+
-
<div class="cell">Data 3</div>
+
-
<div class="cell">Data 4</div>
+
-
<div class="cell dark">Data 5<span class="icon">&#xf00c;</span></div>
+
-
<div class="cell dark">Data 6<span class="icon">&#xf00c;</span></div>
+
-
<div class="cell">Data 7</div>
+
-
<div class="cell">Data 8</div>
+
-
</div>
+
-
</div>
+
-
</div>
+
-
<!-- Third tab -->
+
-
<div class="tab-3-wide no-margin-padding">
+
-
<!-- Icons present -->
+
-
<div class="title">Scalable icons</div>
+
-
<p>Font Awesome icons are scalable and Retina ready to fit any layout and design. They are easy to use anywhere.</p>
+
-
<div class="clrfx-4"></div>
+
-
<!-- Row 1 -->
+
-
<div class="column-115 narrow-margin"><a href="#" class="link-1"><span class="icon">&#xf000;</span> Glass</a></div>
+
-
<div class="column-115 narrow-margin"><a href="#" class="link-1"><span class="icon">&#xf086;</span> Comment</a></div>
+
-
<div class="column-115 narrow-margin"><a href="#" class="link-1"><span class="icon">&#xf0e4;</span> Dashboard</a></div>
+
-
<div class="column-115 narrow-margin"><a href="#" class="link-1"><span class="icon">&#xf0f3;</span> Bell</a></div>
+
-
<div class="column-115 narrow-margin"><a href="#" class="link-1"><span class="icon">&#xf0e0;</span> Envelope</a></div>
+
-
<div class="column-115 narrow-margin last"><a href="#" class="link-1"><span class="icon">&#xf0e2;</span> Undo</a></div>
+
-
<!-- Row 2 -->
+
-
<div class="column-115 narrow-margin"><a href="#" class="link-1"><span class="icon">&#xf0ae;</span> Tasks</a></div>
+
-
<div class="column-115 narrow-margin"><a href="#" class="link-1"><span class="icon">&#xf073;</span> Calendar</a></div>
+
-
<div class="column-115 narrow-margin"><a href="#" class="link-1"><span class="icon">&#xf004;</span> Heart</a></div>
+
-
<div class="column-115 narrow-margin"><a href="#" class="link-1"><span class="icon">&#xf013;</span> Cog</a></div>
+
-
<div class="column-115 narrow-margin"><a href="#" class="link-1"><span class="icon">&#xf002;</span> Search</a></div>
+
-
<div class="column-115 narrow-margin last"><a href="#" class="link-1"><span class="icon">&#xf00e;</span> Zoom</a></div>
+
-
<!-- Row 3 -->
+
-
<div class="column-115 narrow-margin"><a href="#" class="link-1"><span class="icon">&#xf012;</span> Signal</a></div>
+
-
<div class="column-115 narrow-margin"><a href="#" class="link-1"><span class="icon">&#xf02b;</span> Tag</a></div>
+
-
<div class="column-115 narrow-margin"><a href="#" class="link-1"><span class="icon">&#xf030;</span> Camera</a></div>
+
-
<div class="column-115 narrow-margin"><a href="#" class="link-1"><span class="icon">&#xf06c;</span> Leaf</a></div>
+
-
<div class="column-115 narrow-margin"><a href="#" class="link-1"><span class="icon">&#xf06b;</span> Gift</a></div>
+
-
<div class="column-115 narrow-margin last"><a href="#" class="link-1"><span class="icon">&#xf07a;</span> Cart</a></div>
+
-
<!-- Row 4 -->
+
-
<div class="column-115 narrow-margin"><a href="#" class="link-1"><span class="icon">&#xf07b;</span> Folder</a></div>
+
-
<div class="column-115 narrow-margin"><a href="#" class="link-1"><span class="icon">&#xf187;</span> Archive</a></div>
+
-
<div class="column-115 narrow-margin"><a href="#" class="link-1"><span class="icon">&#xf15b;</span> File</a></div>
+
-
<div class="column-115 narrow-margin"><a href="#" class="link-1"><span class="icon">&#xf0c6;</span> Paper clip</a></div>
+
-
<div class="column-115 narrow-margin"><a href="#" class="link-1"><span class="icon">&#xf0c7;</span> Save</a></div>
+
-
<div class="column-115 narrow-margin last"><a href="#" class="link-1"><span class="icon">&#xf0ea;</span> Copy</a></div>
+
-
<!-- Row 5 -->
+
-
<div class="column-115 narrow-margin"><a href="#" class="link-1"><span class="icon">&#xf074;</span> Random</a></div>
+
-
<div class="column-115 narrow-margin"><a href="#" class="link-1"><span class="icon">&#xf164;</span> Thumb up</a></div>
+
-
<div class="column-115 narrow-margin"><a href="#" class="link-1"><span class="icon">&#xf165;</span> Thumb down</a></div>
+
-
<div class="column-115 narrow-margin"><a href="#" class="link-1"><span class="icon">&#xf065;</span> Resize</a></div>
+
-
<div class="column-115 narrow-margin"><a href="#" class="link-1"><span class="icon">&#xf047;</span> Move</a></div>
+
-
<div class="column-115 narrow-margin last"><a href="#" class="link-1"><span class="icon">&#xf021;</span> Refresh</a></div>
+
-
<!-- Row 6 -->
+
-
<div class="column-115 narrow-margin"><a href="#" class="link-1"><span class="icon">&#xf09e;</span> Rss feed</a></div>
+
-
<div class="column-115 narrow-margin"><a href="http://facebook.com/igemufmg" class="link-1" target="_blank"><span class="icon">&#xf09a;</span> Facebook</a></div>
+
-
<div class="column-115 narrow-margin"><a href="https://twitter.com/iGEMUFMG" class="link-1" target="_blank"><span class="icon">&#xf099;</span> Twitter</a></div>
+
-
<div class="column-115 narrow-margin"><a href="https://plus.google.com/u/0/b/103630184189550084798/103630184189550084798/" class="link-1" target="_blank"><span class="icon">&#xf0d5;</span> Google Plus</a></div>
+
-
<div class="column-115 narrow-margin"><a href="#" class="link-1"><span class="icon">&#xf0d2;</span> Pinterest</a></div>
+
-
<div class="column-115 narrow-margin last"><a href="http://fortawesome.github.io/Font-Awesome/cheatsheet/" class="link-1"><span class="icon">&#xf0c1;</span>&amp; more...</a></div>
+
-
</div>
+
-
<!-- Fourth tab -->
+
-
<div class="tab-4-wide no-margin-padding">
+
-
<div class="title">Columns and rows grid for menu content</div>
+
-
<p>Adjust your layout and display content easily with a <b class="dark">sticky footer grid</b>, which is set to a 6 different widths.</p>
+
-
<div class="clrfx-4"></div>
+
-
<!-- Row 1 -->
+
-
<div class="column-115 bg">115px</div>
+
-
<div class="column-115 bg">115px</div>
+
-
<div class="column-115 bg">115px</div>
+
-
<div class="column-115 bg">115px</div>
+
-
<div class="column-115 bg">115px</div>
+
-
<div class="column-115 bg last">115px</div>
+
-
<!-- Row 2 -->
+
-
<div class="column-256 bg">256px</div>
+
-
<div class="column-115 bg">115px</div>
+
-
<div class="column-115 bg">115px</div>
+
-
<div class="column-115 bg">115px</div>
+
-
<div class="column-115 bg last">115px</div>
+
-
<!-- Row 3 -->
+
-
<div class="column-397 bg">397px</div>
+
-
<div class="column-115 bg">115px</div>
+
-
<div class="column-115 bg">115px</div>
+
-
<div class="column-115 bg last">115px</div>
+
-
<!-- Row 4 -->
+
-
<div class="column-538 bg">538px</div>
+
-
<div class="column-115 bg">115px</div>
+
-
<div class="column-115 bg last">115px</div>
+
-
<!-- Row 5 -->
+
-
<div class="column-679 bg">679px</div>
+
-
<div class="column-115 bg last">115px</div>
+
-
<!-- Row 6 -->
+
-
<div class="column-820 bg last">820px</div>
+
-
</div>
+
-
</div>
+
-
</div>
+
-
</div>
+
-
</div>
+
</li>
</li>
-
<li class="menu-title"><span>&#xf040;</span>Content elemtents preview</li>
+
                                             
 +
                                                <li><a href="https://2013.igem.org/Team:UFMG_Brazil/Acknowledgment" class="menu"><span class="icon basic">&#xf0a3;</span>Acknowledgment</a></li>
</div>
</div>
</ul>
</ul>
</li>
</li>
</ul>
</ul>
-
<!-- START Content in tabs preview -->
+
<!-- END Right menu -->
<!-- START Sitemap menu -->
<!-- START Sitemap menu -->
Line 543: Line 194:
<div class="column-538 no-margin-padding">
<div class="column-538 no-margin-padding">
<div class="column-256 no-padding">
<div class="column-256 no-padding">
-
<div class="title">Basic layout</div>
+
<div class="title">iGEM UFMG 2013</div>
-
<div class="sub-title">1. Home</div>
+
<div class="sub-title">1. Cardbio</div>
-
<div class="row"><span class="icon">&#xf0da;</span><a href="#" class="link-1">Lorem ipsum</a></div>
+
<div class="row"><span class="icon">&#xf0da;</span><a href="https://2013.igem.org/Team:UFMG_Brazil/Theproblem" class="link-1">The problem </a></div>
-
<div class="row"><span class="icon">&#xf0da;</span><a href="#" class="link-1">Adipiscing </a></div>
+
<div class="row"><span class="icon">&#xf0da;</span><a href="https://2013.igem.org/Team:UFMG_Brazil/Ourdesign" class="link-1">Our design</a></div>
-
<div class="row"><span class="icon">&#xf0da;</span><a href="#" class="link-1">Nisi dis risus</a></div>
+
<div class="row"><span class="icon">&#xf0da;</span><a href="https://2013.igem.org/Team:UFMG_Brazil/Biomarkers" class="link-1">Biomarkers</a></div>
-
<div class="row"><span class="icon">&#xf0da;</span><a href="#" class="link-1">Tempor sociis</a></div>
+
<div class="sub-title">2. In the Lab</div>
-
<div class="sub-title">2. Services</div>
+
<div class="row"><span class="icon">&#xf0da;</span><a href="https://2013.igem.org/Team:UFMG_Brazil/Notebook" class="link-1">Notebook</a></div>
-
<div class="row"><span class="icon">&#xf0da;</span><a href="#" class="link-1">Sit mauris in</a></div>
+
<div class="row"><span class="icon">&#xf0da;</span><a href="https://2013.igem.org/Team:UFMG_Brazil/Protocols" class="link-1">Protocols</a></div>
-
<div class="row"><span class="icon">&#xf0da;</span><a href="#" class="link-1">Et enim arcu</a></div>
+
<div class="row"><span class="icon">&#xf0da;</span><a href="https://2013.igem.org/Team:UFMG_Brazil/Safety" class="link-1">Safety</a></div>
-
<div class="row"><span class="icon">&#xf0da;</span><a href="#" class="link-1">Auctor</a></div>
+
-
<div class="row"><span class="icon">&#xf0da;</span><a href="#" class="link-1">Risus purus ac nec tortor</a></div>
+
                                                                                <div class="row"><span class="icon">&#xf0da;</span><a href="https://2013.igem.org/Team:UFMG_Brazil/Results" class="link-1">Results</a></div>
-
<div class="sub-title">3. Partners and external links</div>
+
<div class="sub-title">3. Human practice</div>
-
<div class="row"><span class="icon">&#xf08e;</span><a href="#" class="link-1">Tincidunt enim</a></div>
+
<div class="row"><span class="icon">&#xf0da;</span><a href="https://2013.igem.org/Team:UFMG_Brazil/Talks" class="link-1">Our Talks</a></div>
-
<div class="row"><span class="icon">&#xf08e;</span><a href="#" class="link-1">Tempor sociis tincidunt</a></div>
+
<div class="row"><span class="icon">&#xf0da;</span><a href="https://2013.igem.org/Team:UFMG_Brazil/Divulgation" class="link-1">Divulgation</a></div>
-
<div class="row"><span class="icon">&#xf08e;</span><a href="#" class="link-1">Augue lacus</a></div>
+
<div class="row"><span class="icon">&#xf0da;</span><a href="https://2013.igem.org/Team:UFMG_Brazil/Outsidethebox" class="link-1">Thinking Outside of the Box</a></div>
-
<div class="row"><span class="icon">&#xf08e;</span><a href="#" class="link-1">Sit mauris in</a></div>
+
</div>
</div>
<div class="column-256 no-padding last">
<div class="column-256 no-padding last">
-
<div class="title">Table layout</div>
+
<div class="row">
-
<div class="sub-title">1. Home</div>
+
 
-
<div class="row"><span class="icon">&#xf105;</span><a href="#" class="link-1">Lorem ipsum</a></div>
+
<div class="sub-title">4. Modeling</div>
-
<div class="row even"><span class="icon">&#xf105;</span><a href="#" class="link-1">Adipiscing </a></div>
+
<div class="row"><span class="icon">&#xf0da;</span><a href="https://2013.igem.org/Team:UFMG_Brazil/TMAO" class="link-1">TMAO</a></div>
-
<div class="row"><span class="icon">&#xf105;</span><a href="#" class="link-1">Nisi dis risus</a></div>
+
<div class="row"><span class="icon">&#xf0da;</span><a href="https://2013.igem.org/Team:UFMG_Brazil/IMA" class="link-1">IMA</a></div>
-
<div class="row even"><span class="icon">&#xf105;</span><a href="#" class="link-1">Tempor sociis</a></div>
+
 
-
<div class="sub-title">2. Services</div>
+
<div class="sub-title">5. Our Team</div>
-
<div class="row"><span class="icon">&#xf105;</span><a href="#" class="link-1">Sit mauris in</a></div>
+
<div class="row"><span class="icon">&#xf0da;</span><a href="https://2013.igem.org/Team:UFMG_Brazil/UFMG" class="link-1">Get to Know UFMG</a></div>
-
<div class="row even"><span class="icon">&#xf105;</span><a href="#" class="link-1">Et enim arcu</a></div>
+
<div class="row"><span class="icon">&#xf0da;</span><a href="https://2013.igem.org/Team:UFMG_Brazil/Team" class="link-1">Team</a></div>
-
<div class="row"><span class="icon">&#xf105;</span><a href="#" class="link-1">Auctor</a></div>
+
<div class="row"><span class="icon">&#xf0da;</span><a href="https://2013.igem.org/Team:UFMG_Brazil/Acknowledgment" class="link-1">Acknowledgement</a></div>
-
<div class="row even"><span class="icon">&#xf105;</span><a href="#" class="link-1">Risus purus ac nec tortor</a></div>
+
-
<div class="sub-title">3. Partners and external links</div>
+
-
<div class="row"><span class="icon">&#xf08e;</span><a href="#" class="link-1">Tincidunt enim</a></div>
+
-
<div class="row even"><span class="icon">&#xf08e;</span><a href="#" class="link-1">Tempor sociis tincidunt</a></div>
+
-
<div class="row"><span class="icon">&#xf08e;</span><a href="#" class="link-1">Augue lacus</a></div>
+
-
<div class="row even"><span class="icon">&#xf08e;</span><a href="#" class="link-1">Sit mauris in</a></div>
+
</div>
</div>
</div>
</div>
</div>
</div>
</li>
</li>
-
<li class="menu-title right"><span>&#xf0c1;</span>Sitemap and links demo</li>
+
<li class="menu-title right"><span>&#xf0c1;</span>Brazil_UFMG Wiki Sitemap</li>
</div>
</div>
</ul>
</ul>
</li>
</li>
</ul>
</ul>
-
<!-- END Sitemap menu -->
+
 +
 
 +
 
<!-- START Copyright -->
<!-- START Copyright -->
Line 595: Line 243:
<a href="http://twitter.com/iGEMUFMG" class="icon tooltip" target="_blank">&#xf099;<span>Tweet with us</span></a>
<a href="http://twitter.com/iGEMUFMG" class="icon tooltip" target="_blank">&#xf099;<span>Tweet with us</span></a>
<a href="http://plus.google.com/u/0/b/103630184189550084798/103630184189550084798/" class="icon tooltip" target="_blank">&#xf0d5;<span>Find us on Google</span></a>
<a href="http://plus.google.com/u/0/b/103630184189550084798/103630184189550084798/" class="icon tooltip" target="_blank">&#xf0d5;<span>Find us on Google</span></a>
-
<a href="#" class="icon tooltip">&#xf0e1;<span>Meet up on Linkedin</span></a>
+
</div>
</div>
</div>
</div>
Line 609: Line 257:
<article class="expanded-content-440">
<article class="expanded-content-440">
<div id="columns-expanded">
<div id="columns-expanded">
-
<div class="title">Hey, you found a secret pocket</div>
+
<div class="title">Hey, you found our secret pocket!</div>
-
<p><b class="dark">This is a hidden section with a grid for expanded content.</b></p>
+
-
<p>It's avaliable for you to present additional content, links, insert a quick contact form or suprise your visitors with a special offer. We'll leave imagination to you.</p>
+
<div class="clrfx-4"></div>
<div class="clrfx-4"></div>
-
<!-- Row 1 -->
+
 
-
<div class="column-145 bg">145px</div>
+
<div class="column-658 bg"><img src='https://static.igem.org/mediawiki/2013/2/26/Epcb.jpg'></div>
-
<div class="column-145 bg">145px</div>
+
 
-
<div class="column-145 bg">145px</div>
+
-
<div class="column-145 bg">145px</div>
+
-
<div class="column-145 bg">145px</div>
+
-
<div class="column-145 bg last">145px</div>
+
-
<!-- Row 2 -->
+
-
<div class="column-316 bg">316px</div>
+
-
<div class="column-145 bg">145px</div>
+
-
<div class="column-145 bg">145px</div>
+
-
<div class="column-145 bg">145px</div>
+
-
<div class="column-145 bg last">145px</div>
+
-
<!-- Row 3 -->
+
-
<div class="column-487 bg">487px</div>
+
-
<div class="column-145 bg">145px</div>
+
-
<div class="column-145 bg">145px</div>
+
-
<div class="column-145 bg last">145px</div>
+
-
<!-- Row 4 -->
+
-
<div class="column-658 bg">658px</div>
+
-
<div class="column-145 bg">145px</div>
+
-
<div class="column-145 bg last">145px</div>
+
-
<!-- Row 5 -->
+
-
<div class="column-829 bg">829px</div>
+
-
<div class="column-145 bg last">145px</div>
+
-
<!-- Row 6 -->
+
-
<div class="column-1000 bg last">1000px</div>
+
</div>
</div>
</article>
</article>

Latest revision as of 00:20, 29 October 2013

Retrieved from "http://2013.igem.org/Template:Team:UFMG_Brazil/barra"