Difference between revisions of "Team:NUS Singapore-A"

(Undo revision 333991 by Liyanaaoy (talk))
Line 1: Line 1:
 +
{{NUS_Singapore-A}}
 +
{{:Team:NUS_Singapore-A/Templates/Style}}
 +
 
<html>
 
<html>
 +
 
<head>
 
<head>
−
<meta name="viewport" content="width=device-width, initial-scale=1">
 
 
<meta charset="utf-8">
 
<meta charset="utf-8">
 
<meta http-equiv="X-UA-Compatible" content="IE=edge">
 
<meta http-equiv="X-UA-Compatible" content="IE=edge">
−
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
+
<meta name="viewport" content="width=device-width, initial-scale=1">
−
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:400,400i">
+
 
−
<link rel="icon" href="https://static.igem.org/mediawiki/2018/2/2a/T--NUS_Singapore-A--TeamLogo.png">
+
 
</head>
 
</head>
−
<style>
 
−
/***************************************************** DEFAULT WIKI SETTINGS  ***************************************/
 
−
  /* Clear the default wiki settings */
 
−
       
 
−
  #home_logo, #sideMenu { display:none; }
 
−
  #sideMenu, #top_title, .patrollink  {display:none;}
 
−
  #content { width:100%; padding:0px;  margin-top:-7px; margin-left:0px;}
 
−
  body {background-color:white; }
 
−
  #bodyContent h1, #bodyContent h2, #bodyContent h3, #bodyContent h4, #bodyContent h5 { margin-bottom: 0px; }
 
−
 
 
−
/**************************************************************** MENU ***********************************************/
 
  
  
−
/**** Class for splitting different section = Clear content below while adds extra spacing when clearing content ****/
+
<script>
−
.clear {
+
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
−
    clear:both;
+
−
    height: 50px;
+
−
}
+
  
−
.clear-largespace{
 
−
    clear:both;
 
−
    height: 100px;
 
−
}
 
  
  
−
/************************************************** Back to top button style ****************************************/
+
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
−
#BacktoTopBtn {
+
</script>
−
  display: none;
+
−
  position: fixed;
+
−
  bottom: 20px;
+
−
  right: 50px;
+
−
  z-index: 99;
+
−
  border: none;
+
−
  outline: none;
+
−
  background-color: #F5B041;
+
−
  color: white;
+
−
  cursor: pointer;
+
−
  padding: 15px;
+
−
  border-radius: 20px;
+
−
}
+
  
−
#BacktoTopBtn:hover {
+
<style>
−
   background-color: #2980B9;
+
/**************************************************************************************************************************************************************************************************/
 +
.container{
 +
   position: relative;
 +
  width: 80%;
 +
  margin: 65px auto;
 
}
 
}
−
 
+
.container div{
−
/***************************************** Top menu and Dropdown list **************************************/
+
   position: absolute;
−
 
+
   border-radius: 2px;
−
/* The outer border wraps the content outside of the box */
+
   font-size: 26px;
−
.outer-border{
+
   font-family: Garamond;
−
   max-width: 100%;
+
−
   height: auto;
+
−
  margin: 0px;
+
−
  padding: 35px;
+
−
}
+
−
 
+
−
/*This controls the 'Connect with us' that is rotated on the left side*/
+
−
.nusgem_mail{
+
−
  font-family: "Montserrat";
+
−
   font-size: .9em;
+
−
  letter-spacing: .275em;
+
−
   font-weight: 100;
+
−
  width: auto;
+
−
  height: auto;
+
−
  -ms-transform: rotate(270deg);
+
−
  -webkit-transform: rotate(270deg);
+
−
  transform: rotate(270deg);
+
−
  transform-origin: left 0;
+
−
  position: fixed;
+
−
  top: 400px;
+
−
  left: 12px;
+
−
}
+
−
/* The inner border contains the nav bar, header and whatever content is in the page....I NEED TO USE THIS CLASS FOR EVERY DIV AS AN OVERALL PAGE WRAPPER*/
+
−
.inner-border{
+
−
  border-left: 2px solid black;
+
−
  border-right: 2px solid black;
+
−
  max-width: 100%;
+
−
  height: auto;
+
−
  margin: 5px 5px -10px 5px;
+
 
   text-align: center;
 
   text-align: center;
−
   /*background-color: white;*/
+
   line-height: 1.025;
 
}
 
}
−
 
