Team:IIT Delhi

From 2013.igem.org

(Difference between revisions)
Line 1: Line 1:
<html>
<html>
<head>
<head>
-
 
-
 
   <meta content="text/html; charset=ISO-8859-1"
   <meta content="text/html; charset=ISO-8859-1"
  http-equiv="content-type">
  http-equiv="content-type">
   <title>Navigation-Top</title>
   <title>Navigation-Top</title>
 +
  <style ="text/css">
 +
#contentSub, #search-controls, .firstHeading, #footer-box, #catlinks, #p-logo { display:none;}
 +
#top-section {
 +
border: none;
 +
height: 0px;}
 +
#content {
 +
border: none;}
 +
/* Redesigning the topmenu */ /***************************/ body {
 +
margin: 0px 0 0 0;
 +
padding: 0;}
 +
#content, #globalWrapper {
 +
border: none;
 +
width: 100%;
 +
margin: 0;
 +
padding: 0;}
 +
.centering {
 +
margin: 0 auto;
 +
width: 100%;}
 +
/* Nav Bar */
 +
#wrap {
 +
width: 100%; /* Spans the width of the page */
 +
height: 50px; margin: 0; /* Ensures there is no space between sides of the screen and the menu */
 +
z-index: 99; /* Makes sure that your menu remains on top of other page elements */
 +
position: relative; background-color: #333333;
 +
}
 +
