Difference between revisions of "Team:Uppsala"

 
(91 intermediate revisions by 5 users not shown)
Line 1: Line 1:
−
<!--<head>                     STUFF TO BE REMOVED
+
{{Uppsala_NewTemplate}}
 +
<html>
  
 
<style>
 
<style>
−
 
−
body {
 
−
background-color: #ffffff;
 
−
}
 
−
 
−
.navbar {
 
−
width: 100%;
 
−
}
 
−
 
−
#main {
 
−
background-color: #FFFFFF;
 
−
margin-left:auto;
 
−
margin-right:auto;
 
−
width:1100px;
 
−
padding: 5px;
 
−
 
−
}
 
−
 
−
h1,h2,h3 {
 
−
font-family:"Trebuchet MS", Helvetica;
 
−
color: #FF3300;
 
−
text-shadow: 2px 2px 5px #888888;
 
−
border: none;
 
−
}
 
  
 
#home_image {
 
#home_image {
−
   /*margin: 20px auto;*/
+
   margin: 0 auto;
 
   display: block;
 
   display: block;
−
   padding: 10px 0 0 0;
+
   margin-top: -16px;
 
}
 
}
  
−
hr {
 
−
background-color: #FF3300;
 
−
}
 
  
−
p {
+
/*Design for the buttons*/
−
font-family:Garamond, "Times New Roman";
+
−
font-size: 150%;
+
−
}
+
−
 
+
−
 
+
−
@import url(http://fonts.googleapis.com/css?family=Lato:300,400,700);
+
−
@charset "UTF-8";
+
−
/* Base Styles */
+
−
#cssmenu ul,
+
−
#cssmenu li,
+
−
#cssmenu a {
+
−
  list-style: none;
+
−
  margin: 0;
+
−
  padding: 0;
+
−
  border: 0;
+
−
  line-height: 1;
+
−
  font-family: 'Lato', sans-serif;
+
−
}
+
−
#cssmenu {
+
−
  -webkit-border-radius: 5px;
+
−
  -moz-border-radius: 5px;
+
−
  -ms-border-radius: 5px;
+
−
  -o-border-radius: 5px;
+
−
  border-radius: 5px;
+
−
  width: auto;
+
−
}
+
−
#cssmenu ul {
+
−
  zoom: 1;
+
−
  background: #461972;
+
−
  background: -moz-linear-gradient(top, #4619720%, #2a8a8f 100%);
+
−
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #461972), color-stop(100%, #2a8a8f));
+
−
  background: -webkit-linear-gradient(top, #4619720%, #2a8a8f 100%);
+
−
  background: -o-linear-gradient(top, #4619720%, #2a8a8f 100%);
+
−
  background: -ms-linear-gradient(top, #4619720%, #2a8a8f 100%);
+
−
  background: linear-gradient(top, #4619720%, #2a8a8f 100%);
+
−
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='@top-color', endColorstr='@bottom-color', GradientType=0);
+
−
  padding: 5px 10px;
+
−
  -webkit-border-radius: 5px;
+
−
  -moz-border-radius: 5px;
+
−
  -ms-border-radius: 5px;
+
−
  -o-border-radius: 5px;
+
−
  border-radius: 5px;
+
−
}
+
−
#cssmenu ul:before {
+
−
  content: '';
+
−
  display: block;
+
−
}
+
−
#cssmenu ul:after {
+
−
  content: '';
+
−
  display: table;
+
−
  clear: both;
+
−
}
+
−
#cssmenu li {
+
−
  float: left;
+
−
  margin: 0 5px 0 0;
+
−
  border: 1px solid transparent;
+
−
}
+
−
#cssmenu li a {
+
−
  -webkit-border-radius: 5px;
+
−
  -moz-border-radius: 5px;
+
−
  -ms-border-radius: 5px;
+
−
  -o-border-radius: 5px;
+
−
  border-radius: 5px;
+
−
  padding: 8px 10px 9px 10px;
+
−
  display: block;
+
−
  text-decoration: none;
+
−
  color: #ffffff;
+
−
  border: 1px solid transparent;
+
−
  font-size: 16px;
+
−
 
