Difference between revisions of "Team:Uppsala"

 
(60 intermediate revisions by 4 users not shown)
Line 7: Line 7:
 
   margin: 0 auto;
 
   margin: 0 auto;
 
   display: block;
 
   display: block;
−
   margin-top: -42px;
+
   margin-top: -16px;
 
}
 
}
  
Line 24: Line 24:
 
         box-shadow: 10px 10px 20px #888888;
 
         box-shadow: 10px 10px 20px #888888;
 
         /*margin-right: 15px;*/
 
         /*margin-right: 15px;*/
 +
        background-color: #E84243;
 
         margin-right: 20px;
 
         margin-right: 20px;
 
         margin-top:15px;
 
         margin-top:15px;
Line 32: Line 33:
 
}
 
}
  
−
.buttons img:hover, #nic img {
+
/*Button effects*/
 +
 
 +
.buttons img:hover, #nic img, #med img {
 
         opacity: 1;
 
         opacity: 1;
 
}
 
}
  
−
.buttons img:hover, #nic img:hover {
+
.buttons img:hover, #nic img:hover, #med img:hover {
 
         opacity: 0.2;
 
         opacity: 0.2;
 
}
 
}
Line 50: Line 53:
 
         text-align: center;
 
         text-align: center;
 
         width: 350px;
 
         width: 350px;
 +
        font-family: "Fira Sans";
 +
        font-size: 200%;
 +
        color:  #F8F8FF;
 +
        -webkit-transition: all 300ms ease-out;
 +
-moz-transition: all 300ms ease-out;
 +
transition: all 300ms ease-out
 
          
 
          
 
}
 
}
  
−
.buttons:hover .description {
+
.buttons .description {
 +
padding: 3px;
 +
font-size: 170%;
 +
}
 +
#nic .description, #med .description {
 +
        width:75%;
 +
        margin: auto;
 +
}
 +
 
 +
.buttons:hover .description, #nic:hover .description, #med:hover .description {
 
         visibility: visible;
 
         visibility: visible;
 
         opacity: 1;
 
         opacity: 1;
 +
        -moz-transform: translateY(140px);
 +
-webkit-transform: translateY(140px);
 +
transform: translateY(140px);
 +
}
 +
 +
#med:hover .description {
 +
        visibility: visible;
 +
        opacity: 1;
 +
        -moz-transform: translateY(40px);
 +
-webkit-transform: translateY(40px);
 +
transform: translateY(40px);
 +
}
 +
 +
/*Affects all effects on the buttons (opacity, resize). Makes a smooth 300ms transition.*/
 +
.button_grid img {
 +
        -webkit-transition: all 300ms;
 +
-moz-transition: all 300ms;
 +
transition: all 300ms;
 +
}
 +
 +
/*Resize of the buttons on hover*/
 +
.button_grid td:hover img {
 +
        -webkit-transform: scale(1.2);
 +
-moz-transform: scale(1.2);
 +
transform: scale(1.2);
 
}
 
}
  
Line 61: Line 104:
 
#results_button {
 
#results_button {
 
  box-shadow: 3px 3px 10px #888888;
 
  box-shadow: 3px 3px 10px #888888;
 +
margin-left: 10px;
 
}
 
}
  
Line 67: Line 111:
 
  border-radius: 20px;*/
 
  border-radius: 20px;*/
 
  box-shadow:  10px 10px 20px #888888;
 
  box-shadow:  10px 10px 20px #888888;
−
  background-color: #d3dfe4;
+
  /*background-color: #d3dfe4;*/
 +
background-color: #E84243;
 
  margin-top: 17px;
 
  margin-top: 17px;
 
  width: 1100px;
 
  width: 1100px;
Line 84: Line 129:
 
}
 
}
  
 +
#medal {
 +
/*padding: 25px 0px;*/
 +
/*box-shadow: 10px 10px 20px #888888;*/
 +
/*margin-top: 14px;
 +
margin-bottom: 3px;*/
 +
}
  
−
/*Footer*/
+
#med {
−
.puff {
+
width: 1100px;
−
      margin-top: 50px;
+
height: 103px;
 +
box-shadow: 10px 10px 20px #888888;
 +
overflow: hidden;
 +
margin-top: 10px;
 +
background-color: #E84243;
 
}
 
}
  
  
−
.puff img {
+
*flipping images*/
−
width: 100%;
+
 
−
opacity: 0.4;
+
/* entire container, keeps perspective */
 +
.flip-container{
 +
/*perspective*/
 +
-webkit-perspective:1000;
 +
  -moz-perspective:1000;
 +
    -ms-perspective:1000;
 +
    -o-perspective:1000;
 +
        perspective:1000;
 +
}
 +
/* flip the pane when hovered */
 +
.flipped {
 +
/*transform*/
 +
-webkit-transform:rotateY(180deg);
 +
  -moz-transform:rotateY(180deg);
 +
    -ms-transform:rotateY(180deg);
 +
    -o-transform:rotateY(180deg);
 +
        transform:rotateY(180deg);
 
}
 
}
  
