Team:UANL Mty-Mexico/Project/The Code

From 2011.igem.org

(Difference between revisions)
Line 19: Line 19:
/-->
/-->
 +
        <!-- Include jQuery first. -->
 +
<script type="text/javascript" src="http://www.genobiotec2011.org/iGEMwiki/jquery-1.3.2.min.js"></script>
 +
 +
        <!-- Include the below script, Copyright 2010, Brandon Aaron (http://brandonaaron.net/) for scrollwheel support. -->
 +
<script type="text/javascript" src="http://www.genobiotec2011.org/iGEMwiki/jquery-mousewheel/jquery.mousewheel.min.js"></script>
 +
 +
 +
<link rel="stylesheet" type="text/css" href="http://www.genobiotec2011.org/iGEMwiki/slidedeck.skin.css" media="screen" />
 +
        <!-- Styles for the skin that only load for Internet Explorer -->
 +
        <!--[if lte IE 8]>
 +
        <link rel="stylesheet" type="text/css" href="http://www.genobiotec2011.org/iGEMwiki/slidedeck.skin.ie.css" media="screen,handheld" />
 +
        <![endif]-->
 +
 +
        <!-- Include the SlideDeck jQuery script. -->
 +
<script type="text/javascript" src="http://www.genobiotec2011.org/iGEMwiki/slidedeck.jquery.lite.pack.js"></script>
 +
       
 +
        <style type="text/css">
 +
            #slidedeck_frame {
 +
width: 665px;
 +
height: 200px;
 +
            }       
 +
        </style>
<style>
<style>
 +
 +
#botonera {
 +
}
 +
 +
.lateral-button {
 +
font-family: Verdana, Geneva, sans-serif;
 +
font-size: 12px;
 +
font-weight: bold;
 +
color: #036;
 +
text-decoration: none;
 +
 +
padding-top: 10px;
 +
padding-bottom: 10px;
 +
padding-left: 10px;
 +
padding-right: 10px;
 +
margin: 2px;
 +
-webkit-border-radius: 5px;
 +
-moz-border-radius: 5px;
 +
  border-radius: 5px;
 +
  cursor: pointer;
 +
  text-align: center;
 +
}
 +
 +
.lateral-button:hover {
 +
font-family: Verdana, Geneva, sans-serif;
 +
font-size: 12px;
 +
font-weight: bolder;
 +
color: #036;
 +
text-decoration:underline;
 +
background-color:#CCC;
 +
color:#000;
 +
 +
padding-top: 10px;
 +
padding-bottom: 10px;
 +
padding-left: 10px;
 +
padding-right: 10px;
 +
margin: 2px;
 +
-webkit-border-radius: 5px;
 +
-moz-border-radius: 5px;
 +
  border-radius: 5px;
 +
  cursor: pointer;
 +
  text-align: center;
 +
}
 +
 +
.lateral-button a {
 +
font-family: Verdana, Geneva, sans-serif;
 +
font-size: 12px;
 +
font-weight: bold;
 +
color: #036;
 +
text-decoration: none;
 +
 +
padding-top: 10px;
 +
padding-bottom: 10px;
 +
padding-left: 10px;
 +
padding-right: 10px;
 +
margin: 2px;
 +
-webkit-border-radius: 5px;
 +
-moz-border-radius: 5px;
 +
  border-radius: 5px;
 +
  cursor: pointer;
 +
  text-align: center;
 +
}
 +
 +
.lateral-button:hover a {
 +
font-family: Verdana, Geneva, sans-serif;
 +
font-size: 12px;
 +
font-weight: bolder;
 +
color: #036;
 +
text-decoration:underline;
 +
background-color:#CCC;
 +
color:#000;
 +
 +
padding-top: 10px;
 +
padding-bottom: 10px;
 +
padding-left: 10px;
 +
padding-right: 10px;
 +
margin: 2px;
 +
-webkit-border-radius: 5px;
 +
-moz-border-radius: 5px;
 +
  border-radius: 5px;
 +
  cursor: pointer;
 +
  text-align: center;
 +
}
 +
 +
.style5.top-menu {
 +
  background: transparent;
 +
  margin: auto;
 +
  width: 950px;
 +
  margin-top: -35px;
 +
 
 +
}
 +
.style5 ul.top-menu-main {
 +
  margin: auto;
 +
  width: 950px;
 +
  font-family: Georgia, Tahoma, Arial;
 +
  font-size: 10px;
 +
  line-height: 18px;
 +
}
 +
 +
.style5 ul.top-menu-main > li {
 +
  background: #000;
 +
  border-right: 1px solid #afafaf;
 +
 +
 
 +
  color: #fff;
 +
  margin: 0;
 +
}
 +
 +
.style5 ul.top-menu-main > li.last {
 +
  border-right: none;
 +
}
 +
