Difference between revisions of "Team:Macquarie Australia"

Line 3: Line 3:
 
<html>
 
<html>
  
−
<link href="https://2018.igem.org/Team:Macquarie_Australia/CSS_Navbar?action=raw&ctype=text/css" rel="stylesheet">
+
    <link href="https://2018.igem.org/Team:Macquarie_Australia/CSS_Navbar?action=raw&ctype=text/css" rel="stylesheet">
  
  
−
<link href="https://fonts.googleapis.com/css?family=Quicksand:300,400|Roboto:400,400i" rel="stylesheet">  
+
    <link href="https://fonts.googleapis.com/css?family=Quicksand:300,400|Roboto:400,400i" rel="stylesheet">  
  
  
  
−
<head>
+
    <head>
−
<meta name="viewport" content="width=device-width, initial-scale=1">
+
        <meta name="viewport" content="width=device-width, initial-scale=1">
−
<style>
+
        <style>
−
DO NOT REMOVE
+
            DO NOT REMOVE
−
#content {
+
            #content {
−
    width: 100vw;
+
                width: 100vw;
−
    margin: 0;
+
                margin: 0;
−
    padding: 0;
+
                padding: 0;
−
}
+
            }
  
−
/* Clear the 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: #f2f2f2; }
+
−
#bodyContent h1, #bodyContent h2, #bodyContent h3, #bodyContent h4, #bodyContent h5 { margin-bottom: 0px; }
+
  
−
/********************************* DEFAULT WIKI SETTINGS  ********************************/
+
            #home_logo, #sideMenu { display:none; }
−
/*FROM STYLESHEET*/
+
            #sideMenu, #top_title, .patrollink  {display:none;}
−
   
+
            #content { width:100%; padding:0px; margin-top:-7px; margin-left:0px;}
