Team:Carnegie Mellon/Notebook

From 2014.igem.org

(Difference between revisions)
 
(3 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 *** -->
+
<html lang="en">
 +
  <head>
 +
 
 +
  <meta charset="utf-8">
 +
    <title>Carousel Template &middot; Bootstrap</title>
 +
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
 +
    <meta name="description" content="">
 +
    <meta name="author" content="">
 +
    <!-- Le styles -->
 +
    <link href="http://getbootstrap.com/2.3.2/assets/css/bootstrap.css" rel="stylesheet">
 +
    <link href="http://getbootstrap.com/2.3.2/assets/css/bootstrap-responsive.css" rel="stylesheet">
 +
    <style>
-
{{CSS/Main}}
+
    /* GLOBAL STYLES
 +
    -------------------------------------------------- */
 +
    /* Padding below the footer and lighter body text */
 +
#contentSub, #search-controls, .firstHeading, #footer-box, #catlinks, #p-logo {
 +
    display:none;
 +
}
-
<html>
+
    body {
 +
      padding-bottom: 40px;
 +
    background: #008AE6;
 +
      color: #5a5a5a;
 +
  font-size: 12px;
 +
    }
-
<!--main content -->
 
-
<table width="70%" align="center">
 
 +
    /* CUSTOMIZE THE NAVBAR
 +
    -------------------------------------------------- */
-
<!--welcome box -->
+
    /* Special class on .container surrounding .navbar, used for positioning it into place. */
-
<tr>
+
    .navbar-wrapper {
-
<td style="border:1px solid black;" colspan="3" align="center" height="150px" bgColor=#FF404B>
+
      position: absolute;
-
<h1 >WELCOME TO iGEM 2014! </h1>
+
      top: 50;
-
<p>Your team has been approved and you are ready to start the iGEM season!
+
      left: 0;
-
<br>On this page you can document your project, introduce your team members, document your progress <br> and share your iGEM experience with the rest of the world! </p>
+
      right: 0;
-
<br>
+
      z-index: 100;
-
<p style="color:#E7E7E7"> <a href="https://2014.igem.org/wiki/index.php?title=Team:Carnegie_Mellon/Notebook&action=edit"style="color:#FFFFFF"> Click here  to edit this page!</a> </p>
+
      margin-top: -70px;
-
</td>
+
      margin-bottom: -90px; /* Negative margin to pull up carousel. 90px is roughly margins and height of navbar. */
-
</tr>
+
    }
 +
    .navbar-wrapper .navbar {
-
<tr> <td colspan="3"  height="5px"> </td></tr>
+
    }
-
<!-- end welcome box -->
+
-
<tr>
+
-
<!--navigation menu -->
+
    /* Remove border and change up box shadow for more contrast */
-
<td align="center" colspan="3">
+
    .navbar .navbar-inner {
 +
width:80%;
 +
      border: 0;
 +
      -webkit-box-shadow: 0 2px 10px rgba(0,0,0,.25);
 +
        -moz-box-shadow: 0 2px 10px rgba(0,0,0,.25);
 +
              box-shadow: 0 2px 10px rgba(0,0,0,.25);
 +
    }
-
<table  width="100%">
+
    /* Downsize the brand/project name a bit */
-
<tr heigth="15px"></tr>
+
    .navbar .brand {
-
<tr heigth="75px">
+
      padding: 14px 20px 16px; /* Increase vertical padding to match navbar links */
 +
      font-size: 16px;
 +
      font-weight: bold;
 +
      text-shadow: 0 -1px 0 rgba(0,0,0,.5);
 +
    }
 +
    /* Navbar links: increase padding for taller navbar */
 +
    .navbar .nav > li > a {
 +
      padding: 15px 20px;
 +
    }
-
<td style="border:1px solid black;" align="center" height ="45px" onMouseOver="this.bgColor='#d3d3d3'" onMouseOut="this.bgColor='#e7e7e7'" bgColor=#e7e7e7> 
+
    /* Offset the responsive button for proper vertical alignment */
-
<a href="https://2014.igem.org/Team:Carnegie_Mellon"style="color:#000000">Home </a> </td>
+
    .navbar .btn-navbar {
 +
      margin-top: 10px;
 +
    }
-
<td style="border:1px solid black;" align="center" height ="45px" onMouseOver="this.bgColor='#d3d3d3'" onMouseOut="this.bgColor='#e7e7e7'" bgColor=#e7e7e7>
 
-
<a href="https://2014.igem.org/Team:Carnegie_Mellon/Team"style="color:#000000"> Team </a> </td>
 