.style5 ul.top-menu-main > li:hover .menu-item-text
 +
{color: #cfcfcf; text-shadow: 0 1px 0 #0C131C;}
 +
 +
.style5 ul.top-menu-main > li:hover{
 +
  background: #333 transparent;
 +
  color: #fff;
 +
  -moz-box-shadow: 0 0 8px #333;
 +
  -webkit-box-shadow: 0 0 8px #333;
 +
  box-shadow: 0 0 8px #333;
 +
}
 +
 +
.style5 ul.top-menu-main > li > a {
 +
  color: #fff;
 +
  text-decoration: none;
 +
}
 +
.style5 ul.top-menu-main > li > a:hover {
 +
  color: #fff;
 +
}
 +
 +
.style5 ul.top-menu-main > li > a {
 +
  padding: 10px 10px;
 +
}
 +
 +
.style5 ul.top-submenu {
 +
  -moz-box-shadow: 0 0 8px #333;
 +
  -webkit-box-shadow: 0 0 8px #333;
 +
  /*box-shadow: 0 0 8px #333;*/
 +
  box-shadow: 0 0 8px #fff;
 +
 
 +
}
 +
 +
.style5 ul.top-submenu > li {
 +
  margin: 0px;
 +
  padding: 5px 10px;
 +
  background: #fff transparent;
 +
 
 +
  color: #fff;
 +
  white-space: nowrap;
 +
 
 +
}
 +
 +
.style5 ul.top-submenu > li a {
 +
  margin: 0px;
 +
  padding: 5px 10px;
 +
  background: #fff transparent;
 +
 
 +
  color: #fff;
 +
  white-space: nowrap;
 +
 
 +
}
 +
 +
.style5 ul.top-submenu > li.hover {
 +
  background: #000 ;
 +
  color: #fff;
 +
 
 +
}
 +
 +
.style5 ul.top-submenu > li a:hover {
 +
  background: #000 ;
 +
  color: #fff;
 +
 
 +
}
 +
/* Wiki Hacks - START */
/* Wiki Hacks - START */
Line 140: Line 336:
font-size: 12px;
font-size: 12px;
z-index: 10;
z-index: 10;
-
text-align: Justify;
+
text-align: center;
padding-bottom: 10px;
padding-bottom: 10px;
}
}
Line 160: Line 356:
.content .main {
.content .main {
padding-top: 0px;
padding-top: 0px;
-
padding-right: 20px;
+
padding-right: 10px;
-
padding-bottom: 20px;
+
padding-bottom: 10px;
-
padding-left: 20px;
+
padding-left: 10px;
}
}
 +
.donate {
.donate {
   padding: 5px;
   padding: 5px;
Line 178: Line 375:
   font-style: italic;
   font-style: italic;
}
}
 +
.s-menu {
.s-menu {
margin: 0;
margin: 0;
Line 183: Line 381:
margin-top: 20px;
margin-top: 20px;
color: #036;
color: #036;
 +
  text-decoration: none;
}
}
 +
.s-menu li {
.s-menu li {
 +
  text-decoration: none;
list-style-type: none;  
list-style-type: none;  
width: 100px;  
width: 100px;  
Line 197: Line 398:
   cursor: pointer;
   cursor: pointer;
   text-align: center;
   text-align: center;
 +
width: 180px;
 +
}
 +
 +
.s-menu li.last {
 +
background: #cfcfcf;
 +
color: #000;
 +
text-align: center;
 +
list-style-type: none;
 +
}
 +
 +
.s-menu li:hover {
 +
background: #cfcfcf;
 +
color: #000;
 +
text-align: center;
 +
list-style-type: none;
}
}
Line 213: Line 429:
text-align: center;
text-align: center;
color: #036;
color: #036;
-
font-size: 14px;
+
font-size: 12px;
-
}
+
 
-
.s-menu li:hover {
+
 
-
background: #cfcfcf;
+
-
color: #000;
+
-
text-align: center;
+
}
}
.s-menu li:hover a {
.s-menu li:hover a {
Line 224: Line 437:
color: #000;
color: #000;
text-align: center;
text-align: center;
 +
font-size: 12px;
}
}
-
.s-menu li {
+
 
-
width: 180px;
+
 
-
}
+
.col-1-3 {
.col-1-3 {
width: 200;
width: 200;
Line 237: Line 450:
color: #FFF;
color: #FFF;
font-weight: bold;
font-weight: bold;
 +
text-decoration: none;
 +
}
}
 +
 +
 +
.sidebar1 {
.sidebar1 {
Line 293: Line 511:
padding-right: 0;
padding-right: 0;
padding-bottom: 0;
padding-bottom: 0;
-
}
 
-
 
-
#header-code-column {
 
-
background-color:#036;
 
-
color: #FFF;
 
-
padding-top: 5;
 
-
padding-right: 5;
 
-
padding-bottom: 5;
 
-
padding-left: 10px;
 
-
font-family: "Arial Black";
 
-
font-size: 18px;
 
-
text-align:left;
 
}
}
Line 322: Line 528:
float:left;
float:left;
width:700px;
width:700px;
-
padding-top: 20px;
+
text-align: justify;
-
}
+
padding-top: 10px;
-
#img-holder {
+
padding-right: 0px;
-
width: 384px;
+
padding-bottom: 0px;
-
float: none;
+
padding-left: 0px;
-
padding: 5;
+
font-size: 15px;
-
margin-bottom: 40px;
+
font-family: Arial;
-
text-align: Justify;
+
-
border: 2px solid #036;
+
-
background-color: #FFF;
+
-
}
+
-
#img-holder2 {
+
-
width: 550px;
+
-
float: none;
+
-
padding: 5;
+
-
margin-bottom: 40px;
+
-
text-align: Justify;
+
-
border: 2px solid #036;
+
-
background-color: #FFF;
+
-
}
+
-
#img-holder3 {
+
-
width: 550px;
+
-
float: none;
+
-
padding: 5;
+
-
margin-bottom: 40px;
+
-
text-align: Justify;
+
-
border: 2px solid #036;
+
-
background-color: #FFF;
+
}
}
 +
#rightColumn {
#rightColumn {
float:right;
float:right;
width:200px;
width:200px;
text-align: center;
text-align: center;
-
padding-top: 20px;
+
padding-top: 5px;
}
}
Line 374: Line 560:
}
}
 +
#youtube-frame {
 +
text-align:center;
 +
 +
}
 +
#leftColumn1 {
 +
 +
}
 +
#ColorHeader {
 +
background-color:#FFF;
 +
color: #333;
 +
padding-top: 5;
 +
padding-right: 5;
 +
padding-bottom: 5;
 +
padding-left: 5;
 +
font-family: "Arial Black";
 +
font-size: 30px;
 +
}
 +
 +
#project-column p {
 +