+
.main-page-img{
−
.content-wrapper{
+
−
  max-width: 90%;
+
−
  position: relative;
+
−
  margin: auto;
+
−
}
+
−
 
+
−
/* The NUSIGEM logo, no background-color added*/
+
−
.nus-logo{
+
−
  max-width: 100%;
+
−
  height: 150px;
+
−
  width: 150px;
+
−
}
+
−
 
+
−
 
+
−
/* The wrapper for the nav menu*/
+
−
.nav {
+
 
   width: 100%;
 
   width: 100%;
−
  height: 60px;
 
−
  /*padding-top: 1em;*/
 
−
/* This color means white and slightly transparent */
 
−
  background-color: rgba(255, 255, 255, 0.82);
 
−
  font-family: "Montserrat";
 
−
  font-weight: 400;
 
−
  letter-spacing: .1em;
 
−
  text-align: center;
 
−
  position: relative;
 
−
  z-index: 3;
 
 
}
 
}
−
 
+
.text-box-description{
−
/* the dropdwn class is given to any button which require a dropdown menu...which is all*/
+
   top: 3.35%;
−
.nav .dropdwn{
+
   left: 3%;
−
   display: inline-block;
+
   width: 45%;  
−
   overflow: hidden;
+
−
   height: 100%;
+
 
}
 
}
−
 
+
.text-box-design{
−
/* The dropdwn-content class contains the hidden content (sub-menu) */
+
   top: 20%;
−
.nav .dropdwn .dropdwn-content{
+
   right: 6%;
−
   display: none;
+
   width: 55%;
−
   position: absolute;
+
−
/*Change this to change the color of the background that houses the dropdown menu content. The last number affects the opacity of the color*/
+
−
   background-color: rgba(255, 255, 255, 0.9);
+
−
  text-align: left;
+
−
  max-width: 250px;
+
−
  z-index: 3;
+
 
}
 
}
−
/* This configures the main button (Project, Hardware, Team, blah blah) */
+
.text-box-ihp{
−
 
+
   top: 37%;
−
.nav .dropdwn button{
+
   left: 6%;
−
  font-family: "Montserrat";
+
   width: 40%;
−
  font-weight: 400;
+
−
   font-size: 1.1em;
+
−
   letter-spacing: 0.2em;
+
−
   margin: auto 10px;
+
−
  padding: 10px 5px;
+
−
  height: 100%;
+
−
  border: none;
+
−
  outline: none;
+
−
  background-color: transparent;
+
−
  display: flex;
+
 
}
 
}
−
/* This styles the links within the dropdwn-content */
+
.text-box-results{
−
.nav .dropdwn .dropdwn-content a{
+
   top: 58%;
−
   float: none;
+
   right: 8%;
−
   padding: 5px; auto;
+
   width: 60%;
−
   margin: auto auto;
+
−
  text-decoration: none;
+
−
  color: black;
+
−
  display: block;
+
−
  min-width: inherit;
+
−
  font-size: 1.1em;
+
−
  font-family: "Montserrat";
+
−
  font-weight: 400;
+
−
  letter-spacing: 0.2em;
+
 
}
 
}
−
 
+
.text-box-modeling{
−
/* Add the hover colors and the reveal of the menu */
+
  top: 75%;
−
.dropdwn:hover {
+
  left: 6%;
−
   background-color: #dddddd;
+
   width: 40%;
 
}
 
}
−
.dropdwn:hover .dropdwn-content {
+
.text-box-team{
−
   display: block;
+
   top: 86%;
−
   }
+
   right: 10%;
−
.dropdwn-content a:hover{
+
   width: 40%;
−
   background-color: #dddddd;
+
 
}
 
}
  