+
−
}
+
−
#cssmenu li.active {
+
−
  -webkit-border-radius: 5px;
+
−
  -moz-border-radius: 5px;
+
−
  -ms-border-radius: 5px;
+
−
  -o-border-radius: 5px;
+
−
  border-radius: 5px;
+
−
  border: 1px solid #36b0b6;
+
−
}
+
−
#cssmenu li.active a {
+
−
  -webkit-border-radius: 5px;
+
−
  -moz-border-radius: 5px;
+
−
  -ms-border-radius: 5px;
+
−
  -o-border-radius: 5px;
+
−
  border-radius: 5px;
+
−
  display: block;
+
−
  background: #1e6468;
+
−
  border: 1px solid #133e40;
+
−
  -moz-box-shadow: inset 0 5px 10px #133e40;
+
−
  -webkit-box-shadow: inset 0 5px 10px #133e40;
+
−
  box-shadow: inset 0 5px 10px #133e40;
+
−
}
+
−
#cssmenu li:hover {
+
−
  -webkit-border-radius: 5px;
+
−
  -moz-border-radius: 5px;
+
−
  -ms-border-radius: 5px;
+
−
  -o-border-radius: 5px;
+
−
  border-radius: 5px;
+
−
  border: 1px solid #36b0b6;
+
−
}
+
−
#cssmenu li:hover a {
+
−
  -webkit-border-radius: 5px;
+
−
  -moz-border-radius: 5px;
+
−
  -ms-border-radius: 5px;
+
−
  -o-border-radius: 5px;
+
−
  border-radius: 5px;
+
−
  display: block;
+
−
  background: #1e6468;
+
−
  border: 1px solid #133e40;
+
−
  -moz-box-shadow: inset 0 5px 10px #133e40;
+
−
  -webkit-box-shadow: inset 0 5px 10px #133e40;
+
−
  box-shadow: inset 0 5px 10px #133e40;
+
−
}
+
−
 
+
−
 
+
−
/*Hide the sub-menus*/
+
−
nav ul ul {
+
−
display: none;
+
−
}
+
−
/*Show the sub-menus when you hover over the bar elements*/
+
−
nav ul li:hover > ul {
+
−
display: block;
+
−
}
+
−
/*Change of the box around the bar*/
+
−
nav ul {
+
−
background-color: #A5A5C1;
+
−
        background: -moz-linear-gradient(top, #efefef 0%, #bbbbbb 100%);
+
−
background: -webkit-linear-gradient(top, #efefef 0%,#bbbbbb 100%);
+
−
font-family: serif;
+
−
text-align: center;
+
−
        list-style: none;
+
−
+
−
padding: 0 15px;
+
−
display: inline-table;
+
−
}
+
−
nav > ul {
+
−
margin-top: 0px;
+
−
margin-left: auto;
+
−
margin-right: auto;
+
−
}
+
−
nav ul li {
+
−
float: left;
+
−
}
+
−
 
+
−
/*Only affects links in the first ul, the bar*/
+
−
nav ul li:hover > a{
+
−
        background-color: #4b545f;
+
−
color: #CC0000;
+
−
        text-decoration: none;
+
−
background-color: #A5A5C1;
+
−
}
+
−
 
+
−
/* Change of link text in the bar*/
+
−
nav ul li a {
+
−
display: block;
+
−
padding: 2px 15px;
+
−
text-decoration: none;
+
−
        color: white;
+
−
}
+
−
/*List of sub-menus*/
+
−
nav ul ul {
+
−
background: #5f6975;
+
−
border-radius: 0px;
+
−
padding: 0;
+
−
position: absolute;
+
−
        top: 100%;
+
−
}
+
−
/*The individual sub-menu elements*/
+
−
nav ul ul li {
+
−
float: none;
+
−
background-color: #A5A5C1;
+
−
border-top: 1px solid #6b727c;
+
−
border-bottom: 1px solid #575f6a;
+
−
position: relative;
+
−
}
+
−
/*The individual link texts in the sub-menus*/
+
−
nav ul ul li a {
+
−
padding: 15px 20px;
+
−
}
+
−
 
+
−
nav ul ul li a:hover {
+
−
background: #4b545f;
+
−
}
+
−
 
+
−
/*Supposed to make the navigation bar fixed up top*/
+
−
.fixed {
+
−
  position: fixed;
+
−
  top: 0;
+
−
  right: 0;
+
−
  left: 0;
+
−
  margin: auto;
+
−
  margin-top: 15px;
+
−
  width: 100%;
+
−
}
+
  
 
/*Div with the project buttons*/
 
/*Div with the project buttons*/
 
#buttonbox {
 
#buttonbox {
−
      background-color: #d3dfe4;
 
 
       border: 2px black solid;
 
       border: 2px black solid;
 
}
 
}
Line 241: Line 20:
 