−
.puff img:hover{
+
.flip-container, .front, .back{
−
opacity: 1;
+
width: 100%;
 +
height: 461px;
 
}
 
}
  
−
/*End of footer*/
+
 
 +
/* flip speed goes here */
 +
.flipper {
 +
/*transition*/
 +
-webkit-transition:1s;
 +
  -moz-transition:1s;
 +
    -o-transition:1s;
 +
        transition:1s;
 +
/*transform-style*/
 +
-webkit-transform-style:preserve-3d;
 +
  -moz-transform-style:preserve-3d;
 +
    -ms-transform-style:preserve-3d;
 +
    -o-transform-style:preserve-3d;
 +
        transform-style:preserve-3d;
 +
position:relative;
 +
}
 +
 
 +
/* hide back of pane during swap */
 +
.front, .back{
 +
/*backface-visibility*/
 +
-webkit-backface-visibility:hidden;
 +
  -moz-backface-visibility:hidden;
 +
    -ms-backface-visibility:hidden;
 +
    -o-backface-visibility:hidden;
 +
        backface-visibility:hidden;
 +
position:absolute;
 +
top:0;
 +
left:0;
 +
}
 +
 
 +
 
 +
 
 +
/* front pane, placed above back */
 +
.front{
 +
z-index:2;
 +
}
 +
 
 +
 
 +
/* back, initially hidden pane */
 +
.back{
 +
/*transform*/
 +
-webkit-transform:rotateY(180deg);
 +
  -moz-transform:rotateY(180deg);
 +
    -ms-transform:rotateY(180deg);
 +
    -o-transform:rotateY(180deg);
 +
        transform:rotateY(180deg);
 +
}
  
 
</style>
 
</style>
 
</head>
 
</head>
 
<body>
 
<body>
 +
 +
    <!--<img id="home_image" src="https://static.igem.org/mediawiki/2015/4/4d/Uppsala_NewFront.png" alt="iGEM Uppsala" style="width:100%;height:100%;">-->
 +
 +
<div class="flip-container">
 +
<div class="flipper" onclick="this.classList.toggle('flipped')">
 +
<div class="front">
 +
<img id="home_image" src="https://static.igem.org/mediawiki/2015/4/4d/Uppsala_NewFront.png" alt="iGEM Uppsala" style="width:100%;">
 +
</div>
 +
<div class="back">
 +
<img id="home_image" src="https://static.igem.org/mediawiki/2015/7/72/Uppsala_MansFront.png" alt="iGEM Uppsala" style="width:100%;">
 +
</div>
 +
</div>
 +
</div>
  
 
     <div id="main">
 
     <div id="main">
−
    <img id="home_image" src="https://static.igem.org/mediawiki/2015/0/08/Uppsala_NewFrontHeader.png" alt="iGEM Uppsala" style="width:1100px;height:517px;">
+
 
−
     <h1 class="header">Home</h1>
+
      
 
     <h2 class="header">Abstract</h2>
 
     <h2 class="header">Abstract</h2>
 
     <hr>
 
     <hr>
Line 116: Line 247:
 
     <td>
 
     <td>
 
       <p>
 
       <p>
−
     Polycyclic aromatic hydrocarbons (PAHs) are produced by various activities, from grilling meat to coal gasification, and are potent carcinogens. Our project aims to degrade PAHs in industrial waste. The current waste handling method for PAHs is simply to deposit them in landfills where they leak into the environment. The bacterial cells we use need to detect the PAHs for the degradation. However, the molecules do not readily pass through the membrane.  
+
     Polycyclic aromatic hydrocarbons (PAHs) are potent carcinogens produced by various activities ranging from grilling meat to coal gasification. Our project aims to degrade high molecular weight PAHs present in industrial waste from district heating plants. There is currently no sustainable way to handle this waste and therefore it is deposited in landfills. We want to solve this problem by  employing a bacterial based system.  
 
     </p>
 
     </p>
−
     <p>
+
     <p>Our cells need to be able to detect the PAHs for direct degradation. However the high molecular weight PAHs do not readily pass through the cell membrane. We solved this obstacle by using the low weight PAH, naphthalene, as an indicator for the presence of heavier PAHs. The degradation of this small PAH inside the cell relieves repression of genes under the control of the NahR/Psal promoter system. This causes the expression of a series of enzymes for PAH degradation which are secreted outside the cell where they can oxidize and cleave the ring structures of the carcinogenic compounds. This in turn makes them available for downstream biodegradation. To increase the degradation efficiency, our system also produces rhamnolipids. These are biosurfactants that prevent the PAHs from aggregating, making them easier for the enzymes to access.  
