Team:Calgary/SandboxMain

From 2012.igem.org

(Difference between revisions)
 
(9 intermediate revisions not shown)
Line 1: Line 1:
 +
{{Team:Calgary/MainHeader}}
 +
<html>
<html>
<!--
<!--
Line 19: Line 21:
======*/
======*/
@media only screen and (min-device-width:481px) {
@media only screen and (min-device-width:481px) {
-
 
-
 
-
/***Nav styling***/
 
-
#nav-wrap{
 
-
height: 0px;
 
-
margin-top: -45px;
 
-
}
 
-
 
-
#nav, #nav ul{
 
-
list-style: none;
 
-
margin: 0;
 
-
padding: 0;
 
-
width: 965px;
 
-
height: 100%;
 
-
display: table;
 
-
 
-
 
-
}
 
-
 
-
/*To be moved to JQ block*/
 
-
#menu-icon{
 
-
display: none;
 
-
}
 
-
 
-
/*menu*/
 
-
#nav li{
 
-
height: auto;
 
-
padding: 0;
 
-
list-style: none;
 
-
float: left;
 
-
width: auto;
 
-
margin: 0;
 
-
background: #333333;
 
-
position: relative;
 
-
}
 
-
#nav > li a{
 
-
padding: 0 15px;
 
-
}
 
-
#nav > li{
 
-
background: transparent;
 
-
}
 
-
 
-
/*submenu*/
 
-
#nav li ul {
 
-
position: absolute;
 
-
width: 200px;
 
-
display: none;
 
-
}
 
-
#nav li:hover ul {
 
-
display: block;
 
-
}
 
-
/*sub-submenu*/
 
-
#nav li ul ul{
 
-
margin-left: 230px;
 
-
margin-top: -15px;
 
-
}
 
-
#nav li:hover ul ul{
 
-
display: none;
 
-
}
 
-
#nav li:hover ul, #nav li li:hover ul{
 
-
display: block;
 
-
}
 
-
#nav a{
 
-
display: block;
 
-
font-family: Myriad Pro, Gill Sans MT, Trebuchet MS, Arial, Sans-Serif;
 
-
color: white;
 
-
}
 
-
#nav li a{
 
-
line-height: 1.4em; /*centers the text vertically*/
 
-
font-size: 2em;
 
-
}
 
-
#nav ul li > a{
 
-
width: 200px;
 
-
}
 
-
/*color change after rollover*/
 
-
#nav li a:hover, #nav li li a.drop:hover::after{
 
-
display: block;
 
-
text-decoration: none;
 
-
color: #43bbff;
 
-
}
 
-
#nav li ul li ul{
 
-
margin-top: -35px;
 
-
position: absolute;
 
-
}
 
-
/*submenu and sub-submenu*/
 
-
#nav li ul li ul li a, #nav li ul li a{
 
-
font-size: 1.8em;
 
-
}
 
-
#nav li li a.drop:after{
 
-
content: '>';
 
-
padding-left: 20px;
 
-
color: #BBB;
 
-
display: inline;
 
-
float: right;
 
-
}
 
-
 
-
/***End nav styling***/
 
-
 
-
/***Headerimage***/
 
-
#headerimage{
 
-
width: 968px;
 
-
position: relative;
 
-
margin-left: 0px;
 
-
margin-bottom: 10px;
 
-
margin-top: -20px;
 
-
}
 
-
#css-full{
 
-
display: none;
 
-
}
 
-
#css-mobi{
 
-
display: block;
 
-
top: 0px;
 
-
}
 
-
 
-
/***Logo styling***/
 
-
#logo{
 
-
position: relative;
 
-
margin-top: -145px;
 
-
right: 20px;
 
-
float: right;
 
-
}
 
-
 
-
#logo img{
 
-
width: 260px;
 
-
}
 
/***Body styling***/
/***Body styling***/
Line 155: Line 32:
#box1{
#box1{
width: 968px;
width: 968px;
-
margin-top: 39px;
+
margin-top: -8px;
-
background: #A0A0A0;
+
background: #CCCCCC;
padding-bottom: 20px;
padding-bottom: 20px;
 +
margin-bottom: 13px;
}
}
#box1 h2{
#box1 h2{
Line 189: Line 67:
top: 108px;
top: 108px;
background: #F6A82D;
background: #F6A82D;
 +
margin-bottom: 4px;
}
}
 +
