Team:Northwestern

From 2013.igem.org

(Difference between revisions)
(Prototype team page)
 
(284 intermediate revisions not shown)
Line 1: Line 1:
-
<!-- *** What falls between these lines is the Alert Box! You can remove it from your pages once you have read and understood the alert *** -->
+
{{:Team:Northwestern/Templates/Skinning}}
 +
 
 +
<!-- LAST EDITED: 8/21 6:09 PM -->
 +
 
 +
<!-- To-do list (8/21)
 +
    - Get a Gallery
 +
    - Fix the "view source" bar
 +
        - Remove hover css
 +
        - Make plain black/grey text color
 +
        - Remove background color
 +
    - Get linked logos to each sponsor
 +
        - 3 columns grid
 +
 
 +
-->  
<html>
<html>
-
<div id="box" style="width: 700px; margin-left: 137px; padding: 5px; border: 3px solid #000; background-color: #fe2b33;">
+
<style>
-
<div id="template" style="text-align: center; font-weight: bold; font-size: large; color: #f6f6f6; padding: 5px;">
+
 
-
This is a template page. READ THESE INSTRUCTIONS.
+
/* Thanks to Matthew Mombrea for the following code!! Link: http://www.itworld.com/development/354027/how-build-drop-down-menu-css-and-html"*/
 +
#main-nav {width: 850px;height: 50px;background: #C3C3E5; margin:auto; margin-top: 0px; border-radius: 20px}
 +
#main-nav .subnav {
 +
    display: none;
 +
    position: absolute;
 +
    top: 67px;
 +
    left: 0px;
 +
    width: 100%;
 +
    list-style-type: none;
 +
    background: #fff;
 +
    margin: 0;
 +
    border:solid 1px #eeeeee;
 +
    z-index:5;
 +
    padding:0;
 +
}
 +
#main-nav .subnav li {
 +
    display: block;
 +
    border-bottom: solid 1px #eeeeee;
 +
    margin:0;
 +
}
 +
#main-nav .subnav li a {
 +
    color: #333;
 +
    height:18px;
 +
    padding:10px 0;
 +
    font-size:13px;
 +
}
 +
#main-nav .subnav li a:hover {
 +
    background:#f9f9f9;
 +
}
 +
#nav-primary {
 +
    list-style-type: none;
 +
    margin: 0;
 +
    float: left;
 +
    padding:0;
 +
}
 +
#nav-primary li {
 +
    float: left;
 +
    position: relative;
 +
}
 +
#nav-primary li a {
 +
    float: left;
 +
    color: #000;
 +
    text-align: center;
 +
    font-size: 14px;
 +
    height: 48px;
 +
    padding-top: 19px;
 +
    line-height: 16px;
 +
    width: 164px;
 +
    text-decoration:none;
 +
}
 +
#nav-primary li a:hover {
 +
    text-decoration:none;
 +
}
 +
#nav-primary li:hover .subnav {
 +
    display: block;
 +
}
 +
/** END OF HEADER **/
 +
 
 +
body {
 +
margin: 0;
 +
padding: 0;
 +
background: #222;
 +
color: #EEE;
 +
text-align: center;
 +
font: normal 9pt Verdana;
 +
}
 +
a:link, a:visited {
 +
color: #EEE;  
 +
}
 +
img {
 +
border: none;
 +
}
 +
#normal2, #normal3, #normal4, #normal5 {
 +
display: none;
 +
}
 +
#gallery {
 +
margin: 0 auto;
 +
width: 800px;
 +
}
 +
#thumbs {
 +
margin: 10px auto 10px auto;
 +
text-align: center;
 +
width: 800px;
 +
}
 +
#bigimages {
 +
width: 770px;
 +
float: left;
 +
}
 +
#thumbs img {
 +
width: 130px;
 +
height: 130px;
 +
}
 +
#bigimages img {
 +
border: 4px solid #555;
 +
margin-top: 5px;
 +
width: 750px;
 +
}
 +
#thumbs a:link, #thumbs a:visited {
 +
width: 130px;
 +
height: 130px;
 +
border: 6px solid #555;
 +
margin: 6px;
 +
float: left;
 +
}
 +
#thumbs a:hover {
 +
border: 6px solid #888;
 +
}
 +
 
 +
/**END of gallery**/
 +
 
 +
#picture {
 +
        margin: auto;
 +
}
 +
 
 +
#project-description-title {
 +
width: 800px;
 +
margin: auto;
 +
display: block;
 +