background-color:#FFF;
 +
color:#000;
 +
font: Tahoma;
 +
font-size: 14px;
 +
}
 +
 +
#project-column {
 +
width:340px;
 +
padding-top: 15;
 +
padding-right: 15;
 +
padding-bottom: 5;
 +
padding-left: 0;
 +
float: left;
 +
}
 +
 +
#header-project-column {
 +
background-color:#036;
 +
color: #FFF;
 +
padding-top: 5;
 +
padding-right: 5;
 +
padding-bottom: 5;
 +
padding-left: 10px;
 +
font-family: "Arial Black";
 +
font-size: 16px;
 +
text-align:left;
 +
}
 +
 +
#content-project-column {
 +
 +
}
 +
 +
#About-column {
 +
float:left;
 +
width:320px;
 +
padding-top: 15;
 +
padding-right: 5;
 +
padding-bottom: 5;
 +
padding-left: 15px;
 +
}
 +
#header-about-column {
 +
background-color:#036;
 +
color: #FFF;
 +
padding-top: 5;
 +
padding-right: 5;
 +
padding-bottom: 5;
 +
padding-left: 10px;
 +
font-family: "Arial Black";
 +
font-size: 16px;
 +
text-align:left;
 +
}
 +
 +
#content-about-column {
 +
 +
}
 +
 +
#content-about-column p {
 +
background-color:#FFF;
 +
color:#000;
 +
font-size: 15px;
 +
font-family: Arial;
 +
}
 +
 +
#content-about-column a {
 +
color:#036;
 +
font-size: 14px;
 +
text-decoration:underline;
 +
font-family: Tahoma;
 +
font-weight: bolder;
 +
}
 +
 +
 +
#content-3 {
 +
 +
}
 +
 +
#header-content-3 {
 +
background-color:#333;
 +
color: #FFF;
 +
padding-top: 5;
 +
padding-right: 5;
 +
padding-bottom: 5;
 +
padding-left: 10px;
 +
font-family: "Arial Black";
 +
font-size: 16px;
 +
text-align:left;
 +
}
 +
 +
#content-project-column a {
 +
color:#036;
 +
font-size: 14px;
 +
text-decoration:underline;
 +
font-family: Tahoma;
 +
font-weight: bolder;
 +
font-style: italic;
 +
}
 +
 +
#outline-header {
 +
background-color:#036;
 +
color: #FFF;
 +
padding-top: 5;
 +
padding-right: 5;
 +
padding-bottom: 5;
 +
padding-left: 10px;
 +
font-family: "Arial Black";
 +
font-size: 16px;
 +
}
 +
 +
#outline-content {
 +
 +
}
Line 392: Line 707:
.br {
.br {
height: 5px;
height: 5px;
 +
width: 100%;
 +
margin: 0;
 +
padding: 0;
 +
overflow: hidden;
 +
}
 +
 +
.br2 {
 +
height: 2px;
width: 100%;
width: 100%;
margin: 0;
margin: 0;
Line 439: Line 762:
   <title>Team: UANL_Mty-Mexico</title>
   <title>Team: UANL_Mty-Mexico</title>
    
    
-
 
-
 
-
  <link href="style5.css" rel="stylesheet" type="text/css" media="screen" />
 
-
 
 
-
  <script type='text/javascript' src='http://www.genobiotec2011.org/iGEMwiki/jquery-1.6.min.js'></script>
 
   <script type='text/javascript' src='http://www.genobiotec2011.org/iGEMwiki/jquery.easing.1.3.js'></script>
   <script type='text/javascript' src='http://www.genobiotec2011.org/iGEMwiki/jquery.easing.1.3.js'></script>
   <script type='text/javascript' src='http://www.genobiotec2011.org/iGEMwiki/jquery.slideup.menu.1.0.min.js'></script>
   <script type='text/javascript' src='http://www.genobiotec2011.org/iGEMwiki/jquery.slideup.menu.1.0.min.js'></script>
-
  <script src="http://www.genobiotec2011.org/iGEMwiki/Scripts/swfobject_modified.js" type="text/javascript"></script>
+
 
<script>
<script>
     var opts = {slideUpSpeed:500, slideDownSpeed: 200};
     var opts = {slideUpSpeed:500, slideDownSpeed: 200};
Line 456: Line 774:
       });
       });
       $('ul.s-style li').click(function(){
       $('ul.s-style li').click(function(){
-
       // $('.top-menu').removeClass().addClass('top-menu').addClass('style'+$(this).attr('rel'));
+
       $('.top-menu').removeClass().addClass('top-menu').addClass('style'+$(this).attr('rel'));
-
        //$('.top-menu').removeClass().addClass('top-menu').addClass('style5');
+
      $('.top-menu').removeClass().addClass('top-menu').addClass('style5');
         $(".top-menu").slideupmenu(opts);   
         $(".top-menu").slideupmenu(opts);   
Line 500: Line 818:
-webkit-box-shadow: 0 0 8px #777;
-webkit-box-shadow: 0 0 8px #777;
box-shadow: 0 -5px 10px #777;
box-shadow: 0 -5px 10px #777;
-
border-top-color: #FFF;
 
}
}
.textblack {
.textblack {
Line 510: Line 827:
font-weight: bolder;
font-weight: bolder;
}
}
-
.content .main #leftColumn p {
+
 
-
font-size: 15px;
+
.content .main #leftColumn center #img-holder2 .img-holder2-text {
-
}
+
font-size: 12px;
-
.content .main #leftColumn h1 {
+
-
font-size: 16px;
+
-
}
+
-
.content .main #leftColumn p {
+
-
font-size: 14px;
+
-
}
+
-
.content .main #leftColumn center img {
+
-
border: thin none #000;
+
-
margin-bottom:10px;
+
-
}
+
-
.img-holder-text {
+
-
text-align: justify;
+
-
}
+
-
.img-holder2-text {
+
-
text-align: justify;
+
}
}
</style>
</style>
 +
 +