.oblank{
 +
width: 644px;
 +
height: 104px;
 +
background: #FFE485;
 +
position: relative;
 +
top: -219px;
 +
}
 +
#orangebox:hover .oblank, .oblank:hover{
 +
display: none;
 +
}
#orangebox .iconcontainer{
#orangebox .iconcontainer{
position: relative;
position: relative;
-
margin-bottom: 4px;
+
display: none;
-
left: -999em;
+
left: auto;
-
top: -215px;
+
top: -219px;
}
}
.iconbox div, .iconbox{
.iconbox div, .iconbox{
Line 224: Line 113:
}
}
#orangebox:hover .iconcontainer{
#orangebox:hover .iconcontainer{
-
left: auto;
+
display: block;
background: transparent;
background: transparent;
}
}
Line 234: Line 123:
background: #58CD45;
background: #58CD45;
}
}
 +
.gblank{
 +
width: 320px;
 +
height: 104px;
 +
background: #A5FF8E;
 +
position: relative;
 +
top: 219px;
 +
left: -320px;
 +
}
#greenbox .iconcontainer{
#greenbox .iconcontainer{
position: relative;
position: relative;
margin-top: 4px;
margin-top: 4px;
left: -999em;
left: -999em;
-
z-index: 0;
+
z-index: 1;
}
}
a.gbox1 div{
a.gbox1 div{
Line 255: Line 152:
background: #94FF7D;
background: #94FF7D;
z-index: 99; /*hovers are not overridden by OSCAR boxes*/
z-index: 99; /*hovers are not overridden by OSCAR boxes*/
 +
}
 +
#greenbox:hover .gblank, .gblank:hover{
 +
display: none;
}
}
#greenbox:hover .iconcontainer{
#greenbox:hover .iconcontainer{
Line 272: Line 172:
margin-left: 4px;
margin-left: 4px;
}
}
 +
.bblank{
 +
width: 320px;
 +
height: 104px;
 +
background: #C5F0F0;
 +
position: relative;
 +
top: 219px;
 +
left: -320px;
 +
z-index: 0;
 +
}
#bluebox .iconcontainer{
#bluebox .iconcontainer{
position: relative;
position: relative;
Line 300: Line 209:
background: #7DD7FF;
background: #7DD7FF;
z-index: 99; /*hovers are not overridden by FRED boxes*/
z-index: 99; /*hovers are not overridden by FRED boxes*/
 +
}
 +
#bluebox:hover .bblank, .bblank:hover{
 +
display: none;
}
}
#bluebox:hover .iconcontainer{
#bluebox:hover .iconcontainer{
Line 313: Line 225:
background: #555555;
background: #555555;
height: 650px;
height: 650px;
 +
margin-bottom: 12px;
}
}
#boxinfo h2{
#boxinfo h2{
Line 341: Line 254:
position: relative;
position: relative;
width: 968px;
width: 968px;
-
margin-bottom: 4px;
+
margin-bottom: 12px;
}
}
#threeboxes a, #threeboxes a div{
#threeboxes a, #threeboxes a div{
width: 320px;
width: 320px;
height: 155px;
height: 155px;
-
background: #999999;
 
float: left;
float: left;
 +
margin-bottom: 12px;
}
}
#threeboxes div h2{
#threeboxes div h2{
padding: 20px 20px 0px;
padding: 20px 20px 0px;
 +
position: relative;
 +
top: -155px;
}
}
#threeboxes div p{
#threeboxes div p{
padding: 0px 20px;
padding: 0px 20px;
 +
position: relative;
 +
top: -155px;
}
}
#greybox1{
#greybox1{
margin-right: 4px;
margin-right: 4px;
 +
background: #58CD45;
}
}
 +
#greybox1:hover{
 +
background: #94FF7D;
 +
}
#greybox2{
#greybox2{
margin-right: 4px;
margin-right: 4px;
 +
background: #5BB5E8;
}
}
 +
#greybox2:hover{
 +
background: #7DD7FF;
 +
}
#greybox3{
#greybox3{
margin: 0;
margin: 0;
 +
background: #F6A82D;
}
}
-
#threeboxes div:hover{
+
#greybox3:hover{
-
background: #BBBBBB;
+
background: #FFE44F;
-
}
+
}
 +
#sponsorsbox{
#sponsorsbox{
clear: both;
clear: both;
-
float: left;
 