-
<td style="border:1px solid black;" align="center"  height ="45px"  onMouseOver="this.bgColor='#d3d3d3'" onMouseOut="this.bgColor='#e7e7e7'" bgColor=#e7e7e7>
 
-
<a href="https://igem.org/Team.cgi?year=2014&team_name=Carnegie_Mellon"style="color:#000000"> Official Team Profile </a></td>
 
-
<td style="border:1px solid black" align="center"  height ="45px" onMouseOver="this.bgColor='#d3d3d3'" onMouseOut="this.bgColor='#e7e7e7'" bgColor=#e7e7e7> 
 
-
<a href="https://2014.igem.org/Team:Carnegie_Mellon/Project"style="color:#000000"> Project</a></td>
 
-
<td style="border:1px solid black;" align="center"  height ="45px" onMouseOver="this.bgColor='#d3d3d3'" onMouseOut="this.bgColor='#e7e7e7'" bgColor=#e7e7e7>
+
    /* MARKETING CONTENT
-
<a href="https://2014.igem.org/Team:Carnegie_Mellon/Parts"style="color:#000000"> Parts</a></td>
+
    -------------------------------------------------- */
-
<td style="border:1px solid black;" align="center" height ="45px" onMouseOver="this.bgColor='#d3d3d3'" onMouseOut="this.bgColor='#e7e7e7'" bgColor=#e7e7e7>
+
    /* Center align the text within the three columns below the carousel */
-
<a href="https://2014.igem.org/Team:Carnegie_Mellon/Modeling"style="color:#000000"> Modeling</a></td>
+
    .marketing .span4 {
 +
width:25%;
-
<td style="border:1px solid black;" align="center" height ="45px" onMouseOver="this.bgColor='#d3d3d3'" onMouseOut="this.bgColor='#e7e7e7'" bgColor=#e7e7e7> 
+
      text-align: center;
-
<a href="https://2014.igem.org/Team:Carnegie_Mellon/Notebook"style="color:#000000"> Notebook</a></td>
+
    }
 +
    .marketing h2 {
 +
      font-weight: normal;
 +
    }
 +
    .marketing .span4 p {
 +
      margin-left: 10px;
 +
      margin-right: 10px;
 +
    }
-
<td style="border:1px solid black;" align="center"  height ="45px" onMouseOver="this.bgColor='#d3d3d3'" onMouseOut="this.bgColor='#e7e7e7'" bgColor=#e7e7e7>
 
-
<a href="https://2014.igem.org/Team:Carnegie_Mellon/Safety"style=" color:#000000"> Safety </a></td>
 
-
<td style="border:1px solid black;" align="center"  height ="45px" onMouseOver="this.bgColor='#d3d3d3'" onMouseOut="this.bgColor='#e7e7e7'" bgColor=#e7e7e7>
+
    /* Featurettes
-
<a href="https://2014.igem.org/Team:Carnegie_Mellon/Attributions"style="color:#000000"> Attributions </a></td>
+
    ------------------------- */
 +
    .featurette-divider {
 +
width:82%;
-
<td align ="center"> <a href="https://2014.igem.org/Main_Page"> <img src="https://static.igem.org/mediawiki/igem.org/6/60/Igemlogo_300px.png" width="55px"></a> </td>
+
      margin: 80px 0; /* Space out the Bootstrap <hr> more */
-
</tr>
+
    }
-
</table>
+
    .featurette {
 +
width:82%;
 +
      padding-top: 100px; /* Vertically center images part 1: add padding above and below text. */
 +
      overflow: hidden; /* Vertically center images part 2: clear their floats. */
 +
    }
 +
    .featurette-image {
 +
      margin-top: -120px; /* Vertically center images part 3: negative margin up the image the same amount of the padding to center it. */
 +
    }
-
</tr>
+
    /* Give some space on the sides of the floated elements so text doesn't run right into it. */
 +
    .featurette-image.pull-left {
 +
      margin-right: 40px;
 +
    }
 +
    .featurette-image.pull-right {
 +
      margin-left: 40px;
 +
    }
 +
    /* Thin out the marketing headings */
 +
    .featurette-heading {
 +
      font-size: 50px;
 +
      font-weight: 300;
 +
      line-height: 1;
 +
      letter-spacing: -1px;
 +
    }
-
</tr>
 