.navbar {
 +
height: 50px;
 +
width: 100%;
 +
padding: 0;
 +
margin: 0;
 +
position: absolute; /* Ensures that the menu doesn&#8217;t affect other elements */
 +
border-right: 1px solid #333333; }
 +
.navbar li {
 +
height: auto;
 +
width: 16.666%; /* Each menu item is 200px wide */
 +
float: left; /* This lines up the menu items horizontally */
 +
text-align: center; /* All text is placed in the center of the box */
 +
list-style: none; /* Removes the default styling (bullets) for the list */
 +
font: normal bold 12px/1.2em Arial, Verdana, Helvetica; padding: 0;
 +
margin: 0;
 +
background-color: #333333;
 +
 +
}
 +
.navbar a { padding: 18px 0; /* Adds a padding on the top and bottom so the text appears centered vertically */
 +
border-left: 1px solid #333333; border-right: 1px solid #333333; text-decoration: none; /* Removes the default hyperlink styling. */
 +
color: white; /* Text color is white */
 +
display: block;
 +
}
 +
#home {background-color:red;}
 +
#home:hover {color:red; background-color: #333333;}
 +
 +
#Project {background-color:orange;}
 +
#Project:hover {color:orange; background-color: #333333;}
 +
#overview {background-color: orange;}
 +
#overview:hover {color:orange; background-color: #333333;}
 +
#motivation {background-color: orange;}
 +
#motivation:hover {color:orange; background-color: #333333;}
 +
#model {background-color: orange;}
 +
#model:hover {color:orange; background-color: #333333;}
 +
#biobricks {background-color: orange;}
 +
#biobricks:hover {color:orange; background-color: #333333;}
 +
 +
#modelling {background-color: yellow;}
 +
#modelling:hover {color:yellow; background-color: #333333;}
 +
 +
#methods {background-color: green;}
 +
#methods:hover {color:green; background-color:#333333;}
 +
#protocol {background-color: green;}
 +
#protocol:hover {color:green; background-color:#333333;}
 +
#notebook {background-color: green;}
 +
#notebook:hover {color:green; background-color: #333333;}
 +
#safety {background-color: green;}
 +
#safety:hover {color:green; background-color:#333333;}
 +
 +
#outreach {background-color: violet;}
 +
#outreach:hover {color:violet; background-color: #333333;}
 +
#orientation {background-color: violet;}
 +
#orientation:hover {color:violet; background-color: #333333;}
 +
#south {background-color: violet;}
 +
#south:hover {color:violet; background-color: #333333;}
 +
#bill {background-color: violet;}
 +
#bill:hover {color:violet; background-color: #333333;}
 +
#biotoilets {background-color: violet;}
 +
#biotoilets:hover {color:violet; background-color: #333333;}
 +
 +
#team {background-color: darkblue;}
 +
#team:hover {color:darkblue; background-color: #333333;}
 +
#student {background-color: darkblue;}
 +
#student:hover {color:darkblue; background-color: #333333;}
 +
#faculty {background-color: darkblue;}
 +
#faculty:hover {color:darkblue; background-color: #333333;}
 +
#attributions {background-color: darkblue;}
 +
#attributions:hover {color:darkblue; background-color: #333333;}
 +
 +
.navbar li ul {
 +
display: none; /* Hides the drop-down menu */
 +
height: auto; margin: 0; /* Aligns drop-down box underneath the menu item */
 +
padding: 0; /* Aligns drop-down box underneath the menu item */ } .navbar li:hover ul {
 +
display: block;
 +
/* Displays the drop-down box when the menu item is hovered over */
 +
 +
}
 +
.navbar li ul li {background-color: #333333; width: 100%;} .navbar li ul li a {
 +
border-left: 1px solid #1f5065; border-right: 1px solid #333333; border-top: 1px solid #333333; border-bottom: 1px solid #333333; width: auto; }
 +
.navbar li ul li a:hover {width: 100%; background-color: #333333;}
 +
/*-----------------------------------------------------Slideshow---------------------------------------------------*/
-
<SCRIPT type="text/javascript">
 
-
<!--
 
 +
<SCRIPT TYPE="text/javascript">
function slide(src,link,text,target,attr) {
function slide(src,link,text,target,attr) {
   // This is the constructor function for the slide object.
   // This is the constructor function for the slide object.
Line 673: Line 776:
     this.display_text();
     this.display_text();
   }
   }
-
}
 
-
//-->
 
-
</SCRIPT>
 
-
 
-
<SCRIPT type="text/javascript">
 
-
<!--
 
SLIDES = new slideshow("SLIDES");
SLIDES = new slideshow("SLIDES");
-
// Create some slides and add custom filters for Microsoft IE
+
s = new slide();
-
SLIDES.add_slide(s = new slide('https://static.igem.org/mediawiki/igem.org/e/e1/Banner-1.jpg'));
+
s.src = "https://static.igem.org/mediawiki/2013/7/7a/Sfgfp-iit-igem.JPG";
-
s.filter = 'progid:DXImageTransform.Microsoft.Pixelate()';
+
//s.link = "pics/pic1-lg.jpg";
 +
//s.text = "Open link in same window";
 +
SLIDES.add_slide(s);
 +
s.src = "https://static.igem.org/mediawiki/igem.org/e/e1/Banner-1.jpg";
 +
SLIDES.add_slide(s);
-
SLIDES.add_slide(s = new slide('https://static.igem.org/mediawiki/igem.org/d/de/IGEM_basic_Logo_stylized.png'));
+
if (document.images)
-
s.filter = 'progid:DXImageTransform.Microsoft.Fade()';
+
{
 +
  SLIDES.set_image(document.images.SLIDESIMG);
 +
  SLIDES.set_textid("SLIDESTEXT"); // optional
 +
  SLIDES.update();
 +
  SLIDES.play(); //optional
 +
}
 +
}
 +
</SCRIPT>
-
SLIDES.add_slide(s = new slide('igem.org/wiki/images/d/de/IGEM_basic_Logo_stylized.png'));
 
-
s.filter = 'progid:DXImageTransform.Microsoft.Barn()';
 
 +
/*----------------------------------------------slideshow----------------------------------------------------------*/
-
//-->
 
-
</SCRIPT>
 
-
  <style ="text/css">
+
/* Slider */
-
#contentSub, #search-controls, .firstHeading, #footer-box, #catlinks, #p-logo { display:none;}
+
#image-slider {
-
#top-section {
+
margin: 10px auto;
-
border: none;
+
width: 600px;
-
height: 0px;}
+
-
#content {
+
-
border: none;}
+
-
/* Redesigning the topmenu */ /***************************/ body {
+
-
margin: 0px 0 0 0;
+
-
padding: 0;}
+
-
#content, #globalWrapper {
+
-
border: none;
+
-
width: 100%;
+
-
margin: 0;
+
-
padding: 0;}
+
-
.centering {
+
-
margin: 0 auto;
+
-
width: 100%;}
+
-
/* Nav Bar */
+
-
#wrap {
+
-
width: 100%; /* Spans the width of the page */
+
-
height: 50px; margin: 0; /* Ensures there is no space between sides of the screen and the menu */
+
-
z-index: 99; /* Makes sure that your menu remains on top of other page elements */
+
-
position: relative; background-color: white;
+
}
}
-
.navbar {
+
#slide-frame {
-
height: 50px;
+
height: 300px;
-
width: 100%;
+
overflow: hidden;
-
padding: 0;
+
-
margin: 0;
+
-
position: absolute; /* Ensures that the menu doesn&#8217;t affect other elements */
+
-
border-right: 0.5px solid white; }
+
-
.navbar li {
+
-
height: auto;
+
-
width: 16.666%; /* Each menu item is 200px wide */
+
-
float: left; /* This lines up the menu items horizontally */
+
-
text-align: center; /* All text is placed in the center of the box */
+
-
list-style: none; /* Removes the default styling (bullets) for the list */
+
-
font: normal bold 13px/1.2em Arial, Verdana, Helvetica; padding: 0;
+
-
margin: 0;
+
-
background-color: white;
+
-
 
+
}
}
-
.navbar a { padding: 18px 0; /* Adds a padding on the top and bottom so the text appears centered vertically */
+
#slides {
-
border-left: 0.5px solid black; border-right: 0.5px solid black; border-top: 0.5px solid black; border-bottom: 0.5px solid black; text-decoration: none; /* Removes the default hyperlink styling. */
+
height: 375px;
-
color: white; /* Text color is white */
+
overflow: hidden;
-
display: block;
+
position: relative;
}
}
-
#home {background-color:red;}
+
#slides img {
-
#home:hover {color:red; background-color: white;}
+
position: absolute;
-
 