</head>
</head>
 +
 +
 +
 +
 +
 +
 +
 +
 +
<body>
<body>
 +
<div class="header"><span class="header1">
<div class="header"><span class="header1">
-
   <img src="http://www.genobiotec2011.org/iGEMwiki/banners/blueprints4.jpg" alt="banner-main" width="964" height="203" border="0" usemap="#map">
+
   <img src="http://www.genobiotec2011.org/iGEMwiki/banners/home-banner2.jpg" alt="banner-main" width="964" height="202" border="0" usemap="#map">
     <map name="map">
     <map name="map">
-
       <area shape="rect" coords="2,2,72,61" href="https://2011.igem.org/Main_Page" target="_new" alt="iGEM-logo" title="Go to the iGEM 2011 Wiki Main Page">  
+
       <area shape="rect" coords="0,0,69,55" href="https://2011.igem.org/Main_Page" target="_new" alt="iGEM-logo" title="Go to the iGEM 2011 Wiki Main Page">  
   </map>
   </map>
          
          
Line 543: Line 857:
   <div class="top-menu style4">
   <div class="top-menu style4">
-
    <ul class="top-menu-main">
+
      <ul class="top-menu-main">
      
      
       <li class="first">
       <li class="first">
-
         <a href="index-4.html">Home</a>
+
         <a href="https://2011.igem.org/Team:UANL_Mty-Mexico" class="menu-item-text">Home</a>
       </li>
       </li>
        
        
       <li class="">
       <li class="">
         <ul class="top-submenu">
         <ul class="top-submenu">
-
           <li class="first"><a href="https://2011.igem.org/Team:UANL_Mty-Mexico/Project/The_Code">Results</a></li>
+
           <li class="last"><a href="https://2011.igem.org/Team:UANL_Mty-Mexico/Project/Applications">Applications</a></li>
-
           <li class=""><a href="https://2011.igem.org/Team:UANL_Mty-Mexico/Project/Modelling">Modelling</a></li>
+
           <li class=""><a href="https://2011.igem.org/Team:UANL_Mty-Mexico/Project/Circuit">Circuit</a></li>
-
 
+
           <li class=""><a href="https://2011.igem.org/Team:UANL_Mty-Mexico/Project/Mechanism">Mechanism</a></li>
           <li class=""><a href="https://2011.igem.org/Team:UANL_Mty-Mexico/Project/Mechanism">Mechanism</a></li>
-
           <li class="last"><a href="code.html">The Code</a></li>
+
           <li class=""><a href="https://2011.igem.org/Team:UANL_Mty-Mexico/Project/The_Code">The Code</a></li>
 +
          <li class="first"><a href="https://2011.igem.org/Team:UANL_Mty-Mexico/Project/Overview">Overview</a></li>
         </ul>
         </ul>
-
         <a href="project.html">Project</a>
+
         <a href="https://2011.igem.org/Team:UANL_Mty-Mexico/Project/Overview" class="menu-item-text">Project</a>
       </li>
       </li>
-
     
+
 
       <li class="">
       <li class="">
         <ul class="top-submenu">
         <ul class="top-submenu">
-
 
+
           <li class="last"><a href="https://2011.igem.org/Team:UANL_Mty-Mexico/Project/The_Code">Results</a></li>
-
           <li class="last"><a href="https://2011.igem.org/Team:UANL_Mty-Mexico/Team/Gallery">Gallery</a></li>
+
           <li class="first"><a href="https://2011.igem.org/Team:UANL_Mty-Mexico/Modelling/Overview">Overview</a></li>
-
          <li class=""><a href="hometown.html">Hometown</a>
+
-
          <li class=""><a href="https://2011.igem.org/Team:UANL_Mty-Mexico/Team/Logo">Logo</a></li>
+
-
           <li class="first"><a href="https://2011.igem.org/Team:UANL_Mty-Mexico/Team/Members">Members</a></li>
+
         </ul>
         </ul>
-
         <a href="https://2011.igem.org/Team:UANL_Mty-Mexico/Team" class="menu-item-text">Team</a>
+
         <a href="https://2011.igem.org/Team:UANL_Mty-Mexico/Modelling/Overview" class="menu-item-text">Modelling</a>
 +
      </li>
 +
      <li class="">
 +
        <a href="https://2011.igem.org/Team:UANL_Mty-Mexico/Results" class="menu-item-text">Results</a>
       </li>       
       </li>       
-
         
 
-
     
 
       <li class="">
       <li class="">
         <ul class="top-submenu">
         <ul class="top-submenu">
-
           <li class="first"><a href="https://2011.igem.org/Team:UANL_Mty-Mexico/Contributions/Parts">Parts</a></li>
+
           <li class="last"><a href="https://2011.igem.org/Team:UANL_Mty-Mexico/Achievements/Parts">Parts</a></li>
-
           <li class=""><a href="https://2011.igem.org/Team:UANL_Mty-Mexico/Contributions/UANLBricks">UANLBricks</a></li>
+
           <li class=""><a href="https://2011.igem.org/Team:UANL_Mty-Mexico/Achievements/UANLBricks">UANLBricks</a></li>
-
           <li class=""><a href="https://2011.igem.org/Team:UANL_Mty-Mexico/Contributions/Light_Machine">Light Machine</a></li>
+
           <li class=""><a href="https://2011.igem.org/Team:UANL_Mty-Mexico/Achievements/Light_Machine">Light Machine</a></li>
-
           <li class="last"><a href="https://2011.igem.org/Team:UANL_Mty-Mexico/Contributions/Photochassis">Photochassis</a></li>