−
/* A sticky class cause this fking mediawiki doesn't have one */
 
−
.sticky{
 
−
  position: fixed;
 
−
  top: 0;
 
−
  left: 0;
 
−
}
 
  
−
/* Hide the link that should open and close the topnav on small screens */
+
</style>
−
.topnav .icon {
+
−
    display: none;
+
−
}
+
  
  
−
/* When the screen is less than 600 pixels wide, hide all links, except for the first one ("Home"). Show the link that contains should open and close the topnav (.icon) */
+
<!------------------------------------------------------ALL HTML BELONGS BELOW HERE------------------------------------------------------------------------------------------------------------------------------------------------------------------------>
−
@media screen and (max-width: 600px) {
+
<head>
−
  .nav a:not(:first-child), .dropdown .dropdwn button {
+
−
    display: none;
+
−
  }
+
−
  .nav a.icon {
+
−
    float: right;
+
−
    display: block;
+
−
  }
+
−
}
+
  
−
/* The "responsive" class is added to the topnav with JavaScript when the user clicks on the icon. This class makes the topnav look good on small screens (display the links vertically instead of horizontally) */
+
</head>
−
@media screen and (max-width: 600px) {
+
−
  .nav.responsive {position: relative;}
+
−
  .nav.responsive a.icon {
+
−
    position: absolute;
+
−
    right: 0;
+
−
    top: 0;
+
−
  }
+
−
  .dropdwn-content.responsive a {
+
−
    float: none;
+
−
    display: block;
+
−
    text-align: left;
+
−
  }
+
−
  .nav.responsive .dropdwn {float: none;}
+
−
  .nav.responsive .dropdwn-content {position: relative;}
+
−
  .nav.responsive .dropdwn .dropdwn button {
+
−
    display: block;
+
−
    width: 100%;
+
−
    text-align: left;
+
−
  }
+
−
}
+
  
−
 
+
<body>
−
 
+
<div class="inner-border" style="border-top: none;">
−
 
+
<div class="all-wrapper" style="background-color: transparent;">
−
/* Positioning and sizing of the social media icons */
+
<div class="content-wrapper">
−
.instalogo{
+
−
  position: fixed;
+
−
  top: 75px;
+
−
  left: 10px;
+
−
  font-size: 2.0em !important;
+
−
  color: #1e1e1e;
+
−
}
+
−
.instalogo:hover{
+
−
  color: #3d4d6d;
+
−
}
+
−
.fblogo{
+
−
  position: fixed;
+
−
  top: 115px;
+
−
  left: 15px;
+
−
  font-size: 1.5em !important;
+
−
  color: #1e1e1e;
+
−
}
+
−
.fblogo:hover{
+
−
  color: #3d4d6d;
+
−
}
+
−
.maillogo{
+
−
  position: fixed;
+
−
  top: 150px;
+
−
  left: 10px;
+
−
  font-size: 1.5em !important;
+
−
  color: #1e1e1e;
+
−
}
+
−
.maillogo:hover{
+
−
  color: #3d4d6d;
+
−
}
+
−
 
+
−
 
+
−
/***********  Change of Background Color *************/
+
−
.bg-primary {
+
−
  background-image: url("https://static.igem.org/mediawiki/2018/0/04/T--NUS_Singapore-A--Wiki_theme5.jpg");
+
−
  background-size: 100% 100%;
+
−
  color: black;
+
−
}
+
−
 
+
−
 
+
−
/*Responsive Design*/
+
−
/*********************  Responsive Design  *********************/
+
−
 
+
−
/*
+
−
  ##Device = Tablets, Ipads (landscape)
+
−
  ##Screen = B/w 768px to 1024px
+
−
*/
+
−
 
