Difference between revisions of "Team:UNOTT"

 
(401 intermediate revisions by 4 users not shown)
Line 1: Line 1:
−
{{UNOTT}}
+
{{:Team:UNOTT/Template/NavBarTest}}
−
<html>
+
  
  
−
<div class="column full_size" >
+
<html >
−
<img src="http://placehold.it/2000x300/d3d3d3/f2f2f2">
+
<head>
−
</div>
+
  <meta charset="UTF-8">
 +
  <meta name="viewport" content="width=device-width, initial-scale=1">
 +
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/5.0.0/normalize.min.css">
 +
 +
 
  
  
 +
<style>
 +
      @import url(https://fonts.googleapis.com/css?family=Lato:300,400,300italic,400italic);
  
−
<div class="column full_size" >
+
      /* Base Styles
−
<h1> Welcome to the iGEM Nottingham 2017 Wiki! </h1>
+
      ===================================*/
−
<p>Your team has been approved and you are ready to start the iGEM season! </p>
+
      body {
−
</div>
+
      color: #183532;
 +
      font-family: 'Lato', sans-serif;
 +
      font-weight: 400;
 +
      line-height: 1.8;
 +
        background-color: #fff;
 +
        width: auto;
 +
        position:absolute;
  
−
<div class="clear"></div>
+
      }
  
−
<div class="column half_size" >
 
−
<h5>Keycoli</h5>
 
−
<p>The first biological password that changes over time!</p>
 
−
<ul>
 
−
<li>Microorganism is transformed using BioBricks to produce secondary metabolites, initially the metabolites will be a simpler product such as fluorescent proteins. The secondary metabolites will be produced in a unique and random configuration and as as our "key". In order to produce this randomness, shuffling of metabolite expression levels via transposons or error prone RNase will be applied. To produce a unique configuration of the metabolite varying promoter expression levels will produce unique metabolites. This key will be used to open locked mechanism such as safes and secure doors. </li>
 
−
<li> For the key to be practical it would need to be portable, this is where our key transport device comes in. It will consist of a similar design to a chemostat. Our Key colony metabolites will degrade a desired amount of time before they must be renewed from the Lock colony, when this occurs the configuration of the key is shuffled once again to ensure the key and lock are changing. </li>
 
−
<li>Once the key has been transported to the locked object a juxtaposition of a detection technique such as gas chromotography or mass spectrometry and data comparison software will compare the secondary metabolites of the "key" microorganism to the "reference/lock" colony. If the metabolies of both colonies exceeds a threshold of similarity the locked object will become unlocked.</li>
 
−
</ul>
 
−
</div>
 
  
−
<div class="column half_size" >
+
      /* Layout Styles
−
<div class="highlight">
+
      ===================================*/
−
<h5> Project Overview </h5>
+
      section:not(:first-of-type),
−
<p>FOR CHRIS: https://www.youtube.com/watch?v=otCpCn0l4Wo</p>
+
      section:not(:nth-of-type(n2)) {
−
<p></p>
+
      margin-top: 80px;
−
</div>
+
      }
−
</div>
+
      .section-two,
 +
      .section-three,
 +
      footer {
 +
      margin-top: 80px;
 +
      }
  
−
<div class="column full_size" >
 
−
<h5> PLAN OF ACTION </h5>
 
−
<p>We have created these wiki template pages to help you get started and to help you think about how your team will be evaluated. You can find a list of all the pages tied to awards here at the <a href="https://2017.igem.org/Judging/Pages_for_Awards">Pages for awards</a> link. You must edit these pages to be evaluated for medals and awards, but ultimately the design, layout, style and all other elements of your team wiki is up to you!</p>
 
  
−
</div>
+
     
  
 +
      /* Cover / Jumbotron Styles
 +
      ===================================*/
 +
      section .cover {
 +
      padding-top: 70px;
 +
     
 +
      background-repeat: no-repeat;
 +
      background-size: cover;
 +
      height: 100vh;
 +
        width: 100vw;
 +
     
 +
      display: -ms-flexbox;
 +
      display: flex;
 +
       
 +
      }
  
  
 +
      /* Section One Styles
 +
      ===================================*/
 +
      .section-one-content {
 +
      padding: 1em 1em;
 +
      color: #ffffff;
 +
      font-weight: 300;
 +
        height:350px;
 +
      }
 +
      .section-one-content h1 {
 +
      margin: 0 0 0px;
 +
      }
 +
      #section-one-left {
 +
      background: #183532;
 +
      }
 +
      #section-one-middle {
 +
      background: #244F4A;
 +
      }
 +
      #section-one-right {
 +
      background: #2A5C56;
 +
       
 +
      }
  
−
<div class="column half_size" >
+
      .section-two,
−
<h5> Transposon selection </h5>
+
      .section-three {
−
<p>Tn7 Transposon used due to specific target site selection for its transposition, which is impossible in other transposon species, without this modular increases in promoter activity could not be achieved as random insertions would create a gradient rather than step wise expression pattern of proteins.</p>
+
      background: #fff;
 +
      }
  