/*Buttons that lead to the project page*/
 
/*Buttons that lead to the project page*/
 
.buttons {
 
.buttons {
−
border: 3px solid black;
+
/*border: 3px solid black;
−
border-radius: 20px;
+
border-radius: 20px;*/
−
         background-color: #d3dfe4;
+
        box-shadow: 10px 10px 20px #888888;
−
         margin-right: 15px;
+
        /*margin-right: 15px;*/
−
         margin-left: 10px;
+
         background-color: #E84243;
−
width: 355px;
+
         margin-right: 20px;
−
height: 225px;
+
         margin-top:15px;
 +
width: 350px;
 +
height: 583px;
 +
        overflow: hidden;
 +
        z-index:0;
 
}
 
}
  
−
/*Text on the button*/
+
/*Button effects*/
−
#textbox {
+
−
color: white;
+
−
padding: 5px;
+
−
background: rgba(0, 0, 0, 0.6);
+
−
display:table;
+
−
margin: 0 auto;
+
−
}
+
  
−
 
+
.buttons img:hover, #nic img, #med img {
−
/*Reset of the wiki default settings*/
+
        opacity: 1;
−
#contentSub, #footer-box, #catlinks, #search-controls, #p-logo, .printfooter, .firstHeading,.visualClear {display: none;} /*-- hides default wiki settings --*/
+
−
 
+
−
#top-section { /*-- styling for default menu bar (edit, page, history, etc.) --*/
+
−
+
−
border: 0 none;
+
−
height: 14px;
+
−
z-index: 100;
+
−
top: 0;
+
−
position: fixed;
+
−
width: 975px;
+
−
left: 50%;
+
−
margin-left: -487px;
+
 
}
 
}
  
−
#globalWrapper { /*-- changes default wiki settings --*/
+
.buttons img:hover, #nic img:hover, #med img:hover {
−
width: 100%;
+
        opacity: 0.2;
−
height: 100%;
+
−
border: 0px;
+
−
background-color: transparent;
+
−
margin: 0px;
+
−
padding: 0px;
+
 
}
 
}
  
−
#content {
+
.description {
−
background-color: #ffffff;      
+
        position: absolute;
−
width: 100%;    
+
        top: inherit;
−
border: 0px;
+
        bottom: inherit;
−
margin: 0px;  
+
        left: inherit;
−
  padding-left: 0px; /should be set to 0 in alt.1) /
+
        right: inherit;
−
padding-right: 0px;
+
        visibility: hidden;
−
padding-bottom: 0px;      
+
        opacity: 0;
−
  padding-top: 50px;
+
        text-align: center;
 +
        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
 +
       
 
}
 
}
  
−
html, .wrapper { /*-- changes default wiki settings --*/
+
.buttons .description {
−
  width: 100%;  
+
  padding: 3px;
−
  height: 100%;  
+
  font-size: 170%;
−
background-color: transparent; 
+
 
}
 
}
−
/*End of wiki reset*/
+
#nic .description, #med .description {
−
 
+
        width:75%;
−
</style>
+
        margin: auto;
−
</head>
+
−
 
+
−
<body>
+
−
<div id="cssmenu">
+
−
<nav class="fixed">
+
−
<ul class="navbar">
+
−
  <li class="listelem"><a href="https://2015.igem.org/Team:Uppsala">Home</a></li>
+
−
  <li class="listelem"><a href="https://2015.igem.org/Team:Uppsala/Team">Team</a></li>
