Difference between revisions of "Team:UNOTT/Results"

 
(41 intermediate revisions by one other user not shown)
Line 4: Line 4:
 
<head>
 
<head>
 
   <meta charset="UTF-8">
 
   <meta charset="UTF-8">
   <title>Expandable Boxes With CSS Transitions</title>
+
    
 
   <script src="https://s.codepen.io/assets/libs/modernizr.js" type="text/javascript"></script>
 
   <script src="https://s.codepen.io/assets/libs/modernizr.js" type="text/javascript"></script>
  
  
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/5.0.0/normalize.min.css">
+
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/5.0.0/normalize.min.css">
 
+
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.5/angular.min.js">
 +
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.csss">
 +
<link href="https://fonts.googleapis.com/css?family=Montserrat" rel="stylesheet">
 +
<link href="https://fonts.googleapis.com/css?family=Karla" rel="stylesheet">
  
 
<style>
 
<style>
 +
body {
 +
    font-family: 'Karla', sans-serif;
 +
}
 +
 +
p {
 +
margin-top:10px;
 +
}
  
 
h2 span.spacer {
 
h2 span.spacer {
Line 36: Line 46:
 
   left: 0;  
 
   left: 0;  
 
   width: 100%;
 
   width: 100%;
 +
  font-family: 'Karla', sans-serif;
 
}
 
}
  
 +
h4 {
 +
  font-family: 'Karla', sans-serif;
 +
  color:#4b524a;
 +
  font-weight: bold;
 +
}
 +
 +
.contentmargin{
 +
  margin: auto;
 +
    width: 60%;
 +
    padding: 10px;
 +
    font-family: 'Karla', sans-serif;
 +
    background-color: #ffffff;
 +
}
 +
 +
.wrapper {
 +
  width: 100%;
 +
  margin: 0 auto;
 +
  padding: 3em 0 0;
 +
}
 +
 +
.dropdown1 {
 +
  float: left;
 +
  width: 100%;
 +
  position: relative;
 +
  padding-bottom: 2em;
 +
}
 +
 +
.dropdown1 input[type=checkbox] {
 +
  position: absolute;
 +
  top: 30px;
 +
  left: 0;
 +
  width: 100%;
 +
  height: 100%;
 +
  opacity: 0;
 +
  cursor: pointer;
 +
}
 +
 +
.dropdown1 label {
 +
  cursor: pointer;
 +
  display: inline-block;
 +
  padding-left: 1.75rem;
 +
  font-size: 5.0rem;
 +
  line-height: 2rem;
 +
  font-weight: 600;
 +
  color: #333;
 +
  font-family: Karla, sans-serif;
 +
}
 +
 +
.dropdown1 label:before {
 +
  content: "";
 +
  position: absolute;
 +
  top: 6px;
 +
  left: 0;
 +
  border-left: 8px solid #F5634A;
 +
  border-top: 8px solid transparent;
 +
  border-bottom: 8px solid transparent;
 +
  margin-left: 4px;
 +
}
 +
 +
.dropdown1 input[type=checkbox]:checked ~ label:before {
 +
  border-left: 8px solid transparent;
 +
  border-top: 8px solid #F5634A;
 +
  border-right: 8px solid transparent;
 +
  margin: 8px 0 0;
 +
}
 +
 +
.dropdown1 .text {
 +
  max-height: 0;
 +
  -webkit-transition: max-height 1s;
 +
  -moz-transition: max-height 1s;
 +
  -ms-transition: max-height 1s;
 +
  -o-transition: max-height 1s;
 +
  transition: max-height 1s; 
 +
  overflow: hidden;
 +
  font-family: Karla, serif;
 +
  font-size: 1.2rem;
 +
  line-height: 1.6rem;
 +
  letter-spacing: 0.05em;
 +
  color: #333;
 +
  padding-left: 1.75rem;
 +
}
 +
 +
.dropdown1 input[type=checkbox]:checked ~ .text {
 +
  max-height: 1000px;
 +
}
 
</style>
 
</style>
  
Line 46: Line 142:
 
<body>
 
<body>
  
                  <link href="https://fonts.googleapis.com/css?family=Roboto" rel="stylesheet">
+
               
  
 