+
−
@media (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {
+
 
    
 
    
−
}
+
<div class="container">
 +
<img src="https://static.igem.org/mediawiki/2018/8/8d/T--NUS_Singapore-A--FrontPage_Trans2.png" class="main-page-img">
  
−
/*
 
−
  ##Device = Most of the Smartphones Mobiles (Portrait)
 
−
  ##Screen = B/w 320px to 479px
 
−
  ##Device = Tablets, Ipads (portrait)
 
−
  ##Screen = B/w 768px to 1024px
 
−
*/
 
  
−
@media (min-width: 0px) and (max-width: 1024px) {
+
<div class="text-box-description">Biomanufacturing opens up possibilities for sustainable <br>production of useful materials. <br><br>
−
/*
+
−
/*Basics*/
+
−
  p {
+
−
      font-size: 13px;
+
−
      }
+
−
  .dropdown .dropbtn {
+
−
      font-size: 18px;
+
−
      padding: 7px 4px;
+
−
      font-weight:1000;
+
−
    display: inline-block; 
+
−
  }
+
−
*/
+
−
  .dropdown-content {
+
−
    min-width: 10px;
+
−
    box-shadow: 0px 4px 6px 0px rgba(0,0,0,0.2);
+
−
    }
+
  
−
  .dropdown-content a{
+
We, <b>Team NUSGEM</b>, created <font size="12"><b><i>Coup Dy’état</i></b></font>,<br> <font size="5">an environmentally-friendly platform to advance biomanufacturing.</font><br><br><a href="https://2018.igem.org/Team:NUS_Singapore-A/Description"><b>Discover our project</b></a>
−
    padding: 8px;
+
   </div>
−
   }
+
  
−
/************************************************** Back to top button style **************************************************/
 
  
−
#BacktoTopBtn {
+
   <div class="text-box-design">Current biomanufacturing platforms are <br>chemical-intensive and expensive. <br><br>
−
  display: none;
+
<b><i>Coup Dy’état</i></b> is not only <font size="6"><b>environmentally-friendly</b></font>, but also potentially <font size="6"><b>cheaper</b></font>. <br><br><a href="https://2018.igem.org/Team:NUS_Singapore-A/Design"><b>Find out how we designed our platform</b></a>
−
  position: fixed;
+
</div>
−
  bottom: 3px;
+
−
  right: 10px;
+
−
   z-index: 99;
+
−
  border: none;
+
−
  outline: none;
+
−
  background-color: #F5B041;
+
−
  color: white;
+
−
  cursor: pointer;
+
−
  padding: 5px;
+
−
  border-radius: 20px;
+
−
}
+
  
−
#BacktoTopBtn:hover {
 
−
  background-color: #2980B9;
 
−
}
 
  
−
}
+
  <div class="text-box-ihp">Integrating findings from our human practices has helped us make sure that our platform is <font size="6"><b>relevant</b></font> and <font size="6"><b>useful</b></font> to biomanufacturers. <br><br><a href="https://2018.igem.org/Team:NUS_Singapore-A/Human_Practices"><b>Find out who we spoke to</b></a></div>
−
</style>
+
  
  
 +
  <div class="text-box-results">
  
 +
<br><br> To prove that our platform works, we decided to produce flavonoids to be used as dyes.<br><br>
 +
<i>Why did we choose to produce dyes?</i><br>
 +
The textile dyeing and dyestuff production industry is the second most pollutive industry in the world. <br><br>
 +
Our biomanufacturing platform can <br> <font size="10"><b>help</b></font>.<br><br>
  
−
<script>
+
<a href="https://2018.igem.org/Team:NUS_Singapore-A/Results"><b>See our results</b></a></div>
−
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
+
  