−
.dropdown-menu {
+
            body {background-color: #f2f2f2; }
−
  position: absolute;
+
            #bodyContent h1, #bodyContent h2, #bodyContent h3, #bodyContent h4, #bodyContent h5 { margin-bottom: 0px; }
−
  top: 100%;
+
−
  left: 0;
+
−
  z-index: 1000;
+
−
  display: none;
+
−
  float: left;
+
−
  min-width: 160px;
+
−
  padding: 5px 0;
+
−
  margin: 2px 0 0;
+
−
  font-size: 14px;
+
−
  text-align: left;
+
−
  list-style: none;
+
−
  background-color: #fff;
+
−
  -webkit-background-clip: padding-box;
+
−
          background-clip: padding-box;
+
−
  border: 1px solid #ccc;
+
−
  border: 1px solid rgba(0, 0, 0, .15);
+
−
  border-radius: 4px;
+
−
  -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
+
−
          box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
+
−
}
+
−
/* Prevents header buttons fron turning dark upon hover */
+
−
    .navbar-default .navbar-nav > li > a:hover,
+
−
.navbar-default .navbar-nav > li > a:focus {
+
−
  color: #333;
+
−
  background-color: transparent;
+
−
}
+
  
−
/* Makes menu buttons stick to right hand side of screen */
+
            /********************************* DEFAULT WIKI SETTINGS  ********************************/
−
@media (min-width: 768px) {
+
            /*FROM STYLESHEET*/
−
  .navbar-left {
+
−
    float: left !important;
+
−
  }
+
−
  .navbar-right {
+
−
    float: right !important;
+
−
    margin-right: -5px;
+
−
  }
+
−
  .navbar-right ~ .navbar-right {
+
−
    margin-right: 0;
+
−
  }
+
−
}
+
  
−
/* Makes drop-downs appear left to right instead of up to down */
+
            .dropdown-menu {
−
@media (min-width: 768px) {
+
                position: absolute;
−
  .navbar-nav {
+
                top: 100%;
−
    float: left;
+
                left: 0;
−
    margin: 0;
+
                z-index: 1000;
−
  }
+
                display: none;
−
  .navbar-nav > li {
+
                float: left;
−
    float: left;
+
                min-width: 160px;
−
  }
+
                padding: 5px 0;
−
  .navbar-nav > li > a {
+
                margin: 2px 0 0;
−
    padding-top: 15px;
+
                font-size: 14px;
−
    padding-bottom: 15px;
+
                text-align: left;
−
  }
+
                list-style: none;
−
}
+
                background-color: #fff;
 +
                -webkit-background-clip: padding-box;
 +
                background-clip: padding-box;
 +
                border: 1px solid #ccc;
 +
                border: 1px solid rgba(0, 0, 0, .15);
 +
                border-radius: 4px;
 +
                -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
 +
                box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
 +
            }
 +
            /* Prevents header buttons fron turning dark upon hover */
 +
            .navbar-default .navbar-nav > li > a:hover,
 +
            .navbar-default .navbar-nav > li > a:focus {
 +
                color: #333;
 +
                background-color: transparent;
 +
            }
  
−
/* Formatting navbar */
+
            /* Makes menu buttons stick to right hand side of screen */
−
.navbar-fixed-top {
+
            @media (min-width: 768px) {
−
  top: 0;
+
                .navbar-left {
−
  border-width: 0 0 1px;
+
                    float: left !important;
−
}
+
                }
−
.navbar-fixed-top,
+
                .navbar-right {
−
.navbar-fixed-bottom {
+
                    float: right !important;
−
  position: fixed;
+
                    margin-right: -5px;
−
  right: 0;
+
                }
−
  left: 0;
+
                .navbar-right ~ .navbar-right {
−
  z-index: 1030;
+
                    margin-right: 0;
−
}
+
                }
−
@media (min-width: 768px) {
+
            }
−
  .container > .navbar-header,
+
−
  .container-fluid > .navbar-header,
+
−
  .container > .navbar-collapse,
+
−
  .container-fluid > .navbar-collapse {
+
−
    margin-right: 0;
+
−
    margin-left: 0;
+
−
  }
+
−
}
+
−
a {
+
−
  color: #337ab7;
+
−
  text-decoration: none;
+
−
}
+
−
@media (min-width: 768px) {
+
−
  .navbar-header {
+
−
    float: left;
+
−
  }
+
−
}
+
−
.nav > li > a {
+
−
  position: relative;
+
−
  display: block;
+
−
  padding: 10px 15px;
+
−
}
+
−
.nav {
+
−
  padding-left: 0;
+
−
  margin-bottom: 0;
+
−
  list-style: none;
+
−
}
+
−
.dropdown-menu > li > a {
+
−
  display: block;
+
−
  padding: 3px 20px;
+
−
  clear: both;
+
−
  font-weight: normal;
+
−
  line-height: 1.42857143;
+
−
  color: #333;
+
−
  white-space: nowrap;
+
−
}
+
−
.dropup,
+
−
.dropdown {
+
−
  position: relative;
+
−
}
+
−
.caret {
+
−
  display: inline-block;
+
−
  width: 0;
+
−
  height: 0;
+
−
  margin-left: 2px;
+
−
  vertical-align: middle;
+
−
  border-top: 4px dashed;
+
−
  border-top: 4px solid \9;
+
−
  border-right: 4px solid transparent;
+
−
  border-left: 4px solid transparent;
+
−
}
+
−
.img-responsive,
+
−
.thumbnail > img,
+
−
.thumbnail a > img,
+
−
.carousel-inner > .item > img,
+
−
.carousel-inner > .item > a > img {
+
−
  display: block;
+
−
  max-width: 100%;
+
−
  height: auto;
+
−
}
+
  
 +
            /* Makes drop-downs appear left to right instead of up to down */
 +
            @media (min-width: 768px) {
 +
                .navbar-nav {
 +
                    float: left;
 +
                    margin: 0;
 +
                }
 +
                .navbar-nav > li {
 +
                    float: left;
 +
                }
 +
                .navbar-nav > li > a {
 +
                    padding-top: 15px;
 +
                    padding-bottom: 15px;
 +
                }
 +
            }
  
 +
            /* Formatting navbar */
 +
            .navbar-fixed-top {
 +
                top: 0;
 +
                border-width: 0 0 1px;
 +
            }
 +
            .navbar-fixed-top,
 +
            .navbar-fixed-bottom {
 +
                position: fixed;
 +
                right: 0;
 +
                left: 0;
 +
                z-index: 1030;
 +
            }
 +
            @media (min-width: 768px) {
 +
                .container > .navbar-header,
 +
                .container-fluid > .navbar-header,
 +
                .container > .navbar-collapse,
 +
                .container-fluid > .navbar-collapse {
 +
                    margin-right: 0;
 +
                    margin-left: 0;
 +
                }
 +
            }
 +
            a {
 +
                color: #337ab7;
 +
                text-decoration: none;
 +
            }
 +
            @media (min-width: 768px) {
 +
                .navbar-header {
 +
                    float: left;
 +
                }
 +
            }
 +
            .nav > li > a {
 +
                position: relative;
 +
                display: block;
 +
                padding: 10px 15px;
 +
            }
 +
            .nav {
 +
                padding-left: 0;
 +
                margin-bottom: 0;
 +
                list-style: none;
 +
            }
 +
            .dropdown-menu > li > a {
 +
                display: block;
 +
                padding: 3px 20px;
 +
                clear: both;
 +
                font-weight: normal;
 +
                line-height: 1.42857143;
 +
                color: #333;
 +
                white-space: nowrap;
 +
            }
 +
            .dropup,
 +
            .dropdown {
 +
                position: relative;
 +
            }
 +
            .caret {
 +
                display: inline-block;
 +
                width: 0;
 +
                height: 0;
 +
                margin-left: 2px;
 +
                vertical-align: middle;
 +
                border-top: 4px dashed;
 +
                border-top: 4px solid \9;
 +
                border-right: 4px solid transparent;
 +
                border-left: 4px solid transparent;
 +
            }
 +
            .img-responsive,
 +
            .thumbnail > img,
 +
            .thumbnail a > img,
 +
            .carousel-inner > .item > img,
 +
            .carousel-inner > .item > a > img {
 +
                display: block;
 +
                max-width: 100%;
 +
                height: auto;
 +
            }
  
−
/*END FROM SPREADHEET */
 
  
  
 +
            /*END FROM SPREADHEET */
  
  
  
−
/* Navbar */
 
  
−
.some-padding {
 
−
  padding-top: 20px;
 
−
}
 
  
 +
            /* Navbar */
  
−
/*adds necessary spacing to the navbar so links display correctly below the black iGEM navbar */
+
            .some-padding {
 +
                padding-top: 20px;
 +
            }
  
−
.navbar-default {
 
−
  background-color: white;
 
−
  border-color: rgba(255, 255, 255, 0.3);
 
−
  font-family: 'Quicksand', sans-serif;
 
−
  font-weight: 300;
 
−
  -webkit-transition: all 0.35s;
 
−
  -moz-transition: all 0.35s;
 
−
  transition: all 0.35s;
 
−
}
 
  
−
.navbar-default .navbar-header .navbar-brand {
+
            /*adds necessary spacing to the navbar so links display correctly below the black iGEM navbar */
−
  color: #52658F;
+
−
  font-family: 'Quicksand', sans-serif;
+
−
  font-weight: bold;
+
−
  font-size: 22px;
+
−
  display: inline-block;
+
−
}
+
  
 +
            .navbar-default {
 +
                background-color: white;
 +
                border-color: rgba(255, 255, 255, 0.3);
 +
                font-family: 'Quicksand', sans-serif;
 +
                font-weight: 300;
 +
                -webkit-transition: all 0.35s;
 +
                -moz-transition: all 0.35s;
 +
                transition: all 0.35s;
 +
            }
  
−
.navbar-default .navbar-header .navbar-brand:hover,
+
            .navbar-default .navbar-header .navbar-brand {
−
.navbar-default .navbar-header .navbar-brand:focus {
+
                color: #52658F;
−
  color: #52658F;
+
                font-family: 'Quicksand', sans-serif;
−
}
+
                font-weight: bold;
 +
                font-size: 22px;
 +
                display: inline-block;
 +
            }
  
−
.navbar-default .navbar-header .navbar-toggle {
 
−
  font-family: 'Quicksand', sans-serif;
 
−
  font-weight: 400;
 
−
  font-size: 14px;
 
−
  color: #333A56;
 
−
  text-transform: uppercase;
 
−
}
 
  
−
.navbar-default .nav > li > a,
+
            .navbar-default .navbar-header .navbar-brand:hover,
−
.navbar-default .nav > li > a:focus {
+
            .navbar-default .navbar-header .navbar-brand:focus {
−
  text-transform: uppercase;
+
                color: #52658F;
−
  font-family: 'Quicksand', sans-serif;
+
            }
−
  font-weight: 400;
+
−
  font-size: 14px;
+
−
  color: #222222;
+
−
}
+
  
−
.navbar-default .nav > li > a:hover,
+
            .navbar-default .navbar-header .navbar-toggle {
−
.navbar-default .nav > li > a:focus:hover {
+
                font-family: 'Quicksand', sans-serif;
−
  color: #333A56;
+
                font-weight: 400;
−
}
+
                font-size: 14px;
 +
                color: #333A56;
 +
                text-transform: uppercase;
 +
            }
  
−
.navbar-default .nav > li.active > a,
+
            .navbar-default .nav > li > a,
−
.navbar-default .nav > li.active > a:focus {
+
            .navbar-default .nav > li > a:focus {
−
  color: #333A56 !important;
+
                text-transform: uppercase;
−
  background-color: white;
+
                font-family: 'Quicksand', sans-serif;
−
}
+
                font-weight: 400;
 +
                font-size: 14px;
 +
                color: #222222;
 +
            }
  
−
.navbar-default .nav > li.active > a:hover,
+
            .navbar-default .nav > li > a:hover,
−
.navbar-default .nav > li.active > a:focus:hover {
+
            .navbar-default .nav > li > a:focus:hover {
−
  background-color: white;
+
                color: #333A56;
−
}
+
            }
  
−
.navbar-default .navbar-toggle {
+
            .navbar-default .nav > li.active > a,
−
  border: none;
+
            .navbar-default .nav > li.active > a:focus {
−
}
+
                color: #333A56 !important;
 +
                background-color: white;
 +
            }
  
−
.navbar-default .dropdown-menu > li > a:hover,
+
            .navbar-default .nav > li.active > a:hover,
−
.navbar-default .dropdown-menu > li > a:focus {
+
            .navbar-default .nav > li.active > a:focus:hover {
−
  background-color: #F7F5E6;
+
                background-color: white;
−
  color: #333A56;
+
            }
−
}
+
  
−
.navbar-default .dropdown-menu {
+
            .navbar-default .navbar-toggle {
−
  border: none;
+
                border: none;
−
  outline: none;
+
            }
−
  font-family: 'Quicksand', sans-serif;
+
−
  text-transform: uppercase;
+
−
  font-weight: 400 !important;
+
−
  font-size: 13.2px !important;
+
−
  color: #222222;
+
−
}
+
  
−
#sitelinks a {
+
            .navbar-default .dropdown-menu > li > a:hover,
−
  display: inline-block;
+
            .navbar-default .dropdown-menu > li > a:focus {
−
  border: 3px solid #fff;
+
                background-color: #F7F5E6;
−
  color: #fff;
+
                color: #333A56;
−
  padding: 10px 20px;
+
            }
−
  margin: 10px
+
−
}
+
  