+
           <li class="first"><a href="https://2011.igem.org/Team:UANL_Mty-Mexico/Achievements/Photochassis">Photochassis</a></li>
         </ul>
         </ul>
-
         <a href="https://2011.igem.org/Team:UANL_Mty-Mexico/Contributions" class="menu-item-text">Contributions</a>
+
         <a href="https://2011.igem.org/Team:UANL_Mty-Mexico/Achievements/Overview" class="menu-item-text">Achievements</a>
       </li>
       </li>
        
        
       <li class="">
       <li class="">
         <ul class="top-submenu">
         <ul class="top-submenu">
-
           <li class="first"><a href="safety.html">Safety</a></li>
+
           <li class="last"><a href="https://2011.igem.org/Team:UANL_Mty-Mexico/Human_Practices/Safety">Safety</a></li>
-
           <li class=""><a href="lighters.html">iGEM Lighters</a></li>
+
           <li class=""><a href="https://2011.igem.org/Team:UANL_Mty-Mexico/Human_Practices/iGEM-Lighters">iGEM Lighters</a></li>
           <li class=""><a href="https://2011.igem.org/Team:UANL_Mty-Mexico/Human_Practices/Collaboration">Collaboration</a></li>
           <li class=""><a href="https://2011.igem.org/Team:UANL_Mty-Mexico/Human_Practices/Collaboration">Collaboration</a></li>
-
           <li class="last"><a href="https://2011.igem.org/Team:UANL_Mty-Mexico/Human_Practices/Bio_Blog">Bio! Blog</a></li>
+
           <li class="first"><a href="https://2011.igem.org/Team:UANL_Mty-Mexico/Human_Practices/Bio_Blog">Bio! Blog</a></li>
         </ul>
         </ul>
Line 599: Line 911:
       <li class="">
       <li class="">
         <ul class="top-submenu">
         <ul class="top-submenu">
-
          <li class="last"><a href="https://2011.igem.org/Team:UANL_Mty-Mexico/Notebook/New_Protocols">New Protocols</a></li>
 
-
          <li class=""><a href="https://2011.igem.org/Team:UANL_Mty-Mexico/Notebook/Protocols">Protocols</a></li>
 
-
           <li class=""><a href="https://2011.igem.org/Team:UANL_Mty-Mexico/Notebook/Blueprints">Blueprints</a></li>
+
           <li class="last"><a href="https://2011.igem.org/Team:UANL_Mty-Mexico/Team/Gallery">Gallery</a></li>
-
           <li class="first"><a href="https://2011.igem.org/Team:UANL_Mty-Mexico/Notebook/Timeline">Timeline</a></li>
+
          <li class=""><a href="https://2011.igem.org/Team:UANL_Mty-Mexico/Team/Hometown">Hometown</a>
 +
          <li class=""><a href="https://2011.igem.org/Team:UANL_Mty-Mexico/Team/Logo">Logo</a></li>
 +
           <li class="first"><a href="https://2011.igem.org/Team:UANL_Mty-Mexico/Team/Members">Members</a></li>
         </ul>
         </ul>
-
         <a href="https://2011.igem.org/Team:UANL_Mty-Mexico/Notebook" class="menu-item-text">Notebook</a>
+
         <a href="https://2011.igem.org/Team:UANL_Mty-Mexico/Team" class="menu-item-text">Team</a>
-
      </li>
+
-
       <li class="">
+
       </li>
-
        <ul class="top-submenu">
+
-
          <li class="last"><a href="https://2011.igem.org/Team:UANL_Mty-Mexico/In_silico/Restrictions">Restrictions</a></li>
 
-
          <li class=""><a href="https://2011.igem.org/Team:UANL_Mty-Mexico/In_silico/PCR">PCR</a></li>
 
-
          <li class="first"><a href="https://2011.igem.org/Team:UANL_Mty-Mexico/In_silico/Math_Model">Math Model</a></li>
 
-
        </ul>
 
-
        <a href="https://2011.igem.org/Team:UANL_Mty-Mexico/In_silico" class="menu-item-text">In silico</a>
 
-
      </li>
 
       <li class="last">
       <li class="last">
         <ul class="top-submenu">
         <ul class="top-submenu">
-
          <li class="last"><a href="https://2011.igem.org/Team:UANL_Mty-Mexico/In_silico/Restrictions">Tres</a></li>
+
<li class="last"><a href="https://2011.igem.org/Team:UANL_Mty-Mexico/Notebook/In_silico">Wiki hacks</a></li>
-
           <li class=""><a href="https://2011.igem.org/Team:UANL_Mty-Mexico/In_silico/PCR">Dos</a></li>
+
<li class=""><a href="https://2011.igem.org/Team:UANL_Mty-Mexico/Notebook/In_silico">In silico</a></li>
-
           <li class="first"><a href="https://2011.igem.org/Team:UANL_Mty-Mexico/In_silico/Math_Model">Unp</a></li>
+
           <li class=""><a href="https://2011.igem.org/Team:UANL_Mty-Mexico/Notebook/New_Protocols">New Protocols</a></li>
 +
          <li class=""><a href="https://2011.igem.org/Team:UANL_Mty-Mexico/Notebook/Protocols">Protocols</a></li>
 +
 
 +
          <li class=""><a href="https://2011.igem.org/Team:UANL_Mty-Mexico/Notebook/Blueprints">Blueprints</a></li>
 +
           <li class="first"><a href="https://2011.igem.org/Team:UANL_Mty-Mexico/Notebook/Timeline">Timeline</a></li>
         </ul>
         </ul>
-
         <a href="https://2011.igem.org/Team:UANL_Mty-Mexico/In_silico" class="menu-item-text">Applications</a>
+
         <a href="https://2011.igem.org/Team:UANL_Mty-Mexico/Notebook" class="menu-item-text">Notebook</a>
 +
      </li>
-
      </li>     