font-style: bold;
 +
font-size: 23px;
 +
margin-top: 55px;
 +
        font-family: "Impact";
 +
}
 +
 
 +
#project-description {
 +
width: 850px;
 +
height: 500px;
 +
        margin : auto;
 +
display: block;
 +
font-size: 16px;
 +
      font-family: "Georgia";
 +
      text-align: left;
 +
}
 +
 
 +
.first-row {
 +
width: 100%;
 +
height: 350px;
 +
display: block;
 +
background-color: #C972D0;
 +
margin-bottom: 0px;
 +
        border-radius: 20px;
 +
}
 +
 
 +
#problem {
 +
color: #FFF;
 +
width: 22%;
 +
display: inline-block;
 +
background-color: #C972D0;
 +
height: 270px;
 +
padding-left: 57px;
 +
padding-right: 25px;
 +
vertical-align: middle;
 +
margin:auto;
 +
        font-size: 16px;
 +
        border-radius: 20px
 +
 
 +
 
 +
}
 +
 
 +
#pH {
 +
color: #FFF;
 +
width: 22%;
 +
display: inline-block;
 +
background-color: #C972D0;
 +
vertical-align: middle;
 +
height: 270px;
 +
padding-left: 25px;
 +
padding-right: 25px;
 +
margin: auto;
 +
        font-size: 16px;
 +
 
 +
}
 +
 
 +
#dual-state {
 +
color: #FFF;
 +
width: 22%;
 +
display: inline-block;
 +
background-color: #C972D0;
 +
height: 270px;
 +
padding-left: 25px;
 +
padding-right: 50px;
 +
vertical-align: middle;
 +
margin: auto;
 +
        font-size: 16px;
 +
 
 +
}
 +
 
 +
#first-row-title {
 +
text-align: center;
 +
background-color:#C972D0;
 +
vertical-align: middle;
 +
padding-top: 30px;
 +
text-align: center;
 +
}
 +
 
 +
#first-row-description {
 +
text-align: center;
 +
background-color: #C972D0;
 +
vertical-align: middle;
 +
text-align: center;
 +
}
 +
 
 +
#sponsors {
 +
width: 100%;
 +
height: 500px;
 +
display: block;
 +
background-color: #8AB8E6;
 +
margin: 10px 0px 0px 0px;
 +
border-radius: 20px
 +
}
 +
 +
#thanks {
 +
color: white;
 +
display: inline-block;
 +
text-align: center;
 +
background-color: #8AB8E6;
 +
width: 100%;
 +
font-size: 24px;
 +
        border-radius:20px
 +
border-radius: 20px
 +
}
 +
 
 +
#logos-warning {
 +
color: red;
 +
display: inline-block;
 +
text-align: center;
 +
background-color: #8AB8E6;
 +
width: 100%;
 +
font-size: 20px;
 +
}
 +
 
 +
#companies {
 +
color: white;
 +
display: block;
 +
background-color: #8AB8E6;
 +
width: 100%;
 +
text-align: center;
 +
font-size: 20px;
 +
        border-radius: 20px}
 +
 
 +
p{
 +
text-indent: 40px;}
 +
</style>
 +
 
 +
<script type="text/javascript">
 +
 +
function changeImage(current) {
 +
var imagesNumber = 5;
 +
 +
for (i=1; i<=imagesNumber; i++) {
 +
if (i == current) {
 +
document.getElementById("normal" + current).style.display = "block";
 +
} else {
 +
document.getElementById("normal" + i).style.display = "none";
 +
}
 +
}
 +
}
 +
 +
</script>
 +
 
 +
 
 +
 
 +
</br>
 +
 
 +
<body>
 +
 
 +
<div id="gallery">
 +
<div id="bigimages">
 +
<div id="normal1">
 +
<a href = "https://2013.igem.org/Team:Northwestern/Project"> <img src="https://static.igem.org/mediawiki/2013/c/cc/NorthwesternDual-state-gallery.gif" alt=""/> </a>
 +
</div>
 +
 +
<div id="normal2">
 +
<a href = "https://2013.igem.org/Team:Northwestern/Human_Practice"> <img src="https://static.igem.org/mediawiki/2013/1/1c/NorthwesternHuman-practices-gallery.gif" alt=""/> </a>
 +
</div>
 +
 +
<div id="normal3">
 +
<a href = "https://2013.igem.org/Team:Northwestern/Team"> <img src="https://static.igem.org/mediawiki/2013/8/89/Meet-the-team.gif" alt=""/> </a>
 +