−
#footer {
+
            .navbar-default .dropdown-menu {
−
  background: #333;
+
                border: none;
−
  text-align: center;
+
                outline: none;
−
  color: #fff;
+
                font-family: 'Quicksand', sans-serif;
−
  line-height: 50px;
+
                text-transform: uppercase;
−
}
+
                font-weight: 400 !important;
 +
                font-size: 13.2px !important;
 +
                color: #222222;
 +
            }
  
−
#footer a {
+
            #sitelinks a {
−
  color: #fff;
+
                display: inline-block;
−
}
+
                border: 3px solid #fff;
 +
                color: #fff;
 +
                padding: 10px 20px;
 +
                margin: 10px
 +
            }
  
 +
            #footer {
 +
                background: #333;
 +
                text-align: center;
 +
                color: #fff;
 +
                line-height: 50px;
 +
            }
  
 +
            #footer a {
 +
                color: #fff;
 +
            }
  
−
   
 
−
/*END FROM STYLESHEET*/
 
  
−
body {
 
−
  background-color: #f2f2f2;
 
−
  width: 100%;
 
−
  z-index: 3;
 
−
}
 
  
  
−
#bodyContent {
+
            /*END FROM STYLESHEET*/
−
  padding-right: 0px;
+
−
  padding-top: 50px;
+
−
  width: 100 vw;
+
−
  background-color: #f2f2f2;
+
−
}
+
  
−
#globalWrapper {
+
            body {
−
  font-size: 100%;
+
                background-color: #f2f2f2;
−
  padding: 0px;
+
                width: 100%;
−
  margin: -10px -20px -20px -20px;
+
                z-index: 3;
−
}
+
            }
  