+
       
     </ul>
     </ul>
</div>
</div>
-
 
+
 
 +
 
 +
 
 +
 
<div class="content">
<div class="content">
   <div class="main" style="width:930px">
   <div class="main" style="width:930px">
   <!--<div style="width:900px">-->
   <!--<div style="width:900px">-->
-
      
+
     <div class="br2"></div><div class="br2"></div><div class="br2"></div>           
     <div id="leftColumn">
     <div id="leftColumn">
-
     <div id="header-code-column">
+
     <div id="header-project-column">
-
      <a name="code"></a>The Code </div>
+
<div class="br2"></div><div class="br2"></div><div class="br2"></div>           
 +
          <a name="Code"></a>The Code
 +
        <div class="br2"></div><div class="br2"></div><div class="br2"></div>           
 +
      </div>
     <p>The main idea consists of enabling a bacterial community to interpret a simple code. The code will be composed of just red and green lights. The genetic circuit on which the interpretation relies is not dependent on the nature of the stimuli though, whether light or chemical the information processing remains the same. We use light because it is an elegant non-invasive input.</p>
     <p>The main idea consists of enabling a bacterial community to interpret a simple code. The code will be composed of just red and green lights. The genetic circuit on which the interpretation relies is not dependent on the nature of the stimuli though, whether light or chemical the information processing remains the same. We use light because it is an elegant non-invasive input.</p>
<p>The message sent to bacteria will depend on the pattern of light. The community should be able to interpret five messages and tell it did it right when expressing a reporter gene. As there will only be two lights, five patterns of them will be used. The five fluorescent proteins available in the registry (GFP,YFP,RFP,CFP,BFP) fit perfectly to this purpose. The next figure illustrates the five patterns of light that will result in the five different messages sent, each of them represented by the expression of a fluorescent protein.</p>  
<p>The message sent to bacteria will depend on the pattern of light. The community should be able to interpret five messages and tell it did it right when expressing a reporter gene. As there will only be two lights, five patterns of them will be used. The five fluorescent proteins available in the registry (GFP,YFP,RFP,CFP,BFP) fit perfectly to this purpose. The next figure illustrates the five patterns of light that will result in the five different messages sent, each of them represented by the expression of a fluorescent protein.</p>  
<div class="br"></div>
<div class="br"></div>
<div class="br"></div>
<div class="br"></div>
 +
 +
<style>
 +
#img-holder2 {
 +
width: 550px;
 +
float: none;
 +
padding: 5;
 +
margin-bottom: 40px;
 +
text-align: Justify;
 +
border: 2px solid #036;
 +
background-color: #FFF;
 +
}
 +
</style>
 +
<center>
<center>
-
<div id = "img-holder">  
+
<div id = "img-holder2">  
-
<img src="http://www.genobiotec2011.org/iGEMwiki/images/Code-fig1.jpg"width="384" height="322" alt="blue1" align="center">
+
<img src="images/800px-Code-fig2.jpg"width="550" height="337" alt="blue1" align="center">
-
<span class="img-holder-text"><b>Figure 1.</b> The code. Short pulses of a single light will mean message one, while a long continuous pulse will mean a second message. That gives us two messages controlled by each light, summing up to four results. The fifth message will be sent with both lights present at the same time. </span></div>
+
 
 +
<span class="img-holder2-text"><b>Figure 2.</b> The community. Cells one and two control each the expression of two different fluorescent proteins. Cell three controls the expression of the fifth protein. Independent expression of each of the reporter genes is achieved through quorum sensing. Cells one and two have the capability to send and receive a different QS molecule each (QS1 and QS2 respectively), while cell three is only a receiver. When cell one or two receive an activating message, the production of a QS molecule is activated as well. These molecules will then diffuse through the medium and reach the rest of the cells. The effect of quorum sensing will depend on the receiver. QS2 molecules, when reaching cell one, will unleash the expression of a repressor that will block the production of any of cell's one reporter genes. QS1 molecules will have the same effect on cell two. On the other hand, cell three will be activated only when both QS molecules are present and therefore cells one and two are off. </span></div>
</center>
</center>
 +
<div class="br"></div>
 +
<div class="br"></div>
-
<div id="header-code-column">
+
 
-
      <a name="community"></a>The Community </div>
+
    <div id="header-project-column">
 +
<div class="br2"></div><div class="br2"></div><div class="br2"></div>           
 +
        <a name="Community"></a>Community
 +
          <div class="br2"></div><div class="br2"></div><div class="br2"></div>           
 +
      </div>
<p>Constructing the necessary genetic circuitry inside one single cell may be possible but probably much harder to achieve. That being so, we decided to construct the genetic circuit divided in blocks on separate cells that overall interpret the code. We consider this an advantageous approach since compartmentalizing the circuit lowers the construction size and metabolic charge per cell.</p>
<p>Constructing the necessary genetic circuitry inside one single cell may be possible but probably much harder to achieve. That being so, we decided to construct the genetic circuit divided in blocks on separate cells that overall interpret the code. We consider this an advantageous approach since compartmentalizing the circuit lowers the construction size and metabolic charge per cell.</p>
<p>There will be three kinds of cells with different genotypes, although initially all share the same E. coli strain. Two of them will have similar interpretation mechanisms, which will allow each one to take a single light as input and decide whether to express the first or the second reporter gene included in its genotype (decision that will depend on the code). The third kind of cell will be the one taking the input from both lights to express the last protein. Until now the community managed to control the expression of five fluorescent proteins, however we said each of them should be controlled independently. This is accomplished with cell to cell communication through quorum sensing. The following figure illustrates the way the cells within the community work together:</p>
<p>There will be three kinds of cells with different genotypes, although initially all share the same E. coli strain. Two of them will have similar interpretation mechanisms, which will allow each one to take a single light as input and decide whether to express the first or the second reporter gene included in its genotype (decision that will depend on the code). The third kind of cell will be the one taking the input from both lights to express the last protein. Until now the community managed to control the expression of five fluorescent proteins, however we said each of them should be controlled independently. This is accomplished with cell to cell communication through quorum sensing. The following figure illustrates the way the cells within the community work together:</p>
 +
