Team:Groningen/DesignTest

From 2012.igem.org

(Difference between revisions)
m
m
 
(5 intermediate revisions not shown)
Line 1: Line 1:
-
{{HeaderGroningen2012}}
+
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
 +
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
 +
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
 +
<script type="text/javascript" src="js/prototype.js"></script>
 +
<script type="text/javascript" src="js/scriptaculous.js?load=effects,builder"></script>
 +
<script type="text/javascript" src="js/lightbox.js"></script>
 +
    <script type="text/javascript" src="http://jqueryrotate.googlecode.com/svn/trunk/jQueryRotate.js"></script>
 +
<head>
 +
<meta http-equiv="X-UA-Compatible" content="IE=EDGE" charset="utf-8" />
 +
<style>
 +
div.cogbig{
 +
position:absolute;
 +
padding: 0px;
 +
margin: 0px 0px;
 +
opacity:0.4;
 +
filter:alpha(opacity=40);
 +
z-index:-1;
 +
}
 +
 +
/*Windmill*/
 +
#img1{
 +
width:120px;
 +
height:104px;
 +
position:absolute;
 +
z-index:10;
 +
left:-19px;
 +
top:-31px;
 +
}
 +
 +
/*Menu*/
 +
#navigation  {
 +
margin: 0;
 +
padding: 0 0em;
 +
height: 20px;
 +
list-style: none;
 +
display:block;
 +
font-size: 12px; 
 +
                                font-weight: 300;   
 +
color:#fff;
 +
z-index:2;
 +
}
 +
#navigation > li {
 +
float: left;
 +
height: 100%;
 +
margin-right: 18px;
 +
                                margin-left: 18px;
 +
left:100px;
 +
padding: 0 0em;
 +
}
 +
#navigation > li > a {
 +
float: left;
 +
height: 100%;
 +
color: #00;
 +
text-decoration: none;
 +
font-weight: 300;
 +
}
 +
#navigation > li > a:hover {
 +
color: Black;
 +
 +
 +
}
 +
#navigation > li.sub {
 +
position: relative;
 +
 +
}
 +
#navigation > li.sub ul {
 +
width: 130px;
 +
margin: 0;
 +
padding: 0.0em 0;
 +
list-style: none;
 +
position: absolute;
 +
top: -800em;
 +
text-align:center;
 +
padding-left:13px;                                         
 +
background-color: rgba(0,0,0,0.5);
 +
}
 +
#navigation > li.sub ul li {
 +
width: 90%;
 +
background-color: rgba(0,0,0,0.9);
 +
}
 +
#navigation > li.sub ul li a {
 +
height: 100%;
 +
display: block;
 +
padding: 0.0em;
 +
color: #fff;
 +
text-decoration: none;
 +
}
 +
#navigation > li.sub ul li a:hover {
 +
color: rgb(255,103,0);
 +
font-weight: 700;
 +
}
 +
#navigation > li.sub:hover ul {
 +
top: 100px;
 +
left:-35px;
 +
}
 +
 +
#expand
 +
.expand-down span
 +
{
 +
font-family: Arial,Helvetica,sans-serif;
 +
line-height: normal;
 +
margin-bottom: 0px;
 +
margin-top: 0px;
 +
z-index:1;
 +
font-weight: 300;
 +
}
 +
.expand-down * {
 +
margin: 0px;
 +
padding: 0;
 +
z-index:1;
 +
}
 +
.expand-down ul {
 +
padding-top:100px;
 +
z-index:1;
 +
}
 +
.expand-down ul li {
 +
list-style-type:none;
 +
z-index:1;
 +
}
 +
.expand-down ul li a {
 +
text-decoration:none;
 +
z-index:1;
 +
}
 +
.expand-down ul li a img {
 +
width:80px;
 +
height:82px;
 +
border:none;
 +
z-index:1;
 +
}
 +
.expand-down ul li a span {
 +
//span bar under picture text
 +
z-index:1;
 +
text-align:center;
 +
font-size:14px;
 +
display: block;
 +
padding: 0.0em;
 +
color: #fff;
 +
}
 +
.expand-down ul li:hover a span {
 +
display:block;
 +
font-size:14px;
 +
z-index:1;
 +
color: rgb(255,103,0);
 +
font-weight: 700;
 +
background-color: rgba(0,0,0,0.5);
 +
}
 +
.expand-down ul li:hover a img {
 +
width:80px;
 +
height:82px;
 +
z-index:1;
 +
}
 +
.expand-down ul li:hover + li a img {
 +
width:80px;
 +
height:82px;
 +
z-index:1;
 +
}
 +
.expand-down ul li:hover + li + li a img {
 +
width:80px;
 +
height:82px;
 +
z-index:1;
 +
}
 +
 +
/*Body*/
 +
body{
 +
background-attachment:fixed;
 +
background-color:rgb(118,28,17);
 +
text-align: justify;
 +
border: none;
 +
}
 +
#content{
 +
position: relative;
 +
top:-5px;
 +
width: 1024px;
 +
padding: 0px 0px 0px 0px;
 +
background-color:transparent;
 +
border: none;
 +
}
 +
#bodyContent{
 +
width: 1024px;
 +
position: relative;
 +
padding: 0px 0px 0px 0px;
 +
background-color:transparent;
 +
border: none;
 +
}
 +
 +
 +
/*Suppress iGEM defaults*/
 +
a[title="Main Page"]{display: none;}
 +
.firstHeading{display: none;}
 +
.noprint{display: none;}
 +
#menubar{
 +
display: block;
 +
background-color:transparent;
 +
}
 +
#search-controls{display: none;}
 +
#contentSub{display: none;}
 +
#catlinks{display: none;}
 +
#footer-box{display: none;}
 +
#p-logo{display: block;}
 +
#top-section {
 +
display: block;
 +
position: relative;
 +
height: 98px;
 +
width: 975px;
 +
margin: -25px auto;
 +
border-left: 1px solid rgb(118,28,17);
 +
border-right: 1px solid rgb(118,28,17);
 +
border-bottom: 1px solid rgb(118,28,17);
 +
}
 +
</style>
 +
</head>
 +
 +
<body>
 +
 +
 +
<div style="position:absolute; left: 197px; top: 30px;opacity:0.4;
 +
filter:alpha(opacity=40);">
 +
<img  id="cog1" src="https://static.igem.org/mediawiki/2012/a/ad/Groningen2012_AD_20120802_SmallCog.png" />
 +
</div>
 +
 +
<div style="position:absolute; left: 313px; top: 30px;opacity:0.4;
 +
filter:alpha(opacity=40);">
 +
<img  id="cog2" src="https://static.igem.org/mediawiki/2012/a/ad/Groningen2012_AD_20120802_SmallCog.png" />
 +
</div>
 +
 +
<div style="position:absolute; left: 429px; top: 30px;opacity:0.4;
 +
filter:alpha(opacity=40);">
 +
<img  id="cog3" src="https://static.igem.org/mediawiki/2012/a/ad/Groningen2012_AD_20120802_SmallCog.png" />
 +
</div>
 +
 +
<div style="position:absolute; left: 545px; top: 30px;opacity:0.4;
 +
filter:alpha(opacity=40);">
 +
<img  id="cog4" src="https://static.igem.org/mediawiki/2012/a/ad/Groningen2012_AD_20120802_SmallCog.png" />
 +
</div>
 +
 +
<div style="position:absolute; left: 661px; top: 30px;opacity:0.4;
 +
filter:alpha(opacity=40);">
 +
<img  id="cog5" src="https://static.igem.org/mediawiki/2012/a/ad/Groningen2012_AD_20120802_SmallCog.png" />
 +
</div>
 +
 +
<div style="position:absolute; left: 777px; top: 30px;opacity:0.4;
 +
filter:alpha(opacity=40);">
 +
<img  id="cog6" src="https://static.igem.org/mediawiki/2012/a/ad/Groningen2012_AD_20120802_SmallCog.png" />
 +
</div>
 +
 +
<div class="expand-down">
 +
<ul id="navigation" >
 +
<li class="sub" id="menuhome">
 +
 +