+
−
  <li class="listelem"><a href="https://2015.igem.org/Team:Uppsala/Project">Project</a>
+
−
      <ul>
+
−
  <li><a href="https://2015.igem.org/Team:Uppsala/Description">Description</a></li>
+
−
  <li><a href="https://2015.igem.org/Team:Uppsala/Experiments">Experiments &amp; Protocols</a></li> 
+
−
  <li><a href="https://2015.igem.org/Team:Uppsala/Results">Results</a></li> 
+
−
  <li><a href="https://2015.igem.org/Team:Uppsala/Design">Design</a></li>
+
−
      </ul>
+
−
  </li>
+
−
  <li class="listelem"><a href="https://2015.igem.org/Team:Uppsala/Parts">Parts</a>
+
−
      <ul>
+
−
  <li><a href="https://2015.igem.org/Team:Uppsala/Parts">Team Parts</a></li>
+
−
  <li><a href="https://2015.igem.org/Team:Uppsala/Basic_Part">Basic Parts</a></li> 
+
−
  <li><a href="https://2015.igem.org/Team:Uppsala/Composite_Part">Composite Parts</a></li>
+
−
  <li><a href="https://2015.igem.org/Team:Uppsala/Part_Collection">Part Collection</a></li> 
+
−
      </ul>
+
−
  </li>
+
−
  <li><a href="https://2015.igem.org/Team:Uppsala/Notebook">Notebook</a></li>
+
−
  <li><a href="https://2015.igem.org/Team:Uppsala/Attributions">Attributions</a></li>
+
−
  <li><a href="https://2015.igem.org/Team:Uppsala/Collaborations">Collaborations</a></li>
+
−
  <li><a href="https://2015.igem.org/Team:Uppsala/Practices">Human Practices</a></li>
+
−
  <li><a href="https://2015.igem.org/Team:Uppsala/Safety">Safety</a></li>
+
−
  <li><a href="https://2015.igem.org/Team:Uppsala/Modeling">Modeling</a></li>
+
−
  <li><a href="https://2015.igem.org/Team:Uppsala/Measurement">Measurement</a></li>
+
−
  <li><a href="https://2015.igem.org/Team:Uppsala/Software">Software</a></li>
+
−
  <li><a href="https://2015.igem.org/Team:Uppsala/Entrepreneurship">Entrepreneurship</a></li>
+
−
</ul>
+
−
</nav>
+
−
</div>                            END OF STUFF-->
+
−
 
+
−
 
+
−
{{Template_All_Teams}}
+
−
<html>
+
−
<head>
+
−
<style>
+
−
 
+
−
body {
+
−
background-color: #FFFFFF;
+
 
}
 
}
  
−
#main {
+
.buttons:hover .description, #nic:hover .description, #med:hover .description {
−
background-color: #FFFFFF;
+
        visibility: visible;
−
margin-left:auto;
+
        opacity: 1;
−
margin-right:auto;
+
        -moz-transform: translateY(140px);
−
width:1100px;
+
-webkit-transform: translateY(140px);
−
padding: 5px;
+
transform: translateY(140px);
 
}
 
}
  
−
h1, h2 {
+
#med:hover .description {
−
font-family:"Trebuchet MS", Helvetica;
+
        visibility: visible;
−
color: #FF3300;
+
        opacity: 1;
−
text-shadow: 2px 2px 5px #888888;
+
        -moz-transform: translateY(40px);
−
border: none;
+
-webkit-transform: translateY(40px);
 +
transform: translateY(40px);
 
}
 
}
  
−
#home_image {
+
/*Affects all effects on the buttons (opacity, resize). Makes a smooth 300ms transition.*/
−
  margin: 0 auto;
+
.button_grid img {
−
  display: block;
+
        -webkit-transition: all 300ms;
−
  margin-top: -50px;
+
-moz-transition: all 300ms;
−
  padding-bottom: 15px;
+
transition: all 300ms;
 
}
 
}
  
−
hr {
+
/*Resize of the buttons on hover*/
−
background-color: #FF3300;
+
.button_grid td:hover img {
 +
        -webkit-transform: scale(1.2);
 +
-moz-transform: scale(1.2);
 +
transform: scale(1.2);
 
}
 
}
  
