Difference between revisions of "Team:NUS Singapore-A/HP/shadow/IntegratedHP"

(Undo revision 141539 by Aaronlcy (talk))
Line 3: Line 3:
  
 
<head>
 
<head>
 +
<link href="https://fonts.googleapis.com/css?family=Montserrat:300,400,600" rel="stylesheet">
 +
<link href="https://fonts.googleapis.com/css?family=Lora:400,400i" rel="stylesheet">
 +
 
<meta name="viewport" content="width=device-width, initial-scale=1">
 
<meta name="viewport" content="width=device-width, initial-scale=1">
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.1.7/vue.js"></script>
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.1.7/vue.js"></script>
 
<script src="https://rawgit.com/Wlada/vue-carousel-3d/master/dist/vue-carousel-3d.min.js"></script>
 
<script src="https://rawgit.com/Wlada/vue-carousel-3d/master/dist/vue-carousel-3d.min.js"></script>
 +
<script type="text/javascript" src="//use.typekit.net/kei2cfp.js"></script>
 +
<script type="text/javascript">try{Typekit.load();}catch(e){}</script>
 
</head>
 
</head>
  
 
<style>
 
<style>
−
/****************************NEW CAROUSEL**********************************/
 
 
.carousel-3d-slide {
 
.carousel-3d-slide {
 
       height: auto !important;
 
       height: auto !important;
 
       background-color: rgba(0, 0, 0, 0.25) !important;
 
       background-color: rgba(0, 0, 0, 0.25) !important;
 
     }
 
     }
−
/**************************END OF NEW CAROUSEL********************************/
+
.ihp-header{
−
 
+
  width: 47.5%;
−
* {box-sizing: border-box;}
+
  height: auto;
−
body {font-family: Verdana, sans-serif;}
+
   margin-left: auto;
−
.mySlides {display: none;}
+
   margin-right: auto;
−
img {vertical-align: middle;}
+
   display: block;
−
 
+
    }
−
/* Slideshow container */
+
   
−
.slideshow-container {
+
    /* Style the tab */
−
   max-width: 1000px;
+
−
   position: relative;
+
−
   margin: auto;
+
−
}
+
  
−
/* Caption text */
+
/* Style the tab boxes */
−
.text {
+
.sponsor-boxes{
−
   color: #f2f2f2;
+
   display: flex;
−
   font-size: 15px;
+
   margin: 15px;
−
   padding: 8px 12px;
+
   color: #000;
−
  position: absolute;
+
−
  bottom: 8px;
+
−
  width: 100%;
+
 
   text-align: center;
 
   text-align: center;
−
}
+
   vertical-align: 50%;
−
/* Number text (1/3 etc) */
+
   outline: none;
−
.numbertext {
+
   border: none;
−
   color: #f2f2f2;
+
   cursor: pointer;
−
   font-size: 12px;
+
   background-color: inherit;
−
   padding: 8px 12px;
+
−
   position: absolute;
+
−
   top: 0;
+
−
}
+
  
−
/* The dots/bullets/indicators */
 
−
.dot {
 
−
  height: 15px;
 
−
  width: 15px;
 
−
  margin: 0 2px;
 
−
  background-color: #bbb;
 
−
  border-radius: 50%;
 
−
  display: inline-block;
 
−
  transition: background-color 0.6s ease;
 
 
}
 
}
  
−
.active {
+
/* Style the img inside the buttons */
−
   background-color: #717171;
+
.sponsors-overview-rows button img{
 +
   max-height:100%;
 +
  max-width:100%;
 
}
 
}
 +
0
  
−
/* Fading animation */
+
/* Create an active/current tablink class */
−
.fade {
+
.sponsors-overview-rows button.active {
−
  -webkit-animation-name: fade;
+
    background-color: #ccc;
−
  -webkit-animation-duration: 1.5s;
+
−
  animation-name: fade;
+
−
  animation-duration: 1.5s;
+
 
}
 
}
  
−
@-webkit-keyframes fade {
+
/* Style the tab content */
−
  from {opacity: .4}
+
.tabcontent {
−
  to {opacity: 1}
+
    display: none;
 +
    padding: 6px 12px;
 +
    border: 1px solid #ccc;
 +
    flex-direction: row;
 +
    justify-content: flex-start;
 +
    align-items: center;
 
}
 
}
−
 
+
.sponsor-pic{
−
@keyframes fade {
+
   display: flex;
−
   from {opacity: .4}
+
   width: 235px;
−
   to {opacity: 1}
+
  max-width: 235px;
 +
  min-width: 235px;
 +
  height: auto;
 
}
 
}
−
 
+
.sponsor-description{
−
/* On smaller screens, decrease text size */
+
  display: flex;
−
@media only screen and (max-width: 300px) {
+
  margin-left: 24px;
−
   .text {font-size: 11px}
+
  font-family: "Lora", sans-serif;
 +
  font-weight: 400;
 +
   font-size: 1.25em;
 +
  line-height: normal;
 +
  text-align: justify;
 
}
 
}
−
.mySlides{
 
−
  text-align: center;
 
−
}
 
−
 