−
.navbar-collapse {
 
−
  padding-left: 0px;
 
−
}
 
  
−
#banner {
+
            #bodyContent {
−
  margin-top: 50px;
+
                padding-right: 0px;
−
}
+
                padding-top: 50px;
 +
                width: 100 vw;
 +
                background-color: #f2f2f2;
 +
            }
  
−
#sideMenu {
+
            #globalWrapper {
−
  margin-top: 10px;
+
                font-size: 100%;
−
}
+
                padding: 0px;
 +
                margin: -10px -20px -20px -20px;
 +
            }
  
−
.dropdown-menu li:hover .sub-menu {
+
            .navbar-collapse {
−
  visibility: visible;
+
                padding-left: 0px;
−
}
+
            }
  
−
.dropdown:hover .dropdown-menu {
+
            #banner {
−
  display: block;
+
                margin-top: 50px;
−
}
+
            }
  
−
.navbar-nav .dropdown-menu,
+
            #sideMenu {
−
.navbar .dropdown-menu {
+
                margin-top: 10px;
−
  margin-top: 0;
+
            }
−
}
+
  
 +
            .dropdown-menu li:hover .sub-menu {
 +
                visibility: visible;
 +
            }
  
−
/********************************* CONTENT OF THE PAGE ********************************/
+
            .dropdown:hover .dropdown-menu {
 +
                display: block;
 +
            }
  
 +
            .navbar-nav .dropdown-menu,
 +
            .navbar .dropdown-menu {
 +
                margin-top: 0;
 +
            }
  
−
/* Wrapper for the content */
 
  
−
.content_wrapper {
+
            /********************************* CONTENT OF THE PAGE ********************************/
−
  width: 85%%;
+
−
  margin-left: 150px;
+
−
  padding: 0px;
+
−
  float: left;
+
−
  background-color: #f2f2f2;
+
−
}
+
  
  
−
/*LAYOUT */
+
            /* Wrapper for the content */
  
 +
            .content_wrapper {
 +
                width: 85%%;
 +
                margin-left: 150px;
 +
                padding: 0px;
 +
                float: left;
 +
                background-color: #f2f2f2;
 +
            }
  
−
.full_size {
 
−
  width: 100%;
 
−
}
 
  
−
.full_size img {
+
            /*LAYOUT */
−
  padding: 10px 15px;
+
−
  width: 96.5%;
+
−
}
+
  
−
.half_size {
 
−
  width: 50%;
 
−
}
 
  
−
.half_size img {
+
            .full_size {
−
  padding: 10px 15px;
+
                width: 100%;
−
  width: 93%;
+
            }
−
}
+
  
−
.img:hover {
+
            .full_size img {
−
  opacity: 1.0 !important;
+
                padding: 10px 15px;
−
}
+
                width: 96.5%;
 +
            }
  
 +
            .half_size {
 +
                width: 50%;
 +
            }
  
 +
            .half_size img {
 +
                padding: 10px 15px;
 +
                width: 93%;
 +
            }
  
−
/*STYLING */
+
            .img:hover {
 +
                opacity: 1.0 !important;
 +
            }
  
  
−
/* styling for the titles */
 
  
−
.content_wrapper h1,
+
            /*STYLING */
−
.content_wrapper h2 {
+
−
  padding: 5px 15px;
+
−
  border-bottom: 0px;
+
−
  color: #72c9b6;
+
−
}
+
  
−
.content_wrapper h3,
 
−
.content_wrapper h4,
 
−
.content_wrapper h5,
 
−
.content_wrapper h6 {
 
−
  padding: 5px 15px;
 
−
  border-bottom: 0px;
 
−
  color: #000000;
 
−
}
 
  
 +
            /* styling for the titles */
  
−
/* font and text */
+
            .content_wrapper h1,
 +
            .content_wrapper h2 {
 +
                padding: 5px 15px;
 +
                border-bottom: 0px;
 +
                color: #72c9b6;
 +
            }
  
−
.content_wrapper p {
+
            .content_wrapper h3,
−
  padding: 0px 15px;
+
            .content_wrapper h4,
−
  font-size: 13px;
+
            .content_wrapper h5,
−
  font-family: 'Roboto', sans-serif;
+
            .content_wrapper h6 {
−
}
+
                padding: 5px 15px;
 +
                border-bottom: 0px;
 +
                color: #000000;
 +
            }
  
  
−
/* Links */
+
            /* font and text */
  
−
.content_wrapper a {
+
            .content_wrapper p {
−
  font-weight: bold;
+
                padding: 0px 15px;
−
  text-decoration: underline;
+
                font-size: 13px;
−
  text-decoration-color: #72c9b6;
+
                font-family: 'Roboto', sans-serif;
−
  color: #72c9b6;
+
            }
−
  -webkit-transition: all 0.4s ease;
+
−
  -moz-transition: all 0.4s ease;
+
−
  -ms-transition: all 0.4s ease;
+
−
  -o-transition: all 0.4s ease;
+
−
  transition: all 0.4s ease;
+
−
}
+
  
  
−
/* hover for the links */
+
            /* Links */
  
−
.content_wrapper a:hover {
+
            .content_wrapper a {
−
  text-decoration: none;
+
                font-weight: bold;
−
  color: #000000;
+
                text-decoration: underline;
−
}
+
                text-decoration-color: #72c9b6;
 +
                color: #72c9b6;
 +
                -webkit-transition: all 0.4s ease;
 +
                -moz-transition: all 0.4s ease;
 +
                -ms-transition: all 0.4s ease;
 +
                -o-transition: all 0.4s ease;
 +
                transition: all 0.4s ease;
 +
            }
  
  
−
/* non numbered lists */
+
            /* hover for the links */
  