−
   $(document).ready(function() {
+
   <div class="text-box-modeling">No system would work without its <font size="6"><b>support</b></font>.<br><br> Find out how we <a href="https://2018.igem.org/Team:NUS_Singapore-A/Model"><b>modelled</b></a> our complete system and how we built our <a href="https://2018.igem.org/Team:NUS_Singapore-A/Hardware"><b>hardware</b></a> system to support our platform.</div>
  
−
    $("#HQ_page").attr('id','');
 
−
   
 
  
−
    //highlight current page on the menu
+
  <div class="text-box-team">Our team of 13 is made up <font size="6"><b><i>intensely</i> motivated</b></font> students across all disciplines. <br><br><a href="https://2018.igem.org/Team:NUS_Singapore-A/Team"><b>Find out who we are</b></a></div>
−
    highlight_current_page_menu();
+
</div>
−
     
+
−
    //accessing submenus
+
−
    $(".menu_item").click(function(){
+
−
      $(".submenu_control_icon", this).toggleClass("open");
+
−
      $(this).next(".submenu").fadeToggle(400);
+
−
    });
+
−
   
+
−
    //mobile menu access
+
−
    $(".igem_2018_team_mobile_bar").click(function(){
+
−
      $(this).next().toggleClass("displaying_menu");
+
−
    });
+
−
   
+
−
  });
+
  
  
−
    function highlight_current_page_menu() {
 
−
     
 
−
      var page_url="https://2018.igem.org/";
 
−
      page_url = page_url + wgPageName;
 
−
      $("a[href$='"+ page_url +"']").children().addClass("current_page");
 
−
     
 
−
      //if the page is in a submenu, open the submenu and make the appropiate changes
 
−
      if( $( ".current_page" ).hasClass( "submenu_item" )){
 
−
       
 
−
        $(".current_page").parent().parent().fadeToggle(400);
 
−
        $(".current_page").parent().parent().prev().addClass("current_page");
 
−
        $(".menu_item.current_page > .submenu_control_icon").toggleClass("open");
 
−
       
 
−
      }
 
−
    }
 
−
 
−
 
−
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
 
−
</script>
 
−
</head>
 
−
 
−
 
−
 
−
 
−
 
−
<!--********************************  Here is where the main content starts ************************************-->
 
−
 
−
<body>
 
−
<!-------------------------------------START OF NAV BAR HTML------------------------------------------------------>
 
−
 
−
 
−
<div class="nusgem_mail">CONNECT WITH US</div>
 
−
<div class="outer-border bg-primary">
 
−
  <a href="https://www.instagram.com/nusgem2018/"><i class="fa fa-instagram instalogo"></i></a>
 
−
  <a href="https://www.facebook.com/NUSGEM2018/"><i class="fa fa-facebook fblogo"></i></a>
 
−
  <a href="mailto:nusigem@gmail.com"><i class="fa fa-envelope maillogo"></i></a>
 
−
  <div class="inner-border" style="border-top: 2px solid black; background-image: none;">
 
−
    <div style="text-align:center;"><a href="https://2018.igem.org/Team:NUS_Singapore-A"><img class='nus-logo' src='https://static.igem.org/mediawiki/2018/2/2a/T--NUS_Singapore-A--TeamLogo.png' alt='nus logo'></a>
 
 
     </div>
 
     </div>
−
   
+
   </div>
−
    <div class="nav" id="myNav">
+
−
      <div class="dropdwn">
+
−
      <button><a href="https://2018.igem.org/Team:NUS_Singapore-A" clas="active">HOME</a></button>
+
−
      <button>PROJECT</button>
+
−
        <div class="dropdwn-content">
+
−
          <a href="https://2018.igem.org/Team:NUS_Singapore-A/Description">Description</a>
+
−
          <a href="https://2018.igem.org/Team:NUS_Singapore-A/Design">Design</a>
+
−
          <a href="https://2018.igem.org/Team:NUS_Singapore-A/Results">Results</a>
+
−
          <a href="https://2018.igem.org/Team:NUS_Singapore-A/Demonstrate">Demonstrate</a>
+
−
        </div>
+
−
      </div>