+
top: 0;
-
#Project {background-color:orange;}
+
left: 0px;
-
#Project:hover {color:orange; background-color: white;}
+
}
-
#overview {background-color: orange;}
+
#navigation {
-
#overview:hover {color:orange; background-color: white;}
+
margin: 5px 0 0 0;
-
#motivation {background-color: orange;}
+
text-align: center;
-
#motivation:hover {color:orange; background-color: white;}
+
z-index: 10px;
-
#model {background-color: orange;}
+
}
-
#model:hover {color:orange; background-color: white;}
+
#navigation a {
-
#biobricks {background-color: orange;}
+
text-decoration: none;
-
#biobricks:hover {color:orange; background-color: white;}
+
background: #333333;
-
 
+
padding: 2px 6px;
-
#modelling {background-color: #b3b300;}
+
color: #FFFFFF;
-
#modelling:hover {color:#b3b300; background-color: white;}
+
display: inline-block;
-
 
+
}
-
#methods {background-color: green;}
+
#navigation a:hover {
-
#methods:hover {color:green; background-color:white;}
+
background: #0182C4;
-
#protocol {background-color: green;}
+
}
-
#protocol:hover {color:green; background-color: white;}
+
transition: transition-property transition-duration transition-timing-function transition-delay;
-
#notebook {background-color: green;}
+
#slides img {
-
#notebook:hover {color:green; background-color: white;}
+
z-index: 1;
-
#brainstorming {background-color: green;}
+
opacity: 0;
-
#brainstorming:hover {color:green; background-color: white;}
+
/* animation */
-
#safety {background-color: green;}
+
transition: all linear 400ms;
-
#safety:hover {color:green; background-color:white;}
+
-o-transition: all linear 400ms;
-
 
+
-moz-transition: all linear 400ms;
-
#outreach {background-color: violet;}
+
-webkit-transition: all linear 400ms;
-
#outreach:hover {color:violet; background-color: white;}
+
}
-
#orientation {background-color: violet;}
+
#slides img:target {
-
#orientation:hover {color:violet; background-color: white;}
+
left: 0;
-
#south {background-color: violet;}
+
z-index: 5;
-
#south:hover {color:violet; background-color: white;}
+
opacity: 1;
-
#bill {background-color: violet;}
+
-
#bill:hover {color:violet; background-color: white;}
+
-
#biotoilets {background-color: violet;}
+
-
#biotoilets:hover {color:violet; background-color: white;}
+
-
 
+
-
#team {background-color: darkblue;}
+
-
#team:hover {color:darkblue; background-color: white;}
+
-
#student {background-color: darkblue;}
+
-
#student:hover {color:darkblue; background-color: white;}
+
-
#faculty {background-color: darkblue;}
+
-
#faculty:hover {color:darkblue; background-color: white;}
+
-
#attributions {background-color: darkblue;}
+
-
#attributions:hover {color:darkblue; background-color: white;}
+
-
 
+
-
.navbar li ul {
+
-
display: none; /* Hides the drop-down menu */
+
-
height: auto; margin: 0; /* Aligns drop-down box underneath the menu item */
+
-
padding: 0; /* Aligns drop-down box underneath the menu item */ } .navbar li:hover ul {
+
-
display: block;
+
-
/* Displays the drop-down box when the menu item is hovered over */
+
-
 
+
}
}
-
.navbar li ul li {background-color: white; width: 100%;} .navbar li ul li a {
 
-
border-left: 0.5px solid black; border-right: 0.5px solid black; border-top: 0.5px solid black; border-bottom: 0.5px solid black; width: auto; }
 
-
.navbar li ul li a:hover {width: 100%; background-color: white;}
 
-
 
-
 
-
 
   </style>
   </style>
</head>
</head>
-
 
+
<body onLoad="SLIDES.restore_position(); SLIDES.update();"
-
<body onLoad="SLIDES.play();">
+
onUnLoad="SLIDES.save_position()">
-
 
+
-
<P>
+
-
<IMG NAME="SLIDESIMG" SRC="https://static.igem.org/mediawiki/2013/7/7a/Sfgfp-iit-igem.JPG"
+
-
WIDTH="150" HEIGHT="150" BORDER="0" ALT="slideshow image">
+
-
   
