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

(Undo revision 476618 by BambooPanda (talk))
Line 1: Line 1:
 
<html>
 
<html>
 
<head>
 
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
+
  <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">
+
<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">
+
  
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
+
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
</head>
+
  <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">
  
 +
  <link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
 +
</head>
 
<style>
 
<style>
 
/***************************************************** DEFAULT WIKI SETTINGS  ***************************************/
 
/***************************************************** DEFAULT WIKI SETTINGS  ***************************************/
Line 56: Line 56:
 
}
 
}
  
/***************End of Back to top button ***********/
 
 
/************************************************** Back to top button style **************************************************/
 
 
#BacktoTopBtn {
 
  display: none;
 
  position: fixed;
 
  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;
 
}
 
 
/*******************/
 
 
 
body, html {
 
    height: 100%;
 
    line-height: 1.8;
 
}
 
 
/***********  Change of Background Color *************/
 
 
body  {
 
    background-image: url("https://static.igem.org/mediawiki/2018/0/04/T--NUS_Singapore-A--Wiki_theme5.jpg");
 
    background-repeat: no-repeat;
 
    background-attachment: fixed;
 
    height: 100%;
 
    background-size: 100% 100%;
 
}
 
 
 
.w3-bar .w3-button {
 
    padding: 16px;
 
}
 
 
.w3-button {
 
  display: inline-block;
 
  font-family: "Montserrat";
 
  font-weight: 400;
 
  font-size: 1.2em;
 
  letter-spacing: 0.1em;
 
  height: 100%;
 
}
 
 
.nav .w3-hide-small a {
 
  display: inline-block;
 
  font-family: "Montserrat";
 
  font-weight: 400;
 
  font-size: 1.2em;
 
  letter-spacing: 0.1em;
 
  height: 100%;
 
  border: none;
 
  outline: none;
 
  background-color: transparent;
 
}
 
 
.w3-dropdown-hover  { 
 
  display: inline-block;
 
  font-family: "Montserrat";
 
  font-weight: 400;
 
  font-size: 1.2em;
 
  letter-spacing: 0.1em;
 
  height: 100%;
 
  border: none;
 
  outline: none;
 
  background-color: transparent;
 
}
 
 
.w3-dropdown-content {
 
  display: none;
 
  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.95);
 
  text-align: left;
 
  max-width: 250px;
 
  z-index: 3;
 
}
 
 
.nav {
 
  width: 100%;
 
  min-height: 45px;
 
  /*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;
 
}
 
  
  
Line 167: Line 65:
 
   height: auto;
 
   height: auto;
 
   margin: 0px;
 
   margin: 0px;
   padding: 35px;
+
   padding-top: 20px;
 +
  padding-left: 35px;
 +
  padding-right: 35px;
 
}
 
}
  
Line 183: Line 83:
 
   transform-origin: left 0;
 
   transform-origin: left 0;
 
   position: fixed;
 
   position: fixed;
   top: 400px;
+
   top: 380px;
   left: 12px;  
+
   left: 10px;
 +
}
 +
 
 +
.welcome-message{
 +
  font-family: "Roboto", sans-serif ;
 +
  font-size: 20px;
 +
  letter-spacing: .1em;
 +
  font-weight: 300;
 +
  width: auto;
 +
  position: absolute;
 +
  top: 20px;
 +
  left: 50px;  
 
}
 
}
  
Line 190: Line 101:
 
.instalogo{
 
.instalogo{
 
   position: fixed;
 
   position: fixed;
   top: 75px;
+
   top: 65px;
   left: 10px;
+
   left: 8px;
 
   font-size: 2.0em !important;
 
   font-size: 2.0em !important;
 
   color: #1e1e1e;
 
   color: #1e1e1e;
Line 200: Line 111:
 
.fblogo{
 
.fblogo{
 
   position: fixed;
 
   position: fixed;
   top: 115px;
+
   top: 108px;
   left: 15px;
+
   left: 12px;
 
   font-size: 1.5em !important;
 
   font-size: 1.5em !important;
 
   color: #1e1e1e;
 
   color: #1e1e1e;
Line 210: Line 121:
 
.maillogo{
 
.maillogo{
 
   position: fixed;
 
   position: fixed;
   top: 150px;
+
   top: 145px;
   left: 10px;
+
   left: 8px;
 
   font-size: 1.5em !important;
 
   font-size: 1.5em !important;
 
   color: #1e1e1e;
 
   color: #1e1e1e;
Line 217: Line 128:
 
.maillogo:hover{
 
.maillogo:hover{
 
   color: #3d4d6d;
 
   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;
 
}
 
}
  
Line 227: Line 146:
 
   max-width: 100%;
 
   max-width: 100%;
 
   height: auto;
 
   height: auto;
   margin: 5px 5px -10px 5px;
+
   margin: 0px 5px -10px 5px;
 
   text-align: center;
 
   text-align: center;
 
   /*background-color: white;*/
 
   /*background-color: white;*/
Line 244: Line 163:
 
   width: 150px;
 
   width: 150px;
 
}
 
}
 +
  
  
