Difference between revisions of "Template:Team:William and Mary/HEADER3"

 
(42 intermediate revisions by 2 users not shown)
Line 1: Line 1:
−
<!---- adapted from 2016 Sydney Australia iGEM------->
 
  
 +
<html lang="en">
 +
<cfheader name="X-XSS-Protection" value="1">
 +
    <head>
 +
        <meta charset="utf-8" />
 +
<link rel="icon" type="image/png" href="https://static.igem.org/mediawiki/2015/e/ea/WMFavicon.png">
  
 +
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
 +
        <title>NOISE - W&M iGEM</title>
 +
        <meta content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0' name='viewport' />
 +
        <link href="https://2015.igem.org/Team:William_and_Mary/bootstrap?action=raw&amp;ctype=text/css" rel="stylesheet" type="text/css"/>
  
−
<html>
+
        <link href="https://2015.igem.org/Team:William_and_Mary/rubick?action=raw&amp;ctype=text/css" rel="stylesheet" type="text/css"/>
 +
        <link href="https://2015.igem.org/Team:William_and_Mary/demo?action=raw&amp;ctype=text/css" rel="stylesheet" type="text/css"/>
 +
        <link rel="stylesheet" type="text/css" href="https://2015.igem.org/Template:William_and_Mary/jquerybxsliderCSS?action=raw&ctype=text/css" />
  
−
<head>
+
        <!--    Fonts and icons    -->
 +
        <link href="http://maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet" type="text/css"/>
 +
        <link href='http://fonts.googleapis.com/css?family=Droid+Serif:400,700' rel='stylesheet' type='text/css'>
 +
        <link href="https://2015.igem.org/Team:William_and_Mary/pe-icon-7-stroke?action=raw&amp;ctype=text/css" rel="stylesheet" type="text/css"/>
 +
        <link href="https://2015.igem.org/Team:William_and_Mary/Rubik-Fonts?action=raw&amp;ctype=text/css" rel="stylesheet" type="text/css"/>
 +
       
 +
<!-- the wiki settings in the section immediately below are from UC San Diego 2015 -->
 +
        <style type="text/css">
 +
/* WIKI SETTINGS*/
 +
 +
/* Hide first heading */
 +
.firstHeading {
 +
display: none;
 +
}
 +
/* Visited hyperlinks */
 +
                        a:visited{
 +
                                color: #393d31;
 +
                        }
  
−
+
/*-- Remove borders, float content left and remove padding/margin */
 +
#globalWrapper, #content{
 +
background-color: transparent;
 +
border: none;
 +
float: center;
 +
                                width: 101%;
 +
margin-left: -3px;
 +
margin-top: -8px;
 +
padding: auto;
 +
}
  
−
  <!-- External scripts -->
+
/*left align Black Menu Bar */
−
<link href='http://fonts.googleapis.com/css?family=Open+Sans:400,600'
+
#top_menu_inside {  
−
rel='stylesheet' type='text/css'>
+
margin-left: 0px;  
−
  <script src="http://code.jquery.com/jquery-2.1.0.min.js"></script>
+
}
−
  <link href='http://fonts.googleapis.com/css?family=Yanone+Kaffeesatz:400,300,700' rel='stylesheet' type='text/css'>
+
.centerImage
−
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
+
−
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
+
−
 
+
−
  <!-- Functionallity and behaviour JS -->
+
−
  <script>
+
−
 
+
−
    $(document).ready(function(){
+
−
 
+
−
      //Loading screen functionallity
+
−
      $('.loading').animate(
+
−
          {opacity:0},
+
−
          500,
+
−
          function(){
+
−
            $('.loading').attr("style", "display:none");
+
−
          }
+
−
      );
+
−
 
+
−
      //Height responsiveness
+
−
      $(window).resize(function() {
+
−
          wheight = $(window).height();
+
−
          $('.container').attr("style","height:"+(wheight)+"px;background-size:cover;");
+
−
          $('.team-member-container').attr("style","height:"+wheight/2.7+"px;");
+
−
      });
+
−
 
+
−
      $(window).trigger('resize');
+
−
 
+
−
      //Menu moveto container on item click functionallity
+
−
      $('.menu-item').on('click', function(){
+
−
          $('.menu-item').removeClass('subselected');
+
−
          $(this).addClass('subselected');
+
−
          if($(this).attr("data")=="#top"){
+
−
              $('html, body').animate({
+
−
                  scrollTop: 0
+
−
              }, 1000);
+
−
          }else{
+
−
              $('html, body').animate({
+
−
                  scrollTop: $($(this).attr("data")).offset().top-70
+
−
              }, 1000);
+
−
          }
+
−
      });
+
−
 
+
−
      //Hover of team members
+
−
      $('.team-member-container').on('mouseenter', function(){
+
−
        $(this).children('.team-member-photo').attr("style", "background-image:url('"+$(this).attr("hover")+"');");
+
−
        $(this).on('mouseleave', function(){
+
−
          $(this).children('.team-member-photo').attr('style', "background-image:url('"+$(this).attr("data")+"');");
+
−
        });
+
−
      });
+
−
 
+
−
    });
+
−
   
+
−
  </script>
+
−
 
+
−
  <style>
+
−
 
+
−
 
+
−
#sideMenu, #top_title {display:none;}
+
−
#content { padding:0px; width:90%; margin-top:-7px; margin-left:5%;, margin-right: 5%}
+
−
body {background-color:white; }
+
−
#bodyContent h1, #bodyContent h2, #bodyContent h3, #bodyContent h4, #bodyContent h5 { margin-bottom: 0px; }
+
−
 
+
−
 
+
−
    body,
+
−
    html{
+
−
      margin: 0;
+
−
      padding:0;
+
−
      font-family: font-family: 'Yanone Kaffeesatz', sans-serif;
+
−
    }
+
−
 
+
−
    /* REMOVE UNWANTED ELEMENTS AND STYLE OTHERS */
+
−
    .firstHeading{
+
−
      display:none;
+
−
    }