−
.content_wrapper ul {
+
            .content_wrapper a:hover {
−
  padding: 0px 20px;
+
                text-decoration: none;
−
  font-size: 13px;
+
                color: #000000;
−
  font-family: 'Quicksand', sans-serif;
+
            }
−
}
+
  
  
−
/* numbered lists */
+
            /* non numbered lists */
  
−
.content_wrapper ol {
+
            .content_wrapper ul {
−
  padding: 0px;
+
                padding: 0px 20px;
−
  font-size: 13px;
+
                font-size: 13px;
−
  font-family: 'Quicksand', sans-serif;
+
                font-family: 'Quicksand', sans-serif;
−
}
+
            }
  
  
−
/* Table */
+
            /* numbered lists */
  
−
.content_wrapper table {
+
            .content_wrapper ol {
−
  width: 97%;
+
                padding: 0px;
−
  margin: 15px 10px;
+
                font-size: 13px;
−
  border: 1px solid #d3d3d3;
+
                font-family: 'Quicksand', sans-serif;
−
  border-collapse: collapse;
+
            }
−
}
+
  
  
−
/* table cells */
+
            /* Table */
  
−
.content_wrapper td {
+
            .content_wrapper table {
−
  padding: 10px;
+
                width: 97%;
−
  vertical-align: text-top;
+
                margin: 15px 10px;
−
  border: 1px solid #d3d3d3;
+
                border: 1px solid #d3d3d3;
−
  border-collapse: collapse;
+
                border-collapse: collapse;
−
}
+
            }
  
  
−
/* table headers */
+
            /* table cells */
  
−
.content_wrapper th {
+
            .content_wrapper td {
−
  padding: 10px;
+
                padding: 10px;
−
  vertical-align: text-top;
+
                vertical-align: text-top;
−
  border: 1px solid #d3d3d3;
+
                border: 1px solid #d3d3d3;
−
  border-collapse: collapse;
+
                border-collapse: collapse;
−
  background-color: #f2f2f2;
+
            }
−
}
+
  
  
−
/* Button class */
+
            /* table headers */
  
−
.button_click {
+
            .content_wrapper th {
−
  margin: 10px auto;
+
                padding: 10px;
−
  padding: 15px;
+
                vertical-align: text-top;
−
  width: 12%;
+
                border: 1px solid #d3d3d3;
−
  text-align: center;
+
                border-collapse: collapse;
−
  font-weight: bold;
+
                background-color: #f2f2f2;
−
  background-color: #72c9b6;
+
            }
−
  cursor: pointer;
+
−
  -webkit-transition: all 0.4s ease;
+
−
  -moz-transition: all 0.4s ease;
+
−
  -ms-transition: all 0.4s ease;
+
−
  -o-transition: all 0.4s ease;
+
−
  transition: all 0.4s ease;
+
−
}
+
  
  
−
/* button class on hover */
+
            /* Button class */
  
−
.button_click:hover {
+
            .button_click {
−
  background-color: #000000;
+
                margin: 10px auto;
−
  color: #72c9b6;
+
                padding: 15px;
−
}
+
                width: 12%;
 +
                text-align: center;
 +
                font-weight: bold;
 +
                background-color: #72c9b6;
 +
                cursor: pointer;
 +
                -webkit-transition: all 0.4s ease;
 +
                -moz-transition: all 0.4s ease;
 +
                -ms-transition: all 0.4s ease;
 +
                -o-transition: all 0.4s ease;
 +
                transition: all 0.4s ease;
 +
            }
  
−
.top-pad {
 
−
  padding: 35px;
 
−
}
 
  
−
   
+
            /* button class on hover */
−
   
+
−
   
+
−
/* NEW STUFF FROM CURRENT PAGE
+
−
   
+
  
 +
            .button_click:hover {
 +
                background-color: #000000;
 +
                color: #72c9b6;
 +
            }
  
−
/* side columns */
+
            .top-pad {
−
.column.side.left {
+
                padding: 35px;
−
width: 20%;
+
            }
−
}
+
  
−
.column.side.right {
 
−
width: 20%;
 
−
}
 
  
−
/* main content */
 
−
.column.middle {
 
−
Width: 60%;
 
−
min-height: 850px;
 
  
−
/* change the background image of the main column */
 
−
background-size: contain;
 
−
background-position: center;
 
−
background-repeat: no-repeat;
 
−
}
 
  
−
/* Clear floats after the columns */
+
            /* NEW STUFF FROM CURRENT PAGE
−
.row:after {
+
−
    content: "";
+
−
    display: table;
+
−
    clear: both;
+
−
}
+
  
−
/* footer*/
 
−
.footer {
 
−
    background-color: #f2f2f2;
 
−
    text-align: center;
 
−
    padding: 35px;
 
  
−
}
 
  
−
.bio_paragraph{
+
            /* side columns */
−
    box-sizing: border-box;
+
            .column.side.left {
−
    width: 100%;
+
                width: 20%;
−
    float: right;   
+
            }
−
}
+
  
−
.bio_page_grid{
+
            .column.side.right {
−
    display: grid;
+
                width: 20%;
−
    grid-template-columns: 50% 50%;
+
            }
−
    grid-template-rows: repeat(13, 50%);
+
−
}
+
  
−
/********************************* RESPONSIVE STYLING ********************************/
+
            /* main content */
 +
            .column.middle {
 +
                Width: 60%;
 +
                min-height: 850px;
  
 +
                /* change the background image of the main column */
 +
                background-size: contain;
 +
                background-position: center;
 +
                background-repeat: no-repeat;
 +
            }
  
−
   
+
            /* Clear floats after the columns */
−
/*ROTATING SCRIPT */
+
            .row:after {
−
.rotate {
+
                content: "";
−
    -webkit-animation: spin .8s infinite linear;
+
                display: table;
−
    animation: spin 20s infinite linear;
+
                clear: both;
−
}
+
            }