−
a hr {
 
−
background-color: black;
 
−
}
 
  
−
p {
+
#results_button {
−
font-family:Garamond, "Times New Roman";
+
box-shadow: 3px 3px 10px #888888;
−
font-size: 150%;
+
margin-left: 10px;
 
}
 
}
  
−
/*CSS for the navbar*/
+
#nic {
−
 
+
/*border: 3px solid black;
−
/*Hide the sub-menus*/
+
border-radius: 20px;*/
−
nav ul ul {
+
box-shadow: 10px 10px 20px #888888;
−
    display: none;
+
/*background-color: #d3dfe4;*/
−
}
+
background-color: #E84243;
−
/*Show the sub-menus when you hover over the bar elements*/
+
margin-top: 17px;
−
nav ul li:hover > ul {
+
width: 1100px;
−
    display: block;
+
height: 263px;
−
}
+
overflow: hidden;
−
/*Change of the box around the bar*/
+
−
nav ul {
+
−
    background-color: #FFFFFF;
+
−
    font-family: "Trebuchet MS";
+
−
    color: black;
+
−
    border-bottom: 1px solid black;
+
−
    text-align: center;
+
−
    list-style: none;
+
−
    text-transform: uppercase;
+
−
    padding: 0 15px;
+
−
    display: inline-table;       
+
−
}
+
−
nav > ul {
+
−
    margin-top: 0px;
+
−
    margin-left: auto;
+
−
    margin-right: auto;
+
−
}
+
−
nav ul li {
+
−
    float: left;
+
−
}
+
−
/* Change of link text in the bar*/
+
−
nav ul li a {
+
−
    display: block;
+
−
    padding: 10px 30px 5px 30px;
+
−
    color: black;
+
−
    font-size: 125%;
+
−
    border-bottom: 2px solid #FFFFFF;
+
 
}
 
}
  
−
/*Only affects links in the first ul, the bar*/
+
/*Text on the button*/
−
nav ul li:hover > a {  
+
#textbox {
−
    color: #CC0000;
+
color: white;
−
    text-decoration: none;
+
padding: 5px;
−
    border-bottom: 2px solid #CC0000;
+
background: rgba(0, 0, 0, 0.6);
−
    opacity: 1;
+
display:table;
 +
margin: 0 auto;
 
}
 
}
  
−
 
+
#medal {
−
/*List of sub-menus*/
+
/*padding: 25px 0px;*/
−
nav ul ul {  
+
/*box-shadow: 10px 10px 20px #888888;*/
−
    background-color: #FFFFFF;
+
/*margin-top: 14px;
−
    /*border-radius: 10px;*/
+
margin-bottom: 3px;*/
−
    padding: 0px;
+
−
    /*box-shadow: 0px 1px 1px 1px;*/
+
−
    margin-top: 0px;
+
−
    position: absolute;
+
−
    top: 100%;
+
 
}
 
}
−
/*The individual sub-menu elements*/
 
−
nav ul ul li {
 
−
    float: none;
 
−
    /*border-radius: 5px;*/
 
−
    position: relative;
 
−
}
 
−
/*The individual link texts in the sub-menus*/
 
−
nav ul ul li a {
 
−
    padding: 5px 5px 5px 5px;
 
−
    border: none;
 
−
}
 
−
 
  
−
nav ul ul li a:hover {
+
#med {
−
    /*background: #4b545f;*/
+
width: 1100px;
−
    border: none;
+
height: 103px;
 +
box-shadow: 10px 10px 20px #888888;
 +
overflow: hidden;
 +
margin-top: 10px;
 +
background-color: #E84243;
 
}
 
}
  
  
 +
*flipping images*/
  
−
/*Supposed to make the navigation bar fixed up top*/
+
/* entire container, keeps perspective */
−
.fixed {
+
.flip-container{
−
  position: fixed;
+
/*perspective*/
−
  top: 0;
+
-webkit-perspective:1000;
−
   right: 0;
+
   -moz-perspective:1000;
−
  left: 0;
+
    -ms-perspective:1000;
−
  margin: auto;
+
    -o-perspective:1000;
−
  margin-top: 15px;
+
        perspective:1000;
 
}
 
}
−
 