+
−
    #top-section{
+
−
      background:#48af5d;
+
−
      margin-left:0 !important;
+
−
      width:100%;
+
−
      left:0;
+
−
    }
+
−
 
+
−
 
+
−
    /* LOADING SCREEN */
+
−
    .loading{
+
−
      position:fixed;
+
−
      width:100%;
+
−
      height:100%;
+
−
      top:0;
+
−
      left:0;
+
−
 
+
−
      z-index:5;
+
−
 
+
−
      background-color:#555;
+
−
      color:#fff;
+
−
      text-align: center;
+
−
    }
+
−
    .loading p{
+
−
      position: relative;
+
−
      width:100%;
+
−
      height:10%;
+
−
      top:45%;
+
−
      left:0;
+
−
    }
+
−
 
+
−
    /* MENU STYLING */
+
−
    .menu{
+
−
      position:fixed;
+
−
      width:100%;
+
−
      height:56px;
+
−
      top:14px;
+
−
      background-color: #47a3da;
+
−
 
+
−
      z-index:4;
+
−
 
+
−
      border-collapse: collapse;
+
−
      text-align:center;
+
−
    }
+
−
    .menu tr td{
+
−
      text-align: center;
+
−
      vertical-align: middle;
+
−
 
+
−
      font-weight: 700;
+
−
      font-size:16px;
+
−
      color:#fff;
+
−
      width:7%;
+
−
    }
+
−
    .menu tr td.menu-item:hover{
+
−
      background-color:#258ecd;
+
−
      cursor: pointer;
+
−
    }
+
−
    .subselected{
+
−
      background-color: #258ecd;
+
−
    }
+
−
 
+
−
    /* CONTAINERS STYLING */
+
−
    .container{
+
−
      position:relative;
+
−
      width:100%;
+
−
      top:50px;
+
−
    }
+
−
    .container .subcontainer{
+
−
      position:absolute;
+
−
      width:95%;
+
−
      height:90%;
+
−
      top:5%;
+
−
      left:2.5%;
+
−
    }
+
−
    #top{
+
−
      background-size: cover;
+
−
   
+
−
      overflow:hidden;
+
−
    }
+
−
 
+
−
    /* TEAM MEMBERS CARDS STYLING */
+
−
    .team-member-container{
+
−
      position:relative;
+
−
      width:14%;
+
−
      margin-left:2.28%;
+
−
 
+
−
      float:left;
+
−
    }
+
−
    .team-member-container:hover{
+
−
      cursor:pointer;
+
−
    }
+
−
    .row2{
+
−
      top:4%;
+
−
    }
+
−
    .team-member-container .team-member-photo{
+
−
      position:relative;
+
−
      width:100%;
+
−
      height:85%;
+
−
      top:0;
+
−
      left:0;
+
−
      background-size: cover;
+
−
    }
+
−
    .team-member-container .team-member-footer{
+
−
      position:relative;
+
−
      width:100%;
+
−
      height:15%;
+
−
      top:0;
+
−
      left:0;
+
−
 
+
−
      border:none;
+
−
      border-collapse: collapse;
+
−
      background-color: #47a3da;
+
−
      color:#fff;
+
−
 
+
−
      text-align: center;
+
−
      vertical-align: middle;
+
−
    }
+
−
 
+
−
body {
+
−
    padding-top: 110px;
+
−
}
+
−
 
+
−
.center-block {
+
−
  display: block;
+
−
  margin-left: auto;
+
−
  margin-right: auto;
+
−
}
+
−
 
+
−
 
+
−
.navbar-fixed-top {
+
−
background: #fff;
+
−
filter: none !important;
+
−
box-shadow: 0 2px 15px rgba(0,0,0,0.25);
+
−
-moz-box-shadow: 0 2px 15px rgba(0,0,0,0.25);
+
−
-webkit-box-shadow: 0 2px 15px rgba(0,0,0,0.25);
+
−
        border-bottom: 1px solid rgba(0,0,0,0.2);
+
−
 
+
−
}
+
−
 
+
−
 
+
−
.dropdown-submenu {
+
−
    position: relative;
+
−
}
+
−
 
+
−
.dropdown-submenu>.dropdown-menu {
+
−
    top: 0;
+
−
    left: 100%;
+
−
    margin-top: -6px;
+
−
    margin-left: -1px;
+
−
    -webkit-border-radius: 0 6px 6px 6px;
+
−
    -moz-border-radius: 0 6px 6px;
+
−
    border-radius: 0 6px 6px 6px;
+
−
}
+
−
 
+
−
.dropdown-submenu:hover>.dropdown-menu {
+
−
    display: block;
+
−
}
+
−
 
+
−
.dropdown-submenu>a:after {
+
−
    display: block;
+
−
    content: " ";
+
−
    float: right;
+
−
    width: 0;
+
−
    height: 0;
+
−
    border-color: transparent;
+
−
    border-style: solid;
+
−
    border-width: 5px 0 5px 5px;
+
−
    border-left-color: #ccc;
+
−
    margin-top: 5px;
+
−
    margin-right: -10px;
+
−
}
+
−
 
+
−
.dropdown-submenu:hover>a:after {
+
−
    border-left-color: #fff;
+
−
}
+
−
 
+
−
.dropdown-submenu.pull-left {
+
−
    float: none;
+
−
}
+
−
 