</div>
 +
 +
<div id="normal4">
 +
<img src="https://static.igem.org/mediawiki/2013/3/39/NorthwesternOral-health-gallery.gif" alt=""/>
 +
</div>
 +
 +
<div id="normal5">
 +
<a href = "https://2013.igem.org/Team:Northwestern/methods"> <img src="https://static.igem.org/mediawiki/2013/7/73/NorthwesternMETHODS-GALLERY.gif" alt=""/> </a>
 +
</div>
 +
</div>
 +
 +
<div id="thumbs">
 +
<a href="javascript: changeImage(1);"><img src="https://static.igem.org/mediawiki/2013/e/ef/Dual-state-gallery-small.gif" alt="" /></a>
 +
<a href="javascript: changeImage(2);"><img src="https://static.igem.org/mediawiki/2013/1/13/NorthwesternHuman-practices-gallery-small.gif" alt="" /></a>
 +
<a href="javascript: changeImage(3);"><img src="https://static.igem.org/mediawiki/2013/b/b6/Meet-the-team-small.gif" alt="" /></a>
 +
<a href="javascript: changeImage(4);"><img src="https://static.igem.org/mediawiki/2013/4/4b/Oral-health-gallery-small.gif" alt="" /></a>
 +
<a href="javascript: changeImage(5);"><img src="https://static.igem.org/mediawiki/2013/b/b5/METHODS-GALLERY-small.gif" alt="" /></a>
 +
</div>
 +
</div>
</div>
-
<div id="instructions" style="text-align: center; font-weight: normal; font-size: small; color: #f6f6f6; padding: 5px;">
 
-
You are provided with this team page template with which to start the iGEM season.  You may choose to personalize it to fit your team but keep the same "look." Or you may choose to take your team wiki to a different level and design your own wiki.  You can find some examples <a href="https://2009.igem.org/Help:Template/Examples">HERE</a>.
 
-
</div>
 
-
<div id="warning" style="text-align: center; font-weight: bold; font-size: small; color: #f6f6f6; padding: 5px;">
 
-
You <strong>MUST</strong> have all of the pages listed in the menu below with the names specified. PLEASE keep all of your pages within your teams namespace. 
 
-
</div>
 
-
</div>
 
-
</html>
 
-
<!-- *** End of the alert box *** -->
+
</body>
 +
<p id = "project-description-title"> <!--<font size=1>N</font> <font size=2>N</font> <font size=3>N</font> <font size=4>N</font> <font size=5>N</font>--> NUtralize! </p>
 +
<div id = "project-description">
 +
  <p>  Poor oral health (tooth decay and infection) can lead to many painful symptoms and complicated treatments.  Mouth bacteria are a primary culprit in tooth decay, as lactic acid secreted by natural bacteria in the human mouth decreases pH, leading to cavity formation. The enamel demineralization threshold is known to be around pH 5.5.  The overall vision of our project is to prevent mouth pH from falling below 5.5 by engineering bacteria to sense pH and respond by increasing the alkalinity. To do this, we aimed to create genetic pH sensing elements that would work in the mouth. <p/>
 +
<p>Our project laid the foundation for a dual-state promoter consisting of two promoters in series: a constitutive promoter active at a (tunable) basal level and an upstream, pH-inducible promoter. Previous research has found that the E. coli genes Asr and GadA are highly expressed when pH drops below 5.5. This research drove us to choose the promoter elements for GadA and Asr as our pH-inducible promoters. </p>
 +
<p>We have characterized a new pH-responsive promoter (Asr) as well as an iGEM-characterized promoter (GadA) and a constitutive promoter (Lpp).  Ongoing work will evaluate how promoters in series affect each other and further characterize the dual state phenomenon. Here we used E. coli  for the ease at which it is genetically manipulated to provide proof of principle. Additionally, we tested these promoters with GFP for an easy visual output. Ultimately the aim is to engineer bacteria native to the oral microbiome to sense and respond to drops in pH. We envision that these bacteria will induce enzymes that catalyze reactions to counteract the decrease in pH, preventing the demineralization of the tooth. </p>
-
{|align="justify"
+
</div>
-
|You can write a background of your team here.  Give us a background of your team, the members, etc.  Or tell us more about something of your choosing.
+
-
|[[Image:Northwestern_logo.png|200px|right|frame]]
+
-
|-
+
-
|
+
-
''Tell us more about your project.  Give us background.  Use this as the abstract of your project.  Be descriptive but concise (1-2 paragraphs)''
+
-
|[[Image:Northwestern_team.png|right|frame|Your team picture]]
+
-
|-
+
-
|
+
-
|align="center"|[[Team:Northwestern | Team Northwestern]]
+
-
|}
+
-
<!--- The Mission, Experiments --->
+
<div class = "first-row">
 +