+
−
      <div class="dropdwn">
+
−
      <button>LAB</button>
+
−
      <div class="dropdwn-content">
+
−
          <a href="https://2018.igem.org/Team:NUS_Singapore-A/Notebook">Notebook</a>
+
−
          <a href="https://2018.igem.org/Team:NUS_Singapore-A/Safety">Safety</a>
+
−
          <a href="https://2018.igem.org/Team:NUS_Singapore-A/InterLab">InterLab Study</a>
+
−
          <a href="https://2018.igem.org/Team:NUS_Singapore-A/Measurement">Measurement</a>
+
−
      </div>
+
−
      </div>
+
−
 
+
−
      <div class="dropdwn">
+
−
      <button>PARTS</button>
+
−
      <div class="dropdwn-content">
+
−
          <a href="https://2018.igem.org/Team:NUS_Singapore-A/Basic_Part">Basic Parts</a>
+
−
          <a href="https://2018.igem.org/Team:NUS_Singapore-A/Composite_Part">Composite Parts</a>
+
−
          <a href="https://2018.igem.org/Team:NUS_Singapore-A/Improve">Improved Parts</a>
+
−
      </div>
+
−
      </div>
+
−
 
+
−
      <div class="dropdwn">
+
−
      <button>MODELLING</button>
+
−
        <div class="dropdwn-content">
+
−
          <a href="https://2018.igem.org/Team:NUS_Singapore-A/Model">Modelling</a>
+
−
        <!-- <a href="https://2018.igem.org/Team:NUS_Singapore-A/Model/Data">Data</a> -->
+
−
        </div>
+
−
      </div>
+
−
      <div class="dropdwn">
+
−
      <button>HARDWARE</button>
+
−
        <div class="dropdwn-content">
+
−
          <a href="https://2018.igem.org/Team:NUS_Singapore-A/Hardware">Overview</a>
+
−
          <a href="https://2018.igem.org/Team:NUS_Singapore-A/Hardware/PDF-LA!">PDF-LA!</a>       
+
−
          <a href="https://2018.igem.org/Team:NUS_Singapore-A/Hardware/Sensor">Light Wait - 2-in-1 Sensor</a>
+
−
          <a href="https://2018.igem.org/Team:NUS_Singapore-A/Hardware/Pump">Light Wait - Peristaltic Pump</a>
+
−
          <a href="https://2018.igem.org/Team:NUS_Singapore-A/Hardware/CoJar">Light Wait - Fermentation Chamber</a>
+
−
        </div>
+
−
      </div>
+
−
      <div class="dropdwn">
+
−
      <button>HUMAN PRACTICES</button>
+
−
        <div class="dropdwn-content">
+
−
          <a href="https://2018.igem.org/Team:NUS_Singapore-A/Human_Practices">Integrated Human Practices</a>
+
−
          <a href="https://2018.igem.org/Team:NUS_Singapore-A/Public_Engagement">Education & Public Engagement</a>
+
−
          <a href="https://2018.igem.org/Team:NUS_Singapore-A/Collaborative_Report">Collaborative Report</a>
+
−
        </div>
+
−
      </div>
+
−
      <div class="dropdwn">
+
−
        <button>TEAM</button>
+
−
        <div class="dropdwn-content">
+
−
          <a href="https://2018.igem.org/Team:NUS_Singapore-A/Team">Members</a>
+
−
          <a href="https://2018.igem.org/Team:NUS_Singapore-A/Supervisors">Supervisors</a>
+
−
          <a href="https://2018.igem.org/Team:NUS_Singapore-A/Sponsors">Sponsors</a>
+
−
          <a href="https://2018.igem.org/Team:NUS_Singapore-A/Attributions">Attributions</a>
+
−
          <a href="https://2018.igem.org/Team:NUS_Singapore-A/Collaborations">Collaborations</a>
+
−
          <a href="https://2018.igem.org/Team:NUS_Singapore-A/Gallery">Gallery</a>