−
    We solved this predicament by using one of the smaller PAHs as an indicator to degrade the larger, more dangerous PAHs. The degradation of this small PAH inside the cell relieves repression of genes under the control of the NahR/Psal promoter system. This causes a series of enzymes to get expressed and secreted outside the cell, oxidising and cleaving the ring structures of the carcinogenic compounds, making them available for downstream biodegradation. To increase the degradation efficiency our system also produces rhamnolipids.
+
 
       </p>
 
       </p>
 
       </td>
 
       </td>
 
       <td>
 
       <td>
 
       <a href="https://2015.igem.org/Team:Uppsala/Results">
 
       <a href="https://2015.igem.org/Team:Uppsala/Results">
−
         <img id="results_button" src="https://static.igem.org/mediawiki/2015/e/eb/Uppsala_ResultsButton.png" style="width:69px;height:250px;">
+
         <img id="results_button" src="https://static.igem.org/mediawiki/2015/e/eb/Uppsala_ResultsButton.png" style="width:90px;">
 
       </a>
 
       </a>
 
       </td>
 
       </td>
Line 130: Line 260:
 
     </table>
 
     </table>
 
     <hr>
 
     <hr>
 +
  
  
−
<table >
+
<table class="button_grid">
 +
        <tr>
 +
             
 +
                <td colspan="3" >
 +
                    <div id="med" >
 +
<a href="https://2015.igem.org/Team:Uppsala/Journey">
 +
                              <p class="description">Click here to read about our journey to gold!</p>
 +
      <img id="medal" src="https://static.igem.org/mediawiki/2015/f/f7/Uppsala_goldmedal.png">
 +
                              <!--<h2><span id="textbox">Nordic iGEM Conference</span></h2>-->
 +
</a>
 +
</div>
 +
                </td>
 +
        </tr>
 
    <tr>
 
    <tr>
 
<td >
 
<td >
 
<div class="buttons">
 
<div class="buttons">
 
  <a href="https://2015.igem.org/Team:Uppsala/Enzymes">
 
  <a href="https://2015.igem.org/Team:Uppsala/Enzymes">
−
                                         <p class="description">Click here to learn more about enzymatic degradation!</p>
+
                                         <p class="description">Laccase and dioxygenase are enzymes that are central to our project. Click here to learn more about how we use them!</p>
 
<img class="button" src="https://static.igem.org/mediawiki/2015/9/95/Uppsala_Degradation.png" alt="Enyzmatic degradation" style="width:350px;height:583px">
 
<img class="button" src="https://static.igem.org/mediawiki/2015/9/95/Uppsala_Degradation.png" alt="Enyzmatic degradation" style="width:350px;height:583px">
 
                                         <!--<h2><span id="textbox">Enzymatic Degradation</span></h2>-->
 
                                         <!--<h2><span id="textbox">Enzymatic Degradation</span></h2>-->
Line 145: Line 288:
 
<td >
 
<td >
 
<div class="buttons">
 
<div class="buttons">
−
<a href="https://2015.igem.org/Team:Uppsala/Biosurfactants">
+
<a href="https://2015.igem.org/Team:Uppsala/Naphthalene">
−
                                <p class="description">Click here to learn more about how we use biosurfactants!</p>
+
                              <p class="description">The degradation of naphthalene is what activates our whole construct. Click here to learn more about how this happens!</p>
−
<img src="https://static.igem.org/mediawiki/2015/b/ba/Uppsala_NewBioButton.png" alt="Biosurfactants" style="width:350px;height:583px">
+
      <img src="https://static.igem.org/mediawiki/2015/9/92/Uppsala_NewNahButton.png" alt="Naphthalene pathway" style="width:350px;height:583px">
−
                                <!--<h2><span id="textbox">Biosurfactants</span></h2>-->
+
                              <!--<h2><span id="textbox">Naphthalene Pathway</span></h2>-->
 
</a>
 
</a>
 
</div>
 
</div>
 
</td>
 
</td>
−
<td >
+
                <td >
 
<div class="buttons">
 
<div class="buttons">
−
<a href="https://2015.igem.org/Team:Uppsala/Naphthalene">
+
<a href="https://2015.igem.org/Team:Uppsala/Biosurfactants">
−
                              <p class="description">Click here to learn more about what the naphthalene pathway does!</p>
+
                                <p class="description">We used rhamnolipids to increase our enzymes' accessibility to the PAH:s. Click here to find out more about how we incorporated them into our system!</p>
−
      <img src="https://static.igem.org/mediawiki/2015/9/92/Uppsala_NewNahButton.png" alt="Naphthalene pathway" style="width:350px;height:583px">