<div id = "problem">
 +
<p id = "first-row-title"> Summary of Problem </p>
 +
                <center> <a href = "https://2013.igem.org/Team:Northwestern/problem"> <img src="https://static.igem.org/mediawiki/2013/thumb/2/2c/Summary-of-problem.gif/600px-Summary-of-problem.gif" width="120" height="120"/> </a></center>
 +
<p id = "first-row-description"> Following meals, the pH within the mouth drops substantially which leads to cavities. </p>
 +
             
 +
</div>
 +
<div id = "pH">
 +
<p id = "first-row-title"> pH </p> 
 +
                <center> <a href = "https://2013.igem.org/Team:Northwestern/detectpH"><img src="https://static.igem.org/mediawiki/2013/thumb/1/1e/Ph-image.gif/120px-Ph-image.gif" width="120" height="120"/></center>
 +
<p id = "first-row-description"> The first step in combating cavities is to create a bacteria that can detect pH. </p>
 +
</div>
 +
<div id = "dual-state">
 +
<p id = "first-row-title"> Dual State Promoter </p>
 +
                <center> <a href = "https://2013.igem.org/Team:Northwestern/dualstate"><img src="https://static.igem.org/mediawiki/2013/thumb/1/14/Dual-state-image.gif/180px-Dual-state-image.gif" width="120" height="120"/></center> </a>
 +
<p id = "first-row-description"> In order for a quick response from basal level, we designed the dual state promoter. </p>
 +
</div>
 +
</div>
-
{| style="color:#1b2c8a;background-color:#0c6;" cellpadding="3" cellspacing="1" border="1" bordercolor="#fff" width="62%" align="center"
+
 
-
!align="center"|[[Team:Northwestern|Home]]
+
 
-
!align="center"|[[Team:Northwestern/Team|Team]]
+
</html>
-
!align="center"|[https://igem.org/Team.cgi?year=2013&team_name=Northwestern Official Team Profile]
+
-
!align="center"|[[Team:Northwestern/Project|Project]]
+
-
!align="center"|[[Team:Northwestern/Parts|Parts Submitted to the Registry]]
+
-
!align="center"|[[Team:Northwestern/Modeling|Modeling]]
+
-
!align="center"|[[Team:Northwestern/Notebook|Notebook]]
+
-
!align="center"|[[Team:Northwestern/Safety|Safety]]
+
-
!align="center"|[[Team:Northwestern/Attributions|Attributions]]
+
-
|}
+

Latest revision as of 04:04, 28 September 2013



NUtralize!

Poor oral health (tooth decay and infection) can lead to many painful symptoms and complicated treatments. Mouth bacteria are a primary culprit in tooth decay, as lactic acid secreted by natural bacteria in the human mouth decreases pH, leading to cavity formation. The enamel demineralization threshold is known to be around pH 5.5. The overall vision of our project is to prevent mouth pH from falling below 5.5 by engineering bacteria to sense pH and respond by increasing the alkalinity. To do this, we aimed to create genetic pH sensing elements that would work in the mouth.

Our project laid the foundation for a dual-state promoter consisting of two promoters in series: a constitutive promoter active at a (tunable) basal level and an upstream, pH-inducible promoter. Previous research has found that the E. coli genes Asr and GadA are highly expressed when pH drops below 5.5. This research drove us to choose the promoter elements for GadA and Asr as our pH-inducible promoters.

We have characterized a new pH-responsive promoter (Asr) as well as an iGEM-characterized promoter (GadA) and a constitutive promoter (Lpp). Ongoing work will evaluate how promoters in series affect each other and further characterize the dual state phenomenon. Here we used E. coli for the ease at which it is genetically manipulated to provide proof of principle. Additionally, we tested these promoters with GFP for an easy visual output. Ultimately the aim is to engineer bacteria native to the oral microbiome to sense and respond to drops in pH. We envision that these bacteria will induce enzymes that catalyze reactions to counteract the decrease in pH, preventing the demineralization of the tooth.

Summary of Problem

Following meals, the pH within the mouth drops substantially which leads to cavities.

Dual State Promoter

In order for a quick response from basal level, we designed the dual state promoter.