+
-
<SCRIPT type="text/javascript">
+
-
<!--
+
-
 
+
-
if (document.images) {
+
-
 
+
-
SLIDES.image = document.images.SLIDESIMG;
+
-
 
+
-
// Create a function to ramp up the image opacity in Mozilla
+
-
var fadein_opacity = 0.04;
+
-
var fadein_img = SLIDES.image;
+
-
function fadein(opacity) {
+
-
  if (typeof opacity != 'undefined') { fadein_opacity = opacity; }
+
-
  if (fadein_opacity < 0.99 && fadein_img && fadein_img.style &&
+
-
      typeof fadein_img.style.MozOpacity != 'undefined') {
+
-
 
+
-
    fadein_opacity += .05;
+
-
    fadein_img.style.MozOpacity = fadein_opacity;
+
-
    setTimeout("fadein()", 50);
+
-
  }
+
-
}
+
-
 
+
-
// Tell the slideshow to call our function whenever the slide is changed
+
-
SLIDES.post_update_hook = function() { fadein(0.04); }
+
-
 
+
-
}
+
-
 
+
-
 
+
-
//-->
+
-
</SCRIPT>
+
-
 
+
-
</P>
+
-
 
+
<table
<table
  style="background-color: white; width: 100%; height: 200px; text-align: left; margin-left: auto; margin-right: auto;"
  style="background-color: white; width: 100%; height: 200px; text-align: left; margin-left: auto; margin-right: auto;"
Line 875: Line 882:
       <li><a href="https://2013.igem.org/Team:IIT_Delhi/Protocol" id="protocol">Protocols</a></li>
       <li><a href="https://2013.igem.org/Team:IIT_Delhi/Protocol" id="protocol">Protocols</a></li>
       <li><a href="https://2013.igem.org/Team:IIT_Delhi/Notebook" id="notebook">Notebook</a></li>
       <li><a href="https://2013.igem.org/Team:IIT_Delhi/Notebook" id="notebook">Notebook</a></li>
-
      <li><a href="https://2013.igem.org/Team:IIT_Delhi/Brainstorming" id="brainstorming">Brainstorming</a></li>
 
       <li><a href="https://2013.igem.org/Team:IIT_Delhi/Safety" id="safety">Safety</a></li>
       <li><a href="https://2013.igem.org/Team:IIT_Delhi/Safety" id="safety">Safety</a></li>
     </ul>
     </ul>
Line 920: Line 926:
  style="vertical-align: top; text-align: center; width: 291px; background-color: white;"></td>
  style="vertical-align: top; text-align: center; width: 291px; background-color: white;"></td>
       <td style="vertical-align: top; text-align: center;">
       <td style="vertical-align: top; text-align: center;">
-
+
      <div id="image-slider">
-
</td>
+
      <div id="slide-frame">
-
      
+
<a href="javascript:SLIDES.hotlink()">
 +
<IMG NAME="SLIDESIMG" SRC="https://static.igem.org/mediawiki/2013/7/7a/Sfgfp-iit-igem.JPG"
 +
WIDTH="150" HEIGHT="150" BORDER="0" ALT="slideshow image">
 +
</a>      
 +
<a href="javascript:SLIDES.hotlink()">
 +
<IMG NAME="SLIDESIMG2" SRC="https://static.igem.org/mediawiki/igem.org/e/e1/Banner-1.jpg"
 +
WIDTH="150" HEIGHT="150" BORDER="0" ALT="slideshow image">
 +
</a>
 +
 
 +
 
 +
</div>
 +
      </div>
 +
      </td>
       <td
       <td
  style="vertical-align: top; text-align: center; width: 294px; background-color: white;"></td>
  style="vertical-align: top; text-align: center; width: 294px; background-color: white;"></td>

Revision as of 16:58, 27 September 2013

Navigation-Top






Project Description

pH induced response elicited by certain promoters in bacteria may have major practical applications. The response can be targeted for specific pH ranges, for example in tracking the anomalies associated with the gut micro-biota or detecting pH inside a bioreactor. There are only limited studies reported in the area. In the present project, a genetic circuit has been created, using the promoters of the acid shock response gene from E.coli and the F0F1 ATPase operon from C. glutamicum that produces a pH dependent colour gradient, much like a universal pH indicator. A mathematical model has been developed to simulate the experimental findings. The present study will form the basis for further research in the field of synthetic biology.





Feel Free to contact us at igemiitdelhi2013 at gmail dot com if you have queries; requests; suggestions et cetera.

Thanks to iGEM and IIT Delhi,
we had an awesome summer!

Our Project was supported by and done by the students

 of IIT Delhi, India.

This project was done as a part of iGEM:
iGEM Main Website