+
<img src="https://static.igem.org/mediawiki/2015/7/73/Uppsala_NewBiosurfButton.png" alt="Biosurfactants" style="width:350px;height:583px">
−
                              <!--<h2><span id="textbox">Naphthalene Pathway</span></h2>-->
+
                                <!--<h2><span id="textbox">Biosurfactants</span></h2>-->
 
</a>
 
</a>
 
</div>
 
</div>
 
</td>
 
</td>
 
</tr>
 
</tr>
 +
        <tr>
 +
             
 +
                <td colspan="3" >
 +
                    <div id="nic" >
 +
<a href="https://2015.igem.org/Team:Uppsala/Software">
 +
                              <p class="description">We needed a fluorometer to measure the efficiency of our system, but we quickly noticed that getting hold of one was not that easy. Therefore, we built our own!</p>
 +
      <img  src="https://static.igem.org/mediawiki/2015/2/27/Uppsala_fluorometer.png" alt="NiC" style="width:1100px; height:263px">
 +
                              <!--<h2><span id="textbox">Nordic iGEM Conference</span></h2>-->
 +
</a>
 +
</div>
 +
                </td>
 +
        </tr>
 
         <tr>
 
         <tr>
 
                
 
                
Line 167: Line 322:
 
                     <div id="nic" >
 
                     <div id="nic" >
 
<a href="https://2015.igem.org/Team:Uppsala/nic">
 
<a href="https://2015.igem.org/Team:Uppsala/nic">
 +
                              <p class="description">We collaborated with the iGEM team from Stockholm to arrange a meetup of nordic teams in Uppsala. Click here to learn more about the Nordic iGEM Conference!</p>
 
      <img  src="https://static.igem.org/mediawiki/2015/a/ac/Uppsala_NewNiCButton.png" alt="NiC" style="width:1100px; height:263px">
 
      <img  src="https://static.igem.org/mediawiki/2015/a/ac/Uppsala_NewNiCButton.png" alt="NiC" style="width:1100px; height:263px">
 
                               <!--<h2><span id="textbox">Nordic iGEM Conference</span></h2>-->
 
                               <!--<h2><span id="textbox">Nordic iGEM Conference</span></h2>-->
Line 174: Line 330:
 
         </tr>
 
         </tr>
 
</table>
 
</table>
−
<footer class="puff">
 
−
<hr>
 
−
<!--  This is the footer. Insert logos and links to the apropriate websites. -->
 
−
<div>
 
−
<table>
 
−
<tr>
 
−
<td><a href=""><img src="https://static.igem.org/mediawiki/2015/c/c8/Elab_logo2.png" alt="Elabjournal"></a></td>
 
−
<td><a href="#"><img src="https://static.igem.org/mediawiki/2015/2/26/NGI_logo3.png" alt="National Genomic Infrastructure"></a></td>
 
−
<td><a href=""><img src="https://static.igem.org/mediawiki/2015/a/ac/Qiagen_logo2.png" alt="Qiagen"></a></td>
 
−
<td></td>
 
−
</tr>
 
−
</table>
 
−
</div>
 
−
</footer
 
−
</div>
 
−
 
  
 +
</div>
 
</body>
 
</body>
 
</html>
 
</html>
 +
 +
{{Uppsala_NewFooter}}

Latest revision as of 22:45, 20 November 2015

iGEM Uppsala
iGEM Uppsala

Abstract

Polycyclic aromatic hydrocarbons (PAHs) are potent carcinogens produced by various activities ranging from grilling meat to coal gasification. Our project aims to degrade high molecular weight PAHs present in industrial waste from district heating plants. There is currently no sustainable way to handle this waste and therefore it is deposited in landfills. We want to solve this problem by employing a bacterial based system.

Our cells need to be able to detect the PAHs for direct degradation. However the high molecular weight PAHs do not readily pass through the cell membrane. We solved this obstacle by using the low weight PAH, naphthalene, as an indicator for the presence of heavier PAHs. The degradation of this small PAH inside the cell relieves repression of genes under the control of the NahR/Psal promoter system. This causes the expression of a series of enzymes for PAH degradation which are secreted outside the cell where they can oxidize and cleave the ring structures of the carcinogenic compounds. This in turn makes them available for downstream biodegradation. To increase the degradation efficiency, our system also produces rhamnolipids. These are biosurfactants that prevent the PAHs from aggregating, making them easier for the enzymes to access.

Laccase and dioxygenase are enzymes that are central to our project. Click here to learn more about how we use them!

Enyzmatic degradation

The degradation of naphthalene is what activates our whole construct. Click here to learn more about how this happens!

Naphthalene pathway

We used rhamnolipids to increase our enzymes' accessibility to the PAH:s. Click here to find out more about how we incorporated them into our system!

Biosurfactants