<a href="https://2012.igem.org/Team:Groningen" title="Home" rel="nofollow">
 +
<img src="https://static.igem.org/mediawiki/2012/6/61/Groningen2012_ID_20120808_Menu_Home.png" alt="Home"  title="Home" />
 +
<span>home</span>
 +
</a>
 +
 +
<div class="cogbig">
 +
<img id="cogbighome" src="https://static.igem.org/mediawiki/2012/b/b6/Groningen2012_AD_20120802_BigCog.png" width="80" height="80">
 +
</div>
 +
 +
</li>
 +
<li class="sub" id="menuteam">
 +
<div class="cogbig">
 +
<img id="cogbigteam" src="https://static.igem.org/mediawiki/2012/b/b6/Groningen2012_AD_20120802_BigCog.png" width="80" height="80">
 +
</div>
 +
<a href="https://2012.igem.org/Team:Groningen/Team" title="Team" rel="nofollow" >
 +
<img src="https://static.igem.org/mediawiki/2012/f/fc/Groningen2012_ID_20120808_Menu_Team.png" alt="team" title="Team" />
 +
<span>team</span>
 +
<ul>
 +
<li><a href="https://2012.igem.org/Team:Groningen/Team">about us</a></li>
 +
<li><a href="https://igem.org/Team.cgi?id=818" TARGET="_blank">official profile</a></li>
 +
                                                        <li><a href="https://2012.igem.org/Team:Groningen/Gallery">gallery</a></li>
 +
                                                       
 +
                                                        <li><a href="https://2012.igem.org/Team:Groningen/Attributions">attributions</a></li>
 +
                                                        <li><a href="https://2012.igem.org/Team:Groningen/acknowledgements">acknowledgements</a></li>
 +
 +
                                                        <li><a href="https://2012.igem.org/Team:Groningen/Contact">contact</a></li>
 +
</ul>
 +
</a>
 +
</li>
 +
<li class="sub" id="menuproject">
 +
<div class="cogbig">
 +
<img id="cogbigproject" src="https://static.igem.org/mediawiki/2012/b/b6/Groningen2012_AD_20120802_BigCog.png" width="80" height="80">
 +
</div>
 +
<a href="https://2012.igem.org/Team:Groningen/Project" title="Project" rel="nofollow" >
 +
<img src="https://static.igem.org/mediawiki/2012/1/19/Groningen2012_ID_20120808_Menu_Project.png" alt="Project" title="Project" />
 +
<span>project</span>
 +
<ul>
 +
<li><a href="https://2012.igem.org/Team:Groningen/Project">abstract</a></li>                            <li><a href="https://2012.igem.org/Team:Groningen/Data_page">data page</a></li>
 +
<li><a href="https://2012.igem.org/Team:Groningen/Sticker">sticker</a></li>
 +
<li><a href="https://2012.igem.org/Team:Groningen/volatiles">volatiles</a></li>
 +
<li><a href="https://2012.igem.org/Team:Groningen/Sensor">sensor</a></li>
 +
<li><a href="https://2012.igem.org/Team:Groningen/pigmentproduction">pigment</a></li>
 +
<li><a href="https://2012.igem.org/Team:Groningen/Construct">construct</a></li>
 +
<li><a href="https://2012.igem.org/Team:Groningen/Kill_Switch">kill switch</a></li>
 +
<li><a href="https://2012.igem.org/Team:Groningen/Modeling">modeling</a></li>
 +
<li><a href="https://2012.igem.org/Team:Groningen/Notebook">notebook</a></li>
 +
 +
</ul>   
 +
</a>
 +
</li>
 +
<li class="sub" id="menuparts">
 +
<div class="cogbig">
 +
<img id="cogbigparts" src="https://static.igem.org/mediawiki/2012/b/b6/Groningen2012_AD_20120802_BigCog.png" width="80" height="80">
 +
</div>
 +
<a href="https://2012.igem.org/Team:Groningen/OurBiobrick" title="Parts" rel="nofollow" >
 +
<img src="https://static.igem.org/mediawiki/2012/0/06/Groningen2012_ID_20120808_Menu_Parts.png" alt="Parts" title="Parts" />
 +
<span>parts</span>
 +
                                                <ul>
 +
<li><a href="https://2012.igem.org/Team:Groningen/OurBiobrick">our biobricks</a></li>
 +
                                                        <li><a href="https://2012.igem.org/Team:Groningen/parts_fail">improvements</a></li>
 +
                                                        <li><a href="https://2012.igem.org/Team:Groningen/in_development">in development</a></li>
 +
</ul> 
 +
</a>
 +
</li>
 +
<li class="sub" id="menusafety">
 +
<div class="cogbig">
 +
<img id="cogbigsafety" src="https://static.igem.org/mediawiki/2012/b/b6/Groningen2012_AD_20120802_BigCog.png" width="80" height="80">
 +
</div>
 +
<a href="https://2012.igem.org/Team:Groningen/Safety" title="Safety" rel="nofollow" >
 +
<img src="https://static.igem.org/mediawiki/2012/d/d4/Groningen2012_ID_20120808_Menu_Safety.png" alt="Safety" title="Safety" />
 +
<span>safety</span>
 +
                                                <ul>
 +
 +
<li><a href="https://2012.igem.org/Team:Groningen/Safety">general safety</a></li>
 +
<li><a href="https://2012.igem.org/Team:Groningen/10com">in the lab</a></li>
 +
<li><a href="https://2012.igem.org/Team:Groningen/publicsafety">public safety</a></li>
 +
<li><a href="https://2012.igem.org/Team:Groningen/environment">environment</a></li>
 +
<li><a href="https://2012.igem.org/Team:Groningen/foodsafety">food safety</a></li>
 +
</ul>
 +
</a>
 +
</li>
 +
<li class="sub" id="menupr">
 +
<div class="cogbig">
 +
<img id="cogbigpr" src="https://static.igem.org/mediawiki/2012/b/b6/Groningen2012_AD_20120802_BigCog.png" width="80" height="80">
 +
</div>
 +
<a href="https://2012.igem.org/Team:Groningen/overview" title="Public Relation" rel="nofollow" >
 +
<img src="https://static.igem.org/mediawiki/2012/6/6f/Groningen2012_ID_20120808_Menu_Public_Relations.png" alt="Public Relation" title="Public Relation" />
 +
<span>human<br>practice</span>
 +
                                                <ul>
 +
<li><a href="https://2012.igem.org/Team:Groningen/overview">overview</a></li>
 +
<li><a href="https://2012.igem.org/Team:Groningen/summer_school">summerschool</a></li>
 +
<li><a href="https://2012.igem.org/Team:Groningen/Stop_the_food_waste_initiative">stop food waste</a></li>
 +
<li><a href="https://2012.igem.org/Team:Groningen/market_research">market research</a></li>
 +
<li><a href="https://2012.igem.org/Team:Groningen/Festivals">festivals</a></li>
 +
<li><a href="https://2012.igem.org/Team:Groningen/symposia">presentations</a></li>
 +
<li><a href="https://2012.igem.org/Team:Groningen/international_cooperation">collaboration</a></li>
 +
<li><a href="https://2012.igem.org/Team:Groningen/Media_coverage">media coverage</a></li>
 +
</ul>
 +
</a>
 +
</li>
 +
<li class="sub" id="menusponsors">
 +
<div class="cogbig">
 +
<img id="cogbigsponsors" src="https://static.igem.org/mediawiki/2012/b/b6/Groningen2012_AD_20120802_BigCog.png" width="80" height="80">
 +
</div>
 +
<a href="https://2012.igem.org/Team:Groningen/Sponsors" title="Sponsors" rel="nofollow" >
 +
<img src="https://static.igem.org/mediawiki/2012/d/d4/Groningen2012_ID_20120808_Menu_Sponsors.png" alt="Sponsors" title="Sponsors" />
 +
<span>sponsors</span>
 +
<ul>
 +
<li><a href="https://2012.igem.org/Team:Groningen/our_sponsors">our sponsors</a></li>
 +