position: relative;
position: relative;
width: 968px;
width: 968px;
Line 376: Line 302:
}
}
#sponsorsbox h2{
#sponsorsbox h2{
-
padding: 20px 20px 0px;
+
padding: 20px 20px 0px 20px;
}
}
#sponsorsbox p{
#sponsorsbox p{
padding: 0px 20px;
padding: 0px 20px;
 +
}
 +
#sponsorsbox table{
 +
width: 950px;
 +
margin-left: auto;
 +
margin-right: auto;
 +
background: #EEEEEE;
 +
}
 +
#sponsorsbox td{
 +
padding: 15px 0px;
 +
width: 300px;
 +
}
 +
#sponsorsbox img{
 +
display: block;
 +
margin-right: auto;
 +
margin-left: auto;
}
}
}
}
Line 425: Line 366:
});
});
 +
/*epic box FRED/OSCAR blank box disappearance*/
 +
$('#bluebox').hover(
 +
function(){
 +
$('.gblank').hide();
 +
$('.bblank').hide();
 +
},
 +
function(){
 +
$('.gblank').show();
 +
$('.bblank').show();
 +
});
 +
 +
$('#greenbox').hover(
 +
function(){
 +
$('.gblank').hide();
 +
$('.bblank').hide();
 +
},
 +
function(){
 +
$('.gblank').show();
 +
$('.bblank').show();
 +
});
/*Set stylesheet properly*/
/*Set stylesheet properly*/
Line 447: Line 408:
<body>
<body>
-
<header>
 
-
<!--
 
-
<a id="css-full" href="#default">Full View</a>
 
-
<a id="css-mobi" href="#mobile">Mobile View</a>
 
-
-->
 
-
<div id="headerimage"><img src="https://static.igem.org/mediawiki/2012/7/7c/UCalgary2012_HeaderImage_V7.2.png"></img></div>
 
-
<a id="logo" href="https://2012.igem.org/Team:Calgary"><img src="https://static.igem.org/mediawiki/2012/4/48/UCalgary2012_White_Low-Res_Official_Logo.png"></img></a>
 
-
<div id="nav-wrap">
 
-
<ul id="nav">
 
-
<li><a href="https://2012.igem.org/Team:Calgary">Home</a></li>
 
-
<li><a class="drop" href="https://2012.igem.org/Team:Calgary/Team">Team</a>
 
-
<ul>
 
-
<li>
 
-
<a class="drop" href="#">Members</a>
 
-
<ul>
 
-
<li><a href="#">Undergraduates</a></li>
 
-
<li><a href="#">Advisors</a></li>
 
-
<li><a href="#">Supervisors</a></li>
 
-
</ul>
 
-
</li>
 
-
<li><a class="dropheader" href="http://ung.igem.org/Team.cgi?id=902">Official Profile</a></li>
 
-
<li><a class="dropheader" href="#">The University</a></li>
 
-
</ul>
 
-
</li>
 
-
<li><a class="drop" href="https://2012.igem.org/Team:Calgary/Project">Project</a>
 
-
<ul>
 
-
<li>
 
-
<a class="drop" href="https://2012.igem.org/Team:Calgary/Project">Overview</a>
 
-
<ul>
 
-
<li><a href="#">Data Page</a></li>
 
-
</ul>
 
-
</li>
 
-
<li>
 
-
<a class="drop" href="https://2012.igem.org/Team:Calgary/Project/FRED">FRED</a>
 
-
<ul>
 
-
<li><a href="#">Sensing NAs</a></li>
 
-
<li><a href="#">Electroreporting</a></li>
 
-
<li><a href="#">Modelling</a></li>
 
-
<li><a href="#">Device Prototype</a></li>
 
-
</ul>
 
-
</li>
 
-
<li>
 
-
<a class="drop" href="https://2012.igem.org/Team:Calgary/Project/OSCAR">OSCAR</a>
 
-
<ul>
 
-
<li><a href="#">Decarboxylation</a></li>
 
-
<li><a href="#">Desulfurization</a></li>
 
-
<li><a href="#">Denitrification</a></li>
 
-
<li><a href="#">Decatecholization</a></li>
 
-
<li><a href="#">Bioreactor Design</a></li>
 
-
<li><a href="#">Flux Analysis</a></li>
 
-
</ul>
 
-
</li>
 
-
<li>
 
-
<a class="drop" href="https://2012.igem.org/Team:Calgary/Project/Killswitch">Killswitch</a>
 
-
<ul>
 
-
<li><a href="#">Death Genes</a></li>
 
-
<li><a href="#">Regulation</a></li>
 
-
</ul>
 
-
</li>
 