+
−
        </div>
+
−
      </div>
+
−
      <div class="dropdwn">
+
−
      <button>AWARDS</button>
+
−
      <div class="dropdwn-content">
+
−
          <a href="https://2018.igem.org/Team:NUS_Singapore-A/Medals">Medals</a>
+
−
      </div>
+
−
      <button><a href="javascript:void(0);" class="icon" onclick="myFunction()">&#9776;</a></button>
+
−
    </div>
+
−
   </div>  
+
 
</div>
 
</div>
−
 
−
 
−
<!----------------------------------------SCRIPT FOR STICKY NAV BAR------------------------------------------------->
 
−
<script>
 
−
 
−
var yourNavigation = $(".nav");
 
−
    stickyDiv = "sticky";
 
−
    yourHeader = $('.logo').height()+120;
 
−
 
−
$(window).scroll(function() {
 
−
  if( $(this).scrollTop() > yourHeader ) {
 
−
    yourNavigation.addClass(stickyDiv);
 
−
  } else {
 
−
    yourNavigation.removeClass(stickyDiv);
 
−
  }
 
−
});
 
−
 
−
/* Toggle between adding and removing the "responsive" class to topnav when the user clicks on the icon */
 
−
function myFunction() {
 
−
    var x = document.getElementById("myNav");
 
−
    if (x.className === "nav") {
 
−
        x.className += " responsive";
 
−
    } else {
 
−
        x.className = "nav";
 
−
    }
 
−
}
 
−
 
−
</script>
 
−
<!------------------------------------END OF SCRIPT FOR STICKY NAV BAR----------------------------------------------->
 
−
 
−
<!------------------------------------------END OF NAV BAR HTML------------------------------------------------------>
 
−
 
−
 
−
 
−
 
−
<!--******************************************  Back to top button ***********************************************-->
 
−
<button onclick="topFunction()" id="BacktoTopBtn" title="Go to top">Back to Top</button>
 
−
 
−
 
−
<script>
 
−
//**************************************** Back to top button Javascript ****************************************//
 
−
// When the user scrolls down 50px from the top of the document, show the button
 
−
window.onscroll = function() {scrollFunction()};
 
−
 
−
function scrollFunction() {
 
−
    if (document.body.scrollTop > 500 || document.documentElement.scrollTop > 500) {
 
−
        document.getElementById("BacktoTopBtn").style.display = "block";
 
−
    } else {
 
−
        document.getElementById("BacktoTopBtn").style.display = "none";
 
−
    }
 
−
}
 
−
 
−
// When the user clicks on the button, scroll to the top of the document
 
−
function topFunction() {
 
−
    document.body.scrollTop = 0;
 
−
    document.documentElement.scrollTop = 0;
 
−
}
 
−
</script>
 
  
 
</body>
 
</body>
−
 
  
 
</html>
 
</html>
 +
{{:Team:NUS_Singapore-A/Templates/Footer}}

Revision as of 20:23, 15 October 2018

CONNECT WITH US

Biomanufacturing opens up possibilities for sustainable
production of useful materials.

We, Team NUSGEM, created Coup Dy’état,
an environmentally-friendly platform to advance biomanufacturing.

Discover our project
Current biomanufacturing platforms are
chemical-intensive and expensive.

Coup Dy’état is not only environmentally-friendly, but also potentially cheaper.

Find out how we designed our platform
Integrating findings from our human practices has helped us make sure that our platform is relevant and useful to biomanufacturers.

Find out who we spoke to


To prove that our platform works, we decided to produce flavonoids to be used as dyes.

Why did we choose to produce dyes?
The textile dyeing and dyestuff production industry is the second most pollutive industry in the world.

Our biomanufacturing platform can
help.

See our results
No system would work without its support.

Find out how we modelled our complete system and how we built our hardware system to support our platform.
Our team of 13 is made up intensely motivated students across all disciplines.

Find out who we are


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