<li><a href="https://2012.igem.org/Team:Groningen/sponsor_levels">sponsorship levels</a></li>
 +
</ul>
 +
</a>
 +
 +
<img id="img1" img src="https://static.igem.org/mediawiki/2012/e/e4/Groningen2012_AD_20120802_WindmillArms.png" width="120"height="104" />
 +
 +
 +
</script>
 +
</li>
 +
</ul>
 +
</div>
 +
 +
 +
 +
 +
</body>
 +
<script>
 +
$(document).ready(function(){
 +
    $("ul#navigation").mouseenter(function(){
 +
        cog = 1;
 +
    });
 +
    $("li#navigation").mouseleave(function(){
 +
        cog = 0;
 +
        angle = 0;
 +
    });
 +
    $("li#menuhome").mouseenter(function(){
 +
        target = "#cogbighome";         
 +
    }); 
 +
    $("li#menuteam").mouseenter(function(){
 +
        target = "#cogbigteam";
 +
    });
 +
    $("li#menuproject").mouseenter(function(){
 +
        target = "#cogbigproject";
 +
    });
 +
    $("li#menuparts").mouseenter(function(){
 +
        target = "#cogbigparts";
 +
    });
 +
    $("li#menusafety").mouseenter(function(){
 +
        target = "#cogbigsafety"; 
 +
    });
 +
    $("li#menupr").mouseenter(function(){
 +
        target = "#cogbigpr";   
 +
    });
 +
    $("li#menusponsors").mouseenter(function(){
 +
        target = "#cogbigsponsors";
 +
 +
    });
 +
});
 +
 +
var cogangle = 0;
 +
var cog = 0;
 +
var angle = 0;
 +
 +
var target = ".cogbig";
 +
setInterval(function(){
 +
      cogangle-=cog;
 +
    $(target).rotate(cogangle);
 +
if (target=="#cogbigsponsors")
 +
  {
 +
$("#img1").rotate(cogangle);
 +
$("#cogbighome").rotate(cogangle);
 +
$("#cogbigteam").rotate(cogangle);
 +
$("#cogbigproject").rotate(cogangle);
 +
$("#cogbigsafety").rotate(cogangle);
 +
$("#cogbigparts").rotate(cogangle);
 +
$("#cogbigpr").rotate(cogangle);
 +
$("#cog1").rotate(-cogangle*3);
 +
$("#cog2").rotate(-cogangle*3);
 +
$("#cog3").rotate(-cogangle*3);
 +
$("#cog4").rotate(-cogangle*3);
 +
$("#cog5").rotate(-cogangle*3);
 +
$("#cog6").rotate(-cogangle*3);
 +
document.getElementById('cog1').style.display = "block";
 +
document.getElementById('cog2').style.display = "block";
 +
document.getElementById('cog3').style.display = "block";
 +
document.getElementById('cog4').style.display = "block";
 +
document.getElementById('cog5').style.display = "block";
 +
document.getElementById('cog6').style.display = "block";
 +
  }
 +
else
 +
{
 +
  document.getElementById('cog1').style.display = "none";
 +
  document.getElementById('cog2').style.display = "none";
 +
  document.getElementById('cog3').style.display = "none";
 +
  document.getElementById('cog4').style.display = "none";
 +
  document.getElementById('cog5').style.display = "none";
 +
  document.getElementById('cog6').style.display = "none";
 +
 +
} 
 +
},30);
 +
 +
 +
 +
</script>
 +
 +
</html>
 +
 +
 +
 +
 +
 +
 +
 +
<html>
 +
<head>
 +
<style>
 +
#img2{
 +
position:absolute;
 +
z-index:0;
 +
left:0px;
 +
top:80px;
 +
margin-bottom: 20px;
 +
} 
 +
#img3{
 +
position:absolute;
 +
z-index:0;
 +
left:800px;
 +
top:130px;
 +
margin-bottom: 20px;
 +
}             
 +
 +
</style>
 +
<img id="img2" img src="https://static.igem.org/mediawiki/2012/4/41/Groningen_2012_logoFW.png" width="220px"/><a href="https://2012.igem.org/Main_Page">
 +
<img id="img3" img src="https://static.igem.org/mediawiki/igem.org/1/17/IGEM_basic_Logo_white_stylized.png" width="100px"/></a>
 +
 +
</head>
 +
</html>
 +
 +
<html>
 +
<script type="text/javascript">
 +
 +
  var _gaq = _gaq || [];
 +
  _gaq.push(['_setAccount', 'UA-34029773-1']);
 +
  _gaq.push(['_trackPageview']);
 +
 +
  (function() {
 +
    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
 +
    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
 +
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
 +
  })();
 +
 +
</script>
 +
</html>
<html>
<html>
Line 11: Line 511:
color:white;
color:white;
}
}
-
z2 {
+
z2 {  
-
font-size:14pt;
+
font-size:18pt;
-
font-weight: bold;
+
line-height:21pt;
-
color: rgb(255,103,0);
+
-
}
+
-
z3 {
+
-
font-size:14pt;
+
-
font-weight: bold;
+
-
color: white;
+
-
}
+
-
z5 {
+
-
font-size:14pt;
+
-
font-weight: bold;
+
-
color: rgb(255,103,0);
+
-
}
+
-
z4 {
+
-
margin-left:170px;
+
-
margin-right:150px;
+
-
font-size:12pt;
+
-
font-weight: bold;
+
color:white;
color:white;
}
}
div.ctd {
div.ctd {
-
width: 120px;
+
width: 90px;
text-align: center;
text-align: center;
background: #000;
background: #000;
background-color: rgba(0,0,0,0.3);
background-color: rgba(0,0,0,0.3);
padding: 5px ;
padding: 5px ;
-
margin: 30px auto;
+
margin: 30px auto;
color: #FFF;
color: #FFF;
}
}
div.cte {
div.cte {
-
width: 150px;
+
width: 120px;
text-align: center;
text-align: center;
background: #000;
background: #000;
padding-right:10px;
padding-right:10px;
padding-left:10px;
padding-left:10px;
 +
margin: 0 auto;
background-color: rgba(0,0,0,0.3);
background-color: rgba(0,0,0,0.3);
-
margin: 0px auto;
 
color: #FFF;
color: #FFF;
}
}
-
p{
+
            div.ctd2 {
 +
width: 300px;
 +
height: 20px;
 +
text-align: center;
 +
background: #000;
 +
background-color: transparent;
 +
background-color: rgba(0,0,0,0.3);
 +
padding: 10px ;
 +
margin: 30px auto; 
 +
color: #FFF;
 +
}
 +
            div.cte2 {
 +
width: 330px;
 +
height: 40px;
 +
text-align: center;
 +
background: #000;
 +
padding-right:10px;
 +
padding-left:10px;
 +
background-color: transparent;
 +
background-color: rgba(0,0,0,0.3);
 +
margin: -30px auto;
 +
color: #FFF;
 +
}
 +
div.ctd3 {
 +
width: 430px;
 +
height: 20px;
 +
text-align: center;
 +
background: #000;
 +
background-color: transparent;
 +
background-color: rgba(0,0,0,0.3);
 +
padding: 10px ;
 +
margin: 30px auto; 
 +
color: #FFF;
 +
}
 +
            div.cte3 {
 +
width: 480px;
 +
height: 40px;
 +
text-align: center;
 +
background: #000;
 +
padding-right:10px;
 +
padding-left:10px;
 +
background-color: transparent;
 +
background-color: rgba(0,0,0,0.3);
 +
margin: -30px auto;
 +
color: #FFF;
 +
}
 +
z7{
 +
font-size:13pt;
 +
line-height:14pt;
 +
color: rgb(255,103,0);
 +
}
 +
p.nomargin{
font-size:12pt;  
font-size:12pt;  
line-height:14pt;  
line-height:14pt;  
-
margin-top: 0px;
+
margin-right: 0px;
-
margin-bottom: 0px;
+
margin-left: 0px;
-
margin-right:150px;
+
-
margin-left:150px;
+
color: white;
color: white;
}
}
-
ol.ref{
+
p.marginleft{
-
list-style-type: decimal;
+
margin-top: 0px;
-
margin-left:170px;
+
margin-left:150px;
 +
font-size:13pt;
 +
line-height:15pt;  
margin-right:150px;
margin-right:150px;
-
font-size:10pt;
+
color:white;
-
color:white;
+
}
}
-
p.ref
+
p.orange{
-
{
+
margin-top:0px;
-
margin-left:170px;
+
margin-left:150px;
 +
font-size:14pt;
 +
line-height:16pt;  
margin-right:150px;
margin-right:150px;
-
font-size:10pt;
+
color: #FF6700;
-
font-tyle: italic;
+
font-weight: bold;
}
}
-
p.captionnomargin{
+
p.marginspace{
-
font-size:10pt;  
+
font-size:13pt;  
-
line-height:14pt;  
+
line-height:15pt;  
-
margin-top: 0px;
+
color:white;
-
margin-bottom: 0px;
+
 
-
margin-right: 0px;
+
margin-top:0px;
-
margin-left: 0px;
+
margin-bottom:200px;
-
color: white;
+
margin-right:0px;
 +
margin-left:300px;
 +
margin-right:300px;
}
}
-
.centertable{
+
p.centered{
-
background-color: transparent;
+
font-size:13pt;
-
width: 100%;
+
line-height:15pt;
-
margin-top: 0;
+
color:white;
-
margin-bottom: 0;
+
 
 +
margin-top:0px;
 +
margin-bottom:0px;
 +
margin-right:300px;
 +
margin-left:300px;
 +
}
 +
a.inlink{
 +
font-size: 12pt;
 +
                line-height: 12pt;
 +
                color: rgb(255,103,0);
 +
}
 +
a.menulink{
 +
font-size:12pt;
 +
line-height:12pt;
 +
color:white;
 +
font-weight: 500;
 +
}
 +
a.menulink:hover{
 +
font-size:12pt;
 +
line-height:12pt;
 +
color: rgb(255,103,0);
 +
font-weight: 700;
 +
}
 +
a:link {
 +
color: #FFFFFF;
 +
}
 +
a:visited {
 +
color: #FFFFFF;
 +
}
 +
a:hover {
 +
color: #FF6700;
 +
}
 +
a:active {
 +
color: #FF6700;
}
}
a.inlink{
a.inlink{
Line 95: Line 665:
                 color: rgb(255,103,0);
                 color: rgb(255,103,0);
}
}
-
#DAEshow {
+
table.accompli
-
position:relative;
+
{
-
height:350px;
+
background-color: transparent;
 +
margin-left: 150px;
 +
margin-right: 150px;
}
}
-
#DAEshow IMG {
+
td.accPic
-
position:absolute;
+
{
-
top:0;
+
text-align: left;
-
left:250px;
+
min-width: 350px;
-
z-index:8;
+
max-width: 350px;
-
opacity:0.0;
+
min-height: 400px;
 +
max-height: 400px;
 +
padding-left: 10px
}
}
-
#DAEshow IMG.active {
+
td.accCap
-
z-index:10;
+
{
-
opacity:1.0;
+
text-align: left;
 +
min-width: 350px;
 +
max-width: 350px;
 +
min-height: 200px;
 +
max-height: 200px;
 +
padding-left: 10px
 +
}
 +