+
/* flip the pane when hovered */
−
#full_width {
+
.flipped {
−
width:100%;
+
/*transform*/
 +
-webkit-transform:rotateY(180deg);
 +
  -moz-transform:rotateY(180deg);
 +
    -ms-transform:rotateY(180deg);
 +
    -o-transform:rotateY(180deg);
 +
        transform:rotateY(180deg);
 
}
 
}
  
−
.black {
+
.flip-container, .front, .back{
−
color: black;
+
width: 100%;
 +
height: 461px;
 
}
 
}
  
−
/*End of CSS for the navbar*/
 
  
−
/*Reset of the wiki default settings*/
+
/* flip speed goes here */
−
#contentSub, #footer-box, #catlinks, #search-controls, #p-logo, .printfooter, .firstHeading,.visualClear {display: none;} /*-- hides default wiki settings --*/
+
.flipper {
−
 
+
/*transition*/
−
#top-section { /*-- styling for default menu bar (edit, page, history, etc.) --*/
+
-webkit-transition:1s;
−
+
  -moz-transition:1s;
−
border: 0 none;  
+
    -o-transition:1s;
−
height: 14px;
+
        transition:1s;
−
z-index: 100;
+
/*transform-style*/
−
top: 0;
+
-webkit-transform-style:preserve-3d;
−
position: fixed;
+
  -moz-transform-style:preserve-3d;
−
width: 975px;  
+
    -ms-transform-style:preserve-3d;
−
left: 50%;  
+
    -o-transform-style:preserve-3d;
−
margin-left: -487px;
+
        transform-style:preserve-3d;
 +
position:relative;
 
}
 
}
  
−
#globalWrapper { /*-- changes default wiki settings --*/
+
/* hide back of pane during swap */
−
width: 100%;  
+
.front, .back{
−
height: 100%;
+
/*backface-visibility*/
−
border: 0px;
+
-webkit-backface-visibility:hidden;
−
background-color: transparent;
+
  -moz-backface-visibility:hidden;
−
margin: 0px;
+
    -ms-backface-visibility:hidden;
−
padding: 0px;
+
    -o-backface-visibility:hidden;
 +
        backface-visibility:hidden;
 +
position:absolute;
 +
top:0;
 +
left:0;
 
}
 
}
  
−
#content {
 
−
background-color: #ffffff;     
 
−
width: 100%;   
 
−
border: 0px;
 
−
margin: 0px;
 
−
padding-left: 0px; /*should be set to 0 in alt.1) */
 
−
padding-right: 0px;
 
−
padding-bottom: 0px;       
 
−
padding-top: 50px;
 
−
}
 
  
−
html, .wrapper { /*-- changes default wiki settings --*/
 
−
width: 100%;
 
−
height: 100%;
 
−
background-color: transparent; 
 
−
}
 
−
/*End of wiki reset*/
 
  
−
 
+
/* front pane, placed above back */
−
/*Design for the buttons*/
+
.front{
−
 
+
z-index:2;
−
/*Div with the project buttons*/
+
−
#buttonbox {
+
−
      background-color: #d3dfe4;
+
−
      border: 2px black solid;
+
 
}
 
}
  
−
/*Buttons that lead to the project page*/
 
−
.buttons {
 
−
border: 3px solid black;
 
−
border-radius: 20px;
 
−
        background-color: #d3dfe4;
 
−
        margin-right: 15px;
 
−
        margin-left: 10px;
 
−
width: 355px;
 
−
height: 225px;
 
−
}
 
  
−
/*Text on the button*/
+
/* back, initially hidden pane */
−
#textbox {
+
.back{
−
color: white;
+
/*transform*/
−
padding: 5px;
+
-webkit-transform:rotateY(180deg);
−
background: rgba(0, 0, 0, 0.6);
+
  -moz-transform:rotateY(180deg);
−
display:table;
+
    -ms-transform:rotateY(180deg);
−
margin: 0 auto;
+
    -o-transform:rotateY(180deg);
 +
        transform:rotateY(180deg);
 
}
 
}
  
 
</style>
 