<div class="br"></div>
 +
<div class="br"></div>
<div class="br"></div>
<div class="br"></div>
<div class="br"></div>
<div class="br"></div>
-
<center>
+
  <div id="header-project-column">
-
<div id = "img-holder2">  
+
<div class="br2"></div><div class="br2"></div><div class="br2"></div>          
-
<img src="http://www.genobiotec2011.org/iGEMwiki/images/800px-Code-fig2.jpg"width="550" height="337" alt="blue1" align="center">
+
        <a name="Live"></a>Live Community
-
 
+
          <div class="br2"></div><div class="br2"></div><div class="br2"></div>          
-
<span class="img-holder2-text"><b>Figure 2.</b> The community. Cells one and two control each the expression of two different fluorescent proteins. Cell three controls the expression of the fifth protein. Independent expression of each of the reporter genes is achieved through quorum sensing. Cells one and two have the capability to send and receive a different QS molecule each (QS1 and QS2 respectively), while cell three is only a receiver. When cell one or two receive an activating message, the production of a QS molecule is activated as well. These molecules will then diffuse through the medium and reach the rest of the cells. The effect of quorum sensing will depend on the receiver. QS2 molecules, when reaching cell one, will unleash the expression of a repressor that will block the production of any of cell's one reporter genes. QS1 molecules will have the same effect on cell two. On the other hand, cell three will be activated only when both QS molecules are present and therefore cells one and two are off. </span></div>
+
      </div>
-
</center>
+
-
    <div id="header-code-column">
+
-
      <a name="live"></a>Live Community </div>
+
<p>Here we show an animated explanation for better understanding:</p>
<p>Here we show an animated explanation for better understanding:</p>
-
  <div class="br"></div>
+
 
-
      <div class="br"></div>
+
<div class="br"></div>
-
     
+
<div class="br"></div>
-
<center>
+
<div class="br"></div>
-
<div id = "img-holder3">  
+
<div class="br"></div>
-
    <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="550" height="500" id="FlashID" title="Live Community">
+
 
-
      <param name="movie" value="Flash/circuit-flash.swf">
+
 
-
      <param name="quality" value="high">
+
 
-
      <param name="wmode" value="opaque">
+
 
-
      <param name="swfversion" value="9.0.45.0">
+
-
      <!-- This param tag prompts users with Flash Player 6.0 r65 and higher to download the latest version of Flash Player. Delete it if you don’t want users to see the prompt. -->
+
-
      <param name="expressinstall" value="Scripts/expressInstall.swf">
+
-
      <!-- Next object tag is for non-IE browsers. So hide it from IE using IECC. -->
+
-
      <!--[if !IE]>-->
+
-
      <object type="application/x-shockwave-flash" data="Flash/circuit-flash.swf" width="550" height="500">
+
-
        <!--<![endif]-->
+
-
        <param name="quality" value="high">
+
-
        <param name="wmode" value="opaque">
+
-
        <param name="swfversion" value="9.0.45.0">
+
-
        <param name="expressinstall" value="Scripts/expressInstall.swf">
+
-
        <!-- The browser displays the following alternative content for users with Flash Player 6.0 and older. -->
+
-
        <div>
+
-
          <h4>Content on this page requires a newer version of Adobe Flash Player.</h4>
+
-
          <p><a href="http://www.adobe.com/go/getflashplayer"><img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" width="112" height="33" /></a></p>
+
-
        </div>
+
-
        <!--[if !IE]>-->
+
-
      </object>
+
-
      <!--<![endif]-->
+
-
    </object>
+
-
    </div>
+
-
</center>
+
     </div>
     </div>
      
      
Line 716: Line 1,028:
     <img src="http://www.genobiotec2011.org/iGEMwiki/images/OurSymbol.png" width="200" height="160" alt="OurSymbol">
     <img src="http://www.genobiotec2011.org/iGEMwiki/images/OurSymbol.png" width="200" height="160" alt="OurSymbol">
      
      
-
   
+
  <div class="br"></div>
-
    <div class="col-1-3">
+
        <div class="br"></div>
-
<ul class="s-style s-menu">
+
        <div class="br"></div>
-
            <li rel="1"><a href="#code">The Code</a></li>
+
 
-
          <li rel="2"><a href="index-4.html">The Community</a></li>
+
    <div id="botonera">
-
          <li rel="3"><a href="#live">Live Community</a></li>
+
    <div class="lateral-button"><a href="#Code">The Code</a></div>
-
       
+
    <div class="lateral-button"><a href="#Community">Community</a></div>
-
        </ul>
+
        <div class="lateral-button"><a href="#Live">Live Community</a></div>
-
    </div>
+
    </div>
 +
 
 +
 
         <div class="br"></div>
         <div class="br"></div>
         <div class="br"></div>
         <div class="br"></div>
         <div class="br"></div>
         <div class="br"></div>
 +
 +
Line 743: Line 1,059:
</div>
</div>
-
       
+
     
-
<div class="content3">
+
 
 +
 
 +
<div class="content3">
<div id="footer-leftColumn">
<div id="footer-leftColumn">
     <img src="http://www.genobiotec2011.org/iGEMwiki/images/UANLteamOfficial4.png" alt="UANLofficialteam" width="259" height="82" border="0" usemap="#Map2">
     <img src="http://www.genobiotec2011.org/iGEMwiki/images/UANLteamOfficial4.png" alt="UANLofficialteam" width="259" height="82" border="0" usemap="#Map2">