table.projectmenu{
 +
background-color: transparent;
 +
}
 +
table.centertable{
 +
background-color: transparent;
 +
width: 100%;
 +
margin-top: 0;
 +
margin-bottom: 0;
 +
}
 +
td.margincell{
 +
min-width: 150px;
 +
max-width: 150px;
 +
vertical-align: bottom;
 +
}
 +
div.bigcog{
 +
opacity:0.4;
 +
filter:alpha(opacity=40);
 +
z-index: -1;
 +
}
 +
#bigcogtopleft{
 +
position: relative;
 +
left: -10px;
 +
}
 +
#bigcogtopright{
 +
position: relative;
 +
left: 10px;
 +
}
 +
div.cogoverlay{
 +
z-index: 1;
 +
}
 +
#cogoverlaytopleft{
 +
position: relative;
 +
left: -350px;
 +
top: -150px;
 +
}
 +
#cogoverlaytopright{
 +
position: relative;
 +
left: 355px;
 +
top: -150px;
 +
}
 +
#cogoverlaybottomleft{
 +
position: relative;
 +
top: -25px;
 +
left: 185px;
 +
}
 +
#cogoverlaybottomright{
 +
position: relative;
 +
top: -25px;
 +
left: -135px;
 +
}
 +
p.small {
 +
margin-left:0px;
 +
font-size:13pt;
 +
font-weight: normal;
 +
line-height:13pt;
 +
margin-right:0px;
 +
color:white;
 +
}
 +
p.marginChecklist{
 +
font-size:12pt;
 +
line-height:16pt;
 +
color:white;
 +
margin-top:0px;
 +
margin-bottom:38px;
 +
margin-right:0px;
 +
margin-left:150px;
 +
margin-right:115px;
 +
}
 +
.hoverbox{
 +
cursor: default;
 +
list-style: none;
 +
margin-left: 70px;
 +
margin-right: 15px;
 +
}
 +
.hoverbox a {
 +
cursor: default;
 +
}
 +
.hoverbox a .preview{
 +
display: none;
 +
}
 +
.hoverbox a:hover .preview{
 +
display: block;
 +
position: absolute;
 +
top: -100px;
 +
left: -100px;
 +
z-index: 1;
 +
}
 +
.hoverbox img{
 +
background-color: rgba(0,0,0,0);
 +
color: inherit;
 +
padding: 2px;
 +
vertical-align: top;
 +
}
 +
.hoverbox li{
 +
background-color: rgba(0,0,0,0);
 +
border-width: 0px;
 +
color: inherit;
 +
display: inline;
 +
margin: 3px;
 +
position: relative;
 +
}
 +
.hoverbox .preview{
 +
background-color: #52140C;
 +
border-color: #761C11;
}
}
-
#DAEshow IMG.last-active {
 
-
z-index:9;
 
-
}
 
</style>
</style>
</head>
</head>
 +
<body>
<body>
<br>
<br>
<div class="cte">
<div class="cte">
<div class="ctd">
<div class="ctd">
-
<z1 >The sticker</z1>
+
<z1>Abstract</z1>
</div>
</div>
</div>
</div>
-
<br>
 
-
<p>
 
-
Not everyone likes free living, engineered bacteria next to their food. But in order to make our Food Warden
 
-
system work properly, our bacteria should be able to react to the volatiles coming off the spoiling meat while it
 
-
is located in, for instance, a meat package. We had a lot of discussions about how to achieve a very safe and
 
-
easy-in-use solution, and this is what we came up with:
 
-
<br>
 
-
<br> 
 
-
<i>Bacillus subtilis</i> would be an ideal candidate as a chassis for our genetically engineered construct because it
 
-
has the ability to form endospores, a kind of dormant state that they use for survival. They can survive high levels
 
-
of heat (>100 °C), drying, radiation, and many damaging chemicals and simply be brought back 'to life' under the influence
 
-
of sufficient nutrients and water. This restorative process is germination. For the information,
 
-
take a look <a class="inlink" href="http://www.microbiologytext.com/index.php?module=Book&func=displayarticle&art_id=69">here</a> and
 
-
<a class="inlink" href="http://www.pearsonhighered.com/pearsonhigheredus/educator/product/products_detail.page?isbn=0132324601">here</a>.
 
-
Because of this ability to go dormant, our bacterium can be stored and activated when it is needed!
 
-
<br>
 
-
<br>
 
-
However, this does not solve the problem of the bacteria/spores next to the food. That's why we designed 'the sticker', a
 
-
containment device to store and activate the spores at the right time. For clarity: our team keeps calling it 'the sticker' all the time.
 
-
The sticker consists of two nested compartments. The inner compartment contains a calibrated amount of nutrients,
 
-
while the outer semi-permeable capsule contains the spores of our engineered strain. Breaking the barrier between the two compartments
 
-
allows germination and growth of <i>Bacillus subtilis</i> cells.
 