-
 
 +
    /* RESPONSIVE CSS
 +
    -------------------------------------------------- */
 +
    @media (max-width: 979px) {
-
</td>
+
      .container.navbar-wrapper {
 +
        margin-bottom: 0;
 +
        width: auto;
 +
      }
 +
      .navbar-inner {
 +
        border-radius: 0;
 +
        margin: -20px 0;
 +
      }
-
<tr> <td colspan="3"  height="15px"> </td></tr>
+
      .carousel .item {
-
<tr><td bgColor="#e7e7e7" colspan="3" height="1px"> </tr>
+
        height: 500px;
-
<tr> <td colspan="3"  height="5px"> </td></tr>
+
      }
 +
      .carousel img {
 +
        width: auto;
 +
        height: 500px;
 +
      }
 +
      .featurette {
 +
        height: auto;
 +
        padding: 0;
 +
      }
 +
      .featurette-image.pull-left,
 +
      .featurette-image.pull-right {
 +
        display: block;
 +
        float: none;
 +
        max-width: 20%;
 +
        margin: 0 auto 20px;
 +
      }
 +
    }
-
<!--requirements section -->
 
-
<tr><td colspan="3"> <h3>Notebook</h3></td></tr>
 
-
</tr>
 
 +
    @media (max-width: 767px) {
-
<tr>
+
      .navbar-inner {
-
<td width="45%"  valign="top">
+
        margin: -20px;
-
<p>You should make use of the calendar feature on the wiki and start a lab notebook. This may be looked at by the judges to see how your work progressed throughout the summer. It is a very useful organizational tool as well. </p>
+
      }
-
</td>
+
-
<td></td>
+
      .carousel {
-
<td></td>
+
        margin-left: -20px;
-
</tr>
+
        margin-right: -20px;
 +
      }
 +
      .carousel .container {
 +
      }
 +
      .carousel .item {
 +
        height: 300px;
 +
      }
 +
      .carousel img {
 +
        height: 300px;
 +
      }
 +
      .carousel-caption {
 +
        width: 65%;
 +
        padding: 0 70px;
 +
        margin-top: 100px;
 +
      }
 +
      .carousel-caption h1 {
 +
        font-size: 30px;
 +
      }
 +
      .carousel-caption .lead,
 +
      .carousel-caption .btn {
 +
        font-size: 18px;
 +
      }
-
</table>
+
      .marketing .span4 + .span4 {
-
</html>
+
        margin-top: 40px;
 +
      }
-
{{#calendar: title=STREAM |year=2014 | month=06}}
+
      .featurette-heading {
 +
        font-size: 30px;
 +
      }
 +
      .featurette .lead {
 +
        font-size: 18px;
 +
        line-height: 1.5;
 +
      }
 +
 
 +
    }
 +
    </style>
 +
 
 +
    <!-- HTML5 shim, for IE6-8 support of HTML5 elements -->
 +
    <!--[if lt IE 9]>
 +
      <script src="../assets/js/html5shiv.js"></script>
 +
    <![endif]-->
 +
 
 +
    <!-- Fav and touch icons -->
 +
    <link rel="apple-touch-icon-precomposed" sizes="144x144" href="../assets/ico/apple-touch-icon-144-precomposed.png">
 +
    <link rel="apple-touch-icon-precomposed" sizes="114x114" href="../assets/ico/apple-touch-icon-114-precomposed.png">
 +
      <link rel="apple-touch-icon-precomposed" sizes="72x72" href="../assets/ico/apple-touch-icon-72-precomposed.png">
 +
                    <link rel="apple-touch-icon-precomposed" href="../assets/ico/apple-touch-icon-57-precomposed.png">
 +
                                  <link rel="shortcut icon" href="../assets/ico/favicon.png">
 +
  </head>
 +
 
 +
  <body>
 +
 
 +
 
 +
 
 +
    <!-- NAVBAR
 +
    ================================================== -->
 +
    <div class="navbar-wrapper">
 +
      <!-- Wrap the .navbar in .container to center it within the absolutely positioned parent. -->
 +
      <div class="container">
 +
 
 +
        <div class="navbar navbar-inverse">
 +
          <div class="navbar-inner">
 +
            <!-- Responsive Navbar Part 1: Button for triggering responsive navbar (not covered in tutorial). Include responsive CSS to utilize. -->
 +
            <button type="button" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
 +
              <span class="icon-bar"></span>
 +
              <span class="icon-bar"></span>
 +
            </button>
 +
            <!-- Responsive Navbar Part 2: Place all navbar contents you want collapsed withing .navbar-collapse.collapse. -->
 +
            <div class="nav-collapse collapse">
 +
              <ul class="nav">
 +
                <li class="active"><a href="https://2014.igem.org/Team:Carnegie_Mellon">Home</a></li>
 +
<li class="dropdown">
 +
                  <a href="#" class="dropdown-toggle" data-toggle="dropdown">Our Project <b class="caret"></b></a>
 +
                  <ul class="dropdown-menu">
 +
                    <li><a href="https://2014.igem.org/Team:Carnegie_Mellon/Project_Description">Project Description</a></li>
 +
                    <li><a href="https://2014.igem.org/Team:Carnegie_Mellon/Our_Sensor">Our Sensor</a></li>
 +
                    <li><a href="https://2014.igem.org/Team:Carnegie_Mellon/Collaborations">Collaborations</a></li>
 +
                    <li><a href="https://2014.igem.org/Team:Carnegie_Mellon/Achievements">Achievements</a></li>
 +
                    <li><a href="https://2014.igem.org/Team:Carnegie_Mellon/Future_Plans">Future Plans</a></li>
 +
                  </ul>
 +
                </li>                <li class="dropdown">
 +
                  <a href="#" class="dropdown-toggle" data-toggle="dropdown">Team <b class="caret"></b></a>
 +
                  <ul class="dropdown-menu">
 +
                    <li><a href="https://2014.igem.org/Team:Carnegie_Mellon/Bios">Bios</a></li>
 +
                    <li><a href="https://2014.igem.org/Team:Carnegie_Mellon/Advisors">Advisors</a></li>
 +
                    <li><a href="https://2014.igem.org/Team:Carnegie_Mellon/Attributions">Attributions</a></li>
 +
                    <li><a href="https://2014.igem.org/Team:Carnegie_Mellon/Sponsors">Sponsors</a></li>
 +
                    <li><a href="https://2014.igem.org/Team:Carnegie_Mellon/Gallery">Gallery</a></li>
 +
                  </ul>
 +
                </li>
 +
<li class="dropdown">
 +
                  <a href="#" class="dropdown-toggle" data-toggle="dropdown">Outreach <b class="caret"></b></a>
 +
                  <ul class="dropdown-menu">
 +
                    <li><a href="https://2014.igem.org/Team:Carnegie_Mellon/DNA_Extraction">DNA Extraction</a></li>
 +
                    <li><a href="https://2014.igem.org/Team:Carnegie_Mellon/Creature_Feature">Creature Feature</a></li>
 +
                  </ul>
 +
                </li>
 +
<li class="dropdown">
 +
                  <a href="#" class="dropdown-toggle" data-toggle="dropdown">Lab Work <b class="caret"></b></a>
 +
                  <ul class="dropdown-menu">
 +
                    <li><a href="https://2014.igem.org/Team:Carnegie_Mellon/Notebook">Notebook</a></li>
 +
                    <li><a href="https://2014.igem.org/Team:Carnegie_Mellon/InterLab">Inter Lab Study</a></li>
 +
                    <li><a href="https://2014.igem.org/Team:Carnegie_Mellon/Protein">Fluorescent Protein Evaluation</a></li>
 +
                    <li><a href="https://2014.igem.org/Team:Carnegie_Mellon/Superoxide">Superoxide Generator Improvement</a></li>
 +
                    <li><a href="https://2014.igem.org/Team:Carnegie_Mellon/Sensor">Sensor</a></li>
 +
                  </ul>
 +
                </li>
 +
<li class="dropdown">
 +
                  <a href="#" class="dropdown-toggle" data-toggle="dropdown">Modeling <b class="caret"></b></a>
 +
                  <ul class="dropdown-menu">
 +
                    <li><a href="https://2014.igem.org/Team:Carnegie_Mellon/SensorModel">Sensor</a></li>
 +
                    <li><a href="https://2014.igem.org/Team:Carnegie_Mellon/Fish">Fish Populations</a></li>
 +
                  </ul>
 +
                </li>
 +
              </ul>
 +
            </div><!--/.nav-collapse -->
 +
          </div><!-- /.navbar-inner -->
 +
        </div><!-- /.navbar -->
 +
 
 +
      </div> <!-- /.container -->
 +
    </div><!-- /.navbar-wrapper -->
 +
 
 +
 
 +
 
 +
 
 +
 
 +
 
 +
 
 +
 
 +
<h1> S.T.R.E.A.M. </h1>
 +
<h2> Sensor That Reports Endocrine Activating Molecules </h2>
 +
<p> Hormones are molecules that allow cells to communicate with each other and are used by organisms to alter growth and metabolism. The steroid hormones such as estrogen can diffuse across the plasma membrane, bind their receptor in the cytoplasm, migrate to the nucleus and act as transcription factors to alter cell’s physiology and behavior. Naturally occurring steroid hormones include estrogen, progesterone, testosterone and cortisol. 
 +
<br>
 +
<br>
 +
Detection of hormones in the environment has raised concerns in recent years because of their potential to affect both humans and wildlife. Estrogens from natural, synthetic, plant, and fungal sources can manifest endocrine disrupting properties and even at low concentrations can have harmful effects due to receptor activation. Estrogenic activity can occur in water sources including waste, drinking and freshwater. In freshwater, estrogens are harmful to the ecosystems, feminizing fish and disrupting the overall populations of organisms in the ecosystem. Estrogenic substances can also be present in what we drink, however since the presence of hormones in water is a relatively new area of study, there have been no previous restrictions or regulations regarding filtration of estrogenic compounds. 
 +
<br>
 +
<br>
 +
Due to concern with the compounds in water, we are developing a sensor to detect the molecules in water that will bind to the estrogen receptor. We anticipate that our STREAM, Sensor That Reports Endocrine Activating Molecules, will be sensitive and informative of water quality. A BioNetGen model of the sensor and NetLogo model of fish populations were constructed to improve our understanding of these systems.
 +
</p>
 +
 +
 
 +
     
 +
 
 +
 
 +
 
 +
 
 +
 
 +
 
 +
    <!-- Le javascript
 +
    ================================================== -->
 +
    <!-- Placed at the end of the document so the pages load faster -->
 +
    <script src="http://getbootstrap.com/2.3.2/assets/js/jquery.js"></script>
 +
    <script src="http://getbootstrap.com/2.3.2/assets/js/bootstrap-transition.js"></script>
 +
    <script src="http://getbootstrap.com/2.3.2/assets/js/bootstrap-alert.js"></script>
 +
    <script src="http://getbootstrap.com/2.3.2/assets/js/bootstrap-modal.js"></script>
 +
    <script src="http://getbootstrap.com/2.3.2/assets/js/bootstrap-dropdown.js"></script>
 +
    <script src="http://getbootstrap.com/2.3.2/assets/js/bootstrap-scrollspy.js"></script>
 +
    <script src="http://getbootstrap.com/2.3.2/assets/js/bootstrap-tab.js"></script>
 +
    <script src="http://getbootstrap.com/2.3.2/assets/js/bootstrap-tooltip.js"></script>
 +
    <script src="http://getbootstrap.com/2.3.2/assets/js/bootstrap-popover.js"></script>
 +
    <script src="http://getbootstrap.com/2.3.2/assets/js/bootstrap-button.js"></script>
 +
    <script src="http://getbootstrap.com/2.3.2/assets/js/bootstrap-collapse.js"></script>
 +
    <script src="http://getbootstrap.com/2.3.2/assets/js/bootstrap-carousel.js"></script>
 +
    <script src="http://getbootstrap.com/2.3.2/assets/js/bootstrap-typeahead.js"></script>
 +
    <script>
 +
      !function ($) {
 +
        $(function(){
 +
          // carousel demo
 +
          $('#myCarousel').carousel()
 +
        })
 +
      }(window.jQuery)
 +
    </script>
 +
    <script src="http://getbootstrap.com/2.3.2/assets/js/holder/holder.js"></script>
 +
  </body>
 +
</html>

Latest revision as of 17:43, 12 September 2014

Carousel Template · Bootstrap

S.T.R.E.A.M.

Sensor That Reports Endocrine Activating Molecules

Hormones are molecules that allow cells to communicate with each other and are used by organisms to alter growth and metabolism. The steroid hormones such as estrogen can diffuse across the plasma membrane, bind their receptor in the cytoplasm, migrate to the nucleus and act as transcription factors to alter cell’s physiology and behavior. Naturally occurring steroid hormones include estrogen, progesterone, testosterone and cortisol. 

Detection of hormones in the environment has raised concerns in recent years because of their potential to affect both humans and wildlife. Estrogens from natural, synthetic, plant, and fungal sources can manifest endocrine disrupting properties and even at low concentrations can have harmful effects due to receptor activation. Estrogenic activity can occur in water sources including waste, drinking and freshwater. In freshwater, estrogens are harmful to the ecosystems, feminizing fish and disrupting the overall populations of organisms in the ecosystem. Estrogenic substances can also be present in what we drink, however since the presence of hormones in water is a relatively new area of study, there have been no previous restrictions or regulations regarding filtration of estrogenic compounds. 

Due to concern with the compounds in water, we are developing a sensor to detect the molecules in water that will bind to the estrogen receptor. We anticipate that our STREAM, Sensor That Reports Endocrine Activating Molecules, will be sensitive and informative of water quality. A BioNetGen model of the sensor and NetLogo model of fish populations were constructed to improve our understanding of these systems.

Retrieved from "http://2014.igem.org/Team:Carnegie_Mellon/Notebook"