Line 757: Line 1,075:
         <span id="content-middlefooter">
         <span id="content-middlefooter">
         <a href="#top">Go back to top</a></span>
         <a href="#top">Go back to top</a></span>
-
         <div class="br"></div>
+
         <div class="br2"></div>
-
        <div class="br"></div>
+
 
    
    
         <span class="TUD-footer-title">Search</span>
         <span class="TUD-footer-title">Search</span>
         <form action="/Special:Search" id="search-form">
         <form action="/Special:Search" id="search-form">
 +
         <input id="searchInput" name="search" type="text" title="Search 2010.igem.org [f]" accesskey="f" value="" />
         <input id="searchInput" name="search" type="text" title="Search 2010.igem.org [f]" accesskey="f" value="" />
-
         <div class="br"></div>
+
         <div class="br2"></div>
         <input type='submit' name="go" class="searchButton" id="searchGoButton" value="Go" title="Go to a page with this exact name if exists" />&nbsp;
         <input type='submit' name="go" class="searchButton" id="searchGoButton" value="Go" title="Go to a page with this exact name if exists" />&nbsp;
         <input type='submit' name="fulltext" class="searchButton" id="mw-searchButton" value="Search" title="Search the pages for this text" />
         <input type='submit' name="fulltext" class="searchButton" id="mw-searchButton" value="Search" title="Search the pages for this text" />
Line 770: Line 1,089:
   </div>
   </div>
-
  <div id="footer-rightColumn">
+
 
 +
 
 +
<div id="footer-rightColumn">
         <span class="TUD-footer-title">Contact us</span>
         <span class="TUD-footer-title">Contact us</span>
-
         <div class="br"></div>
+
         <div class="br2"></div>
         <i>Av. Manuel L. Barragan S/N, Cd. Universitaria. C.P.66450. San Nicolás de los Garza, Nuevo León, México.</i>
         <i>Av. Manuel L. Barragan S/N, Cd. Universitaria. C.P.66450. San Nicolás de los Garza, Nuevo León, México.</i>
-
         <div class="br"></div>
+
         <div class="br2"></div>
         <a href="mailto:team.igemuanl2011@gmail.com"><img src="http://www.genobiotec2011.org/iGEMwiki/images/Gmail-Icon.png" width="42" height="29" alt="gmail-icon" title="Mail us to: team.igemuanl2011@gmail.com"></a>
         <a href="mailto:team.igemuanl2011@gmail.com"><img src="http://www.genobiotec2011.org/iGEMwiki/images/Gmail-Icon.png" width="42" height="29" alt="gmail-icon" title="Mail us to: team.igemuanl2011@gmail.com"></a>
         <a href="http://twitter.com/#!/iGEMUANL" target="_new"><img src="http://www.genobiotec2011.org/iGEMwiki/images/twitter1.png" width="30" height="30" alt="twitter-logo" title="Follow us on Twitter: @iGEMUANL"></a>  
         <a href="http://twitter.com/#!/iGEMUANL" target="_new"><img src="http://www.genobiotec2011.org/iGEMwiki/images/twitter1.png" width="30" height="30" alt="twitter-logo" title="Follow us on Twitter: @iGEMUANL"></a>  
Line 781: Line 1,102:
</div>
</div>
-
<script type="text/javascript">
 
-
swfobject.registerObject("FlashID");
 
-
</script>
 
</body>
</body>
</html>
</html>

Revision as of 01:13, 14 September 2011

Team: UANL_Mty-Mexico

banner-main iGEM-logo
The Code

The main idea consists of enabling a bacterial community to interpret a simple code. The code will be composed of just red and green lights. The genetic circuit on which the interpretation relies is not dependent on the nature of the stimuli though, whether light or chemical the information processing remains the same. We use light because it is an elegant non-invasive input.

The message sent to bacteria will depend on the pattern of light. The community should be able to interpret five messages and tell it did it right when expressing a reporter gene. As there will only be two lights, five patterns of them will be used. The five fluorescent proteins available in the registry (GFP,YFP,RFP,CFP,BFP) fit perfectly to this purpose. The next figure illustrates the five patterns of light that will result in the five different messages sent, each of them represented by the expression of a fluorescent protein.

blue1 Figure 2. The community. Cells one and two control each the expression of two different fluorescent proteins. Cell three controls the expression of the fifth protein. Independent expression of each of the reporter genes is achieved through quorum sensing. Cells one and two have the capability to send and receive a different QS molecule each (QS1 and QS2 respectively), while cell three is only a receiver. When cell one or two receive an activating message, the production of a QS molecule is activated as well. These molecules will then diffuse through the medium and reach the rest of the cells. The effect of quorum sensing will depend on the receiver. QS2 molecules, when reaching cell one, will unleash the expression of a repressor that will block the production of any of cell's one reporter genes. QS1 molecules will have the same effect on cell two. On the other hand, cell three will be activated only when both QS molecules are present and therefore cells one and two are off.
Community

Constructing the necessary genetic circuitry inside one single cell may be possible but probably much harder to achieve. That being so, we decided to construct the genetic circuit divided in blocks on separate cells that overall interpret the code. We consider this an advantageous approach since compartmentalizing the circuit lowers the construction size and metabolic charge per cell.

There will be three kinds of cells with different genotypes, although initially all share the same E. coli strain. Two of them will have similar interpretation mechanisms, which will allow each one to take a single light as input and decide whether to express the first or the second reporter gene included in its genotype (decision that will depend on the code). The third kind of cell will be the one taking the input from both lights to express the last protein. Until now the community managed to control the expression of five fluorescent proteins, however we said each of them should be controlled independently. This is accomplished with cell to cell communication through quorum sensing. The following figure illustrates the way the cells within the community work together:

Live Community

Here we show an animated explanation for better understanding:

OurSymbol