-
<li><a href="https://2012.igem.org/Team:Calgary/Project/FutureDirections">Future Directions</a></li>
 
-
</ul>
 
-
</li>
 
-
<li><a href="https://2012.igem.org/Team:Calgary/Parts">Parts</a></li>
 
-
<li><a class="drop" href="https://2012.igem.org/Team:Calgary/Notebook">Notebook</a>
 
-
<ul>
 
-
<li><a href="#">Journal</a></li>
 
-
<li><a href="#">Protocols</a></li>
 
-
</ul>
 
-
</li>
 
-
<li><a class="drop" href="https://2012.igem.org/Team:Calgary/Outreach">Outreach</a>
 
-
<ul>
 
-
<li><a class="drop" href="#">Killswitch Design</a>
 
-
<ul>
 
-
<li><a href="#">Collaboration</a></li>
 
-
</ul>
 
-
</li>
 
-
<li><a class="drop" href="#">Engineering</a>
 
-
<ul>
 
-
<li><a href="#">Biosensor</a></li>
 
-
<li><a href="#">Bioreactor</a></li>
 
-
</ul>
 
-
</li>
 
-
<li>
 
-
<a class="drop" href="#">Community</a>
 
-
<ul>
 
-
<li><a href="#">Spark Science</a></li>
 
-
<li><a href="#">Minds in Motion</a></li>
 
-
<li><a href="#">TEDxCalgary</a></li>
 
-
<li><a href="#">Follow Us!</a></li>
 
-
</ul>
 
-
</li>
 
-
<li><a href="https://2012.igem.org/Team:Calgary/Safety">Safety</a></li>
 
-
</ul>
 
-
</li>
 
-
<li><a href="https://2012.igem.org/Team:Calgary/Sponsors">Sponsors</a></li>
 
-
<li><a href="https://2012.igem.org" target="_blank">iGEM</a></li>
 
-
</ul>
 
-
 
-
</div>
 
-
</header>
 
<div id="box1">
<div id="box1">
-
<h2>FRED and OSCAR: Converting Naphthenic Acids to Biofuels</h2>
+
<h2>Detect and Destroy: Building FRED and OSCAR</h2>
<p><b>Naphthenic acids (NAs)</b> are a group of recalcitrant carboxylic acid-containing compounds which are byproducts of the bitumen extraction process in the northern Alberta oil sands. These toxic and corrosive compounds are part of the solid and liquid wastes deposited into large holding areas called <b>tailings ponds</b>, which pose a potential environmental and economic concern to Alberta and to other areas. The University of Calgary 2012 iGEM team aims to develop a collection of NA-sensing and degrading organisms for their <b>detection and bioremediation</b>.</p>
<p><b>Naphthenic acids (NAs)</b> are a group of recalcitrant carboxylic acid-containing compounds which are byproducts of the bitumen extraction process in the northern Alberta oil sands. These toxic and corrosive compounds are part of the solid and liquid wastes deposited into large holding areas called <b>tailings ponds</b>, which pose a potential environmental and economic concern to Alberta and to other areas. The University of Calgary 2012 iGEM team aims to develop a collection of NA-sensing and degrading organisms for their <b>detection and bioremediation</b>.</p>
<p><b>FRED and OSCAR</b> are the two projects we are working on this year. Take a look at the description below to learn more!</p>
<p><b>FRED and OSCAR</b> are the two projects we are working on this year. Take a look at the description below to learn more!</p>
Line 561: Line 422:
<div class="imgbox">
<div class="imgbox">
<img src="https://static.igem.org/mediawiki/2012/9/9e/UCalgary2012_EpicBoxHP_-_Blank.png"></img>
<img src="https://static.igem.org/mediawiki/2012/9/9e/UCalgary2012_EpicBoxHP_-_Blank.png"></img>
 +
</div>
 +
 +