<p><br>
 
<p><br>
Line 64: Line 160:
 
<h2><span>RESULTS:<span class='spacer'></span></h2>
 
<h2><span>RESULTS:<span class='spacer'></span></h2>
 
    
 
    
<h4>OBJECTIVE: CREATE pgRNA</h4>
+
 
 +
 
 +
 
 +
<div class="contentmargin">
 +
 
 +
 
 +
  
 
        
 
        
Line 73: Line 175:
  
 
    
 
    
   <h4>OBJECTIVE: CREATE pREPORTER</h4>
+
    
   <h4>OBJECTIVE: PROMOTER LIBRARY</h4>
+
    
  <h4>OBJECTIVE: RANDOM LIGATIONS</h4>
+
 
 
        
 
        
      <h4 style="color: #ffffff; font-weight: bold; font-size: 30px;">OBJECTIVE: FREEZE DRYING</h4>
+
 
 +
 
 
        
 
        
  <h4>OBJECTIVE: CRISPRi & gRNA EFFICIENCY</h4>
+
 
 
        
 
        
<p>This picture shows our gRNAs working visually, but the graphs show the results of RFP detection using a microplate reader on cultures containing each of the dCas9 plasmids with one promoter-RFP-terminator brick, with its corresponding gRNA plasmid,
+
 
 +
 
 +
 
 +
 
 +
 
 +
<div class="wrapper">
 +
  <div class="dropdown1">
 +
  <input type="checkbox" id="question-1">
 +
  <label for="question-1"> STEP 1: Create guideRNA Plasmid </label>
 +
    <div class="text">
 +
      <p>Text</p>
 +
    </div>
 +
  </div>
 +
 
 +
<br> 
 +
<div class="dropdown1">
 +
  <input type="checkbox" id="question-2">
 +
  <label for="question-2"> STEP 2: Create Reporter Plasmid </label>
 +
    <div class="text">
 +
      <p>Text</p>
 +
    </div>
 +
  </div>
 +
 
 +
<br> 
 +
<div class="dropdown1">
 +
  <input type="checkbox" id="question-3">
 +
  <label for="question-3">  STEP 3: Create Promoter Library </label>
 +
    <div class="text">
 +
      <p>Text</p>
 +
    </div>
 +
  </div>
 +
 
 +
<br>
 +
<div class="dropdown1">
 +
  <input type="checkbox" id="question-4">
 +
  <label for="question-4">STEP 4: Random Ligations      </label>
 +
    <div class="text">
 +
      <p>Text</p>
 +
    </div>
 +
  </div>
 +
 
 +
<br>
 +
<div class="dropdown1">
 +
  <input type="checkbox" id="question-5">
 +
  <label for="question-5">STEP 5: Freeze drying & Revival    </label>
 +
    <div class="text">
 +
      <p>Here are the results of our freeze-dried cells revival experiments. With these experiments, we want to show that different storage do not have an effect on the revival of the cells within our key.</p>
 +
    </div>
 +
  </div>
 +
 
 +
<br>
 +
 
 +
<div class="dropdown1">
 +
  <input type="checkbox" id="question-6">
 +
  <label for="question-6"> STEP 6: CRISPRi & guideRNA efficiency    </label>
 +
    <div class="text">
 +
      <p>This picture shows our gRNAs working visually, but the graphs show the results of RFP detection using a microplate reader on cultures containing each of the dCas9 plasmids with one promoter-RFP-terminator brick, with its corresponding gRNA plasmid,
 
  or with a non-targeting gRNA plasmid.</p>
 
  or with a non-targeting gRNA plasmid.</p>
 
<img src="https://static.igem.org/mediawiki/2017/6/6a/T--UNOTT--gRNAresultspic.jpeg">
 
<img src="https://static.igem.org/mediawiki/2017/6/6a/T--UNOTT--gRNAresultspic.jpeg">
 +
<img src="https://static.igem.org/mediawiki/2017/e/e1/T--UNOTT--photosofgRNAresults.jpeg">
  
 +
    </div>
 +
  </div>
  
  
+
</div>       
  
 
+
</div>
  
 
</body>
 
</body>

Latest revision as of 16:11, 31 October 2017





RESULTS: