Team:UANL Mty-Mexico BETA

From 2014.igem.org

(Difference between revisions)
Line 1: Line 1:
-
{{Team:Calgary/Main}}
+
<!DOCTYPE html>
 +
<!--
 +
Template Name: The Modernist
 +
Author: <a href="http://www.os-templates.com/">OS Templates</a>
 +
Author URI: http://www.os-templates.com/
 +
Licence: Free to use under our free template licence terms
 +
Licence URI: http://www.os-templates.com/template-terms
 +
-->
<html>
<html>
-
<head>
+
<head>
-
<link href="https://2013.igem.org/Team:Calgary/StyleSheets/HomePage?action=raw&ctype=text/css"rel="stylesheet">
+
<title>The Modernist</title>
-
<script>
+
<meta charset="utf-8">
-
$(document).ready(function() {
+
<link rel="stylesheet" href="layout/styles/layout.css" type="text/css">
-
//Display slider for Javascript users
+
</head>
-
$('#Slider').css('display', 'block');
+
<body id="top">
-
+
<!-- ################################################################################################ -->  
-
//Set height of slider (16/5 ratio)
+
<!-- ################################################################################################ -->
-
$('#Slider').css('height', ($('body').width() / 3.2));
+
<!-- ################################################################################################ -->
-
+
<div class="wrapper row1">
-
//Position right/left arrows
+
  <!-- ################################################################################################ -->
-
var BarHeight = $('#Slider').height() - $('#BottomLinks').height();
+
  <header id="header" class="clear">
-
$('#LeftBar, #RightBar').css('height', BarHeight);
+
    <!-- ################################################################################################ -->
-
$('#LeftArrow, #RightArrow').css('top', (BarHeight-60)/2);
+
    <div id="logo">
-
 
+
      <h1><a href="index.html">The Modernist</a></h1>
-
//Repeats for window resize
+
      <p>Free Website Template</p>
-
$(window).resize(function() {
+
    </div>
-
$('#Slider').css('height', ($('body').width() / 3.2));
+
    <nav>
-
+
      <ul class="clear">
-
var BarHeight = $('#Slider').height() - $('#BottomLinks').height();
+
        <li class="active"><a href="index.html">Home</a></li>
-
$('#LeftBar, #RightBar').css('height', BarHeight);
+
        <li><a class="drop" href="#">Pages</a>
-
$('#LeftArrow, #RightArrow').css('top', (BarHeight-60)/2);
+
          <ul>
-
});
+
            <li><a href="pages/gallery.html">Gallery</a></li>
-
+
            <li><a href="pages/full-width.html">Full Width</a></li>
-
var TotalSlides = $('.Slides').length;
+
            <li><a href="pages/sidebar-left.html">Sidebar Left</a></li>
-
var CurrentSlide = 0;
+
            <li><a href="pages/sidebar-right.html">Sidebar Right</a></li>
-
 
+
          </ul>
-
$('#RightArrow').click(function() {
+
        </li>
-
CurrentSlide = ++CurrentSlide % TotalSlides;
+
        <li><a href="#">Link Text</a></li>
-
changeSlide(CurrentSlide);
+
        <li><a href="#">Link Text</a></li>
-
});
+
        <li><a href="#">Link Text</a></li>
-
+
        <li><a href="#">Link Text</a></li>
-
$('#LeftArrow').click(function() {
+
      </ul>
-
CurrentSlide = (CurrentSlide + TotalSlides - 1) % TotalSlides;
+
    </nav>
-
changeSlide(CurrentSlide);
+
    <!-- ################################################################################################ -->
-
});
+
  </header>
-
+
  <!-- ################################################################################################ -->
-
$('.SlideLink').click(function() {
+
  <div id="slider" class="jcarousel-wrapper">
-
var ClickedSlide = $(this).attr('id');
+
    <div id="slider_content" class="jcarousel">
-
CurrentSlide = parseInt(ClickedSlide.replace('Link', ''));
+
      <ul>
-
changeSlide(CurrentSlide);
+
        <li>
-
});
+
          <figure><a href="#"><img src="images/slider/1.png" alt=""></a>
-
+
            <figcaption>
-
function changeSlide(num){
+
              <h2>Cursus penati saccum nulla.</h2>
-
var SlideID = '#Slide' + num;
+
              <p>Nullamlacus dui ipsum conseque loborttis non euisque morbi penas dapibulum orna. Urnaultrices quis curabitur phasellentesque congue magnis vestibulum quismodo nulla et feugiat adipiscinia pellentum leo&hellip;</p>
-
$('.Slides').css('display', 'none');
+
              <footer><a href="#">Read More Here &raquo;</a></footer>
-
$(SlideID).css('display', 'block');
+
            </figcaption>
-
}
+
          </figure>
-
});
+
        </li>
-
</script>
+
        <li>