</style>
−
 
 
</head>
 
</head>
 
<body>
 
<body>
  
−
<nav class="fixed">
+
    <!--<img id="home_image" src="https://static.igem.org/mediawiki/2015/4/4d/Uppsala_NewFront.png" alt="iGEM Uppsala" style="width:100%;height:100%;">-->
−
<ul id="full_width">
+
−
  <li><a href="https://2015.igem.org/Team:Uppsala">Home</a></li>
+
−
  <li><a href="https://2015.igem.org/Team:Uppsala/Team">Team</a></li>
+
−
  <li><a href="https://2015.igem.org/Team:Uppsala/Description">Project</a>
+
−
      <ul>
+
−
    <li><a href="https://2015.igem.org/Team:Uppsala/Enzymes">Enzymatic Degradation<hr></a></li>
+
−
    <li><a href="https://2015.igem.org/Team:Uppsala/Biosurfactants">Biosurfactants <hr></a></li>
+
−
    <li><a href="https://2015.igem.org/Team:Uppsala/Naphthalene">Naphthalene Pathway<hr></a></li>
+
−
    <li><a href="https://2015.igem.org/Team:Uppsala/Design">Design<hr></a></li>
+
−
    <li><a href="https://2015.igem.org/Team:Uppsala/Software">Software</a></li>
+
−
      </ul>
+
−
  </li>
+
−
  <li><a href="https://2015.igem.org/Team:Uppsala/Results">Results</a></li>
+
−
  <li><a href="https://2015.igem.org/Team:Uppsala/Parts">Parts</a>
+
−
      <ul>
+
−
      <li><a href="https://2015.igem.org/Team:Uppsala/Basic_Part">Basic Parts<hr></a></li> 
+
−
      <li><a href="https://2015.igem.org/Team:Uppsala/Composite_Part">Composite Parts<hr></a></li>
+
−
      <li><a href="https://2015.igem.org/Team:Uppsala/Part_Collection">Part Collection</a></li> 
+
−
      </ul>
+
−
  </li>
+
−
  <li><a href="https://2015.igem.org/Team:Uppsala/Notebook">Notebook</a>
+
−
      <ul>
+
−
        <li><a href="https://2015.igem.org/Team:Uppsala/Experiments">Experiments &amp; Protocols<hr></a></li>
+
−
        <li><a href="https://2015.igem.org/Team:Uppsala/Calendar">Calendar</a></li>
+
−
      </ul>
+
−
  </li>
+
−
  <li><a href="https://2015.igem.org/Team:Uppsala/Attributions">Attributions</a>
+
−
    <ul>
+
−
    <li><a href="https://2015.igem.org/Team:Uppsala/Collaborations">Collaborations<hr></a></li>
+
−
    <li><a href="https://2015.igem.org/Team:Uppsala/Acknowledgements">Acknowledgements</a></li>
+
−
    </ul>
+
−
  </li>
+
−
  <li><a href="https://2015.igem.org/Team:Uppsala/Safety">Safety</a></li>
+
−
  <li><a href="https://2015.igem.org/Team:Uppsala/Practices">Human Practices</a></li>
+
−
  <li><a href="https://2015.igem.org/Team:Uppsala/Modeling">Modeling</a></li>
+
−
</ul>
+
−
</nav>
+
  
−
  <!--<img id="https://static.igem.org/mediawiki/2015/5/53/Ppsala_pathway.png" alt="iGEM Uppsala" style="width:1348px;height:582px;">-->
+
<div class="flip-container">
−
  <div id="main">
+
<div class="flipper" onclick="this.classList.toggle('flipped')">
−
    <img id="home_image" src="https://static.igem.org/mediawiki/2015/0/08/Uppsala_NewFrontHeader.png" alt="iGEM Uppsala" style="width:1100px;height:517px;">
+
<div class="front">
−
     <h1 class="header">Home</h1>
+
<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">
 +
 
 +
   
 
     <h2 class="header">Abstract</h2>
 
     <h2 class="header">Abstract</h2>
 
     <hr>
 
     <hr>