−
<h5> Promoter selection </h5>
+
      /* CSS Image Styles
−
<p>Promoters are selected to have a greatly varied production of products. These will then allow easy recognition of each level 0-3</p>
+
      ====================================================*/
 +
      .css-img-wrapper {
 +
          display: -webkit-box;
 +
          display: -ms-flexbox;
 +
          display: flex;
 +
          -webkit-box-orient: vertical;
 +
          -webkit-box-direction: normal;
 +
              -ms-flex-direction: column;
 +
                  flex-direction: column;
 +
          -ms-flex-wrap: nowrap;
 +
              flex-wrap: nowrap;
 +
          -webkit-box-pack: center;
 +
              -ms-flex-pack: center;
 +
                  justify-content: center;
 +
          -ms-flex-line-pack: center;
 +
              align-content: center;
 +
          -webkit-box-align: center;
 +
              -ms-flex-align: center;
 +
                  align-items: center;
 +
      }
 +
      .img-designers,
 +
      .img-developers {
 +
      height: 400px;
 +
      width: 400px;
 +
      background-position: center center;
 +
      background-size: cover;
 +
      }
 +
      .img-designers {
 +
      background: #183532;
 +
      }
 +
      .img-developers {
 +
      background: #2A5C56;
 +
      }
  
−
</div>
 
  
  
−
<div class="column half_size" >
+
      /* Media Styles
−
<h5>Bacterial Key Transport</h5>
+
      ===================================*/
−
<p>There is a need for a transport mechanism for the key. This presents problems depending on the bacteria used.</p>
+
      @media (min-width: 480px) {
−
<p> In Ecoli Our key transport system would need to: </p>
+
      body {
−
<ul>
+
      font-size: 16px;
−
<li>Keep our colonies alive for a few days. </li>
+
             
−
<li>Potentially could freeze. Freezing is one of the best ways to store bacteria. </li>
+
               
−
<li>The lower the temperature the longer the culture will retain viable cells.</li>
+
      }
−
<li>PROBLEM: Ice can damage cells due to localised accumulation of salt, it can also rupture membranes. </li>
+
      }
−
<li>SOLUTION: Use glycerol as a cryoprotectant </li>
+
      @media (min-width: 768px) {
 +
      .section-one-content {
 +
      padding: 40px 40px;
 +
      }
 +
      }
 +
      @media (min-width: 992px) {
 +
      .section-one-content {
 +
      padding: 40px 20px;
 +
      }
 +
      }
 +
      @media (min-width: 1200px) {
 +
      .section-one-content {
 +
      padding: 40px 40px;
 +
      }
 +
      }
  
−
</ul>
+
@media only screen and (max-width: 500px) {
−
</div>
+
    .section.cover {
 +
        max-width:100%;
 +
    }
  
 +
    .cover {
 +
        max-width:100%;
 +
    }
  
−
<div class="column half_size" >
 
−
<h5>Sponsors</h5>
 
−
<p>Here are our sponsors. FEEL FREE TO EXPAND</p>
 
−
<ul>
 
−
<li>Prince of Nigeria</li>
 
−
</ul>
 
−
</div>
 
  
−
<div class="column half_size" >
+
}
−
<h2>Possible Metabolites</h2>
+
−
<h4>INSERT LATER</h4>
+
  
−
</div>
+
h1 {
 +
          font-size: 300px;
 +
          font-color: #ffffff;
 +
    }
 +
.maintext {
 +
position: absolute;
 +
left: 33%%;
 +
top: 10%;
 +
}
  
 +
.maintext2 {
 +
position: absolute;
 +
left: 33%;
 +
top: 40%;
 +
}
  
 +
.mainimage{
 +
max-width: 100%;
 +
height: auto;
 +
}
  
 +
</style>
  
 +
</head>
  
 +
<body>
 +
  <body data-spy="scroll" data-target="#myScrollspy" class="">
  
  
 +
 +
<!-- Full Screen Landing Section -->
 +
<div class="cover">
 +
 +
<img class="mainimage"src="https://static.igem.org/mediawiki/2017/1/12/T--UNOTT--CoverImg.png">
 +
 +
     
 +
 +
</div>
 +
 +
<!-- //Close Full Screen Landing Section -->
 +
 +
 +
<!-- Section One; as seen on many site 3 main option sections for content -->
 +
<section class="container-fluid section-one">
 +
<div class="row">
 +
<div class="col-md-4 section-one-content" id="section-one-left">
 +
<h1>What?</h1>
 +
<p> An unpredicatable security system consisting of bacteria. <br>
 +
</p>
 +
 +
</div>
 +
 +
<div class="col-md-4 section-one-content" id="section-one-middle">
 +
<h1>Why?</h1>
 +
<p> To secure customer accounts that require high-end security.<br>
 +
</p>
 +
 +
</div>
 +
 +
<div class="col-md-4 section-one-content" id="section-one-right">
 +
<h1>How?</h1>
 +
<p>Unique expression of fluorescent proteins linked to CRISPR dCas9 interference.</p>
 +
 +
</div>
 +
</div>
 +
</section>
 +
<!-- //Close Section One -->
 +
 +
 +
 +
 +
 +
<!--// Section Three -->
 +
<section class="container section-three" id="spydevelopers">
 +
<div class="row">
 +
<img src="https://static.igem.org/mediawiki/2017/0/08/T--UNOTT--Slogan.png" style="width:100%;height:auto;">
 +
</div>
 +
</section>
 +
<!--//Close Section Three -->
 +
 +
<br> </br>
 +
</body>
 
</html>
 
</html>
 +
 +
{{:Team:UNOTT/Template/Footer}}

Latest revision as of 00:57, 2 November 2017


What?

An unpredicatable security system consisting of bacteria.

Why?

To secure customer accounts that require high-end security.

How?

Unique expression of fluorescent proteins linked to CRISPR dCas9 interference.