<div class="oblank">
</div>
</div>
<div class="iconcontainer">
<div class="iconcontainer">
-
<a class="obox1 iconbox" href="#">
+
<a class="obox1 iconbox" href="https://2012.igem.org/Team:Calgary/Outreach/VideoGame">
<div>
<div>
<img src="https://static.igem.org/mediawiki/2012/6/6b/UCalgary2012_IconHP1.png"></img>
<img src="https://static.igem.org/mediawiki/2012/6/6b/UCalgary2012_IconHP1.png"></img>
</div>
</div>
</a>
</a>
-
<a class="obox2 iconbox" href="#">
+
<a class="obox2 iconbox" href="https://2012.igem.org/Team:Calgary/Project/HumanPractices/Killswitch">
<div>
<div>
<img src="https://static.igem.org/mediawiki/2012/6/65/UCalgary2012_IconHP2.png"></img>
<img src="https://static.igem.org/mediawiki/2012/6/65/UCalgary2012_IconHP2.png"></img>
</div>
</div>
</a>
</a>
-
<a class="obox3 iconbox" href="#">
+
<a class="obox3 iconbox" href="https://2012.igem.org/Team:Calgary/Project/HumanPractices/Interviews">
<div>
<div>
<img src="https://static.igem.org/mediawiki/2012/d/d6/UCalgary2012_IconHP3.png"></img>
<img src="https://static.igem.org/mediawiki/2012/d/d6/UCalgary2012_IconHP3.png"></img>
</div>
</div>
</a>
</a>
-
<a class="obox4 iconbox" href="#">
+
<a class="obox4 iconbox" href="https://2012.igem.org/Team:Calgary/Project/HumanPractices/Design">
<div>
<div>
<img src="https://static.igem.org/mediawiki/2012/1/1c/UCalgary2012_IconHP4.png"></img>
<img src="https://static.igem.org/mediawiki/2012/1/1c/UCalgary2012_IconHP4.png"></img>
</div>
</div>
</a>
</a>
-
<a class="obox5 iconbox" href="#">
+
<a class="obox5 iconbox" href="https://2012.igem.org/Team:Calgary/Safety">
<div>
<div>
<img src="https://static.igem.org/mediawiki/2012/c/c9/UCalgary2012_IconHP5.png"></img>
<img src="https://static.igem.org/mediawiki/2012/c/c9/UCalgary2012_IconHP5.png"></img>
</div>
</div>
</a>
</a>
-
<a class="obox6 iconbox" href="#">
+
<a class="obox6 iconbox" href="https://2012.igem.org/Team:Calgary/Outreach">
<div>
<div>
<img src="https://static.igem.org/mediawiki/2012/0/0e/UCalgary2012_IconHP6.png"></img>
<img src="https://static.igem.org/mediawiki/2012/0/0e/UCalgary2012_IconHP6.png"></img>
Line 604: Line 468:
<div class="imgbox">
<div class="imgbox">
<img src="https://static.igem.org/mediawiki/2012/4/47/UCalgary2012_EpicBoxFRED_-_Blank.png"></img>
<img src="https://static.igem.org/mediawiki/2012/4/47/UCalgary2012_EpicBoxFRED_-_Blank.png"></img>
 +
</div>
 +
 +
<div class="gblank">
</div>
</div>
<div class="iconcontainer">
<div class="iconcontainer">
-
<a class="gbox1 iconbox" href="#">
+
<a class="gbox1 iconbox" href="https://2012.igem.org/Team:Calgary/Project/FRED/Detecting">
<div>
<div>
<img src="https://static.igem.org/mediawiki/2012/0/0a/UCalgary2012_IconFRED1.png"></img>
<img src="https://static.igem.org/mediawiki/2012/0/0a/UCalgary2012_IconFRED1.png"></img>
</div>
</div>
</a>
</a>
-
<a class="gbox2 iconbox" href="#">
+
<a class="gbox2 iconbox" href="https://2012.igem.org/Team:Calgary/Project/FRED/Reporting">
<div>
<div>
<img src="https://static.igem.org/mediawiki/2012/8/8d/UCalgary2012_IconFRED2.png"></img>
<img src="https://static.igem.org/mediawiki/2012/8/8d/UCalgary2012_IconFRED2.png"></img>
</div>
</div>
</a>
</a>
-
<a class="gbox3 iconbox" href="#">
+
<a class="gbox3 iconbox" href="https://2012.igem.org/Team:Calgary/Project/FRED/Modelling">
<div>
<div>
<img src="https://static.igem.org/mediawiki/2012/c/c0/UCalgary2012_IconFRED3.png"></img>
<img src="https://static.igem.org/mediawiki/2012/c/c0/UCalgary2012_IconFRED3.png"></img>
</div>
</div>
</a>
</a>
-
<a class="gbox4 iconbox" href="#">
+
<a class="gbox4 iconbox" href="https://2012.igem.org/Team:Calgary/Project/FRED/Prototype">
<div>
<div>
<img src="https://static.igem.org/mediawiki/2012/a/a7/UCalgary2012_IconFRED4.png"></img>
<img src="https://static.igem.org/mediawiki/2012/a/a7/UCalgary2012_IconFRED4.png"></img>
Line 635: Line 502:
<div class="imgbox">
<div class="imgbox">
<img src="https://static.igem.org/mediawiki/2012/9/94/UCalgary2012_EpicBoxOSCAR_-_Blank.png"></img>
<img src="https://static.igem.org/mediawiki/2012/9/94/UCalgary2012_EpicBoxOSCAR_-_Blank.png"></img>
 +