−
@-webkit-keyframes spin {
+
−
    100% { -webkit-transform: rotate(360deg); }
+
−
}
+
−
@-moz-keyframes spin {
+
−
    100% { -moz-transform: rotate(360deg); }
+
−
}
+
−
@keyframes spin {
+
−
    100% {
+
−
        -moz-transform:rotate(360deg);
+
−
        -o-transform:rotate(360deg);
+
−
        transform:rotate(360deg);
+
−
    }
+
−
}
+
  
−
   
+
            /* footer*/
−
   
+
            .footer {
−
</style>
+
                background-color: #f2f2f2;
 +
                text-align: center;
 +
                padding: 35px;
  
 +
            }
  
−
</head>
+
            .bio_paragraph{
 +
                box-sizing: border-box;
 +
                width: 100%;
 +
                float: right;   
 +
            }
  
 +
            .bio_page_grid{
 +
                display: grid;
 +
                grid-template-columns: 50% 50%;
 +
                grid-template-rows: repeat(13, 50%);
 +
            }
  
 +
            /********************************* RESPONSIVE STYLING ********************************/
  
−
<body>
 
−
 
−
 
−
  <nav class="navbar navbar-default navbar-fixed-top" style=" padding-top: 20px;">
 
−
    <div class="container-fluid">
 
−
      <div class="navbar-header">
 
  
−
        <a class="navbar-logo" href="https://2018.igem.org/Team:Macquarie_Australia">
 
−
          <image class="img-responsive, rotate" src="https://static.igem.org/mediawiki/2018/3/3f/T--Macquarie_Australia--Logo_onlyMembrane.png" height="80" width="80">
 
−
            </image>
 
−
        </a>
 
  
−
      </div>
+
            /*ROTATING SCRIPT */
−
      <div class="navbar-header" style="padding-top: 15px; padding-left: 15px;">
+
            .rotate {
−
        <a class="navbar-logo" href="https://2018.igem.org/Team:Macquarie_Australia">
+
                -webkit-animation: spin .8s infinite linear;
−
          <image class="img-responsive" src="https://static.igem.org/mediawiki/2018/2/25/T--Macquarie_Australia--Logo_onlyText.png" height="120" width="120">
+
                animation: spin 20s infinite linear;
−
             </image>
+
            }
−
        </a>
+
            @-webkit-keyframes spin {
−
      </div>
+
                100% { -webkit-transform: rotate(360deg); }
 +
            }
 +
            @-moz-keyframes spin {
 +
                100% { -moz-transform: rotate(360deg); }
 +
             }
 +
            @keyframes spin {
 +
                100% {
 +
                    -moz-transform:rotate(360deg);
 +
                    -o-transform:rotate(360deg);
 +
                    transform:rotate(360deg);
 +
                }
 +
            }
  
−
      <div id="navbar" class="navbar-collapse collapse">
 
−
        <ul class="nav navbar-nav navbar-right" style="margin-top: 15px;">
 
−
          <li class="dropdown">
 
−
            <a class="dropdown-toggle active" href="https://2018.igem.org/Team:Macquarie_Australia/Team">Team<span class="caret"></span></a>
 
−
            <ul class="dropdown-menu" style="left:0;">
 
−
              <li><a href="https://2018.igem.org/Team:Macquarie_Australia/Collaborations">Collaborations</a></li>
 
−
              <li><a href="https://2018.igem.org/Team:Macquarie_Australia/Attributions">Attributions</a></li>
 
−
            </ul>
 
−
          </li>
 
  
  
−
         <li class="dropdown">
+
         </style>
−
            <a class="dropdown-toggle active" href="https://2018.igem.org/Team:Macquarie_Australia/Project">Project<span class="caret"></span></a>
+
−
            <ul class="dropdown-menu" style="left:0;">
+
−
              <li><a href="https://2018.igem.org/Team:Macquarie_Australia/Description">Description</a></li>
+
−
              <li><a href="https://2018.igem.org/Team:Macquarie_Australia/Results">Results</a></li>
+
−
              <li><a href="https://2018.igem.org/Team:Macquarie_Australia/Demonstrate">Demonstrate</a></li>
+
−
              <li><a href="https://2018.igem.org/Team:Macquarie_Australia/Improve">Improve</a></li>
+
−
              <li><a href="https://2018.igem.org/Team:Macquarie_Australia/Safety">Saftey</a></li>
+
−
            </ul>
+
−
          </li>
+
  
−
        <li class="dropdown">
 
−
            <a class="dropdown-toggle active" href="https://2018.igem.org/Team:Macquarie_Australia/Notebook">Notebook<span class="caret"></span></a>
 
−
            <ul class="dropdown-menu" style="left:0;">
 
−
              <li><a href="https://2018.igem.org/Team:Macquarie_Australia/Experiment">Experiment</a></li>
 
−
              <li><a href="https://2018.igem.org/Team:Macquarie_Australia/Interlab">Interlab</a></li>
 
−
            </ul>
 
−
          </li>
 
  
−
        <li class="dropdown">
+
    </head>
−
            <a class="dropdown-toggle active" href="https://2018.igem.org/Team:Macquarie_Australia/Parts">Parts<span class="caret"></span></a>
+
−
            <ul class="dropdown-menu" style="left:0;">
+
−
              <li><a href="https://2018.igem.org/Team:Macquarie_Australia/Parts">Parts Summary</a></li>
+
−
              <li><a href="https://2018.igem.org/Team:Macquarie_Australia/Composite_Parts">Composite Parts</a></li>
+
−
              <li><a href="https://2018.igem.org/Team:Macquarie_Australia/Validation">Validation</a></li>
+
−
            </ul>
+
−
          </li>
+
  
−
          <li class="dropdown">
 