-
</head>
+
          <figure><a href="#"><img src="images/slider/2.png" alt=""></a>
-
+
            <figcaption>
-
<body>
+
              <h2>Cursus penati saccum nulla.</h2>
-
<section id="HomePageContent">
+
              <p>Nullamlacus dui ipsum conseque loborttis non euisque morbi penas dapibulum orna. Urnaultrices quis curabitur phasellentesque congue magnis vestibulum quismodo nulla et feugiat adipiscinia pellentum leo&hellip;</p>
-
<div id="Slider">
+
              <footer><a href="#">Read More Here &raquo;</a></footer>
-
<div id="Slide0" class="Slides current"></div>
+
            </figcaption>
-
<div id="Slide1" class="Slides"></div>
+
          </figure>
-
<div id="Slide2" class="Slides"></div>
+
        </li>
-
<div id="Slide3" class="Slides"></div>
+
        <li>
-
<div id="Slide4" class="Slides"></div>
+
          <figure><a href="#"><img src="images/slider/3.png" alt=""></a>
-
<div id="Slide5" class="Slides"></div>
+
            <figcaption>
-
<div id="LeftBar" class="SideBar"><div id="LeftArrow"></div></div>
+
              <h2>Cursus penati saccum nulla.</h2>
-
<div id="RightBar" class="SideBar"><div id="RightArrow"></div></div>
+
              <p>Nullamlacus dui ipsum conseque loborttis non euisque morbi penas dapibulum orna. Urnaultrices quis curabitur phasellentesque congue magnis vestibulum quismodo nulla et feugiat adipiscinia pellentum leo&hellip;</p>
-
<ul id="BottomLinks">
+
              <footer><a href="#">Read More Here &raquo;</a></footer>
-
<li id="Link0" class="SlideLink">Background</li><li id="Link1" class="SlideLink">Problem</li><li id="Link2" class="SlideLink">Idea</li><li id="Link3" class="SlideLink">Solution</li>
+
            </figcaption>
-
</ul>
+
          </figure>
-
</div>
+
        </li>
-
+
      </ul>
-
<section id="Overview">
+
    </div>
-
<h2><b>OVERVIEW</b></h2>
+
    <!-- Previous Next -->  
-
<p>
+
    <a href="#" id="featured-item-prev" class="jcarousel-control-prev">&laquo; Previous</a> <a href="#" id="featured-item-next" class="jcarousel-control-next">Next &raquo;</a>
-
In order to be capable of controlling transformed bacteria and reprogram its function as many times as would be required, we designed a system consisting of a bacteriophage that infects just one specific strain of bacteria and has on its genome the information to codify a TALEN/ZFN enzyme and a reporter gene. With this tools (TALEN/ZFN) we can target a specific sequence of the host's plasmids to degrade them. The bacteriophages will replace the plasmids, giving it a new function or characteristic that could be a totally new one.
+
    <!-- / Previous Next -->
-
</p>
+
  </div>
-
</section>
+
  <!-- ########################################################################################## -->
-
+
</div>
-
<section id="SectionLinks">
+
<!-- ################################################################################################ -->
-
<div class="Wrap">
+
<!-- ################################################################################################ -->
-
<a href="https://2013.igem.org/Team:Calgary/Project/OurSensor">
+
<!-- ################################################################################################ -->
-
<div id="DescriptionLink1" class="DescriptionLink">
+
<div class="wrapper row2">
-
<h2>Our Sensor</h2>
+
  <main id="container" class="clear">  
-
<img src="https://static.igem.org/mediawiki/2013/4/44/Calgary2013_Our_Sensor.png">
+
    <!-- container body -->
-
<p>Check out what we did in the lab this summer to detect <i>E. coli</i> contamination! Learn about the design of our detector, linker, and reporter as well as our prototype and modelling.</p>
+
    <!-- ########################################################################################## -->
-
</div>
+
    <div id="homepage">  
-
</a>
+
      <!-- Services -->
-
+
      <div id="services">
-
<a href="https://2013.igem.org/Team:Calgary/Project/PostRegionals">
+
        <ul class="clear">
-
<div id="DescriptionLink2" class="DescriptionLink">
+
          <li>
-
<h2>Final System</h2>
+
            <article> <a class="service s-1" href="#">
-
<img src="https://static.igem.org/mediawiki/2013/b/bf/Calgary2013_Data_Page.png">
+
              <h2>Service Title</h2>
-
<p>We have shown our final system in action! Click here to see our modeling, talks with industry, and characterization data combine to make a biosensor that can detect DNA in under 5 minutes!</p>
+
              <p>Vestassapede et donec ut est libe ros sus et eget sed eget quisq ueta habitur augue</p>
-
</div>
+
              </a> </article>
-
</a>
+
          </li>
-
<div style="clear:both;"></div>
+
          <li>