</div>
 +
 +
<div class="bblank">
</div>
</div>
<div class="iconcontainer">
<div class="iconcontainer">
-
<a class="bbox1 iconbox" href="#">
+
<a class="bbox1 iconbox" href="https://2012.igem.org/Team:Calgary/Project/OSCAR/Decarboxylation">
<div>
<div>
<img src="https://static.igem.org/mediawiki/2012/f/f1/UCalgary2012_IconOSCAR1.png"></img>
<img src="https://static.igem.org/mediawiki/2012/f/f1/UCalgary2012_IconOSCAR1.png"></img>
</div>
</div>
</a>
</a>
-
<a class="bbox2 iconbox" href="#">
+
<a class="bbox2 iconbox" href="https://2012.igem.org/Team:Calgary/Project/OSCAR/Denitrogenation">
<div>
<div>
<img src="https://static.igem.org/mediawiki/2012/1/1c/UCalgary2012_IconOSCAR2.png"></img>
<img src="https://static.igem.org/mediawiki/2012/1/1c/UCalgary2012_IconOSCAR2.png"></img>
</div>
</div>
</a>
</a>
-
<a class="bbox3 iconbox" href="#">
+
<a class="bbox3 iconbox" href="https://2012.igem.org/Team:Calgary/Project/OSCAR/Desulfurization">
<div>
<div>
<img src="https://static.igem.org/mediawiki/2012/9/9b/UCalgary2012_IconOSCAR3.png"></img>
<img src="https://static.igem.org/mediawiki/2012/9/9b/UCalgary2012_IconOSCAR3.png"></img>
</div>
</div>
</a>
</a>
-
<a class="bbox4 iconbox" href="#">
+
<a class="bbox4 iconbox" href="https://2012.igem.org/Team:Calgary/Project/OSCAR/CatecholDegradation">
<div>
<div>
<img src="https://static.igem.org/mediawiki/2012/0/0c/UCalgary2012_IconOSCAR4.png"></img>
<img src="https://static.igem.org/mediawiki/2012/0/0c/UCalgary2012_IconOSCAR4.png"></img>
</div>
</div>
</a>
</a>
-
<a class="bbox5 iconbox" href="#">
+
<a class="bbox5 iconbox" href="https://2012.igem.org/Team:Calgary/Project/OSCAR/Bioreactor">
<div>
<div>
<img src="https://static.igem.org/mediawiki/2012/3/3e/UCalgary2012_IconOSCAR5.png"></img>
<img src="https://static.igem.org/mediawiki/2012/3/3e/UCalgary2012_IconOSCAR5.png"></img>
</div>
</div>
</a>
</a>
-
<a class="bbox6 iconbox" href="#">
+
<a class="bbox6 iconbox" href="https://2012.igem.org/Team:Calgary/Project/OSCAR/FluxAnalysis">
<div>
<div>
<img src="https://static.igem.org/mediawiki/2012/4/40/UCalgary2012_IconOSCAR6.png"></img>
<img src="https://static.igem.org/mediawiki/2012/4/40/UCalgary2012_IconOSCAR6.png"></img>
Line 702: Line 572:
</div>
</div>
<div class="obox6">
<div class="obox6">
-
<h2>Community</h2>
+
<h2>Community Outreach</h2>
<p>iGEM Calgary partnered with a number of different associations to engage the general public about science and synthetic biology. Click here to see what we've done this summer!</p>
<p>iGEM Calgary partnered with a number of different associations to engage the general public about science and synthetic biology. Click here to see what we've done this summer!</p>
</div>
</div>
Line 757: Line 627:
<div id="threeboxes">
<div id="threeboxes">
-
<a id="greybox1" href="#">
+
<a id="greybox1" href="https://2012.igem.org/Team:Calgary/Team">
<div>
<div>
 +