−
            <a class="dropdown-toggle active" href="https://2018.igem.org/Team:Macquarie_Australia/Human_practices">Human Practices <span class="caret"></span></a>
 
−
            <ul class="dropdown-menu">
 
−
              <li><a href="https://2018.igem.org/Team:Macquarie_Australia/human_practices">Human Practices</a></li>
 
−
              <li><a href="https://2018.igem.org/Team:Macquarie_Australia/human_practices">Integrated Practices</a></li>
 
−
            </ul>
 
−
          </li>
 
  
−
          <li class="dropdown">
 
−
            <a class="dropdown-toggle active" href="https://2018.igem.org/Team:Macquarie_Australia/safety">Saftey </a>
 
−
          </li>
 
−
        </ul>
 
−
      </div>
 
−
      <!-- /.navbar-collapse -->
 
−
    </div>
 
−
    <!-- /.container-fluid -->
 
−
    </nav>
 
  
 +
    <body>
  
−
<!-- NEW CODE -->
 
  
 +
        <nav class="navbar navbar-default navbar-fixed-top" style=" padding-top: 20px;">
 +
            <div class="container-fluid">
 +
                <div class="navbar-header">
  
 +
                    <a class="navbar-logo" href="https://2018.igem.org/Team:Macquarie_Australia">
 +
                        <image class="img-responsive, rotate" src="https://static.igem.org/mediawiki/2018/3/3f/T--Macquarie_Australia--Logo_onlyMembrane.png" height="80" width="80">
 +
                        </image>
 +
                    </a>
  
−
<div>
+
                </div>
 +
                <div class="navbar-header" style="padding-top: 15px; padding-left: 15px;">
 +
                    <a class="navbar-logo" href="https://2018.igem.org/Team:Macquarie_Australia">
 +
                        <image class="img-responsive" src="https://static.igem.org/mediawiki/2018/2/25/T--Macquarie_Australia--Logo_onlyText.png" height="120" width="120">
 +
                        </image>
 +
                    </a>
 +
                </div>
  
−
</div>
+
                <div id="navbar" class="navbar-collapse collapse">
 +
                    <ul class="nav navbar-nav navbar-right" style="margin-top: 15px;">
 +
                        <li class="dropdown">
 +
                            <a class="dropdown-toggle active">Project<span class="caret"></span></a>
 +
                            <ul class="dropdown-menu" style="left:0;">
 +
                                <li><a href="https://2018.igem.org/Team:Macquarie_Australia/ProjectSummary">Summary</a></li>
 +
                                <li><a href="https://2018.igem.org/Team:Macquarie_Australia/ProjectSafety">Safety</a></li>
 +
                            </ul>
 +
                        </li>
  
−
<div>
 
−
<img src = "https://static.igem.org/mediawiki/2018/4/41/T--Macquarie_Australia--Logo_transperant.png" style="width: 50%; margin-left: auto; margin-right: auto; display: block;">
 
−
</div>
 
  
−
<div style="width: 50%; margin-left: auto; margin-right: auto; display: block;">
+
                        <li class="dropdown">
−
    <h style= "font-size: 20px; font-weight: bold;">This year - a new frontier! </h>
+
                            <a class="dropdown-toggle active">Notebook<span class="caret"></span></a>
−
    <p style="text-align: justify"> This year Team Macquarie is working on a modified strain of Escherichia coli to produce Chives — no, not the herb! — Chives is actually an acronym for Chlorophyll-Induced Vesicles. Previous reports have indicated that during the chlorophyll biosynthesis pathway, crystalline structures amass when cells are grown in the dark. When light is shone onto them, they form vesicles — a completely isolated environment in the cell! This opens up whole new avenues for the medical field, food, and other industries as these vesicles provide a segregated space to produce cytotoxic products, or products which the cell would ordinarily metabolise. This novel system of artificial compartmentalisation is certain to revolutionize the world! As such, we will first incorporate chlorophyll a into E. coli and aim to produce these biomolecular compartments (which we have dubbed Chives) — the first of their kind!
+
                            <ul class="dropdown-menu" style="left:0;">
−
</p>
+
                                <li><a href="https://2018.igem.org/Team:Macquarie_Australia/NotebookDryLab">Dry Lab</a></li>
−
</div>
+
                                <li><a href="https://2018.igem.org/Team:Macquarie_Australia/NotebookWetLab">Wet lab</a></li>
 +
                            </ul>
 +
                        </li>
  
 +
                        <li class="dropdown">
 +
                            <a class="dropdown-toggle active">Parts<span class="caret"></span></a>
 +
                            <ul class="dropdown-menu" style="left:0;">
 +
                                <li><a href="https://2018.igem.org/Team:Macquarie_Australia/PartsSummary">Summary</a></li>
 +
                                <li><a href="https://2018.igem.org/Team:Macquarie_Australia/CompositeParts">Composite parts</a></li>
 +
                                <li><a href="https://2018.igem.org/Team:Macquarie_Australia/PartsValidation">Validation</a></li>
 +
                                <li><a href="https://2018.igem.org/Team:Macquarie_Australia/ImprovedParts">Improved Parts</a></li>
  
−
<div class="row">
+
                            </ul>
−
<div class="column side left">
+
                        </li>
−
</div>
+
−
+
−
<div class="column middle">
+
  
−
</div>
+
                        <li class="dropdown">
−
+
                            <a class="dropdown-toggle active">Interlab<span class="caret"></span></a>
−
<div class="column side right">
+
                            <ul class="dropdown-menu" style="left:0;">
 +
                                <li><a href="https://2018.igem.org/Team:Macquarie_Australia/InterlabOverview">Interlab Overview</a></li>
 +
                            </ul>
 +
                        </li>
  
−
</div>
+
                        <li class="dropdown">