-
<a href="https://2013.igem.org/Team:Calgary/Project/HumanPractices">
+
            <article> <a class="service s-2" href="#">
-
<div id="DescriptionLink3" class="DescriptionLink">
+
              <h2>Service Title</h2>
-
<h2>Human Practices</h2>
+
              <p>Vestassapede et donec ut est libe ros sus et eget sed eget quisq ueta habitur augue</p>
-
<img src="https://static.igem.org/mediawiki/2013/2/25/2013calgarynewbuttonHuman_Practices.png">
+
              </a> </article>
-
<p>Check out how Human Practices helped guide the development of our project. Learn how we spent time talking to various experts in the industry to design our project with our end-user in mind.</p>
+
          </li>
-
</div>
+
          <li>
-
</a>
+
            <article> <a class="service s-3" href="#">
-
+
              <h2>Service Title</h2>
-
<a href="https://2013.igem.org/Team:Calgary/Project/Collaboration">
+
              <p>Vestassapede et donec ut est libe ros sus et eget sed eget quisq ueta habitur augue</p>
-
<div id="DescriptionLink4" class="DescriptionLink">
+
              </a> </article>
-
<h2>Collaboration</h2>
+
          </li>
-
<img src="https://static.igem.org/mediawiki/2013/3/36/Calgary2013_CollaborationButton.png">
+
          <li>
-
<p>We worked hard with the Paris-Bettencourt team this season to develop useful tools for the rest of the iGEM community. Click here to find out what our collaboration can add to iGEM. </p>
+
            <article> <a class="service s-4" href="#">
-
</div>
+
              <h2>Service Title</h2>
-
</a>
+
              <p>Vestassapede et donec ut est libe ros sus et eget sed eget quisq ueta habitur augue</p>
-
</div>
+
              </a> </article>
-
</section>
+
          </li>
-
+
        </ul>
-
<section id="Logos">
+
      </div>
-
<h2 style="text-align: center;">Thank You to Our Sponsors</h2>
+
      <!-- / Services -->
-
<img src="" style="margin: 50px;"> </section>
+
      <!-- Latest Work -->
-
</section>
+
      <div id="showcase">
-
</body>
+
        <h2><span>Latest Work</span></h2>
 +
        <ul class="clear">
 +
          <li>
 +
            <figure><a href="#"><img src="images/gallery/thumbs/290x190.gif" alt=""> <strong>Lorem ipsum dolor</strong></a></figure>
 +
          </li>
 +
          <li>
 +
            <figure><a href="#"><img src="images/gallery/thumbs/290x190.gif" alt=""> <strong>Lorem ipsum dolor</strong></a></figure>
 +
          </li>
 +
          <li>
 +
            <figure><a href="#"><img src="images/gallery/thumbs/290x190.gif" alt=""> <strong>Lorem ipsum dolor</strong></a></figure>
 +
          </li>
 +
          <li>
 +
            <figure><a href="#"><img src="images/gallery/thumbs/290x190.gif" alt=""> <strong>Lorem ipsum dolor</strong></a></figure>
 +
          </li>
 +
          <li>
 +
            <figure><a href="#"><img src="images/gallery/thumbs/290x190.gif" alt=""> <strong>Lorem ipsum dolor</strong></a></figure>
 +
          </li>
 +
          <li>
 +
            <figure><a href="#"><img src="images/gallery/thumbs/290x190.gif" alt=""> <strong>Lorem ipsum dolor</strong></a></figure>
 +
          </li>
 +
        </ul>
 +
      </div>
 +
      <!-- / Latest Work -->  
 +
    </div>
 +
    <!-- ########################################################################################## -->
 +
    <!-- / container body -->
 +
    <div class="clear"></div>
 +
  </main>
 +
</div>
 +
<!-- ################################################################################################ -->
 +
<!-- ################################################################################################ -->
 +
<!-- ################################################################################################ -->
 +