+
−
.dropdown-submenu.pull-left>.dropdown-menu {
+
−
    left: -100%;
+
−
    margin-left: 10px;
+
−
    -webkit-border-radius: 6px 0 6px 6px;
+
−
    -moz-border-radius: 6px 0 6px 6px;
+
−
    border-radius: 6px 0 6px 6px;
+
−
 
+
−
 
+
−
 
+
−
.faceBot{
+
−
  background: #202020;
+
−
}
+
−
 
+
−
@font-face {
+
−
  font-family: 'Open Sans', Arial;;
+
−
}
+
−
 
+
−
body
+
 
{
 
{
−
    font-family: 'Open Sans', Arial;
+
text-align:center;
 +
display:block;
 
}
 
}
−
 
+
.wraptocenter {
−
ul.nav a{
+
   display: table-cell;
−
   color: gray;
+
   text-align: center;
−
   background-color: transparent;
+
  vertical-align: middle;
−
   height: 100%;
+
  width: 200px;
−
   position: relative;
+
   height: 200px;
 +
   background-color: #999;
 
}
 
}
−
 
+
.wraptocenter * {
−
ul.nav a:hover{
+
   vertical-align: middle;
−
   color: gray;
+
−
  background-color: transparent;
+
−
  height: 100%;
+
−
  position: relative;
+
 
}
 
}
−
 
−
h2 {
 
−
  color:green;
 
−
}
 
−
 
−
h4 {
 
−
    font-weight: bold;
 
−
}
 
−
 
−
.menu-item{
 
−
  height: 75px;
 
−
}
 
−
 
−
li.menu-item{
 
−
  background: transparent !important;
 
−
}
 
−
 
−
 
−
 
−
.green-effect{
 
−
  display: none;
 
−
  background-color: #4AAF51;
 
−
  opacity: 1;
 
−
  color: #FFF;
 
−
  transition-property: all;
 
−
  transition-duration: 0.3s;
 
−
  transition-timing-function: ease-out;
 
−
  transition-delay: 0s;
 
−
  border-color: #288D30;
 
−
  position: absolute;
 
−
  bottom: 0px;
 
−
  width: 100%;
 
−
  height: 2px;
 
−
  right: 0px;
 
−
}
 
−
 
−
.logo {
 
−
margin-top: 100px;
 
−
 
−
}
 
−
 
−
a:hover .green-effect{
 
−
  display: inherit;
 
−
}
 
−
 
−
.invertir:hover {
 
−
  -webkit-filter: invert(100%);
 
−
}
 
−
 
−
dropdown-toggle {
 
−
width: 10%;
 
−
 
−
 
−
 
 
−
}
 
−
 
−
 
 
</style>
 
</style>
  
 +
    </head>
 +
    <body class="landing-page">
 +
        <nav class="navbar navbar-default navbar-transparent navbar-fixed-top navbar-burger" role="navigation">
 +
            <!-- if you want to keep the navbar hidden you can add this class to the navbar "navbar-burger"-->
 +
            <div class="container">
 +
                <div class="navbar-header">
 +
                    <button id="menu-toggle" type="button" class="navbar-toggle" data-toggle="collapse" data-target="#example">
 +
                    <span class="sr-only">Toggle navigation</span>
 +
                    <span class="icon-bar bar1"></span>
 +
                    <span class="icon-bar bar2"></span>
 +
                    <span class="icon-bar bar3"></span>
 +
                    </button>
 +
<a href="https://2015.igem.org/Team:William_and_Mary" class="navbar-brand">W&M iGEM 2015</a>
 +
                </div>
 +
                <div class="collapse navbar-collapse">
 +
                    <ul class="nav navbar-nav navbar-right navbar-uppercase">
 +
<p>    </p>
  
−
</head>
+
                        <li>
−
 
+
                            <a href="https://2015.igem.org/Team:William_and_Mary">  
−
<body>
+
                            Home
−
 
+
                            </a>
−
 
+
                        </li>
−
<body>
+
                        <li>
−
 
+
                            <a href="https://2015.igem.org/Team:William_and_Mary/Description">  
−
 
+
                            Project Description
−
<div class="navbar navbar-fixed-top" style="margin-top:15px">
+
                            </a>
−
  <nav class="navbar-inner">
+
                        </li>
−
 
+
                        <li>
−
  <div class="row-sm-height">
+
                            <a href="https://2015.igem.org/Team:William_and_Mary#parts">
−
 
+
                            Parts
−
  <div class="col-sm-2"><a href="https://2017.igem.org/Team:William_and_Mary"><img class="logo" src="https://static.igem.org/mediawiki/2017/f/f4/T--William_and_Mary--WMlogo.jpeg" height="60"  width="auto" ></a></div>
+
                            </a>
 +
                        </li>
 +
                        <li>
 +
                            <a href="https://2015.igem.org/Team:William_and_Mary/Measurement">  
 +
                            Results
 +
                            </a>
 +
                        </li>
 +
                        <li>
 +
                            <a href="https://2015.igem.org/Team:William_and_Mary/Modeling">  
 +
                            Modeling
 +
                            </a>
 +
                        </li>
 +
                        <li>
 +
                            <a href="https://2015.igem.org/Team:William_and_Mary/Interlab">  
 +
                            Interlab Study
 +
                            </a>
 +
                        </li>
 +
                        <li>
 +
                            <a href="https://2015.igem.org/Team:William_and_Mary/Collaborations">  
 +
                            Collaboration
 +
                            </a>
 +
                        </li>
 +
                        <li>
 +
                            <a href="https://2015.igem.org/Team:William_and_Mary/Software">  
 +
                          Software
 +
                            </a>
 +
                        </li>
 +
                        <li>
 +
                            <a href="https://2015.igem.org/Team:William_and_Mary/Practices">
 +
                            Human Practices
 +
                            </a>
 +
                        </li>
 +
                        <li>
 +
                            <a href="https://2015.igem.org/Team:William_and_Mary#ref">
 +
                            References
 +
                            </a>
 +
                        </li>
 +
                        <li>
 +
                            <a href="https://2015.igem.org/Team:William_and_Mary/Medal_Criteria">
 +
                            Medal Criteria
 +
                            </a>
 +
                        </li>
 +
                        <li>
 +
                            <a href="https://2015.igem.org/Team:William_and_Mary/Team">  
 +
                            Team
 +
                            </a>
 +
                        </li>
 +
                    </ul>
 +
                </div>
 +
            </div>
 +
        </nav>
 +
       
 +
       
 +
       
 +
       
 +
       
 +
       
 +
        <div class="wrapper">
 +
       
 +
       
 +
       
 +
            <!--    replace this line with the code generated with the rubik-builder.html              -->
  
 +
                        <div class="section section-header" id="header4">
 +
                            <div id="video-container-4" class="full-image pattern-image filter filter-gradient-black" data-color="gold">
 +
                               
 +
                                <div class="container">
 +
                                    <div class="content">
 +
                                       
 +
                                        <p class="h1WM" style="font-family:WMSlim-Joe">NOISE</p>
  
 +
                                        <h5>Characterization of promoter-driven transcriptional noise in E. coli</h5>
 +
                                    </div>
 +
                                </div>
 +
                            <video class="bgvid" preload="auto" loop="loop" autoplay="false" muted="muted" volume="0"><source src="https://static.igem.org/mediawiki/2015/3/39/WMCYNoise.webm" type="video/webm" responsive-src="https://2015.igem.org/Team:William_and_Mary/rubik_responsive.jpg"><source src="https://static.igem.org/mediawiki/2015/a/a7/WMCYNoise.mp4" type="video/mp4">Video not supported</video></div>
 +
                           
 +
                            <a href="" data-scroll="true" data-id="#projectdesc" class="scroll-arrow hidden-xs hidden-sm">
 +
                                <i class="fa fa-angle-down"></i>
 +
                            </a>
 +
                        </div>
 +
                   
 +
                        <div class="section section-we-are-2" id="projectdesc">
 +
                        <A NAME="whatis">
 +
                            <div class="text-area">
 +
                                <div class="container">
 +
                                    <div class="row">
 +
                                        <div class="col-md-4">
 +
                                            <div class="title">
  
 +
                                                <p class="h2WM">What is noise?</p>
 +
<!--                                                <div class="separator-container">
 +
                                                    <div class="separator line-separator">✻</div>
 +
                                                </div>-->
 +
                                            </div>
 +
                                        </div>
 +
                                        <div class="col-md-7 col-md-offset-1">
 +
                                            <div class="description">
 +
                                                <p>As synthetic biologists continue to construct increasingly complex gene regulatory networks, the need for accurate quantitative characterization of their regulatory components becomes more pressing. Despite the BioBrick registry's thorough characterization of the average strength of promoters, there is insufficient description of the variability in their expression. Our project aims to characterize this variability, or noise, for the most commonly used promoters in synthetic biology and provide additional tools for the regulation of these promoters.
 +
                                                <p><a href="https://2015.igem.org/Team:William_and_Mary/Description">Read more on our Project Description page.</a>
 +
                                                </p>
 +
                                            </div>
 +
                                        </div>
 +
                                    </div>
 +
                                </div>
 +
                            </div>
 +
                            <div class="parallax full-image pattern-image">
 +
                                <img alt="..." class="parallax-img" src="https://static.igem.org/mediawiki/2015/thumb/a/a8/WMlabBench.jpg/800px-WMlabBench.jpg">
 +
                            </div>
 +
                        </div>
 +
                   
  
 +
                   
 +
  <!-- Section "Our Projects" example 1: 2 Columns Full Width -->
 +
                        <div class="section section-we-made-1 section-with-hover" id="parts">
 +
                            <div class="text-area">
 +
                                <div class="title animate">
 +
                                    <p class = "h2WM">Parts</p2>
 +
<div class = "description">                                    <p>In deciding which parts to submit to the iGEM Registry we focused on three main aspects.</p>
 +
<p><i>First:</i> ensuring our project is as reproducible and extensible as possible. To that end we have submitted all of new composite fluorescent protein parts that we constructed during the project.<br> <i>Second:</i> Making genome integration as straightforward as possible for iGEM teams. In order to accomplish this goal we designed, tested, and validated a new integrator cassette that allows simple genome integration using 3A or Gibson Assembly. <br> <i>Third:</i> Increasing the number of tools available for promoter-mediated regulation in synthetic biology. We created and validated an E. coli codon optimized dCas9 variant and a suite of gRNAs to target the most commonly used promoters in iGEM.  </p>
 +
</p></div>
 +
                                </div>
 +
                            </div>
 +
                            <div class="row" id="projectsLine1">
 +
                                <div class="col-md-3">
 +
                                    <div class="project animate">
 +
                                        <img alt="..." src="https://static.igem.org/mediawiki/2015/3/3e/Allparts.jpeg">
 +
                                        <a class="over-area color-black" href="https://2015.igem.org/Team:William_and_Mary/Parts">
 +
                                            <div class="content">
 +
                                                <h5>All Parts</h5>
 +
                                                <p>A categorized list of all parts.</p>
 +
                                            </div>
 +
                                        </a>
 +
                                    </div>
 +
                                </div>
 +
                                <div class="col-md-3">
 +
                                    <div class="project animate">
 +
                                        <img alt="..." src="https://static.igem.org/mediawiki/2015/7/7d/WMcollections.jpeg">
 +
                                        <a class="over-area color-black " href="https://2015.igem.org/Team:William_and_Mary/Part_Collection">
 +
                                            <div class="content">
 +
                                                <h5>Part Collection</h5>
 +
                                                <p>Guide RNAs for iGEMs top promoters. </p>
 +
                                            </div>
 +
                                        </a>
 +
                                    </div>
 +
                                </div>
 +
                                <div class="col-md-3">
 +
                                    <div class="project animate">
 +
                                        <img alt="..." src="https://static.igem.org/mediawiki/2015/7/7d/WMbasic.jpeg">
 +
                                        <a class="over-area color-black " href="https://2015.igem.org/Team:William_and_Mary/Basic_Part">
 +
                                            <div class="content">
 +
                                                <h5>Basic Part</h5>
 +
                                                <p>Targeted repression with dCAS9.</p>
 +
                                            </div>
 +
                                        </a>
 +
                                    </div>
 +
                                </div>
 +
                                <div class="col-md-3">
 +
                                    <div class="project animate">
 +
                                        <img alt="..." src="https://static.igem.org/mediawiki/2015/f/f4/WMcomposite.jpeg">
 +
                                        <a class="over-area color-black " href="https://2015.igem.org/Team:William_and_Mary/Composite_Part">
 +
                                            <div class="content">
 +
                                                <h5>Composite Part</h5>
 +
                                                <p>An original integrator suite for the E. coli chromosome.</p>
 +
                                            </div>
 +
                                        </a>
 +
                                    </div>
 +
                                </div>
 +
                            </div>
 +
                        </div>
 +
                        <!-- End Section "Our Projects" example 1: 2 Columns Full Width -->
 +
                       
 +
                    <!-- Section "What We do" example 4: Big Title & 3 columns icons -->
  
 +
                    <div class="section section-we-do-2" id="workflow2">
 +
                        <div class="container">
 +
                            <div class="row">
 +
                                <div class="title add-animation animate">
 +
<!--                                    <h5 class="text-gray">Big Title &amp; 4 Columns Icons</h5>-->
 +
                                    <p class="h2WM">Measurement & Modeling</p>
 +
                                    <p>We measured noise in fluorescence data for dual-integrated sets of CFP and YFP under three promoters: BBa_R0010, BBa_R0011, and BBa_R0051. We also developed an analytic model of the impact of plasmid copy number fluctuations on transcriptional noise, which revealed that intrinsic noise cannot be accurately measured from reporters on the pSB1X3 plasmid series.</p>
 +
                                </div>
 +
                                <div class="col-md-6">
 +
                                    <div class="card animation-1 add-animation animate">
 +
                                        <div class="icon">
 +
                                            <a href = "https://2015.igem.org/Team:William_and_Mary/Measurement"><img alt="Click to go to Measurement" src="https://static.igem.org/mediawiki/2015/0/0f/WMRulerIconColor.png" height= "100" width= "150"/></a>
 +
                                        </div>
 +
                                        <h3><a href = "https://2015.igem.org/Team:William_and_Mary/Measurement">Data & Analysis</a></h3>
 +
                                     
 +
                                    </div>
 +
                                </div>
 +
                                <div class="col-md-6">
 +
                                    <div class="card animation-2 add-animation animate">
 +
                                        <div class="icon">
 +
                                            <a href = "https://2015.igem.org/Team:William_and_Mary/Modeling"><img alt="Click to go to the Model." src="https://static.igem.org/mediawiki/2015/7/72/WMNormalIconColor.png" height= "100" width= "150"/></a>
 +
                                        </div>
 +
                                        <h3><a href = "https://2015.igem.org/Team:William_and_Mary/Modeling">Plasmid Fluctuation Model</a></h3>
 +
                                     
 +
                                    </div>
 +
                                </div>
 +
                            </div>
 +
                        </div>
 +
                    </div>
 +
                    <!-- End Section "What We do" example 3: Small Title & 3 columns icons -->
 
   
 
   
 +
                        <!-- Section "What We do" example 3: Small Title & 3 columns icons -->
 +
                        <div class="section section-we-do-2" id="workflow2">
 +
                            <div class="container">
 +
                                <div class="row">
 +
                                    <div class="title">
 +
                                        <p class = "h2WM">Human practices</p>
 +
                                    </div>
 +
<p>Our <a href="https://2015.igem.org/Team:William_and_Mary/Practices">Human Practices effort</a> was a multi-faceted outreach approach to science literacy, focusing specifically on spreading a basic understanding of synthetic biology to the general public. We collaborated with numerous organizations to host nine educational Synthetic Biology workshops for the public (from first graders to adults!) and to implement our <a href="https://2015.igem.org/Team:William_and_Mary/Practices#curriculum">educational 24-activity Synthetic Biology booklet</a> into schools worldwide, to further sustain our efforts for years to come.</p>
 +
                                    <div class="col-md-10 col-md-offset-1">
 +
                                        <div class="row">
 +
                                            <div class="col-md-4">
 +
                                                <div class="card">
 +
                                                    <div class="icon">
 +
                                                        <a href="https://2015.igem.org/Team:William_and_Mary/Practices"><img alt="..." src="https://static.igem.org/mediawiki/2015/2/28/WMSpeechIconColor.png" height= "100" width= "100"/></a>
 +
                                                    </div>
 +
                                                    <h3><a href="https://2015.igem.org/Team:William_and_Mary/Practices">Adult Communication</a></h3>
 +
                                                </div>
 +
                                            </div>
 +
                                            <div class="col-md-4">
 +
                                                <div class="card">
 +
                                                    <div class="icon">
 +
                                                        <a href="https://2015.igem.org/Team:William_and_Mary/Practices"><img alt="..." src="https://static.igem.org/mediawiki/2015/0/07/WMBooksIconColor.png" height= "100" width= "100"/></a>
 +
                                                    </div>
 +
                                                    <h3><a href="https://2015.igem.org/Team:William_and_Mary/Practices">Youth Education</a></h3>
 +
                                                </div>
 +
                                            </div>
 +
                                            <div class="col-md-4">
 +
                                                <div class="card">
 +
                                                    <div class="icon">
 +
                                                        <a href="https://2015.igem.org/Team:William_and_Mary/Practices"><img alt="..." src="https://static.igem.org/mediawiki/2015/3/3e/WMTimeIconColor.png" height= "100" width= "100"/></a>
 +
                                                    </div>
 +
                                                    <h3><a href="https://2015.igem.org/Team:William_and_Mary/Practices">Long-Term Sustainability</a></h3>
 +
                                                </div>
 +
                                            </div>
 +
                                        </div>
 +
                                    </div>
 +
                                </div>
 +
                            </div>
 +
                        </div>
 +
                        <!-- End Section "What We do" example 3: Small Title & 3 columns icons -->
 +
                   
 +
                    <!-- Section "Our Projects" example 2: 3 Columns Full Width -->
 +
                                            <div class="section section-we-made-1 section-with-hover" id="projects1">
 +
                                                <div class="text-area">
 +
                                                    <div class="title">
 +
                                                        <p class="h2WM">Collaboration</p>
 +
                    <!--                                    <div class="separator-container">
 +
                                                            <div class="separator line-separator">✻</div>
 +
                                                        </div>-->
 +
                                                        <p>W&M iGEM met and exceeded iGEM's collaboration requirements by collaborating with other researchers in four main ways: creating a pen pal program to connect teams with similar projects, participating in the interlab measurement study, interviewing the general public to provide data to future teams about how to communicate synthetic biology, and collaborating on individual research projects with iGEM teams from University of Georgia, University of Maryland, and Cambridge. </p>
 +
                                                    </div>
 +
                                                </div>
 +
                                                <div class="row" id="projectsLine1">
 +
                                                    <div class="col-md-4">
 +
                                                        <div class="project">
 +
                                                            <img alt="..." src="https://static.igem.org/mediawiki/2015/c/c8/WmInter.jpg">
 +
                                                            <a class="over-area color-green" href="https://2015.igem.org/Team:William_and_Mary/Interlab">
 +
                                                                <div class="content">
 +
                                                                    <h4>Interlab Study</h4>
 +
                                                                    <p>Click for details.</p>
 +
                                                                </div>
 +
                                                            </a>
 +
                                                        </div>
 +
                                                    </div>
 +
                                                    <div class="col-md-4">
 +
                                                        <div class="project">
 +
                                                            <img alt="..." src="https://static.igem.org/mediawiki/2015/6/6f/Wmpenpal.jpg">
 +
                                                            <a class="over-area color-black" href="https://2015.igem.org/Team:William_and_Mary/Collaborations#penpals">
 +
                                                                <div class="content">
 +
                                                                    <h4>PenPal Program</h4>
 +
                                                                    <p>Click for details.</p>
 +
                                                                </div>
 +
                                                            </a>
 +
                                                        </div>
 +
                                                    </div>
 +
                                                    <div class="col-md-4">
 +
                                                        <div class="project">
 +
                                                            <img alt="..." src="https://static.igem.org/mediawiki/2015/a/af/WmCollCam.png">                                   
 +
                                                            <a class="over-area color-blue " href="https://2015.igem.org/Team:William_and_Mary/Collaborations#otherteams">
 +
                                                                <div class="content">
 +
                                                                    <h4>With Other Teams</h4>
 +
                                                                    <p>Click for details.</p>
 +
                                                                </div>
 +
                                                            </a>
 +
                                                        </div>
 +
                                                    </div>
 +
                                                </div>
 +
                                            </div>
 +
                                            <!-- End Section "Our Projects" example 2: 3 Columns Full Width -->
 +
                   
 +
<!-- MEDAL CRITERIA HERE -->
  
 +
<div class="section section-we-are-2">
 +
                            <div class="text-area">
 +
                                <div class="container">
 +
                                    <div class="row">
 +
                                        <div class="col-md-4">
 +
                                            <div class="title">
 +
                                                <p class="h2WM">Medal Criteria</p>
 +
                                            </div>
 +
                                        </div>
 +
                                        <div class="col-md-7 col-md-offset-1">
 +
                                            <div class="content">
 +
                                                <p><a href="https://2015.igem.org/Team:William_and_Mary/Medal_Criteria">We're very proud of all of our accomplishments from over the summer! Click here to learn more about what we did to reach our goals.</a></p>
 +
                                            </div>
 +
                                        </div>
 +
                                    </div>
 +
                                </div>
 +
                            </div>
 +
                        </div>
  
−
  <div class="col-md-10" >
+
<!--End Medal Criteria -->                  
−
      <ul class="nav navbar-nav" style="margin-top:10px">
+
  
 +
<!--Software starts here! -->
 +
<div class="section section-we-are-2">
 +
                            <div class="text-area">
 +
                                <div class="container">
 +
                                    <div class="row">
 +
                                        <div class="col-md-7 col-md-offset-1">
 +
                                            <div class="content">
 +
                                                <p><a href="https://2015.igem.org/Team:William_and_Mary/Software">Click here to check out the software we made to help us make sense of sequencing results of complex parts!</a> </p>
 +
                                            </div>
 +
                                        </div>
 +
<div class="col-md-4">
 +
                                            <div class="title">
 +
                                                <p class="h2WM">Software</p>
 +
                                            </div>
 +
                                        </div>
 +
                                    </div>
 +
                                </div>
 +
                            </div>
 +
                        </div>
 +
<!--End software -->
  
−
    <li>
 
−
    <a href="#" class="dropdown-toggle" data-toggle="dropdown">
 
  
−
                Project<b class="caret"></b>           
 
−
</a>
 
−
                    <ul class="dropdown-menu multi-level">
 
−
                        <li><a href="https://2017.igem.org/Team:William_and_Mary/Team">Overview </a></li>
 
−
<li><a href="https://2017.igem.org/Team:William_and_Mary/Team">Description </a></li>
 
−
<li><a href="https://2017.igem.org/Team:William_and_Mary/Team">Parts </a></li>
 
−
<li><a href="https://2017.igem.org/Team:William_and_Mary/Team">Results </a></li>
 
−
                        <li><a href="https://2017.igem.org/Team:William_and_Mary/Attributions">Model</a></li>
 
−
                   
 
−
                    </ul>
 
−
                </li>
 
  
  
 +
                   
 +
                        <!-- Section "Team" example 1: Title & Full Image -->
 +
                        <div class="section section-team-1" id="team1">
 +
                            <div class="container">
 +
                                <div class="text-area">
 +
                                    <div class="title">
 +
                                        <p class="h2WM">Team</p>
 +
<!--                                        <div class="separator-container">
 +
                                            <div class="separator line-separator">✻</div>
 +
                                        </div>-->
 +
<div class="content">
 +
                                        <a href="https://2015.igem.org/Team:William_and_Mary/Team"><p>Click here to learn more about our team.</p></a>
 +
</div>
 +
                                    </div>
 +
                                </div>
 +
                            </div>
 +
                            <div class="full-image gradient-image">
 +
                                <img alt="..." src="https://static.igem.org/mediawiki/2015/f/f5/WmTeam15a.png">
 +
                            </div>
 +
                        </div>
 +
                        <!-- End Section "Team" example 1: Description & Full Image -->
 +
                   
  
  
 +
<!--Software starts here! -->
 +
<div class="section section-we-are-2">
 +
                            <div class="text-area">
 +
                                <div class="container">
 +
                                    <div class="row">
 +
<div class="title">
 +
<p class="h2WM">2015 Jamboree Results</p>
 +
</div>
 +
                                        <div class="col-md-7 col-md-offset-1">
 +
                                            <div class="content">
 +
                                                <p><img src="https://static.igem.org/mediawiki/2015/b/b7/WM_Wins.jpg" width=600px> </p>
 +
                                            </div>
 +
                                        </div>
 +
<div class="col-md-4">
 +
                                            <div class="content" style="vertical-align:middle;">
 +
                                                <p>Undergraduate Grand Prize Winner<br><br>Best in Track: Measurement<br><br>Best Education & Public Engagement<br><br>Best Presentation<br><br>Nominee: Best Mathematical Model</p>
 +
                                            </div>
 +
                                        </div>
 +
                                    </div>
 +
                                </div>
 +
                            </div>
 +
                        </div>
 +
<!--End software -->
  
 +
                        <!-- Section "ref" example 2: Text & Icons -->
 +
                        <div class="section section-numbers-1" id="ref">
 +
                            <div class="container">
 +
                                <div class="text-area">
 +
                                    <div class="title">
 +
                                        <p class="h2WM">References</p>
 +
<!--                                      <div class="separator-container">
 +
                                            <div class="separator line-separator">✻</div>
 +
                                        </div>-->
 +
                                    </div>
 +
                                </div>
 +
                                <div class="clearfix"></div>
 +
                                <div class="row">
 +
                                <div class="title add-animation animate">
 +
                                    <div class="col-md-4">
 +
                                        <div class="card">
 +
                                            <div class="icon">
 +
                                                <a href="https://2015.igem.org/Team:William_and_Mary/Notebook"><img alt="..." src="https://static.igem.org/mediawiki/2015/a/a6/WMNotebookIconColor.png" height= "100" width= "90"/></a>
 +
                                            </div>
 +
                                            <h3>
 +
<a href="https://2015.igem.org/Team:William_and_Mary/Notebook">
 +
                            Notebook</a></h3>
 +
<!--                                            <h5 class="text-gray">explain</h5>-->
 +
<!--                                          <div class="number" id="customersNo">
 +
                                                5.382
 +
                                            </div>-->
 +
                                        </div>
 +
                                    </div>
 +
                                    <div class="col-md-4">
 +
                                        <div class="card">
 +
                                            <div class="icon">
 +
                                                <a href="https://2015.igem.org/Team:William_and_Mary/Safety"><img alt="..." src="https://static.igem.org/mediawiki/2015/7/79/WMGogglesIconColor.png" height= "100" width= "100"/></a>
 +
                                            </div>
 +
                                            <h3>
 +
<a href="https://2015.igem.org/Team:William_and_Mary/Safety">
 +
                            Safety</a></h3>
 +
<!--                                            <h5 class="text-gray">explain</h5>-->
 +
<!--                                            <div class="number" id="projectsNo">
 +
                                                26.832
 +
                                            </div>-->
 +
                                        </div>
 +
                                    </div>
 +
                                    <div class="col-md-4">
 +
                                        <div class="card">
 +
                                            <div class="icon">
 +
                                                <a href="https://2015.igem.org/Team:William_and_Mary/Attributions"> <img alt="..." src="https://static.igem.org/mediawiki/2015/a/aa/WMTUIconColor.png" height= "100" width= "100"/></a>
 +
                                            </div>
 +
                                            <h3>
 +
<a href="https://2015.igem.org/Team:William_and_Mary/Attributions">
 +
                            Attributions</a></h3>
 +
<!--                                            <h5 class="text-gray">explain</h5>-->
 +
<!--                                            <div class="number" id="citiesNo">
 +
                                                278
 +
                                            </div>-->
 +
                                        </div>
 +
                                    </div>
 +
                                </div>
 +
                            </div>
 +
                        </div>
 +
                        </div>
 +
                        <!-- End Section "Numbers" example 2: Text & Image -->
 +
                   
 +
                   
 +
                      <footer class="footer footer-color-black" data-color="black">
 +
                            <div class="container">
 +
                                <nav class="pull-left navbar-burger">
 +
                                    <ul>
 +
                                        <li>
 +
                                            <a href="https://2015.igem.org/Team:William_and_Mary">
 +
                                                Home
 +
                                            </a>
 +
                                        </li>
 +
                                        <li>
 +
                                            <a href="mailto:igem@wm.edu">
 +
                                                Contact
 +
                                            </a>
 +
                                        </li>
 +
                                    </ul>
 +
                                </nav>
 +
                                <div class="social-area pull-right">               
 +
                                    <a href="https://www.facebook.com/wmigem2015">
 +
                                        <i class="fa fa-facebook-square"></i>
 +
                                    </a>
 +
                                    <a href="https://twitter.com/wmigem">
 +
                                        <i class="fa fa-twitter"></i>
 +
                                    </a>
 +
                                </div>
 +
                                <div class="copyright">
 +
                                    © 2015 William & Mary iGEM
 +
                                </div>
 +
                            </div>
 +
                        </footer>   
 +
        </div>
 +
       
 +
       
 +
       
 +
       
 +
       
 +
       
 +
        <!--  Here are the examples of the content for each project that is viewed inside of the page. You can create how many projects you want if you set the specific #id     
 +
        -->
 +
       
  
−
     
+
       
−
 
+
         <div class="body-layer"></div>
−
 
+
    </body>
−
        <li>
+
−
    <a href="https://2016.igem.org/Team:Sydney_Australia/Human_Practices" class="dropdown-toggle" data-toggle="dropdown">
+
−
 
+
−
                Human Practices<b class="caret"></b>           
+
−
</a>
+
−
                    <ul class="dropdown-menu multi-level">
+
−
<li><a href="https://2017.igem.org/Team:William_and_Mary/Engagement">Education & Public Engagement</a></li>
+
−
 
+
−
                        <li><a href="https://2017.igem.org/Team:William_and_Mary/Collaborations">Collaborations</a></li>
+
−
                        <li><a href="https://2017.igem.org/Team:William_and_Mary/Interlab">Interlab</a></li>
+
−
 
+
−
                     
+
−
                    </ul>
+
−
                </li>
+
−
 
+
−
 
+
−
         <li class="menu-item">
+
−
          <a href="https://2017.igem.org/Team:William_and_Mary/Database">
+
−
            <span>Database</span>
+
−
            <span class="green-effect"></span>
+
−
          </a>
+
−
</li>
+
−
 
+
 
      
 
      
 +
   
 +
   
 +
    <script type="text/javascript" src="https://2015.igem.org/Template:William_and_Mary/jquery1112minJS?
 +
action=raw&ctype=text/javascript"></script>
 +
   
 +
    <script type="text/javascript" src="https://2015.igem.org/Template:William_and_Mary/bootstrapJS?
 +
action=raw&ctype=text/javascript"></script>
 +
 
  
−
+
    <script type="text/javascript" src="https://2015.igem.org/Template:William_and_Mary/jquerywaypointsminJS?
−
 
+
action=raw&ctype=text/javascript"></script>
−
                <li>
+
−
             
+
−
 
+
−
                    <a href="#" class="dropdown-toggle" data-toggle="dropdown">
+
−
 
+
−
                Notebook <b class="caret"></b>           
+
−
</a>
+
−
                    <ul class="dropdown-menu multi-level">
+
−
                        <li><a href="https://2017.igem.org/Team:William_and_Mary/Notebook">Notebook</a></li>
+
−
                        <li><a href="https://2017.igem.org/Team:William_and_Mary/Safety">Safety</a></li>
+
−
                        <li><a href="https://2017.igem.org/Team:William_and_Mary/Medal_Requirements">Medal Requirements</a></li>
+
−
 
+
−
                     
+
−
                     
+
−
                    </ul>
+
−
                </li>
+
−
 
+
−
      <li>
+
−
 
+
−
  <li>
+
−
             
+
−
 
+
−
                    <a href="#" class="dropdown-toggle" data-toggle="dropdown">
+
−
 
+
−
                Team <b class="caret"></b>           
+
−
</a>
+
−
                    <ul class="dropdown-menu multi-level">
+
−
                        <li><a href="https://2017.igem.org/Team:William_and_Mary/Team">About Us </a></li>
+
−
                        <li><a href="https://2017.igem.org/Team:William_and_Mary/Attributions">Attributions </a></li>
+
−
                     
+
−
                     
+
−
                     
+
−
                    </ul>
+
−
                </li>
+
−
 
+
−
 
+
−
 
+
−
      </ul>
+
−
 
+
−
</div>
+
−
  </nav>
+
−
</div>
+
−
 
+
  
 +
    <script type="text/javascript" src="http://presentation.paperplane.io/assets/js/modernizr.js"></script>
  
−
<html>
+
    <script type="text/javascript" src="https://2015.igem.org/Template:William_and_Mary/rubick2JS?
 +
action=raw&ctype=text/javascript"></script>
 +
</html>

Latest revision as of 01:54, 22 August 2017

NOISE - W&M iGEM

NOISE

Characterization of promoter-driven transcriptional noise in E. coli

Parts

In deciding which parts to submit to the iGEM Registry we focused on three main aspects.

First: ensuring our project is as reproducible and extensible as possible. To that end we have submitted all of new composite fluorescent protein parts that we constructed during the project.
Second: Making genome integration as straightforward as possible for iGEM teams. In order to accomplish this goal we designed, tested, and validated a new integrator cassette that allows simple genome integration using 3A or Gibson Assembly.
Third: Increasing the number of tools available for promoter-mediated regulation in synthetic biology. We created and validated an E. coli codon optimized dCas9 variant and a suite of gRNAs to target the most commonly used promoters in iGEM.

Measurement & Modeling

We measured noise in fluorescence data for dual-integrated sets of CFP and YFP under three promoters: BBa_R0010, BBa_R0011, and BBa_R0051. We also developed an analytic model of the impact of plasmid copy number fluctuations on transcriptional noise, which revealed that intrinsic noise cannot be accurately measured from reporters on the pSB1X3 plasmid series.

Click to go to Measurement

Data & Analysis

Click to go to the Model.

Plasmid Fluctuation Model

Human practices

Our Human Practices effort was a multi-faceted outreach approach to science literacy, focusing specifically on spreading a basic understanding of synthetic biology to the general public. We collaborated with numerous organizations to host nine educational Synthetic Biology workshops for the public (from first graders to adults!) and to implement our educational 24-activity Synthetic Biology booklet into schools worldwide, to further sustain our efforts for years to come.

...

Adult Communication

...

Youth Education

...

Long-Term Sustainability

Collaboration

W&M iGEM met and exceeded iGEM's collaboration requirements by collaborating with other researchers in four main ways: creating a pen pal program to connect teams with similar projects, participating in the interlab measurement study, interviewing the general public to provide data to future teams about how to communicate synthetic biology, and collaborating on individual research projects with iGEM teams from University of Georgia, University of Maryland, and Cambridge.

Medal Criteria

We're very proud of all of our accomplishments from over the summer! Click here to learn more about what we did to reach our goals.

Click here to check out the software we made to help us make sense of sequencing results of complex parts!

Software

2015 Jamboree Results

Undergraduate Grand Prize Winner

Best in Track: Measurement

Best Education & Public Engagement

Best Presentation

Nominee: Best Mathematical Model