Line 250: Line 170:
 
/* The wrapper for the nav menu*/
 
/* The wrapper for the nav menu*/
 
.nav {
 
.nav {
  height: 60px;
 
 
   width: 100%;
 
   width: 100%;
 +
  min-height: 45px;
 
   /*padding-top: 1em;*/
 
   /*padding-top: 1em;*/
 
/* This color means white and slightly transparent */
 
/* This color means white and slightly transparent */
   background-color: rgba(255, 255, 255, 0.82);
+
   background-color: rgba(255, 255, 255, 0.95);
  font-family: "Montserrat";
+
  font-weight: 400;
+
  letter-spacing: .1em;
+
 
   text-align: center;
 
   text-align: center;
 
   position: relative;
 
   position: relative;
Line 265: Line 182:
 
/* Add an active class to highlight the current page */
 
/* Add an active class to highlight the current page */
 
.active {
 
.active {
     background-color:rgba(255, 255, 255, 0.82);
+
     background-color:rgba(255, 255, 255, 0.95);
 
}
 
}
  
/* Hide the link that shoul
+
/* Hide the link that should open and close the topnav on small screens */
    display: none;d open and close the topnav on small screens */
+
 
.nav .icon {
 
.nav .icon {
 +
    display: none;
 
}
 
}
  
 
/* the dropdwn class is given to any button which require a dropdown menu...which is all*/
 
/* the dropdwn class is given to any button which require a dropdown menu...which is all*/
.dropdown{
+
.nav .dropdown{
 
   display: inline-block;
 
   display: inline-block;
 
   overflow: hidden;
 
   overflow: hidden;
 
   height: 100%;
 
   height: 100%;
 +
  margin-top: 8px;
 
}
 
}
  
 
/* This configures the main button (Project, Hardware, Team, blah blah) */
 
/* This configures the main button (Project, Hardware, Team, blah blah) */
.dropdown .dropbtn{
+
.nav .dropdown .dropbtn{
 
   font-family: "Montserrat";
 
   font-family: "Montserrat";
 
   font-weight: 400;
 
   font-weight: 400;
   font-size: 1.1em;
+
   font-size: 1.2em;
   letter-spacing: 0.2em;
+
   letter-spacing: 0.1em;
   margin: auto 10px;
+
   margin: auto 6px;
 
   padding: 10px 5px;
 
   padding: 10px 5px;
 
   height: 100%;
 
   height: 100%;
Line 296: Line 214:
  
 
/* The dropdwn-content class contains the hidden content (sub-menu) */
 
/* The dropdwn-content class contains the hidden content (sub-menu) */
.dropdown-content{
+
.nav .dropdown .dropdown-content{
 
   display: none;
 
   display: none;
 
   position: absolute;
 
   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*/
 
/*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);
+
   background-color: rgba(255, 255, 255, 0.95);
 
   text-align: left;
 
   text-align: left;
 
   max-width: 250px;
 
   max-width: 250px;
Line 307: Line 225:
  
 
/* This styles the links within the dropdwn-content */
 
/* This styles the links within the dropdwn-content */
.dropdown-content a{
+
.nav .dropdown .dropdown-content a{
 
   float: none;
 
   float: none;
   padding: 5px; auto;
+
   padding-top: 5px;
 +
  padding-bottom: 5px;
 +
  padding-left: 4px;
 
   margin: auto auto;
 
   margin: auto auto;
 
   text-decoration: none;
 
   text-decoration: none;
Line 315: Line 235:
 
   display: block;
 
   display: block;
 
   min-width: inherit;
 
   min-width: inherit;
   font-size: 1.1em;
+
   font-size: 1.2em;
   font-family: "Montserrat";
+
   font-family: "Montserrat" !important;
 
   font-weight: 400;
 
   font-weight: 400;
   letter-spacing: 0.2em;
+
   letter-spacing: 0.1em;
 
}
 
}
  
 
/* Add the hover colors and the reveal of the menu */
 
/* Add the hover colors and the reveal of the menu */
.dropdown:hover {
+
.nav .dropdown:hover {
 
   background-color: #dddddd;
 
   background-color: #dddddd;
 
}
 
}
  
.dropdown:hover .dropdown-content {
+
.nav .dropdown:hover .dropdown-content {
 
   display: block;
 
   display: block;
 
}
 
}
  
.dropdown-content a:hover{
+
.nav .dropdown-content a:hover{
 
   background-color: #dddddd;
 
   background-color: #dddddd;
 
}
 
}
Line 337: Line 257:
 
.sticky{
 
.sticky{
 
   position: fixed;
 
   position: fixed;
   top: 0;
+
   top: 1%;
 
   left: 0;
 
   left: 0;
 +
  padding-left: 42px;
 +
  padding-right: 42px;
 
}
 
}
  
  
 
/* 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) */
 
/* 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) */
@media screen and (max-width: 600px) {
+
@media screen and (max-width: 700px) {
   .dropdown .dropbtn, .nusgem_mail, .instalogo, .fblogo, .maillogo, .nus-logo {
+
   .nav .dropdown, .nusgem_mail, .welcome-message, .instalogo, .fblogo, .maillogo, .nus-logo {
 
     display: none;
 
     display: none;
 
   }
 
   }
Line 350: Line 272:
 
     float: right;
 
     float: right;
 
     display: block;
 
     display: block;
 +
    position: relative;
 +
    font-size: 30px;
 
   }
 
   }
 +
  .nav .dropdown .dropdown-content {
 +
    text-align: center;
 +
  }
 +
 
   .outer-border {
 
   .outer-border {
 
     padding: 0px;
 
     padding: 0px;
Line 365: Line 293:
  
 
/* 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) */
 
/* 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) */
@media screen and (max-width: 600px) {
+
@media screen and (max-width: 700px) {
 
   .nav.responsive {position: relative;}
 
   .nav.responsive {position: relative;}
 
   .nav.responsive a.icon {
 
   .nav.responsive a.icon {
 
     position: absolute;
 
     position: absolute;
 
     right: 0;
 
     right: 0;
     top: 0;
+
     top: 2.5%;
 
   }
 
   }
   .nav.responsive .dropdown {float: none;}
+
   .nav.responsive .dropdown {float: none; display: block; background-color: #dddddd;}
   .nav.responsive .dropdown-content {position: relative;}
+
   .nav.responsive .dropdown-content {position: relative; display: block; background-color: #dddddd;}
 
   .nav.responsive .dropdown .dropbtn {
 
   .nav.responsive .dropdown .dropbtn {
 
     display: block;
 
     display: block;
 
     width: 100%;
 
     width: 100%;
     text-align: left;
+
     text-align: center;
 
   }
 
   }
 
}
 
}
  
 +
 +
/************************************************** Back to top button style **************************************************/
 +
 +
#BacktoTopBtn {
 +
  display: none;
 +
  position: fixed;
 +
  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;
 +
}
 +
 +
}
 
</style>
 
</style>
 +
 +
  
  
Line 424: Line 377:
 
       }
 
       }
 
     }
 
     }
 +
  
 
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
 
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
 
</script>
 
</script>
 +
</head>
  
  
  
<body>
 
  
<div class="nusgem_mail">CONNECT WITH US</div>
 
  
<div class="outer-border">
+
<!--********************************  Here is where the main content starts ************************************-->
    <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="background-image: none;">
+
  
 +
<body>
 
<!-------------------------------------START OF NAV BAR HTML------------------------------------------------------>
 
<!-------------------------------------START OF NAV BAR HTML------------------------------------------------------>
  
    <div style="text-align:center;  display:block;"><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 class="welcome-message">Welcome to NUSGEM2018!</div>
    </div>
+
<div class="nusgem_mail">CONNECT WITH US</div>
  
<!-- Navbar in desktop (sit on top) -->
+
<div class="outer-border bg-primary">
<div class="nav" style="display: inline-block;">
+
  <div class="w3-hide-small">
 +
  <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>
  
     <!-- Right-sided navbar links -->
+
  <div class="inner-border" style="background-image: none;">
     <div class="w3-hide-small">
+
     <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>
       <button class="w3-button">
+
   
      <a href="https://2018.igem.org/Team:NUS_Singapore-A" class="w3-bar-item w3-button">HOME</a>
+
     <div class="nav" id="myNav">
      </button>
+
   
 +
       <div class="dropdown">
 +
        <button class="dropbtn">
 +
          <a href="https://2018.igem.org/Team:NUS_Singapore-A" style="text-decoration: none; color: black;">HOME</a>
 +
        </button>
 +
      </div>
  
       <div class="w3-dropdown-hover w3-mobile">
+
       <div class="dropdown">
         <button class="w3-button">PROJECT</i></button>
+
         <button class="dropbtn">PROJECT</button>
         <div class="w3-dropdown-content w3-bar-block">
+
         <div class="dropdown-content">
           <a href="https://2018.igem.org/Team:NUS_Singapore-A/Description" class="w3-bar-item w3-button w3-mobile">Description</a>
+
           <a href="https://2018.igem.org/Team:NUS_Singapore-A/Description">Description</a>
           <a href="https://2018.igem.org/Team:NUS_Singapore-A/Design" class="w3-bar-item w3-button w3-mobile">Design</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" class="w3-bar-item w3-button w3-mobile">Results</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" class="w3-bar-item w3-button w3-mobile">Demonstrate</a>
+
           <a href="https://2018.igem.org/Team:NUS_Singapore-A/Demonstrate">Demonstrate</a>
 
         </div>
 
         </div>
 
       </div>
 
       </div>
 
+
       <div class="dropdown">
       <div class="w3-dropdown-hover w3-mobile">
+
         <button class="dropbtn">LAB</button>
         <button class="w3-button">LAB<i class="fa fa-caret-down"></i></button>
+
         <div class="dropdown-content">
         <div class="w3-dropdown-content w3-bar-block">
+
           <a href="https://2018.igem.org/Team:NUS_Singapore-A/Notebook">Notebook</a>
           <a href="https://2018.igem.org/Team:NUS_Singapore-A/Notebook" class="w3-bar-item w3-button w3-mobile">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/Safety" class="w3-bar-item w3-button w3-mobile">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/InterLab" class="w3-bar-item w3-button w3-mobile">InterLab Study</a>
+
           <a href="https://2018.igem.org/Team:NUS_Singapore-A/Measurement">Measurement</a>
           <a href="hhttps://2018.igem.org/Team:NUS_Singapore-A/Measurement" class="w3-bar-item w3-button w3-mobile">Measurement</a>
+
 
         </div>
 
         </div>
 
       </div>
 
       </div>
  
       <div class="w3-dropdown-hover w3-mobile">
+
       <div class="dropdown">
         <button class="w3-button">PARTS<i class="fa fa-caret-down"></i></button>
+
         <button class="dropbtn">PARTS</button>
         <div class="w3-dropdown-content w3-bar-block">
+
         <div class="dropdown-content">
           <a href="https://2018.igem.org/Team:NUS_Singapore-A/Part_Collection" class="w3-bar-item w3-button w3-mobile">Parts Overview</a>
+
           <a href="https://2018.igem.org/Team:NUS_Singapore-A/Part_Collection">Parts Overview</a>
           <a href="https://2018.igem.org/Team:NUS_Singapore-A/Composite_Part" class="w3-bar-item w3-button w3-mobile">Composite 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" class="w3-bar-item w3-button w3-mobile">Improved Parts</a>
+
           <a href="https://2018.igem.org/Team:NUS_Singapore-A/Improve">Improved Parts</a>
 
         </div>
 
         </div>
 
       </div>
 
       </div>
  
       <a href="https://2018.igem.org/Team:NUS_Singapore-A/Model" class="w3-bar-item w3-button">MODEL</a>
+
       <div class="dropdown">
 
+
        <button class="dropbtn">
       <div class="w3-dropdown-hover w3-mobile">
+
          <a href="https://2018.igem.org/Team:NUS_Singapore-A/Model" style="text-decoration: none; color: black;">MODEL</a>
         <button class="w3-button">HARDWARE<i class="fa fa-caret-down"></i></button>
+
        </button>
         <div class="w3-dropdown-content w3-bar-block">
+
      </div>
           <a href="https://2018.igem.org/Team:NUS_Singapore-A/Hardware" class="w3-bar-item w3-button w3-mobile">Overview</a>
+
     
           <a href="https://2018.igem.org/Team:NUS_Singapore-A/Hardware/PDF-LA!" class="w3-bar-item w3-button w3-mobile">PDF-LA!</a>
+
       <div class="dropdown">
           <a href="https://2018.igem.org/Team:NUS_Singapore-A/Hardware/Sensor" class="w3-bar-item w3-button w3-mobile">2-in-1 Sensor</a>
+
         <button class="dropbtn">HARDWARE</button>
           <a href="https://2018.igem.org/Team:NUS_Singapore-A/Hardware/Pump" class="w3-bar-item w3-button w3-mobile">Peristaltic Pump</a>
+
         <div class="dropdown-content">
           <a href="https://2018.igem.org/Team:NUS_Singapore-A/Hardware/CoJar" class="w3-bar-item w3-button w3-mobile">Fermentation Chamber</a>
+
           <a href="https://2018.igem.org/Team:NUS_Singapore-A/Hardware">Overview</a>
           <a href="https://2018.igem.org/Team:NUS_Singapore-A/Hardware/Futuristic_Bioreactor" class="w3-bar-item w3-button w3-mobile">Futuristic Bioreactor</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>
 +
           <a href="https://2018.igem.org/Team:NUS_Singapore-A/Hardware/Futuristic_Bioreactor">Futuristic Bioreactor</a>
 
         </div>
 
         </div>
 
       </div>
 
       </div>
 
+
     
       <div class="w3-dropdown-hover w3-mobile">
+
       <div class="dropdown">
         <button class="w3-button">HUMAN PRACTICES<i class="fa fa-caret-down"></i></button>
+
         <button class="dropbtn">HUMAN PRACTICES</button>
         <div class="w3-dropdown-content w3-bar-block">
+
         <div class="dropdown-content">
           <a href="https://2018.igem.org/Team:NUS_Singapore-A/Human_Practices" class="w3-bar-item w3-button w3-mobile">Integrated Human Practices</a>
+
           <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" class="w3-bar-item w3-button w3-mobile">Education & Public Engagement</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" class="w3-bar-item w3-button w3-mobile">Collaborative Report</a>
+
           <a href="https://2018.igem.org/Team:NUS_Singapore-A/Collaborative_Report">Collaborative Report</a>
 
         </div>
 
         </div>
 
       </div>
 
       </div>
 
+
     
       <div class="w3-dropdown-hover w3-mobile">
+
       <div class="dropdown">
         <button class="w3-button">TEAM<i class="fa fa-caret-down"></i></button>
+
         <button class="dropbtn">TEAM</button>
         <div class="w3-dropdown-content w3-bar-block">
+
         <div class="dropdown-content">
           <a href="https://2018.igem.org/Team:NUS_Singapore-A/Team" class="w3-bar-item w3-button w3-mobile">Members</a>
+
           <a href="https://2018.igem.org/Team:NUS_Singapore-A/Team">Members</a>
           <a href="https://2018.igem.org/Team:NUS_Singapore-A/Supervisors" class="w3-bar-item w3-button w3-mobile">Supervisors</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" class="w3-bar-item w3-button w3-mobile">Sponsors</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" class="w3-bar-item w3-button w3-mobile">Attributions</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" class="w3-bar-item w3-button w3-mobile">Collaborations</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" class="w3-bar-item w3-button w3-mobile">Gallery</a>
+
           <a href="https://2018.igem.org/Team:NUS_Singapore-A/Gallery">Gallery</a>
 
         </div>
 
         </div>
 
       </div>
 
       </div>
  
       <a href="https://2018.igem.org/Team:NUS_Singapore-A/Medals" class="w3-bar-item w3-button">MEDALS</a>
+
       <div class="dropdown">
 +
        <button class="dropbtn">
 +
          <a href="https://2018.igem.org/Team:NUS_Singapore-A/Medals" style="text-decoration: none; color: black;">MEDAL</a>
 +
        </button>
 +
      </div>
 
        
 
        
    </div>
+
     <a href="javascript:void(0);" class="icon" onclick="myFunction()">&#9776;</a>
    <!-- Hide right-floated links on small screens and replace them with a menu icon -->
+
  </div>  
 
+
     <a href="javascript:void(0)" class="w3-bar-item w3-button w3-right w3-hide-large w3-hide-medium w3-hover-white" onclick="w3_open()"><i class="fa fa-bars"></i></a>
+
 
+
 
</div>
 
</div>
  
 
<!-- NavBar on small screens when clicking the menu icon -->
 
<nav class="w3-sidebar w3-bar-block w3-black w3-card w3-animate-left w3-hide-medium w3-hide-large" style="display:none" id="mySidebar">
 
  <a href="javascript:void(0)" onclick="w3_close()" class="w3-bar-item w3-button w3-large w3-padding-16">Close</a>
 
 
  <a href="https://2018.igem.org/Team:NUS_Singapore-A" onclick="w3_close()" class="w3-bar-item w3-button" onclick="w3_close()">HOME</a>
 
     
 
  <div class="w3-dropdown-hover w3-mobile">
 
    <button class="w3-button">PROJECT<i class="fa fa-caret-down"></i></button>
 
    <div class="w3-dropdown-content w3-bar-block">
 
        <a href="https://2018.igem.org/Team:NUS_Singapore-A/Description" class="w3-bar-item w3-button w3-mobile" onclick="w3_close()">Description</a>
 
        <a href="https://2018.igem.org/Team:NUS_Singapore-A/Design" class="w3-bar-item w3-button w3-mobile" onclick="w3_close()">Design</a>
 
        <a href="https://2018.igem.org/Team:NUS_Singapore-A/Results" class="w3-bar-item w3-button w3-mobile" onclick="w3_close()">Results</a>
 
        <a href="https://2018.igem.org/Team:NUS_Singapore-A/Demonstrate" class="w3-bar-item w3-button w3-mobile" onclick="w3_close()">Demonstrate</a>
 
      </div>
 
  </div>
 
 
  <div class="w3-dropdown-hover w3-mobile">
 
    <button class="w3-button">LAB<i class="fa fa-caret-down"></i></button>
 
    <div class="w3-dropdown-content w3-bar-block">
 
        <a href="https://2018.igem.org/Team:NUS_Singapore-A/Notebook" class="w3-bar-item w3-button w3-mobile" onclick="w3_close()">Notebook</a>
 
        <a href="https://2018.igem.org/Team:NUS_Singapore-A/Safety" class="w3-bar-item w3-button w3-mobile" onclick="w3_close()">Safety</a>
 
        <a href="https://2018.igem.org/Team:NUS_Singapore-A/InterLab" class="w3-bar-item w3-button w3-mobile" onclick="w3_close()">Inter Lab</a>
 
        <a href="hhttps://2018.igem.org/Team:NUS_Singapore-A/Measurement" class="w3-bar-item w3-button w3-mobile" onclick="w3_close()">Measurement</a>
 
    </div>
 
  </div>
 
 
  <div class="w3-dropdown-hover w3-mobile">
 
    <button class="w3-button">PARTS<i class="fa fa-caret-down"></i></button>
 
    <div class="w3-dropdown-content w3-bar-block">
 
        <a href="https://2018.igem.org/Team:NUS_Singapore-A/Part_Collection" class="w3-bar-item w3-button w3-mobile" onclick="w3_close()">Overview</a>
 
        <a href="https://2018.igem.org/Team:NUS_Singapore-A/Composite_Part" class="w3-bar-item w3-button w3-mobile" onclick="w3_close()">Composite Parts</a>
 
        <a href="https://2018.igem.org/Team:NUS_Singapore-A/Improve" class="w3-bar-item w3-button w3-mobile" onclick="w3_close()">Improved Parts</a>
 
    </div>
 
  </div>
 
 
  <a href="https://2018.igem.org/Team:NUS_Singapore-A/Model" class="w3-bar-item w3-button">MODELLING</a>
 
 
  <div class="w3-dropdown-hover w3-mobile">
 
    <button class="w3-button">HARDWARE<i class="fa fa-caret-down"></i></button>
 
    <div class="w3-dropdown-content w3-bar-block">
 
        <a href="https://2018.igem.org/Team:NUS_Singapore-A/Hardware" class="w3-bar-item w3-button w3-mobile" onclick="w3_close()">Overview</a>
 
        <a href="https://2018.igem.org/Team:NUS_Singapore-A/Hardware/PDF-LA!" class="w3-bar-item w3-button w3-mobile" onclick="w3_close()">PDF-LA!</a>
 
        <a href="https://2018.igem.org/Team:NUS_Singapore-A/Hardware/Sensor" class="w3-bar-item w3-button w3-mobile" onclick="w3_close()">2-in-1 Sensor</a>
 
        <a href="https://2018.igem.org/Team:NUS_Singapore-A/Hardware/Pump" class="w3-bar-item w3-button w3-mobile" onclick="w3_close()">Peristaltic Pump</a>
 
        <a href="https://2018.igem.org/Team:NUS_Singapore-A/Hardware/CoJar" class="w3-bar-item w3-button w3-mobile" onclick="w3_close()">Fermentation Chamber</a>
 
    </div>
 
  </div>
 
 
  <div class="w3-dropdown-hover w3-mobile">
 
    <button class="w3-button">HUMAN PRACTICES<i class="fa fa-caret-down"></i></button>
 
    <div class="w3-dropdown-content w3-bar-block">
 
        <a href="https://2018.igem.org/Team:NUS_Singapore-A/Team" class="w3-bar-item w3-button w3-mobile" onclick="w3_close()">Members</a>
 
        <a href="https://2018.igem.org/Team:NUS_Singapore-A/Supervisors" class="w3-bar-item w3-button w3-mobile" onclick="w3_close()">Supervisors</a>
 
        <a href="https://2018.igem.org/Team:NUS_Singapore-A/Sponsors" class="w3-bar-item w3-button w3-mobile" onclick="w3_close()">Sponsors</a>
 
        <a href="https://2018.igem.org/Team:NUS_Singapore-A/Attributions" class="w3-bar-item w3-button w3-mobile" onclick="w3_close()">Attributions</a>
 
        <a href="https://2018.igem.org/Team:NUS_Singapore-A/Collaborations" class="w3-bar-item w3-button w3-mobile" onclick="w3_close()">Collaborations</a>
 
        <a href="https://2018.igem.org/Team:NUS_Singapore-A/Gallery" class="w3-bar-item w3-button w3-mobile" onclick="w3_close()">Gallery</a>
 
    </div>
 
  </div>
 
 
  <a href="https://2018.igem.org/Team:NUS_Singapore-A/Medals" class="w3-bar-item w3-button" onclick="w3_close()">AWARDS</a>
 
 
 
</nav>
 
 
 
  </div>
 
</div>
 
  
 
<!----------------------------------------SCRIPT FOR STICKY NAV BAR------------------------------------------------->
 
<!----------------------------------------SCRIPT FOR STICKY NAV BAR------------------------------------------------->
Line 604: Line 497:
 
var yourNavigation = $(".nav");
 
var yourNavigation = $(".nav");
 
     stickyDiv = "sticky";
 
     stickyDiv = "sticky";
     yourHeader = $('.logo').height()+120;
+
     yourHeader = $('.logo').height()+225;
  
 
$(window).scroll(function() {
 
$(window).scroll(function() {
Line 624: Line 517:
 
     }
 
     }
 
}
 
}
 
 
  
 
</script>
 
</script>
Line 658: Line 549:
 
}
 
}
 
</script>
 
</script>
 
 
  
 
</body>
 
</body>
  
<script>
 
// Modal Image Gallery
 
function onClick(element) {
 
  document.getElementById("img01").src = element.src;
 
  document.getElementById("modal01").style.display = "block";
 
  var captionText = document.getElementById("caption");
 
  captionText.innerHTML = element.alt;
 
}
 
 
 
// Toggle between showing and hiding the sidebar when clicking the menu icon
 
var mySidebar = document.getElementById("mySidebar");
 
 
function w3_open() {
 
    if (mySidebar.style.display === 'block') {
 
        mySidebar.style.display = 'none';
 
    } else {
 
        mySidebar.style.display = 'block';
 
    }
 
}
 
 
// Close the sidebar with the close button
 
function w3_close() {
 
    mySidebar.style.display = "none";
 
}
 
</script>
 
  
 
</html>
 
</html>

Revision as of 01:38, 18 October 2018

Welcome to NUSGEM2018!
CONNECT WITH US