<div class="wrapper row3">
 +
  <footer id="footer" class="clear">
 +
    <!-- ################################################################################################ -->
 +
    <div class="one_quarter first">
 +
      <h2 class="title">From The Blog</h2>
 +
      <article>
 +
        <div class="header">
 +
          <h2><a href="#">Blog Post Title</a></h2>
 +
          <time datetime="2000-04-06">Friday, 6<sup>th</sup> April 2000</time>
 +
        </div>
 +
        <p>Vestibulumaccumsan egestibulum eu justo convallis augue estas aenean elit intesque sed. Facilispede estibulum nulla orna nisl velit elit ac aliquat non tincidunt.</p>
 +
        <p>Justoid nonummy laoreet phasellent penatoque in antesque pellus elis eget tincidunt. Nequatdui laorem justo a non tellus laoremut vitae doloreet.</p>
 +
        <p><a href="#">Read More &raquo;</a></p>
 +
      </article>
 +
    </div>
 +
    <div class="one_quarter">
 +
      <h2 class="title">Quick Links</h2>
 +
      <nav>
 +
        <ul>
 +
          <li class="first"><a href="#">Lorem ipsum dolor sit</a></li>
 +
          <li><a href="#">Amet consectetur</a></li>
 +
          <li><a href="#">Praesent vel sem id</a></li>
 +
          <li><a href="#">Curabitur hendrerit est</a></li>
 +
          <li><a href="#">Aliquam eget erat nec sapien</a></li>
 +
          <li><a href="#">Cras id augue nunc</a></li>
 +
          <li><a href="#">In nec justo non</a></li>
 +
        </ul>
 +
      </nav>
 +
    </div>
 +
    <div class="one_quarter">
 +
      <h2 class="title">About Us</h2>
 +
      <figure class="imgholder"><img src="images/demo/215x90.gif" alt=""></figure>
 +
      <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc non diam erat. In fringilla massa ut nisi ullamcorper pellentesque.</p>
 +
      <p>Tel: xxxxx xxxxxxxxxx<br>
 +
        Fax: xxxxx xxxxxxxxxx<br>
 +
        Email: <a href="#">contact@mydomain.com</a></p>
 +
    </div>
 +
    <div class="one_quarter">
 +
      <h2 class="title">Contact Us</h2>
 +
      <form method="post" action="#">
 +
        <fieldset>
 +
          <legend>Contact Form:</legend>
 +
          <label for="cf_name">Name:</label>
 +
          <input type="text" name="cf_name" id="cf_name" value="">
 +
          <label for="cf_email">Email:</label>
 +
          <input type="text" name="cf_email" id="cf_email" value="">
 +
          <label for="cf_subject">Subject:</label>
 +
          <input type="text" name="cf_subject" id="cf_subject" value="">
 +
          <label for="cf_message">Message:</label>
 +
          <textarea name="cf_message" id="cf_message" cols="45" rows="10"></textarea>
 +
          <button type="submit" value="submit">Submit</button>
 +
        </fieldset>
 +
      </form>
 +
    </div>
 +
    <!-- ################################################################################################ -->
 +
  </footer>
 +
</div>
 +
<!-- ################################################################################################ -->  
 +
<!-- ################################################################################################ -->
 +
<!-- ################################################################################################ -->
 +
<div class="wrapper row4">
 +
  <div id="copyright" class="clear">  
 +
    <!-- ################################################################################################ -->
 +
    <p class="fl_left">Copyright &copy; 2014 - All Rights Reserved - <a href="#">Domain Name</a></p>
 +
    <p class="fl_right">Template by <a target="_blank" href="http://www.os-templates.com/" title="Free Website Templates">OS Templates</a></p>
 +
    <!-- ################################################################################################ -->
 +
  </div>
 +
</div>
 +
<!-- JAVASCRIPTS -->  
 +
<!-- <script src="http://code.jquery.com/jquery-latest.min.js"></script> -->  
 +
<script src="layout/scripts/jquery-latest.min.js"></script>  
 +
<script src="layout/scripts/jquery.defaultvalue.js"></script>  
 +
<script>
 +
$(document).ready(function () {
 +
    $("#cf_name, #cf_email, #cf_subject, #cf_message").defaultvalue("Full Name", "Email Address", "Subject", "Message");
 +
});
 +
</script>  
 +
<!-- homepage scripts -->
 +
<script src="layout/scripts/jquery.grayscale.js"></script>  
 +
<script src="layout/scripts/carousel/jquery.jcarousel.pack.js"></script>  
 +
<script src="layout/scripts/carousel/jquery.jcarousel.setup.js"></script>  
 +
<!-- / homepage scripts -->
 +
</body>
</html>
</html>

Revision as of 19:10, 14 October 2014

<!DOCTYPE html> The Modernist

  • Cursus penati saccum nulla.

    Nullamlacus dui ipsum conseque loborttis non euisque morbi penas dapibulum orna. Urnaultrices quis curabitur phasellentesque congue magnis vestibulum quismodo nulla et feugiat adipiscinia pellentum leo…

  • Cursus penati saccum nulla.

    Nullamlacus dui ipsum conseque loborttis non euisque morbi penas dapibulum orna. Urnaultrices quis curabitur phasellentesque congue magnis vestibulum quismodo nulla et feugiat adipiscinia pellentum leo…

  • Cursus penati saccum nulla.

    Nullamlacus dui ipsum conseque loborttis non euisque morbi penas dapibulum orna. Urnaultrices quis curabitur phasellentesque congue magnis vestibulum quismodo nulla et feugiat adipiscinia pellentum leo…

« Previous Next »

Retrieved from "http://2014.igem.org/Team:UANL_Mty-Mexico_BETA"