-
<br><br>
 
-
Now the properties of the material we use for our sticker come into play. The polymer we used is TPX®, also
 
-
called polymethylpentene. This polymer is available as thin, transparent sheets. The advantage is that it is
 
-
relatively cheap, strong, and capable of letting through volatiles. The radius of the pores in TPX® is between
 
-
1 nm and 10 nm, which is at least 50x larger than the average badmeat-volatile, but still small enough to keep liquid
 
-
and bacteria or spores in (see the figure below). More detailed information about the sticker design and its experiments, are stated below.
 
-
<br>
 
-
<br>
 
-
</p>
 
-
<z4>References</z4>
 
-
<p class="ref">
 
-
1. Siebring J. 2012 (unpublished)
 
-
</p>
 
-
<br>
 
-
<br>
 
<table class="centertable">
<table class="centertable">
<tr>
<tr>
-
<td align="center">
+
<td class="margincell" align="right">
-
<img src="https://static.igem.org/mediawiki/2012/d/d4/RR_20120825_tpx.PNG" width="300">
+
<div class="bigcog" id="bigcogtopleft">
 +
<img src="https://static.igem.org/mediawiki/2012/b/b6/Groningen2012_AD_20120802_BigCog.png" width="150px" height="150px">
 +
</div>
 +
</td>
 +
<td colspan="4">
 +
<p class="nomargin">
 +
Every year, one third of global food production -1.3 billion tons of food- is thrown away, partially due to the “best before” dating system.
 +
<z7>iGEM Groningen 2012</z7> seeks to provide an alternative method of assessing edibility: the <z7>Food Warden</z7>. It uses an <z7>engineered strain</z7>
 +
of <i>Bacillus subtilis</i> to detect and report volatiles in spoiling meat. The introduced <z7>genetic construct</z7> uses a promoter to trigger
 +
a pigment coding gene. This promoter, <z7>identified by microarray analysis</z7>, is significantly upregulated in the presence of
 +
<z7>volatiles from spoiling meat</z7>. The activity of the <z7>promoter</z7> regulates the expression of the <z7>pigment reporter</z7> and will
 +
be visible to the naked eye. For safe usage of the system, spores of our engineered strain are placed into one half of a semi-permeable
 +
<z7>capsule</z7>, the second containing a calibrated amount of nutrients. Breaking the barrier between the two compartments allows
 +
<z7>germination and growth</z7>, thereby activating the <z7>spoiling-meat sensor</z7>.
 +
</p>
 +
</td>
 +
<td class="margincell" align="left">
 +
<div class="bigcog" id="bigcogtopright">
 +
<img src="https://static.igem.org/mediawiki/2012/b/b6/Groningen2012_AD_20120802_BigCog.png" width="150px" height="150px">
 +
</div>
</td>
</td>
</tr>
</tr>
<tr>
<tr>
-
<td align="center">
+
<td class="margincell">
-
<p class="captionnomargin">
+
<div class="cogoverlay" id="cogoverlaybottomleft">
-
Comparison of the size of the TPX® pores, volatiles and <i>Bacillus subtilis</i>.
+
<img src="https://static.igem.org/mediawiki/2012/c/c2/Groningen2012_RR_20120909_rotting.png" width="100" height="100">
-
</p>
+
</div>
 +
</td>
 +
<td align="left" >
 +
<div class="bigcog" id="bigcogbottomleft">
 +
<img src="https://static.igem.org/mediawiki/2012/b/b6/Groningen2012_AD_20120802_BigCog.png" width="150px" height="150px">
 +
</div>
 +
</td>
 +
<td align="left" >
 +
<div class="cogoverlay" id="cogoverlaytopleft">
 +
<img src="https://static.igem.org/mediawiki/2012/1/15/Groningen2012_RR20120909_construct.png"  width="100px" height="100px">
 +
</div>
 +
</td>
 +
<td align="right" >
 +
<div class="cogoverlay" id="cogoverlaytopright">
 +
<img src="https://static.igem.org/mediawiki/2012/2/29/Groningen2012_RR20120909_badmeat.png" width="100px" height="100px">
 +
</div>
 +
</td>
 +
<td align="right">
 +
<div class="bigcog" id="bigcogbottomright">
 +
<img src="https://static.igem.org/mediawiki/2012/b/b6/Groningen2012_AD_20120802_BigCog.png" width="150px" height="150px">
 +
</div>
 +
</td>
 +
<td class="margincell">
 +
<div class="cogoverlay" id="cogoverlaybottomright">
 +
<img src="https://static.igem.org/mediawiki/2012/e/e7/Groningen2012_RR20120909_capsule.png" width="100px" height="100px">
 +
</div>
</td>
</td>
</tr>
</tr>
Line 175: Line 864:
<br>
<br>
<br>
<br>
-
<p>
+
<div class="cte3">
-
<z2>Design requirements</z2>
+
<div class="ctd3">
-
<br>
+
<z2 >Completed after European Regionals</z2><br><br>
-
<br>
+
</div>
-
<z3>Material</z3>
+
</div>
-
<br>
+
<p class="marginChecklist">
-
<br>
+
-
The material should not break easily and should resist a human grip strength with a minimum of 40 pounds pinch and pressure. <br>
+
-
The product should be made of a material that is light and easy to handle. <br>
+
-
The material should be durable and inexpensive.<br>
+
-
The volatiles and oxygen should penetrate through the material, while the spores, bacteria and liquid should stay inside.<br>
+
-
The material should fit in a meat package.<br>
+
-
The material should not be toxic or become toxic for the bacteria <br>
+
-
The material should be able to cope with a temperature of at least 125 degrees Celsius.
+
-
<br>
+
-
<br>
+
-
<z3>Measurements</z3>
+
<br>
<br>
<br>
<br>
-
We want a visible feedback system for the human eye that should easy to understand for the consumer. <br>
+
<a href="https://2012.igem.org/Team:Groningen/in_development" target="_blank"><img src="https://static.igem.org/mediawiki/2012/d/df/IGEMGroningen2012_AD20120915_Tick.png"> Tested a construct with downregulated promoter <i>WapA</i></a><br>
-
The visible feedback should not degrade over time.
+
<a href="https://2012.igem.org/Team:Groningen/Construct" target="_blank"><img src="https://static.igem.org/mediawiki/2012/d/df/IGEMGroningen2012_AD20120915_Tick.png"> Performed enhanced construct characterization</a><br>
-
<br>
+
<a href="https://2012.igem.org/Team:Groningen/Sticker" target="_blank"><img src="https://static.igem.org/mediawiki/2012/d/df/IGEMGroningen2012_AD20120915_Tick.png"> Characterized the influence of oxygen on germination and growth within the sticker</a><br>
-
<br>
+
<a href="https://2012.igem.org/Team:Groningen/market_research" target="_blank"><img src="https://static.igem.org/mediawiki/2012/d/df/IGEMGroningen2012_AD20120915_Tick.png"> Expanded the scope of the market survey</a><br>
-
<z3>Appearance</z3>
+
<a href="https://2012.igem.org/Team:Groningen/international_cooperation" target="_blank"><img src="https://static.igem.org/mediawiki/2012/d/df/IGEMGroningen2012_AD20120915_Tick.png"> Collaborated with Cambridge 2012</a><br>
-
<br>
+
-
<br>
+
-
Product should be have attractive color(s) and recognizable shape.
+
-
<br>  
+
-
<br>
+
-
<z3>Safety</z3>
+
-
<br>
+
-
<br>
+
-
The bacteria should not escape from the sticker nor harm the environment or the costumer.  
+
-
Therefore the product should provide adequate support and be reliable.
+
-
<br>
+
-
<br>
+
-
<z3>Customer comfort</z3>
+
-
<br>
+
-
<br>
+
-
Easy to use the visible feedback device.  
+
-
<br>
+
-
The product may provide different degrees of strength depending on the development of the consumer strength.  
+
-
<br>
+
-
<br>
+
-
<z2>Development design</z2>
+
-
<br>
+
-
<br>
+
-
For the development of the sticker, the PDCA (Plan Do Check Act) strategy was used to develop an ultimate
+
-
device that keeps track of the needs of the customer and the environment in the project design.
+
-
<br>
+
-
<br>  
+
-
The following questions where raised:  
+
-
<br>
+
-
<br>
+
-
Who is your external customer?
+
-
<br>
+
-
The customer who is against food spoilage and customers that are willing to buy it.
+
-
<br>
+
-
<br>
+
-
What value do you want to deliver to that customer?
+
-
<br>
+
-
A replacement for the "use by date and sell by date" system. We want to develop a new product that
+
-
indicates when meat starts to spoil before the costumer can notice this by eye, by smell or by taste.
+
-
<br>  
+
-
<br>
+
-
Who, in you iGEM group, delivers that value?
+
-
<br>
+
-
The design engineers and the biologists of iGEM Groningen 2012.
+
-
<br>
+
-
<br>
+
-
How do they deliver that value?<br>
+
-
By doing research and creating a new indicator to predict when meat starts to spoil.
+
-
<br>
+
-
<br>
+
-
<z3>Plan</z3>
+
-
<br>
+
-
<br>
+
-
Our first plan is to identify exactly what we have to do to make a sticker.  
+
-
The sticker should be the same as the use of a glow-in-the-dark stick, that you first have to
+
-
break before it gives off a bright chemical light. Everyone should understand how
+
-
it works. The indication color might be made with the same colors as a traffic light, to
+
-
indicate when the meat is fresh, a bit spoiled or really spoiled. During our second case,
+
-
we want to produce an easily activated sticker. In the third part of the plan, the outer sticker should be strong enough,
+
-
let volatiles go through the outer layer of the sticker, and not any bacteria or liquid should go
+
-
out of the outer layer of the sticker.
+
-
<br>
+
<br>
<br>
</p>
</p>
-
<meta content="text/html; charset=iso-8859-1" http-equiv="Content-Type"/>
 