−
     <p>
+
      
−
     Nature is a biologist’s working bench - and as such we like to keep it tidy. Polycyclic aromatic hydrocarbons (PAHs) are a major pollutant derived from human activity - coil burning, oil spills, gasification plant waste. It’s carcinogenic, insoluble in water and hard to degrade. Thankfully, we’re also engineers and we decided to help nature do it’s thing.
+
  <table>
−
    </p>
+
    <tr>
−
    <p>
+
    <td>
−
    We took a two-way approach for the project  first we’ll enhance E.coli with the ability to degrade PAHs by inserting a biobrick construct  containing laccase  a powerful enzyme that helps get rid of those pesky compounds. And second, we’ll develop a biosensor, so that bacteria don’t waste their time producing enzymes when there is nothing to break down.
+
      <p>
−
    </p>
+
     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>
−
    PAHs are a major problem because they are stable and hydrophobic  meaning once an area is polluted, cleaning up is very hard  like trying to wash a greasy pan by dipping it in cold water! By using the help of bacteria, these contaminants can be removed from the environment (for example in wastewater treatment plants). Best of all  it will require minimum effort, because bacteria will degrade the compounds all by themselves, and with pleasure. Imagine eating doughnuts for homework!
+
    <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.  
−
     </p>
+
      </p>
 +
      </td>
 +
      <td>
 +
      <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:90px;">
 +
      </a>
 +
      </td>
 +
    </tr>
 +
     </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 class="buttons">
+
<td >
−
<div>
+
<div class="buttons">
−
  <a href="#">
+
  <a href="https://2015.igem.org/Team:Uppsala/Enzymes">
−
<img class="button" src="" alt="">
+
                                        <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>
−
                                         <h2><span id="textbox">Enzymatic Degradation</span></h2>
+
<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>-->
 
    </a>
 
    </a>
 
</div>
 
</div>
 
</td>
 
</td>
−
<td class="buttons">
+
<td >
−
<div>
+
<div class="buttons">
−
<a href="#">
+
<a href="https://2015.igem.org/Team:Uppsala/Naphthalene">
−
<img src="" alt="">
+
                              <p class="description">The degradation of naphthalene is what activates our whole construct. Click here to learn more about how this happens!</p>
−
                                <h2><span id="textbox">Biosurfactants</span></h2>
+
      <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">Naphthalene Pathway</span></h2>-->
 
</a>
 
</a>
 
</div>
 
</div>
 
</td>
 
</td>
−
<td class="buttons">
+
                <td >
−
<div>
+
<div class="buttons">
−
<a href="#">
+
<a href="https://2015.igem.org/Team:Uppsala/Biosurfactants">
−
      <img src="" alt="">
+
                                <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>
−
                              <h2><span id="textbox">Naphthalene Pathway</span></h2>
+
<img src="https://static.igem.org/mediawiki/2015/7/73/Uppsala_NewBiosurfButton.png" alt="Biosurfactants" style="width:350px;height:583px">
 +
                                <!--<h2><span id="textbox">Biosurfactants</span></h2>-->
 
</a>
 
</a>
 
</div>
 
</div>
Line 644: Line 306:
 
</tr>
 
</tr>
 
         <tr>
 
         <tr>
−
               <td class="buttons">
+
                
−
                     <div>
+
                <td colspan="3" >
−
<a href="#">
+
                     <div id="nic" >
−
      <img src="" alt="">
+
<a href="https://2015.igem.org/Team:Uppsala/Software">
−
                               <h2><span id="textbox">Results</span></h2>
+
                              <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>
 
</a>
−
    </div>
+
</div>
−
                </td>
+
                </td>
−
                 <td class="buttons">
+
        </tr>
−
                     <div>
+
        <tr>
−
<a href="#">
+
             
−
      <img src="" alt="">
+
                 <td colspan="3" >
−
                               <h2><span id="textbox">Nordic iGEM Conference</span></h2>
+
                     <div id="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">
 +
                               <!--<h2><span id="textbox">Nordic iGEM Conference</span></h2>-->
 
</a>
 
</a>
 
</div>
 
</div>
Line 664: Line 332:
  
 
</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