<img src="https://static.igem.org/mediawiki/2012/b/b8/UCalgary2012_ThreeBoxTeam.png"></img>
<h2>Team</h2>
<h2>Team</h2>
<p>Who are we? What did we do? Where is this Calgary place, anyway? Click here to read our team profiles!</p>
<p>Who are we? What did we do? Where is this Calgary place, anyway? Click here to read our team profiles!</p>
</div>
</div>
</a>
</a>
-
<a id="greybox2" href="#">
+
<a id="greybox2" href="https://2012.igem.org/Team:Calgary/Project/DataPage">
<div>
<div>
 +
<img src="https://static.igem.org/mediawiki/2012/9/92/UCalgary2012_ThreeBoxData.png"></img>
<h2>Data Page</h2>
<h2>Data Page</h2>
<p>Click here to see a summary of all our data collected so far! Details on FRED and OSCAR can be found above.</p>
<p>Click here to see a summary of all our data collected so far! Details on FRED and OSCAR can be found above.</p>
</div>
</div>
</a>
</a>
-
<a id="greybox3" href="#">
+
<a id="greybox3" href="https://2012.igem.org/Team:Calgary/Notebook">
<div>
<div>
 +
<img src="https://static.igem.org/mediawiki/2012/1/1b/UCalgary2012_ThreeBoxNotebook.png"></img>
<h2>Notebook</h2>
<h2>Notebook</h2>
<p>Here is a record of our summer's work. We also want to thank everybody who helped us along the way!</p>
<p>Here is a record of our summer's work. We also want to thank everybody who helped us along the way!</p>
Line 779: Line 652:
<div id="sponsorsbox">
<div id="sponsorsbox">
<h2>Thanks to Our Sponsors!</h2>
<h2>Thanks to Our Sponsors!</h2>
-
+
<table>
 +
<tr>
 +
<td><img style="width: 284px;" src="https://static.igem.org/mediawiki/2012/d/d6/UCalgary2012_Logo_O%27Brien_Centre.png"></img></td>
 +
<td><img style="width: 166px;" src="https://static.igem.org/mediawiki/2012/4/46/UCalgary2012_Logo_U_of_C_Vertical.png"></img></td>
 +
<td><img style="width: 234px;" src="https://static.igem.org/mediawiki/2012/7/7f/UCalgary2012_Logo_AITF.png"></img></td>
 +
</tr>
 +
</table>
 +
<table>
 +
<tr>
 +
<td><img style="width: 891px;" src="https://static.igem.org/mediawiki/2012/9/98/UCalgary2012_Logo_OSLI.png"></img></td>
 +
</tr>
 +
</table>
 +
<table>
 +
<tr>
 +
<td><img style="width: 204px;" src="https://static.igem.org/mediawiki/2012/0/04/UCalgary2012_OSRIN.png"></img></td>
 +
<td><img style="width: 290px;" src="https://static.igem.org/mediawiki/2012/a/a4/UCalgary2012_Logo_Eurofins.png"></img></td>
 +
<td><img style="width: 261px;" src="https://static.igem.org/mediawiki/2012/6/6f/UCalgary2012_Logo_Telus_Spark.png"></img></td>
 +
</tr>
 +
<tr>
 +
<td><img style="width: 281px;" src="https://static.igem.org/mediawiki/2012/2/24/UCalgary2012_Logo_NEB.png"></img></td>
 +
<td><img style="width: 228px;" src="https://static.igem.org/mediawiki/2012/1/15/UCalgary2012_Logo_IDT.png"></img></td>
 +
<td><img style="width: 203px;" src="https://static.igem.org/mediawiki/2012/6/68/UCalgary2012_Logo_Genome_Alberta.png"></img></td>
 +
</tr>
 +
<tr>
 +
<td><img style="width: 274px;" src="https://static.igem.org/mediawiki/2012/f/f6/UCalgary2012_Logo_Sarstedt.png"></img></td>
 +
<td><img style="width: 160px;" src="https://static.igem.org/mediawiki/2012/b/be/UCalgary2012_Logo_TeamLab.png"></img></td>
 +
<td><img style="width: 279px;" src="https://static.igem.org/mediawiki/2012/1/11/UCalgary2012_Logo_VWR.png"></img></td>
 +
</tr>
 +
</table>
</div>
</div>
</body>
</body>
</html>
</html>

Latest revision as of 21:51, 29 September 2012

Detect and Destroy: Building FRED and OSCAR