-
<script type="text/javascript">
 
-
function slideSwitch() {
 
-
var $active = $('#DAEshow IMG.active');
 
-
if ( $active.length == 0 ) $active = $('#DAEshow IMG:last');
+
<a name="MainAcc"></a>
-
var $next =  $active.next().length ? $active.next()
+
<div class="cte2">
-
: $('#DAEshow IMG:first');
+
<div class="ctd2">
-
 
+
<a name="MainAcc"></a><z2 >Our main accomplishments</z2><br><br>
-
 
+
</div>
-
$active.addClass('last-active');
+
-
 
+
-
$next.css({opacity: 0.0})
+
-
.addClass('active')
+
-
.animate({opacity: 1.0}, 1000, function() {
+
-
$active.removeClass('active last-active');
+
-
});
+
-
}
+
-
 
+
-
$(function() {
+
-
setInterval( "slideSwitch()", 2500 );
+
-
});
+
-
</script>
+
-
<div id="DAEshow">
+
-
<img src="https://static.igem.org/mediawiki/2012/d/d8/Groningen2012_ID_20120921_Sticker_proto_draw_type8.png" alt="DAEshow Image 1" class="active" />
+
-
<img src="https://static.igem.org/mediawiki/2012/a/a2/Groningen2012_ID_20120924_Sticker_diffrent_volumes.jpg" alt="DAEshow Image 2" />
+
-
<img src="https://static.igem.org/mediawiki/2012/b/b6/Groningen2012_ID_20120925_pogingR.png" alt="DAEshow Image 3" />
+
</div>
</div>
<br>
<br>
<br>
<br>
-
<br>
+
<p align=center style="color: white; font-size: 10pt;">
-
<p>
+
<i>Hover your mouse over the pictures to see more!</i>
-
<z3>Do</z3>
+
-
<br>
+
-
<br>
+
-
The following solution was chosen:
+
-
Build a transparent plastic bag with inside a smaller compartment, where the medium inside is visible for the user when the color changes.
+
-
Make the inner compartment of a weaker material where the sides break when a pinch force is applied.
+
-
<br>
+
-
<br>
+
-
The following pilots where made:<br>
+
-
<br>
+
-
1. Make sticker user-friendly concerning the breakage of the inner compartment.<br>
+
-
2. Test if the bacteria grow in the sticker.<Br>
+
-
3. Test if the medium with the Food Warden bacteria will product a pigment in the sticker. 
+
-
<br>
+
-
<br>
+
-
<z3>Check</z3>
+
-
<br>
+
-
<br>
+
-
Depending on the success of the pilots, the number of areas for improvement you have identified, and the scope of the whole initiative,
+
-
we made decide to repeat the "Do" and "Check" phases, incorporating our additional improvements.
+
-
<br>
+
-
<br>
+
-
Once you are finally satisfied that the costs would outweigh the benefits of repeating the Do-Check sub-cycle any more,
+
-
you can move on to the final phase.
+
-
<br>
+
-
<br>
+
-
<z3>Act</z3>
+
-
<br>
+
-
<br>
+
-
After implement our solution we generated part of a continuous improvement initiative, we made a loop back to the Plan Phase,
+
-
and seek out further areas for improvement.
+
-
<br>
+
-
<br>
+
-
<z2>Material</z2>
+
-
<br>
+
-
<br>
+
-
Two different materials were carefully chosen for our final product. At first, the outer
+
-
compartment should be resistant enough to support the bacteria inside the sticker and give
+
-
resistance to the pressure that is applied by the customer. Its physical properties and characteristics
+
-
should not be affected when too much pressure or deformation is applied on the sticker. It should be
+
-
light and small, to ensure the capsule is easily placed in meat package, for instance.
+
-
Second, the case should be made from a light material and the surface should be flat to provide grip
+
-
and avoid sharp edges or any other risks for the user.
+
-
<br>
+
-
<br>
+
-
Taking into account all these characteristics, we considered three materials for the sticker:
+
-
polyetheen (sandwich bag), Polyvinyl chloride (cling film) and Polymethylpentene (PMP) als commonly
+
-
known as TPX®. We chose TPX® as the most suitable material for the outer layer of the sticker, because
+
-
this material fulfills all the requirements mentioned above.
+
-
<br> 
+
-
<br>
+
-
In addition, we searched for another material needed for the inner compartment of the sticker,
+
-
that separates the growth medium from the spores untill the consumer wants to use it. At first,
+
-
polyvinyl chloride turned out to be too weak for the outer layer of the sticker, because it is easily broken.
+
-
However, these properties are very suitable for the needed breakable inner compartment of the sticker.
+
-
Very little pressure is needed to break the inner compartment, so it will be easy to start
+
-
the Food Warden system when the consumer needs it.
+
-
<br>
+
-
<br>
+
-
</p>
+
-
<z4>References</z4>
+
-
<p class="ref">
+
-
1. Krentsel B.A., Kissin Y.V., Kleiner V.I., Stotskaya S.S. Polymers and Copolymers of Higher a-Olefins, Hanser Publishers: New York, 1997.<br>
+
-
2. H. C. Raine, J. Appl. Polym. Sci. 11, 39 (1969)<br>
+
-
3. Mitsui Chemicals Co., Properties of Standard TPX Grades, 2004.<br>
+
-
4. FDA CFR Title 21 Sec. 177.1520 Olefin polymers (C) 3.3b for TPX(4-methylpentene-1-based olefin copolymer).<br>
+
-
5. Mathiowetz V, Kashman N, Volland G, Weber K, Dowe M, Rogers S (February 1985). "Grip and pinch strength: normative data for adults". Arch Phys Med Rehabil 66 (2): 69–74. PMID 3970660.<br>
+
-
</p>
+
-
<p>
+
-
<br>
+
-
<br>
+
-
<z2>Tools and supplies</z2>
+
-
<ol class="ref">
+
-
<li>Sealboy type: 236 SBSA-2, Serie: 0070133017 to affix the TPX material and cling film in the setting 7.</li>
+
-
<li>Sanyo labo autoclave MLS-3020U (RUG Serial: 4495) to sterilize the TPX material.</li>
+
-
<li>Gas profile 1 SCS, Part: 6.103.000, series: 0213372 to work sterile during fill-up the sticker.</li>
+
-
<li>B-D Plastipak 21G 1<sup>1/2</sup> 40/8 NR2 2ml to fill up the sticker.</li> 
+
-
<li>Cling film brand: Folia vershoudfolie, 50m width 29cm, 15 micrometer, oxygen permeability, fat- and waterproof. Inner compartment for the the sticker.</li> 
+
-
<li>TPX X-44B#25 and X-44#50, Company: Mitsui Chemicals Co., Brand: TPX to use as outer layer from the sticker.</li>
+
-
<li>Luria Broth Brand: Lennox.</li>
+
-
</ol>
+
-
<br>
+
-
</p>
+
-
<p>
+
-
<z2>Prototype</z2>
+
-
<br>
+
-
<br>
+
-
The prototype of the inner compartment is made from cling film with a side affix of 1 mm thickness.
+
-
The subsequent created inner compartment was filled with sterilized Luria Broth (LB). In the outer layer of the sticker,
+
-
made of TPX®, was filled with the cling film package and the bacterial spores. An important feature that we had to take into
+
-
account was the oxygen exchange between the TPX® and the LB growth medium. If this does not occur extensively,
+
-
the bacteria will not grow at their optimal rate. Therefore, we performed several experiments to calculate the minimum
+
-
oxygen exchange. We used closed flasks containing 50ml medium and 84ml air to test the bacterial growth at 37 degrees Celsius.
+
-
The 50 ml medium in the flasks had a diameter with an average of 6 cm where 84ml of air average of 21% oxygen at a starting point
+
-
is applied on the medium in the flask.  That makes 17.64ml of total oxygen that is needed for the growth of 50ml medium.
+
-
From the TPX® characteristics and mathematical calculations we made the following graph.
+
-
<br>
+
-
<br>
+
-
<table class="centertable">
+
-
<tr>
+
-
<td align="center">
+
-
<img src="https://static.igem.org/mediawiki/2012/4/4c/Groningen2012_ID_20120924_Foodwarden_sticker_surface_graph.png" width="600">
+
-
</td>
+
-
</tr>
+
-
<tr>
+
-
<td>
+
-
<p>
+
-
This graph represent the minimum surface cm<sup>2</sup> is needed per ml. The green line is TPX® 50 um thickness and the red line is
+
-
25um thickness. The x-axis is the volume of ml Luria Broth containing the Food Warden bacterium.
+
-
The y-axis is the required surface area (cubic cm) per mL at 37 degrees Celsius.
+
-
</p>
+
-
</td>
+
-
</tr>
+
-
</table>
+
</p>
</p>
-
<p>
+
<br>
-
<br>
+
<table class="accompli">
-
<z2>Test</z2>
+
 