−
.ihp-header{
 
−
  width: 47.5%;
 
−
  height: auto;
 
−
  margin-left: auto;
 
−
  margin-right: auto;
 
−
  display: block;
 
−
    }
 
 
</style>
 
</style>
  
Line 102: Line 86:
 
<div class="inner-border" style="border-top:none;">
 
<div class="inner-border" style="border-top:none;">
  
−
<!--<div style="text-align: center; margin-bottom: -24px;">
 
−
  <img src="https://static.igem.org/mediawiki/2018/f/fd/T--NUS_Singapore-A--IHP_header.png" alt="IHP Header" style="width:50%;">
 
−
</div>
 
−
-->
 
 
<img src="https://static.igem.org/mediawiki/2018/f/fd/T--NUS_Singapore-A--IHP_header.png" class="ihp-header">
 
<img src="https://static.igem.org/mediawiki/2018/f/fd/T--NUS_Singapore-A--IHP_header.png" class="ihp-header">
  
Line 111: Line 91:
 
<div id="carousel">
 
<div id="carousel">
 
   <carousel-3d :autoplay="true" :autoplay-timeout="2400">
 
   <carousel-3d :autoplay="true" :autoplay-timeout="2400">
−
     <slide :index="0"><img src="https://static.igem.org/mediawiki/2018/a/a6/T--NUS_Singapore-A--IHP_FooJeeLoon.jpg"/></slide>
+
     <slide :index="0"><button class="sponsor-boxes tablinks" onclick="openSponsor(event, 'IHP1')"><img src='https://static.igem.org/mediawiki/2018/a/a6/T--NUS_Singapore-A--IHP_FooJeeLoon.jpg' style='max-height:100%;max-width:100%;'></button></slide>
 
     <slide :index="1"><img src="https://static.igem.org/mediawiki/2018/1/14/T--NUS_Singapore-A--IHP_HolgerSchlaefke.jpg"/></slide>
 
     <slide :index="1"><img src="https://static.igem.org/mediawiki/2018/1/14/T--NUS_Singapore-A--IHP_HolgerSchlaefke.jpg"/></slide>
 
     <slide :index="2"><img src="https://static.igem.org/mediawiki/2018/f/f8/T--NUS_Singapore-A--IHP_Gerard_Talhoff.jpg"/></slide>
 
     <slide :index="2"><img src="https://static.igem.org/mediawiki/2018/f/f8/T--NUS_Singapore-A--IHP_Gerard_Talhoff.jpg"/></slide>
Line 122: Line 102:
 
</div>
 
</div>
  
−
<!--
+
<div id="IHP1" class="tabcontent">
−
<div style="text-align: center; margin-bottom: -24px;">
+
    <img src="https://static.igem.org/mediawiki/2018/a/a6/T--NUS_Singapore-A--IHP_FooJeeLoon.jpg" class="sponsor-pic" alt="Dr Foo Jee Loon"></a>
−
  <img src="https://static.igem.org/mediawiki/2018/f/fd/T--NUS_Singapore-A--IHP_header.png" alt="IHP Header" style="width:50%;">
+
    <span class="sponsor-description"> Dr. Foo Jee Loon
−
</div>
+
<br> <br>
−
 
+
Dr. Foo Jee Loon is a senior research fellow from the Department of Biochemistry at the NUS Yong Yoo Lin School of Medicine. We approached him for his expertise in engineering microbes for biochemical production. He reviewed the metabolic pathway that we were proposing and determined that controlling the flux of intermediates was key to allowing our engineered cells to switch between different product pathways.  
−
<div class="slideshow-container">
+
<br><br>  
−
 
+
He noted that the project would be complex due to the large number of enzymes involved. Because of this, he warned us of the large amount of characterization work that would be required if the functional data on these enzymes were unavailable. He advised us to start by engineering a bacterium that could perform the second half of the pathway using one the intermediates as feedstock. At the same time, we could design an efficient and sensitive method to control the expression of key genes to influence the flux of intermediates.  
−
<div class="mySlides fade">
+
<br><br>
−
  <div class="numbertext">1 / 8</div>
+
Some of the other tips he gave us included the use of monoculture rather than polyculture due to
−
  <img src="https://static.igem.org/mediawiki/2018/a/a6/T--NUS_Singapore-A--IHP_FooJeeLoon.jpg" style="width:50%">
+
better mass transfer characteristics. He also introduced us to the concept of bioremediation, which
−
  <div class="text">Dr Foo Lee Joon</div>
+
would further enhance the environmental impact of our project.
−
</div>
+
    </span>
−
 
+
   </div>
−
<div class="mySlides fade">
+
−
  <div class="numbertext">2 / 8</div>
+
−
  <img src="https://static.igem.org/mediawiki/2018/1/14/T--NUS_Singapore-A--IHP_HolgerSchlaefke.jpg" style="width:50%">
+
−
  <div class="text"> Mr Holger Schlaefke</div>
+
−
</div>
+
−
 
+
−
<div class="mySlides fade">
+
−
  <div class="numbertext">3 / 8</div>
