Difference between revisions of "Team:WashU StLouis"

m
 
(24 intermediate revisions by the same user not shown)
Line 1: Line 1:
 
{{WashU_StLouis}}
 
{{WashU_StLouis}}
 
<html>
 
<html>
−
<head>
+
 
−
<link href="https://fonts.googleapis.com/css?family=Lato|Rubik+One" rel="stylesheet">
+
−
<link href="https://fonts.googleapis.com/css?family=Bangers|Boogaloo" rel="stylesheet">
+
−
</head>
+
 
<style>
 
<style>
−
@import 'https://fonts.googleapis.com/css?family=Martel|Martel+Sans:400,900';
+
 
 +
#myImg {
 +
    border-radius: 5px;
 +
    cursor: pointer;
 +
    transition: 0.3s;
 +
    position: absolute;
 +
    left: 80vw;
 +
    top: 20vh;
 +
}
 +
 
 +
#myImg:hover {opacity: 0.7;}
 +
 
 +
/* The Modal (background) */
 +
.modal {
 +
    display: none; /* Hidden by default */
 +
    position: fixed; /* Stay in place */
 +
    z-index: 100; /* Sit on top */
 +
    padding-top: 100px; /* Location of the box */
 +
    left: 0;
 +
    top: 0;
 +
    width: 100%; /* Full width */
 +
    height: 100%; /* Full height */
 +
    overflow: auto; /* Enable scroll if needed */
 +
    background-color: rgb(0,0,0); /* Fallback color */
 +
    background-color: rgba(0,0,0,0.9); /* Black w/ opacity */
 +
}
 +
 
 +
/* Modal Content (image) */
 +
.modal-content {
 +
    margin: auto;
 +
    display: block;
 +
    width: 80%;
 +
    max-width: 700px;
 +
}
 +
 
 +
/* Caption of Modal Image */
 +
#caption {
 +
    margin: auto;
 +
    display: block;
 +
    width: 80%;
 +
    max-width: 700px;
 +
    text-align: center;
 +
    color: #ccc;
 +
    padding: 10px 0;
 +
    height: 150px;
 +
}
 +
 
 +
/* Add Animation */
 +
.modal-content, #caption {
 +
    -webkit-animation-name: zoom;
 +
    -webkit-animation-duration: 0.6s;
 +
    animation-name: zoom;
 +
    animation-duration: 0.6s;
 +
}
 +
 
 +
@-webkit-keyframes zoom {
 +
    from {-webkit-transform:scale(0)}
 +
    to {-webkit-transform:scale(1)}
 +
}
 +
 
 +
@keyframes zoom {
 +
    from {transform:scale(0)}
 +
    to {transform:scale(1)}
 +
}
 +
 
 +
/* The Close Button */
 +
.close {
 +
    position: absolute;
 +
    top: 15px;
 +
    right: 35px;
 +
    color: #f1f1f1;
 +
    font-size: 40px;
 +
    font-weight: bold;
 +
    transition: 0.3s;
 +
}
 +
 
 +
.close:hover,
 +
.close:focus {
 +
    color: #bbb;
 +
    text-decoration: none;
 +
    cursor: pointer;
 +
}
 +
 
 +
 
 
img {
 
img {
 
   display: inline-block;
 
   display: inline-block;
Line 93: Line 173:
  
 
.quotes {
 
.quotes {
−
     font-family: 'Lato', sans-serif !important;
+
     font-family: 'MartelReg';
 
     font-weight: normal;
 
     font-weight: normal;
 
     font-size: 30px !important;;
 
     font-size: 30px !important;;
Line 111: Line 191:
  
 
.black_grad {
 
.black_grad {
−
     background: rgba(0, 0, 0, .4);
+
     background: rgba(0, 0, 0, .6);
 
}
 
}
  
 
.white_grad {
 
.white_grad {
−
     background: rgba(255, 255, 255, .4);
+
     background: rgba(255, 255, 255, .6);
 
}
 
}
  
Line 136: Line 216:
 
}
 
}
  
−
.sponsor_div{
+
.my_div{
 
  width: 100vw;
 
  width: 100vw;
 
  background: #4EACCC;
 
  background: #4EACCC;
Line 205: Line 285:
  
 
<div class="parawrapper">
 
<div class="parawrapper">
 +
 +
 +
 +
 +
  
 
     <div id="slide1">
 
     <div id="slide1">
Line 212: Line 297:
 
         </div>
 
         </div>
 
     </div>
 
     </div>
 +
 +
 +
<!-- Trigger the Modal -->
 +
<a href = "https://static.igem.org/mediawiki/2016/b/b6/T--WashU_StLouis--appinfo.pdf">
 +
<img id="myImg" src="https://static.igem.org/mediawiki/2016/d/d6/T--WashU_StLouis--joinhere.png" alt="You should definitely join" width="200" height="200">
 +
</a>
 +
<!-- The Modal -->
 +
<div id="myModal" class="modal">
 +
 +
  <!-- The Close Button -->
 +
  <span class="close" onclick="document.getElementById('myModal').style.display='none'">&times;</span>
 +
 +
  <!-- Modal Content (The Image) -->
 +
  <img class="modal-content" id="img01">
 +
 +
  <!-- Modal Caption (Image Text) -->
 +
  <div id="caption"></div>
 +
</div>
 +
 +
 +
  
 
     <div id="slide2">
 
     <div id="slide2">
Line 234: Line 340:
 
         <div class="content">
 
         <div class="content">
 
             <div class="quotes_container white_grad">
 
             <div class="quotes_container white_grad">
−
                 <p class="quotes">Ultimately, our project culminated in data that strongly suggested that our plasmids increased intracellular concentrations of ATP and reduced electron-transport proteins. We demonstrated that the latter could be useful for the manufacture of interesting biological products. We registered three working parts – one for ATP, one for electron transport proteins, and one for an inducible promoter. </p>
+
                 <p class="quotes">Ultimately, our project culminated in data that strongly suggested that our plasmids increased intracellular concentrations of ATP and reduced electron-transport proteins. We demonstrated that the latter could be useful for the manufacture of interesting biological products. We submitted three working parts – one for ATP, one for electron transport proteins, and one for an inducible promoter. </p>
 
             </div>
 
             </div>
 
         </div>
 
         </div>
Line 241: Line 347:
  
 
     <div id="slide5">
 
     <div id="slide5">
−
         <div class="content">
+
         <div class="content"style="padding-top: 200px;">
−
             <div class="quotes_container black_grad">
+
             <div class="quotes_container black_grad" >
−
                 <p class="quotes" style="margin-top: 200px;">Throughout the summer, we communicated with other iGEM teams to talk about our project and exchange advice. We even met up with some Midwest teams! We made invaluable connections, learned an incredible amount about synthetic biology, and created lifelong friendships, contributing to a summer research experience that we will never forget.</p>
+
                 <p class="quotes">Throughout the summer, we communicated with other iGEM teams to talk about our project and exchange advice. We even met up with some Midwest teams! We made invaluable connections, learned an incredible amount about synthetic biology, and created lifelong friendships, contributing to a summer research experience that we will never forget.</p>
 
             </div>
 
             </div>
 
         </div>
 
         </div>
Line 251: Line 357:
  
  
−
<div class = "sponsor_div"style = "margin: 0px 0px 0px 0px";>
+
<div class = "my_div"style = "margin: 0px 0px -10px 0px";>
  
 
<div class = "imgwrapper" >
 
<div class = "imgwrapper" >
Line 275: Line 381:
  
 
<script>
 
<script>
 +
 +
// Get the modal
 +
var modal = document.getElementById('myModal');
 +
 +
// Get the image and insert it inside the modal - use its "alt" text as a caption
 +
var img = document.getElementById('myImg');
 +
var modalImg = document.getElementById("img01");
 +
//var captionText = document.getElementById("caption");
 +
img.onclick = function(){
 +
    //document.getElementById("myImg").src="https://static.igem.org/mediawiki/2016/3/30/T--WashU_StLouis--appinfo.png";
 +
    //modal.style.display = "block";
 +
    modalImg.src = this.src;
 +
    captionText.innerHTML = this.alt;
 +
}
 +
 +
// Get the <span> element that closes the modal
 +
var span = document.getElementsByClassName("close")[0];
 +
 +
// When the user clicks on <span> (x), close the modal
 +
/*span.onclick = function() {
 +
    modal.style.display = "none";
 +
    document.getElementById("myImg").src="https://static.igem.org/mediawiki/2016/d/d6/T--WashU_StLouis--joinhere.png";
 +
 +
}*/
 +
 +
 +
 
/*
 
/*
 
$(window).scroll(function () {
 
$(window).scroll(function () {

Latest revision as of 21:11, 17 December 2016

MENU ▤

SUPER CELLS

WashU and Penn State

You should definitely join

In the famous comic series, exposure to Earth’s yellow sun causes Superman's cells to produce and store vast amounts of energy, giving him superhuman strength and abilities. All earth-bound organisms are made of cells, and all cells store energy with the same simple molecule: ATP. Our team designed plasmids that would cause bacteria to overproduce ATP and other important metabolic cofactors. Our hope is that these mutant “Super Cells” can be used in a variety of fields, from protein biosynthesis to agriculture.

As a subsidiary of The Nitrogen Project, a multi-university initiative to solve nitrate runoff through genetic engineering, the primary long term goal of our project is to design crops that require less chemical fertilizer. We met with local St. Louis farmers and environmental activists to get their impressions on genetically modified plants and learn about other solutions to the runoff problem. In the end, their input inspired us to search for other, wider applications of our research.

Ultimately, our project culminated in data that strongly suggested that our plasmids increased intracellular concentrations of ATP and reduced electron-transport proteins. We demonstrated that the latter could be useful for the manufacture of interesting biological products. We submitted three working parts – one for ATP, one for electron transport proteins, and one for an inducible promoter.

Throughout the summer, we communicated with other iGEM teams to talk about our project and exchange advice. We even met up with some Midwest teams! We made invaluable connections, learned an incredible amount about synthetic biology, and created lifelong friendships, contributing to a summer research experience that we will never forget.