-
<br>
+
-
<br>
+
-
Make sticker user-friendly concerning the breakage of the inner compartment.
+
-
<br>
+
-
<br>
+
-
</p>
+
-
<table class="centertable">
+
<tr>
<tr>
-
<td align="center">
+
<td class="accPic">
-
<img src="https://static.igem.org/mediawiki/2012/d/de/Groningen2012_ID_20120924_Sticker_diffrent_volumes_COrr.png" width="500">
+
<ul class="hoverbox">
 +
<li>
 +
<a href="#">
 +
<img src="https://static.igem.org/mediawiki/2012/c/cb/Groningen2012_RR1capsule_break.png" width=200 />
 +
<img src="https://static.igem.org/mediawiki/2012/a/ac/Groningen2012_ADStickerBig.png" class="preview" width=400 />
 +
</a>
 +
</li>
 +
</ul>
 +
</td>
 +
<td class="accPic">
 +
<ul class="hoverbox">
 +
<li>
 +
<a href="#"><img src="https://static.igem.org/mediawiki/2012/c/c2/Groningen2012_RR_20120909_rotting.png" width=150 /><img src="https://static.igem.org/mediawiki/2012/7/74/Groningen2012_ADVolatilesBig.png" class="preview" width=400 /></a>
 +
</li>
 +
</ul>
</td>
</td>
</tr>
</tr>
<tr>
<tr>
-
<td align="center">
+
<td class="accCap">
-
<p class="captionnomargin">
+
<p class="small">
-
We want to check if each different volume is equally easy to break.
+
<font color=#FF6700><br><b>1.</b></font> We designed and tested the "<a class="inlink" href="https://2012.igem.org/Team:Groningen/Sticker">Sticker</a>": a capsule in which bacteria are kept inside and volatiles can go through. We used a model to get insight on how to tweak the growth of <i>Bacillus subtilis</i>.
</p>
</p>
-
<td>
 
-
</tr>
 
-
</table>
 
-
<p>
 
-
<br>
 
-
Test if the bacteria grow in the sticker.
 
-
<br>
 
-
<br>
 
-
</p>
 
-
<table class="centertable">
 
-
<tr>
 
-
<td align="center">
 
-
<img src="https://static.igem.org/mediawiki/2012/6/6c/Groningen2012_ID_20120924_Sticker_diffrent_volumes_before_growCorr.png" width="500">
 
</td>
</td>
-
</tr>
+
<td class="accCap">
-
<tr>
+
<p class="small">
-
<td align="center">
+
<font color=#FF6700><b>2.</b></font> We explored the definition of spoiled meat and ways to check meat spoilage. We identified <a class="inlink" href="https://2012.igem.org/Team:Groningen/volatiles">various compounds</a> present in spoiled meat.<br>
-
<p class="captionnomargin">
+
-
All different volumes just after breakage, the LB broth has no traces of bacterial growth.
+
</p>
</p>
</td>
</td>
</tr>
</tr>
-
</table>
 
-
<p>
 
-
<br>
 
-
Test if the medium with the Food warden bacteria will product a pigment in the sticker.
 
-
<br>
 
-
<br>
 
-
</p>
 
-
<table class="centertable">
 
<tr>
<tr>
-
<td align="center">
+
<td class="accPic">
-
<img src="https://static.igem.org/mediawiki/2012/4/45/Groningen2012_ID_20120927_Sticker_before_worked.png" width="500">
+
<ul class="hoverbox">
 +
<li>
 +
<a href="#">
 +
<img src="https://static.igem.org/mediawiki/2012/2/29/Groningen2012_RR20120909_badmeat.png" width=200 />
 +
<img src="https://static.igem.org/mediawiki/2012/e/ec/Groningen2012_ADSensorBig.png" class="preview" width=400 />
 +
</a>
 +
</li>
 +
</ul>
</td>
</td>
-
</tr>
+
<td class="accPic">
-
<tr>
+
<ul class="hoverbox">
-
<td align="center">
+
<li>
-
<p class="captionnomargin">
+
<a href="#">
-
No growth in the sticker when it was placed first in a bottle with rotten meat (probably due to oxygen depletion),
+
<img src="https://static.igem.org/mediawiki/2012/2/24/Groningen2012_RRADPsac_transp.png" width=150 />
-
therefore we placed the sticker in a bottle with fresh meat
+
<img src="https://static.igem.org/mediawiki/2012/c/c1/Groningen2012_AdBackboneBig.png" class="preview" width=400 />
-
</p>
+
</a>
 +
</li>
 +
</ul>
</td>
</td>
</tr>
</tr>
-
</table>
 
-
<p>
 
-
<br>
 
-
Extra test Test if the medium with the Food warden bacteria will product a pigment in the sticker.
 
-
<br>
 
-
<br>
 
-
</p>
 
-
<table class="centertable">
 
<tr>
<tr>
-
<td align="center">
+
<td class="accCap">
-
<img src="https://static.igem.org/mediawiki/2012/c/c1/Groningen2012_ID_20120925_sticker_test.png" width="500">
+
<p class="small">
-
</td>
+
<font color=#FF6700><b>3.</b></font> We identified spoiled meat <a class="inlink" href="https://2012.igem.org/Team:Groningen/Sensor">sensors</a> by transcriptome analysis.<br><br><br>
-
</tr>
+
-
<tr>
+
-
<tr>
+
-
<td align="center">
+
-
<p class="captionnomargin">
+
-
Bottle of rotten meat connected to the microarray set up to ensure the oxygen is pumped around
+
</p>
</p>
</td>
</td>
-
</tr>
+
<td class="accCap">
-
</table>
+
<p class="small">
-
<p>
+
<font color=#FF6700><b>4.</b></font> <a class="inlink" href="http://partsregistry.org/wiki/index.php?title=Part:BBa_K818000" target="_blank">Backbone pSac-Cm</a>: easy cloning in<br><i>B. subtilis</i>, the BioBrick way, for the first time! It's easy to check, BioBrick compatible, <i>E. coli</i> compatible, stabily inserted into the <i>B. subtilis</i> chromosome.
-
<br>
+
-
<z2>Results</z2>
+
-
<br>
+
-
<br>
+
-
Make sticker user-friendly concerning the breakage of the inner compartment.
+
-
<br>
+
-
<br>
+
-
</p>
+
-
<table class="centertable">
+
-
<tr>
+
-
<td align="center">
+
-
<iframe left="150" width="500" height="400" src="http://www.youtube.com/embed/rlaCpIiV-24"></iframe>
+
-
<br>
+
-
</td>
+
-
</tr>
+
-
<tr>
+
-
<td align="center">
+
-
<p class="captionnomargin">
+
-
In the movie we see how easy the sticker is to break.  
+
</p>
</p>
</td>
</td>
</tr>
</tr>
-
</table>
 
-
<p>
 
-
<br>
 
-
Test if the bacteria grow in the sticker.
 
-
<br>
 
-
<br>
 
-
</p>
 
-
<table class="centertable">
 
<tr>
<tr>
-
<td align="center">
+
<td class="accPic">
-
<img src="https://static.igem.org/mediawiki/2012/8/83/Groningen2012_ID_20120924_Sticker_diffrent_volumes_grow_Corr.png" width="500">
+
<ul class="hoverbox">
 +
<li>
 +
<a href="#">
 +
<img src="https://static.igem.org/mediawiki/2012/f/f1/Groningen2012_RRADPigments_transp.png" width=150 />
 +
<img src="https://static.igem.org/mediawiki/2012/3/35/Groningen2012_ADPigmentsBig.png" class="preview" width=400 />
 +
</a>
 +
</li>
 +
</ul>
</td>
</td>
-
</tr>
+
<td class="accPic">
-
<tr>
+
<ul class="hoverbox" style="margin-left: 30px">
-
<td>
+
<li>
-
<p>
+
<a href="#">
-
We tested different kind of volumes to verify the calculations in the surface area plot.
+
<img src="https://static.igem.org/mediawiki/2012/9/93/Groningen2012_ADConstruct_yellow.png" width=220 />
-
</p>
+
<img src="https://static.igem.org/mediawiki/2012/2/21/Groningen2012_ADConstructBig.png" class="preview" width=400 />
-
</td>
+
</a>
-
</tr>
+
</li>
-
</table>
+
</ul>
-
<p>
+
-
<br>
+
-
Test if the medium with the Food Warden bacteria will product a pigment in the sticker.
+
-
<br>
+
-
<br>
+
-
</p>
+
-
<table class="centertable">
+
-
<tr>
+
-
<td align="center">
+
-
<img src="https://static.igem.org/mediawiki/2012/4/49/Groningen2012_ID_20120927_Sticker_worked.png" width="500">
+
</td>
</td>
</tr>
</tr>
<tr>
<tr>
-
<td>
+
<td class="accCap">
-
<p>
+
<p class="small">
-
First picture of the <i>Bacillus</i> producing the purple AmilCP pigment IN the sticker and not in a bottle of the microarray set up.
+
<font color=#FF6700><br><br><b>5.</b></font> We made <a class="inlink" href="https://2012.igem.org/Team:Groningen/pigmentproduction">AmilCP and AmilGFP</a> suitable for expression in <i>Bacillus subtilis</i>.
-
</p>
+
<br>
 +
These chromoproteins can be of significant value to the other <i>Bacillus subtilis</i> users in the BioBrick community.
 +
<br><br><br>
 +
</p>
</td>
</td>
-
</tr>
+
<td class="accCap">
-
</table>
+
<p class="small">
-
<p>
+
<font color=#FF6700><b>6.</b></font> Most importantly: we developed a <a class="inlink" href="https://2012.igem.org/Team:Groningen/Construct">construct</a> which makes <i>Bacillus subtilis</i> sense spoiled meat and produce an output in the form of a yellow or purple pigment visible by naked eye.
-
<br>
+
<br><br><br>
-
Extra test Test if the medium with the Food warden bacteria will product a pigment in the sticker.
+
</p>
-
<br>
+
-
<br>
+
-
</p>
+
-
<table class="centertable">
+
-
<tr>
+
-
<td align="center">
+
-
<img src="https://static.igem.org/mediawiki/2012/1/1c/Groningen2012_ID_20120927_Sticker_test.png" width="500">
+
-
</td>
+
-
</tr>
+
-
<tr>
+
-
<td>
+
-
<p>
+
-
Are these bacteria going to produce pigment before or after the wikifreeze. That´s the question!
+
-
</p>
+
</td>
</td>
</tr>
</tr>
</table>
</table>
-
<br>
 
<br>
<br>
<br>
<br>
Line 587: Line 1,005:
{{Template:SponsorsGroningen2012}}
{{Template:SponsorsGroningen2012}}
-
 
-
<html>
 
-
<a href="https://2012.igem.org/Team:Groningen/volatiles">
 
-
<div style="position:absolute; right: 0px; bottom: 760px;">
 
-
<img src="https://static.igem.org/mediawiki/2012/2/22/Groningen2012_RR_20120910_nextstage.png" width="150">
 
-
</div>
 
-
</a>
 
-
<div style="position:absolute; right: 10px; bottom: 700px;">
 
-
<img src="https://static.igem.org/mediawiki/2012/8/87/Groningen2012_RR_20120910_orangearrow.png">
 
-
</div>
 
-
</html>
 

Latest revision as of 03:29, 27 October 2012





Abstract

Every year, one third of global food production -1.3 billion tons of food- is thrown away, partially due to the “best before” dating system. iGEM Groningen 2012 seeks to provide an alternative method of assessing edibility: the Food Warden. It uses an engineered strain of Bacillus subtilis to detect and report volatiles in spoiling meat. The introduced genetic construct uses a promoter to trigger a pigment coding gene. This promoter, identified by microarray analysis, is significantly upregulated in the presence of volatiles from spoiling meat. The activity of the promoter regulates the expression of the pigment reporter and will be visible to the naked eye. For safe usage of the system, spores of our engineered strain are placed into one half of a semi-permeable capsule, the second containing a calibrated amount of nutrients. Breaking the barrier between the two compartments allows germination and growth, thereby activating the spoiling-meat sensor.



Completed after European Regionals



Tested a construct with downregulated promoter WapA
Performed enhanced construct characterization
Characterized the influence of oxygen on germination and growth within the sticker
Expanded the scope of the market survey
Collaborated with Cambridge 2012

Our main accomplishments



Hover your mouse over the pictures to see more!



1. We designed and tested the "Sticker": a capsule in which bacteria are kept inside and volatiles can go through. We used a model to get insight on how to tweak the growth of Bacillus subtilis.

2. We explored the definition of spoiled meat and ways to check meat spoilage. We identified various compounds present in spoiled meat.

3. We identified spoiled meat sensors by transcriptome analysis.

4. Backbone pSac-Cm: easy cloning in
B. subtilis, the BioBrick way, for the first time! It's easy to check, BioBrick compatible, E. coli compatible, stabily inserted into the B. subtilis chromosome.



5. We made AmilCP and AmilGFP suitable for expression in Bacillus subtilis.
These chromoproteins can be of significant value to the other Bacillus subtilis users in the BioBrick community.


6. Most importantly: we developed a construct which makes Bacillus subtilis sense spoiled meat and produce an output in the form of a yellow or purple pigment visible by naked eye.





Our sponsors:

Retrieved from "http://2012.igem.org/Team:Groningen/DesignTest"