+
−
  <img src="https://static.igem.org/mediawiki/2018/f/f8/T--NUS_Singapore-A--IHP_Gerard_Talhoff.jpg" style="width:50%">
+
−
  <div class="text">Mr Gerard Talhoff</div>
+
−
</div>
+
−
 
+
−
<div class="mySlides fade">
+
−
  <div class="numbertext">4 / 8</div>
+
−
  <img src="https://static.igem.org/mediawiki/2018/7/74/T--NUS_Singapore-A--IHP_LeongMinyi.jpg" style="width:50%">
+
−
  <div class="text">Ms Leong Minyi</div>
+
−
</div>
+
−
 
+
−
<div class="mySlides fade">
+
−
  <div class="numbertext">5 / 8</div>
+
−
  <img src="https://static.igem.org/mediawiki/2018/9/97/T--NUS_Singapore-A--IHP_VinodAgnihotri.jpg" style="width:50%">
+
−
  <div class="text">Mr Vinod Agnihotri</div>
+
−
</div>
+
−
 
+
−
<div class="mySlides fade">
+
−
  <div class="numbertext">6 / 8</div>
+
−
  <img src="https://static.igem.org/mediawiki/2018/c/c2/T--NUS_Singapore-A--IHP_AngeleneWong.jpg" style="width:50%">
+
−
  <div class="text">Ms Angelene Wong</div>
+
−
</div>
+
−
 
+
−
<div class="mySlides fade">
+
−
  <div class="numbertext">7 / 8</div>
+
−
  <img src="https://static.igem.org/mediawiki/2018/d/db/T--NUS_Singapore-A--IHP_NicLindley.jpg" style="width:50%">
+
−
  <div class="text">Dr Nic Lindley</div>
+
−
</div>
+
−
 
+
−
<div class="mySlides fade">
+
−
   <div class="numbertext">8 / 8</div>
+
−
  <img src="https://static.igem.org/mediawiki/2018/9/95/T--NUS_Singapore-A--IHP_YvonneChow.jpg" style="width:50%">
+
−
  <div class="text">Dr Yvonne Chow</div>
+
−
</div>
+
−
 
+
−
</div>
+
−
 
+
−
-->
+
−
 
+
  
 
<br>
 
<br>
−
 
−
 
−
<!--
 
−
<div style="text-align:center">
 
−
  <span class="dot"></span>
 
−
  <span class="dot"></span>
 
−
  <span class="dot"></span>
 
−
  <span class="dot"></span>
 
−
  <span class="dot"></span> 
 
−
  <span class="dot"></span>
 
−
  <span class="dot"></span>
 
−
  <span class="dot"></span> 
 
−
</div>
 
−
-->
 
−
 
−
<p style="text-align: center"> Text one? </p>
 
  
 
</div>
 
</div>
Line 205: Line 123:
  
 
<script>
 
<script>
−
 
−
/*
 
−
var slideIndex = 0;
 
−
showSlides();
 
−
 
−
function showSlides() {
 
−
    var i;
 
−
    var slides = document.getElementsByClassName("mySlides");
 
−
    var dots = document.getElementsByClassName("dot");
 
−
    for (i = 0; i < slides.length; i++) {
 
−
      slides[i].style.display = "none"; 
 
−
    }
 
−
    slideIndex++;
 
−
    if (slideIndex > slides.length) {slideIndex = 1}   
 
−
    for (i = 0; i < dots.length; i++) {
 
−
        dots[i].className = dots[i].className.replace(" active", "");
 
−
    }
 
−
    slides[slideIndex-1].style.display = "block"; 
 
−
    dots[slideIndex-1].className += " active";
 
−
    setTimeout(showSlides, 3000); // Change image every 2 seconds
 
−
}
 
−
 
−
*/
 
  
 
new Vue({
 
new Vue({
Line 239: Line 134:
 
   }
 
   }
 
})
 
})
 +
 +
function openSponsor(evt, sponsorName) {
 +
    var i, tabcontent, tablinks;
 +
    tabcontent = document.getElementsByClassName("tabcontent");
 +
    for (i = 0; i < tabcontent.length; i++) {
 +
        tabcontent[i].style.display = "none";
 +
    }
 +
    tablinks = document.getElementsByClassName("tablinks");
 +
    for (i = 0; i < tablinks.length; i++) {
 +
        tablinks[i].className = tablinks[i].className.replace(" active", "");
 +
    }
 +
    document.getElementById(sponsorName).style.display = "flex";
 +
    evt.currentTarget.className += " active";
 +
}
 
</script>
 
</script>
  
 
</html>
 
</html>
 
{{:Team:NUS_Singapore-A/Templates/Footer}}
 
{{:Team:NUS_Singapore-A/Templates/Footer}}

Revision as of 18:59, 13 September 2018

CONNECT WITH US



HEAR OUR STORY

We’re using synthetic biology to change the way the world thinks and functions.

We’re a little disruptive, dangerous and maybe a tad too bold. But the world needs some shaking up every now and then, and we think we’re just the right people for that.

Together we’re going to engineer biology and create something awesome.

CONTACT US

nusigem@gmail.com

21 Lower Kent Ridge Rd, Singapore 119077