Naphthenic acids (NAs) are a group of recalcitrant carboxylic acid-containing compounds which are byproducts of the bitumen extraction process in the northern Alberta oil sands. These toxic and corrosive compounds are part of the solid and liquid wastes deposited into large holding areas called tailings ponds, which pose a potential environmental and economic concern to Alberta and to other areas. The University of Calgary 2012 iGEM team aims to develop a collection of NA-sensing and degrading organisms for their detection and bioremediation.

FRED and OSCAR are the two projects we are working on this year. Take a look at the description below to learn more!

The Concept

Our project consists of three major components: FRED, OSCAR, and the overarching Human Practices considerations surrounding both of their design. Click on the boxes to your left to learn more about what iGEM Calgary has done so far!

Human Practices

Great consideration was put into our Human Practices component this year, as safety was the guiding principle behind the design of FRED and OSCAR. There are many human outreach initiatives that iGEM Calgary has done this year. Roll over the boxes to see each of them!

Video Game

Play our iGEM Lab Escape video game! Do you have the lab skills necessary to solve the puzzle your professor gave you and escape the lab?

Killswitch

Both FRED and OSCAR are designed to operate within enclosed environments. However, since safety is our highest priority, we decided to design and implement a killswitch in both FRED and OSCAR as an extra layer of security. The killswitch aims to to destroy the genome using two powerful non-specific nucleases in the unlikely scenario bacteria can escape into the environment. Click here to learn more!

Interviews

As an undergraduate team, we looked into speaking with experts in various fields, including the oil industry, tailings pond management, biotechnology, law, and politics to gather various opinions on our project. How useful is synthetic biology in a tailings pond environment? What design considerations should we include in our project to improve security? What legal policies must we consider before implementing our project?

Design Considerations

Since safety is the driving force behind our project, we need to ensure the physical design of our biosensor and bioreactor would be able to contain and manage bacterial cultures without allowing any to escape. We needed to build devices that would ensure the safety of both the user and the outside environment during their use. Click here to learn more!

Safety

Click here for our safety page! Here we detail all the safety procedures, certifications, and approvals we have from our University to allow us to work this summer.

Community Outreach

iGEM Calgary partnered with a number of different associations to engage the general public about science and synthetic biology. Click here to see what we've done this summer!

FRED

FRED is our Functional, Robust Electrochemical Detector. FRED is responsible for detecting and measuring NAs and is able to produce an electrochemical signal that can be measured. FRED can be used to measure tailings pond samples within minutes, without having to ship them to an off-site lab for testing. Click on FRED to learn more!

Detecting NAs

We conducted a transposon search for any regulatory elements that may respond to NAs. Click here to learn more!

Electrochemical Reporting

As a continuation of our 2011 iGEM project, we have designed a replacement for colourmetric assays. Electrochemical reporting can be used to measure miniscule concentrations regardless of how turbid the sample is. Click here to learn more!

Modelling

We conducted some modelling on FRED's predicted output.

Prototyping

We built a prototype biosensor in order to give FRED a home. This biosensor device is capable of performing voltage sweeps that will detect specific compounds. Click here to learn more!

OSCAR

OSCAR is our Optimized System for Carboxylic Acid Remediation. OSCAR is responsible for converting NAs into hydrocarbons. OSCAR is also capable of removing nitrogen and sulfur groups from NA rings to purify the hydrocarbons produced even further. Click here to learn more!

Decarboxylation

In order to convert NAs into hydrocarbons, we need to remove the carboxylic acid groups that make NAs acids. We are using the PetroBrick, from the University of Washington's 2011 iGEM team, to cleave off carboxylic acids to produce hydrocarbons. Click here to learn more!

Denitrogenation

Nitrogen heteroatoms in the ring structures reduce the efficiency of combustion in the final product. OSCAR is able to remove these nitrogen atoms. Click here to see how!

Desulfurization

OSCAR can remove sulfur atoms trapped in the rings of NAs. Click here to see how!

Catechol Degradation

Catechol is a common toxic compound found in tailings ponds. We looked into giving OSCAR the ability to degrade catechol, which would also cleave ring structures of NAs.

Bioreactor

OSCAR needed a home, so we developed an enclosed bioreactor system where NAs can be converted into hydrocarbons for output. Click here to see how we designed the bioreactor!

Flux-Variability Analysis

We wanted to optimize OSCAR's output of hydrocarbons, so we computationally modelled which genes should be regulated in order to maximize hydrocarbon output. Click here to see what we found out!

Thanks to Our Sponsors!

Retrieved from "http://2012.igem.org/Team:Calgary/SandboxMain"