−
</div>
+
                            <a class="dropdown-toggle active">Human Practices<span class="caret"></span></a>
 +
                            <ul class="dropdown-menu">
 +
                                <li><a href="https://2018.igem.org/Team:Macquarie_Australia/Interviews">Interviews</a></li>
 +
                                <li><a href="https://2018.igem.org/Team:Macquarie_Australia/PublicEngagement">Public Engagement</a></li>
 +
                                <li><a href="https://2018.igem.org/Team:Macquarie_Australia/IntergratedHumanPractices">Intergrated Human Practices</a></li>
 +
                                <li><a href="https://2018.igem.org/Team:Macquarie_Australia/Toolkit">Toolkit</a></li>
 +
                            </ul>
 +
                        </li>
 +
                        <li class="dropdown">
 +
                            <a class="dropdown-toggle active">Team<span class="caret"></span></a>
 +
                            <ul class="dropdown-menu">
 +
                                <li><a href="https://2018.igem.org/Team:Macquarie_Australia/MeetTheTeam">MeetTheTeam</a></li>
 +
                                <li><a href="https://2018.igem.org/Team:Macquarie_Australia/Staff">Staff</a></li>
 +
                                <li><a href="https://2018.igem.org/Team:Macquarie_Australia/Attributions">Attributions</a></li>
 +
                            </ul>
 +
                        </li>
  
−
              <div class="footerContainer">
+
                        <li class="dropdown">
 +
                            <a class="dropdown-toggle active">Moddelling<span class="caret"></span></a>
 +
                            <ul class="dropdown-menu">
 +
                                <li><a href="https://2018.igem.org/Team:Macquarie_Australia/Model">Our Model</a></li>
 +
                                <li><a href="https://2018.igem.org/Team:Macquarie_Australia/ModelExperimentation">Experimental Data</a></li>
 +
                            </ul>
 +
                        </li>
 +
 
 +
                        <li class="dropdown">
 +
                            <a class="dropdown-toggle active">Collaboration<span class="caret"></span></a>
 +
                            <ul class="dropdown-menu">
 +
                                <li><a href="https://2018.igem.org/Team:Macquarie_Australia/CollaborationOverview">Overview</a></li>
 +
                            </ul>
 +
                        </li>
 +
 
 +
 
 +
 
 +
                    </ul>
 +
                </div>
 +
                <!-- /.navbar-collapse -->
 +
            </div>
 +
            <!-- /.container-fluid -->
 +
        </nav>
 +
 
 +
 
 +
        <!-- NEW CODE -->
 +
 
 +
 
 +
 
 +
        <div>
 +
 
 +
        </div>
 +
 
 +
        <div>
 +
            <img src = "https://static.igem.org/mediawiki/2018/4/41/T--Macquarie_Australia--Logo_transperant.png" style="width: 50%; margin-left: auto; margin-right: auto; display: block;">
 +
        </div>
 +
 
 +
        <div style="width: 50%; margin-left: auto; margin-right: auto; display: block;">
 +
            <h style= "font-size: 20px; font-weight: bold;">This year - a new frontier! </h>
 +
            <p style="text-align: justify"> This year Team Macquarie is working on a modified strain of Escherichia coli to produce Chives — no, not the herb! — Chives is actually an acronym for Chlorophyll-Induced Vesicles. Previous reports have indicated that during the chlorophyll biosynthesis pathway, crystalline structures amass when cells are grown in the dark. When light is shone onto them, they form vesicles — a completely isolated environment in the cell! This opens up whole new avenues for the medical field, food, and other industries as these vesicles provide a segregated space to produce cytotoxic products, or products which the cell would ordinarily metabolise. This novel system of artificial compartmentalisation is certain to revolutionize the world! As such, we will first incorporate chlorophyll a into E. coli and aim to produce these biomolecular compartments (which we have dubbed Chives) — the first of their kind!
 +
            </p>
 +
        </div>
 +
 
 +
 
 +
        <div class="row">
 +
            <div class="column side left">
 +
            </div>
 +
 
 +
            <div class="column middle">
 +
 
 +
            </div>
 +
 
 +
            <div class="column side right">
 +
 
 +
            </div>
 +
        </div>
 +
 
 +
        <div class="footerContainer">
 
             <div class="footerItemSponsor"  >
 
             <div class="footerItemSponsor"  >
 
                 <img style = "height: auto; width: 70%; float: left;" src="https://static.igem.org/mediawiki/2018/d/de/T--Macquarie_Australia--Footer_Sponsor.png">
 
                 <img style = "height: auto; width: 70%; float: left;" src="https://static.igem.org/mediawiki/2018/d/de/T--Macquarie_Australia--Footer_Sponsor.png">
Line 713: Line 735:
 
             </div>
 
             </div>
 
         </div>
 
         </div>
−
   
 
−
   
 
−
   
 
  
−
   
+
 
 +
 
 +
 
 +
 
  
  
 
     </body>
 
     </body>
 
</html>
 
</html>

Revision as of 12:28, 21 September 2018


This year - a new frontier!

This year Team Macquarie is working on a modified strain of Escherichia coli to produce Chives — no, not the herb! — Chives is actually an acronym for Chlorophyll-Induced Vesicles. Previous reports have indicated that during the chlorophyll biosynthesis pathway, crystalline structures amass when cells are grown in the dark. When light is shone onto them, they form vesicles — a completely isolated environment in the cell! This opens up whole new avenues for the medical field, food, and other industries as these vesicles provide a segregated space to produce cytotoxic products, or products which the cell would ordinarily metabolise. This novel system of artificial compartmentalisation is certain to revolutionize the world! As such, we will first incorporate chlorophyll a into E. coli and aim to produce these biomolecular compartments (which we have dubbed Chives) — the first of their kind!