Difference between revisions of "Team:UCSC/Judging"

 
(38 intermediate revisions by 2 users not shown)
Line 1: Line 1:
−
{{UCSC-Styles}}
+
{{UCSC-Header}}
  
 
<html>
 
<html>
  
−
  <!-- External scripts -->
+
<script src="https://use.typekit.net/hii0ztv.js"></script>
 +
<script>try{Typekit.load({ async: true });}catch(e){}</script>
  
−
  <!-- Fonts Used On Page -->
+
<style>
−
  <link href="https://fonts.googleapis.com/css?family=Quicksand" rel="stylesheet">
+
−
  <link href='http://fonts.googleapis.com/css?family=Yanone+Kaffeesatz:400,300,700' rel='stylesheet' type='text/css'>
+
  
 +
.pageflow {
 +
  margin-right: 0px;
 +
  margin-left: 0px;
 +
  margin-top:30px;
 +
  background: honeydew;
 +
}
  
−
   <!-- For mobile friendly version of website. -->
+
h1 {
−
   <head>
+
   font-family: 'objektiv-mk1'!important;
−
   <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1.0">
+
   font-size: 300%; /*!important*/
−
  </head>
+
   font-weight: 300 !important;
 +
    width: 80%;
 +
}
  
−
   <!-- Functionallity and behaviour JS -->
+
h2 {
−
   <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
+
   font-family: 'objektiv-mk1' !important;
−
   <script src="http://code.jquery.com/jquery-2.1.0.min.js"></script>
+
   font-weight: 300 !important;
 +
   font-size: 275%;
 +
  text-align: center;
 +
}
  
−
  <!-- Necessary for nav bar header-->
+
#page {
−
   <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
+
   background: honeydew;
−
   <!-- <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/css/bootstrap.min.css" integrity="sha384-/Y6pD6FV/Vv2HJnA6t+vslU6fwYXjCFtcEpHbNJ0lyAFsXTsjBbfaDjzALeQsN6M" crossorigin="anonymous"> -->
+
   padding: 50px 0px;
 +
}
  
−
  <!-- TypeKit Fonts (BW) --> 
+
.proj-button {
−
  <script src="https://use.typekit.net/hii0ztv.js"></script>
+
    position: relative;
−
  <script>try{Typekit.load({ async: true });}catch(e){}</script>
+
    width: 10%;
 +
}
  
−
<style type="text/css">
+
.proj-button-image {
−
  * {
+
  opacity: 1;
−
      margin:0;
+
  display: inline-block;
−
      padding:0;
+
  width: 16%;
−
      text-decoration:none
+
  height: auto;
−
  }
+
  transition: .5s ease;
 +
  backface-visibility: hidden;
 +
}
  
−
  body {
+
.proj-button-desc {
−
      background:#555;
+
  transition: .5s ease;
−
  }
+
  opacity: 0;
 +
  position: absolute;
 +
  top: 95px;
 +
  left: 49%;
 +
  background: transparent;
 +
  transform: translate(-50%, -50%);
 +
  -ms-transform: translate(-50%, -50%)
 +
}
  
−
  header {
+
.proj-button:hover .proj-button-image {
−
      z-index: 9999;
+
  opacity: 0.3;
−
      position:relative;
+
}
−
      width:100%;
+
−
      background:#333;
+
−
  }
+
  
−
  .logo-header-custom {
+
.proj-button:hover .proj-button-desc {
−
      position:relative;
+
  opacity: 0.6;
−
      z-index:123;
+
}
−
      padding-left: 12px;
+
−
      padding-right: 10px;
+
−
      padding-top: 2px;
+
−
      padding-bottom: 2px;
+
−
      font:18px verdana;
+
−
      color:#6DDB07;
+
−
      float:left;
+
−
      width:15%
+
−
  }
+
  
−
  .logo-header-custom a {
+
.text {
−
      color:#6DDB07;
+
  background-color: transparent;
−
  }
+
  color: black;
 +
  font-size: 20px;
 +
  font-weight: bold;
 +
  padding: 16px 32px;
 +
}
  
−
  nav {
+
.pagagraph {
−
      position:relative;
+
  font-family: 'objektiv-mk1' !important;
−
      width:100%;
+
−
      margin:0 auto;
+
−
  }
+
  
−
  #cssmenu,#cssmenu ul,#cssmenu ul li,#cssmenu ul li a,#cssmenu #head-mobile {
+
}
−
      border:0;
+
−
      list-style:none;
+
−
      margin-bottom: -1px;
+
−
      display:block;
+
−
      position:relative;
+
−
      -webkit-box-sizing:border-box;
+
−
      -moz-box-sizing:border-box;
+
−
      box-sizing:border-box
+
−
  }
+
  
−
  #cssmenu:after,#cssmenu > ul:after {
+
p {
−
      content:".";
+
  font-family: 'objektiv-mk1' !important;
−
      display:block;
+
  /*margin-left: 200px !important;
−
      clear:both;
+
  margin-right: 200px !important;*/
−
      visibility:hidden;
+
  /*width: 70%;*/
−
      line-height:0;
+
  font-size: large !important;
−
      height:0
+
}
−
  }
+
  
−
  #cssmenu #head-mobile {
+
.firstword {
−
      display:none
+
  font-family: 'objektiv-mk1' !important;
−
  }
+
  font-size: 100px;
 +
}
  
−
  #cssmenu {
+
.titleimg {
−
      font-family:"Objektiv-mk1";
+
  vertical-align: middle;
−
      background: #fff;
+
  width: 40%;
−
      top: 16px;
+
}
−
  }
+
  
−
  #cssmenu > ul > li {
+
.titlebox {
−
      float:right;
+
  margin-left: 200px !important;
−
  }
+
}
  
−
  #cssmenu > ul > li > a {
+
.color-change-box {
−
      padding:17px;
+
  height: 100px;
−
      font-size:14px;
+
  width: 100%;
−
      letter-spacing:1px;
+
  margin-bottom: -22.3px;
−
      text-decoration:none;
+
  margin-top: 50px;
−
      color:#333;
+
}
−
      font-weight:300;
+
−
  }
+
  
−
  #cssmenu > ul > li:hover > a,#cssmenu ul li.active a {
+
/*ul {
−
      color:#fff !important;
+
  list-style: none;
−
  }
+
}
  
−
  #cssmenu ul li:hover {
+
ul li:before {
−
      color: white !important;
+
    content: url('https://static.igem.org/mediawiki/2017/5/5a/Checkmark.png');
−
  }
+
}*/
  
−
  #cssmenu > ul > li:hover,#cssmenu ul li.active:hover,#cssmenu ul li.active,#cssmenu ul li.has-sub.active:hover {
+
.requirement-title {
−
      background-color:#50A500!important;
+
  font-family: 'objektiv-mk1';
−
      -webkit-transition:background .3s ease;
+
  font-weight: 400;
−
      -ms-transition:background .3s ease;
+
  font-size: 200%;
−
      transition:background .3s ease;
+
}
−
  }
+
  
−
  #cssmenu > ul > li.has-sub > a {
+
.requirements-subtitle {
−
      padding-right:30px
+
  font-family: 'objektiv-mk1';
−
  }
+
  font-weight: 400;
 +
  font-size: 150%;
 +
}
  
−
  #cssmenu > ul > li.has-sub > a:after {
+
.requirements-description {
−
      position:absolute;
+
  font-family: 'objektiv-mk1';
−
      top:28px;
+
  font-size: 110%;
−
      right:11px;
+
}
−
      width:8px;
+
−
      height:2px;
+
−
      display:block;
+
−
      background:#363636;
+
−
      content:''
+
−
  }
+
  
−
  #cssmenu > ul > li.has-sub > a:before {
+
.col-sm-10 {
−
      position:absolute;
+
  margin-top: 12px !important;
−
      top:25px;
+
}
−
      right:14px;
+
−
      display:block;
+
−
      width:2px;
+
−
      height:8px;
+
−
      background:#363636;
+
−
      content:'';
+
−
      -webkit-transition:all .25s ease;
+
−
      -ms-transition:all .25s ease;
+
−
      transition:all .25s ease
+
−
  }
+
  
−
  #cssmenu > ul > li.has-sub:hover > a:before {
+
.col-sm-9 {
−
      top:29px;
+
  margin-top: 10px !important;
−
      height:0
+
}
−
  }
+
  
−
  #cssmenu ul ul {
+
.checkmark-box {
−
      position:fixed;
+
  width: 120%;
−
      left:-9999px;
+
}
−
      top: 75px;
+
−
  }
+
  
−
  #cssmenu ul ul li {
+
#bronze {
−
      height:0;
+
  width: 100%;
−
      line-height: 1;
+
  height: 0px;
−
      -webkit-transition:all .25s ease;
+
  background-color: honeydew;
−
      -ms-transition:all .25s ease;
+
}
−
      background: #fff;
+
−
      transition: all .25s ease;
+
−
      border-bottom: 1px solid #999;
+
−
      border-left: 1px solid #999;
+
−
      border-right: 1px solid #999;
+
−
  }
+
  
−
  #cssmenu ul ul li:hover {
+
#silver {
−
      background-color: #DCDCDC;
+
  width: 100%;
−
  }
+
  height: 0px;
 +
  background-color: #f08b38;
 +
}
  
−
  #cssmenu ul ul li.has-sub:hover {
+
#gold {
−
      background-color: #DCDCDC !important;
+
  width: 100%;
−
  }
+
  height: 0px;
 +
  background-color: #c2c2c2;
 +
}
  
−
  #cssmenu li:hover > ul {
+
.medal {
−
      left:auto
+
  width: 26%;
−
  }
+
  position: relative;
 +
  text-decoration: none !important;
 +
}
  
−
  #cssmenu li:hover > ul > li {
+
.proj-button-desc:hover .medal {
−
      height:35px
+
  opacity: 0.7;
−
  }
+
}
  
−
  #cssmenu ul ul li a {
+
.medal_image_button {
−
      border-bottom:1px solid rgba(150,150,150,0.15);
+
  display: inline-block;
−
      padding:11px 15px;
+
  width: 26%;
−
      width:200px;
+
}
−
      font-size:11px;
+
−
      text-decoration:none;
+
−
      color:#333;
+
−
      font-weight:300;
+
−
  }
+
  
−
  #cssmenu ul ul li:last-child > a,#cssmenu ul ul li.last-item > a {
+
.medal_image_button:hover {
−
      border-bottom:0
+
  opacity: 0.7;
−
  }
+
}
  
−
  #cssmenu ul ul li:hover > a,#cssmenu ul ul li a:hover {
+
.medal_button_desc {
−
      color:#fff
+
  transition: .5s ease;
−
  }
+
  opacity: 0;
 +
  position: absolute;
 +
  top: 100px;
 +
  left: 50%;
 +
  background: transparent;
 +
  transform: translate(-50%, -50%);
 +
  -ms-transform: translate(-50%, -50%);
 +
}
  
−
  #cssmenu ul ul li.has-sub > a:after {
+
/*.medal_button_desc:hover {
−
      position:absolute;
+
  opacity: 1;
−
      top:16px;
+
}*/
−
      right:11px;
+
−
      display:block;
+
−
      width:8px;
+
−
      height:2px;
+
−
      background:#363636;
+
−
      content:''
+
−
  }
+
  
−
  #cssmenu ul ul li.has-sub > a:before {
+
/*.medal_image_button:hover .medal_button_desc .overlap_medal_button_text {
−
      position:absolute;
+
  opacity: 0.8;
−
      top:13px;
+
}*/
−
      right:14px;
+
−
      display:block;
+
−
      width:2px;
+
−
      height:8px;
+
−
      background:#363636;
+
−
      content:'';
+
−
      -webkit-transition:all .25s ease;
+
−
      -ms-transition:all .25s ease;
+
−
      transition:all .25s ease
+
−
  }
+
  
−
  #cssmenu ul ul > li.has-sub:hover > a:before {
+
.medal:hover .proj-button-desc {
−
      top:17px;
+
  opacity: 0.7;
−
      height:0
+
}
−
  }
+
  
−
  #cssmenu ul ul li.has-sub:hover,#cssmenu ul li.has-sub ul li.has-sub ul li:hover {
+
.overlap_medal_button_text {
−
      background:#363636;
+
  background-color: transparent;
−
  }
+
  color: black;
 +
  font-size: 20px;
 +
  font-family: "Objektiv-mk1" !important;
 +
  font-weight: 400 !important;
 +
  padding: 16px 32px;
 +
}
  
−
  #cssmenu ul ul ul li.active a {
+
.overlap-button-text {
−
      border-left:1px solid #333
+
  background-color: transparent;
−
  }
+
  color: black;
 +
  font-size: 20px;
 +
  font-family: "Objektiv-mk1" !important;
 +
  font-weight: 400 !important;
 +
  padding: 16px 32px;
 +
}
  
−
  #cssmenu > ul > li.has-sub > ul > li.active > a,#cssmenu > ul ul > li.has-sub > ul > li.active> a {
+
.title_image_box {
−
      border-top:1px solid #333
+
  width: 100%;
−
  }
+
  height: 100%;
 +
  margin: -20px;
 +
}
  
−
@media screen and (min-width: 1208px) {
 
  
−
  #cssmenu ul ul li {
+
@media (min-width: 1750px) {
−
      left: -28px;
+
−
  }
+
  
−
  #cssmenu ul ul li a:hover {
+
  .proj-button-desc {
−
       color: white !important;
+
       transition: .5s ease;
−
       background-color: #1B4900 !important;
+
       opacity: 0;
−
  }
+
      position: absolute;
 +
      top: 131px;
 +
      left: 49%;
 +
      transform: translate(-50%, -50%);
 +
      -ms-transform: translate(-50%, -50%)
 +
  }
 +
}
  
−
  #cssmenu ul ul ul li {
 
−
      position: relative;
 
−
      left: 171px !important;
 
−
      top: 34px;
 
−
  }
 
  
 +
@media (max-width: 1750px) {
  
−
  #cssmenu ul ul ul a:before{
+
  .proj-button-desc {
−
       display: none;
+
       transition: .5s ease;
 +
      opacity: 0;
 
       position: absolute;
 
       position: absolute;
−
       left: -9999px;
+
      top: 121px;
−
       top: 20px;
+
       left: 49%;
−
  }
+
       transform: translate(-50%, -50%);
 +
      -ms-transform: translate(-50%, -50%)
 +
  }
 +
}
 +
 
 +
 
 +
@media (max-width: 1650px) {
  
−
  #cssmenu ul ul ul a:after {
+
  .proj-button-desc {
−
       display: block;
+
       transition: .5s ease;
 +
      opacity: 0;
 
       position: absolute;
 
       position: absolute;
−
       left: -9999px;
+
      top: 114px;
−
       top: 20px;
+
       left: 49%;
−
  }
+
       transform: translate(-50%, -50%);
 +
      -ms-transform: translate(-50%, -50%)
 +
  }
 
}
 
}
  
−
@media screen and (min-width: 200px) and (max-width:1208px){
 
  
−
  .logo-header-custom2 {
+
@media (max-width: 1550px) {
−
      display:none
+
−
  }
+
  
−
  header {
+
  .proj-button-desc {
−
       display: block;
+
       transition: .5s ease;
−
       z-index: 999999;
+
       opacity: 0;
−
  }
+
      position: absolute;
−
 
+
      top: 107px;
−
  nav {
+
      left: 49%;
−
       width:100%;
+
       transform: translate(-50%, -50%);
−
       z-index: 999999;
+
       -ms-transform: translate(-50%, -50%)
−
  }
+
  }
 +
}
  
−
  #cssmenu {
 
−
      display: block;
 
−
      width:100%;
 
−
      z-index: 999999;
 
−
  }
 
  
−
  #cssmenu ul {
+
@media (max-width: 1440px) {
−
      z-index: 9999;
+
−
      width:100%;
+
−
      display:none;
+
−
      margin-left: 0px;
+
−
      margin-top: 20px;
+
−
  }
+
  
−
  #cssmenu ul li {
+
  .proj-button-desc {
−
       width:100%;
+
       transition: .5s ease;
−
       border-top:1px solid #444;
+
      opacity: 0;
−
       border-bottom: 1px solid #444;
+
      position: absolute;
−
  }
+
       top: 100px;
 +
       left: 49%;
 +
      transform: translate(-50%, -50%);
 +
      -ms-transform: translate(-50%, -50%)
 +
  }
 +
}
  
−
  #cssmenu ul li,#cssmenu ul li a {
 
−
      line-height: 1;
 
−
  }
 
  
−
  #cssmenu ul li:hover {
+
@media (min-width: 1300px) and (max-width: 1350px) {
−
      color: #fff !important;
+
−
      background:#1B4900;
+
−
  }
+
  
−
  #cssmenu ul ul li,#cssmenu li:hover > ul > li {
+
  .proj-button-desc {
−
       height:auto
+
       transition: .5s ease;
−
  }
+
      opacity: 0;
 +
      position: absolute;
 +
      top: 94px;
 +
      left: 49%;
 +
      transform: translate(-50%, -50%);
 +
      -ms-transform: translate(-50%, -50%)
 +
  }
 +
}
  
−
  #cssmenu ul li a,#cssmenu ul ul li a {
 
−
      width:100%;
 
−
      border-bottom:0
 
−
  }
 
  
−
  #cssmenu > ul > li {
+
@media (min-width: 1144px) and (max-width: 1300px) {
−
      float:none;
+
−
  }
+
  
−
  #cssmenu ul ul li a {
+
  .proj-button-desc {
−
       padding-left:25px
+
       transition: .5s ease;
−
  }
+
      opacity: 0;
 +
      position: absolute;
 +
      top: 94px;
 +
      left: 49%;
 +
      transform: translate(-50%, -50%);
 +
      -ms-transform: translate(-50%, -50%)
 +
  }
 +
}
  
−
  #cssmenu ul ul li {
+
@media (min-width: 1144px) {
−
      background:#DCDCDC!important;
+
  .container {
−
  }
+
    width: 70% !important;
 +
  }
  
−
  #cssmenu li a:hover {
+
  .sub-container {
−
      color: #fff !important;
+
    width: 100%;
−
  }
+
    margin-left: 50px;
 +
  }
  
−
  #cssmenu ul ul li:hover {
+
  .text-container {
−
      color: #fff !important;
+
    width: 60%;
−
      background:#1B4900!important;
+
    padding-left: 15px;
−
  }
+
    padding-right: 15px;
 +
  }
 +
  .titlebox {
 +
    width: 80%;
 +
  }
 +
  figcaption {
 +
    font-size: 16px;
 +
  }
  
−
  #cssmenu ul ul ul li a {
+
  .row {
−
      padding-left:35px
+
    margin-top: 20px;
−
  }
+
  }
 +
}
  
−
  #cssmenu ul ul li a {
+
@media (max-width: 1144px) {
−
      color:#ddd;
+
−
      background:none
+
−
  }
+
  
−
  #cssmenu ul ul li:hover > a,#cssmenu ul ul li.active > a {
+
  .container {
−
      color:#ddd
+
    width: 80% !important;
−
  }
+
  }
  
−
  #cssmenu ul ul,#cssmenu ul ul ul {
+
  .sub-container {
−
      position:initial;
+
       width: 100%;
−
      left:0;
+
       margin-left: 50px;
−
       width:100%;
+
    }
−
       margin:0;
+
−
      text-align:left
+
−
  }
+
  
−
  #cssmenu > ul > li.has-sub > a:after,#cssmenu > ul > li.has-sub > a:before,#cssmenu ul ul > li.has-sub > a:after,#cssmenu ul ul > li.has-sub > a:before {
+
    .titlebox {
−
       display:none
+
       margin-left: auto !important;
−
  }
+
    }
  
−
  #cssmenu #head-mobile {
+
  .text-container {
−
      /*float: left;*/
+
    width: 80%;
−
      display:block;
+
    padding-left: 15px;
−
      padding:23px;
+
    padding-right: 15px;
−
      color:#ddd;
+
  }
−
      font-size:12px;
+
−
      font-weight:700
+
−
  }
+
  
−
  .button-custom {
+
  p {
−
      width:55px;
+
    font-family: 'objektiv-mk1' !important;
−
      height:46px;
+
    margin-left: 20px !important;
−
      position:absolute;
+
    margin-right: 20px !important;
−
      right:0;
+
    font-size: medium !important;
−
      top:8px;
+
  }
−
      cursor:pointer;
+
−
      z-index: 12399994;
+
−
  }
+
  
−
  .button-custom:after {
+
  .col-sm-9 {
−
      position:absolute;
+
  margin-top: 7px !important;
−
      top:22px;
+
}
−
      right:20px;
+
−
      display:block;
+
−
      height:8px;
+
−
      width:20px;
+
−
      border-top:2px solid #363636;
+
−
      border-bottom:2px solid #363636;
+
−
      content:''
+
−
  }
+
  
−
  .button-custom:before {
+
}
−
      -webkit-transition:all .3s ease;
+
−
      -ms-transition:all .3s ease;
+
−
      transition:all .3s ease;
+
−
      position:absolute;
+
−
      top:16px;
+
−
      right:20px;
+
−
      display:block;
+
−
      height:2px;
+
−
      width:20px;
+
−
      background:#363636;
+
−
      content:''
+
−
  }
+
  
−
  .button-custom.menu-opened:after {
+
@media (max-width: 768px) {
−
      -webkit-transition:all .3s ease;
+
−
      -ms-transition:all .3s ease;
+
−
      transition:all .3s ease;
+
−
      top:23px;
+
−
      border:0;height:2px;
+
−
      width:19px;
+
−
      background:#363636;
+
−
      -webkit-transform:rotate(45deg);
+
−
      -moz-transform:rotate(45deg);
+
−
      -ms-transform:rotate(45deg);
+
−
      -o-transform:rotate(45deg);
+
−
      transform:rotate(45deg)
+
−
  }
+
  
−
  .button-custom.menu-opened:before {
 
−
      top:23px;
 
−
      background:#363636;
 
−
      width:19px;
 
−
      -webkit-transform:rotate(-45deg);
 
−
      -moz-transform:rotate(-45deg);
 
−
      -ms-transform:rotate(-45deg);
 
−
      -o-transform:rotate(-45deg);
 
−
      transform:rotate(-45deg)
 
−
  }
 
  
−
  #cssmenu .submenu-button-custom {
+
  .container {
−
      position:absolute;
+
    width: 90% !important;
−
      z-index:99;
+
  }
−
      right:0;
+
−
      top:0;
+
−
      display:block;
+
−
      border-left:1px solid #444;
+
−
      height:46px;
+
−
      width:46px;
+
−
      cursor:pointer
+
−
  }
+
  
−
  #cssmenu .submenu-button-custom.submenu-opened {
+
  .sub-container {
 +
      width: 80%;
 +
    }
  
−
  }
+
  .proj-button-image {
 +
      opacity: 1;
 +
      display: inline-block;
 +
      width: 40%;
 +
      height: auto;
 +
      transition: .5s ease;
 +
      backface-visibility: hidden;
 +
    }
  
−
  #cssmenu ul ul .submenu-button-custom {
+
    .proj-button-desc {
−
       height:34px;
+
       transition: .5s ease;
−
       width:34px
+
       opacity: 1;
−
  }
+
      position: absolute;
 +
      top: 88px;
 +
      left: 49%;
 +
      transform: translate(-50%, -50%);
 +
      -ms-transform: translate(-50%, -50%)
 +
  }
  
−
  #cssmenu .submenu-button-custom:after {
+
  .overlap-button-text {
−
      position:absolute;
+
    background-color: transparent;
−
      top:22px;
+
    color: black;
−
      right:19px;
+
    font-size: 15px;
−
      width:8px;
+
    font-family: "Objektiv-mk1" !important;
−
      height:2px;
+
    font-weight: 400 !important;
−
      display:block;
+
    padding: 16px 32px;
−
      background:#363636;
+
  }
−
      content:''
+
−
  }
+
  
−
  #cssmenu ul ul .submenu-button-custom:after {
+
  .checkmark-box {
−
      top:15px;
+
  width: 10%;
−
      right:13px
+
}
−
  }
+
  
−
  #cssmenu .submenu-button-custom.submenu-opened:after {
+
  h1 {
−
       background:#fff
+
      font-family: 'objektiv-mk1'; /*!important*/
−
  }
+
       font-size: 250%; /*!important*/
 +
  }
  
−
  #cssmenu .submenu-button-custom:before {
+
  h2 {
−
       position:absolute;
+
       font-family: 'objektiv-mk1'; /*!important*/
−
       top:19px;
+
       font-size: 35px; /*!important*/
−
      right:22px;
+
  }
−
      display:block;
+
−
      width:2px;
+
−
      height:8px;
+
−
      background:#363636;
+
−
      content:''
+
−
  }
+
  
−
  #cssmenu ul ul .submenu-button-custom:before {
+
  .text-container {
−
      top:12px;
+
    width: 80%;
−
      right:16px
+
  }
−
  }
+
  
−
  #cssmenu .submenu-button-custom.submenu-opened:before {
+
  .col-sm-9 {
−
      display:none
+
  margin-top: -25px !important;
−
  }
+
  margin-left: 40px;
  
−
  #cssmenu ul ul ul li.active a {
+
  }
−
      border-left:none
+
−
  }
+
  
−
  #cssmenu > ul > li.has-sub > ul > li.active > a,#cssmenu > ul ul > li.has-sub > ul > li.active > a {
+
  .col-sm-10 {
−
      border-top:none
+
    margin-top: -30px !important;
−
  }
+
    margin-left: 60px;
  
 +
  }
 +
 +
  .medal_image_button {
 +
    width: 32%;
 +
  }
 +
 +
  .title_image_box {
 +
    width: 100%;
 +
    height: 100%;
 +
    margin-top: -40px;
 +
  }
 +
 +
  .requirements-description {
 +
    font-family: 'objektiv-mk1';
 +
    font-size: 90%;
 +
  }
 +
 +
  /*.medal {
 +
    width: 32%;
 +
  }*/
 
}
 
}
 +
 +
/*  p {
 +
    margin-left: 10px !important;
 +
    margin-right: 10px !important;
 +
  }
 +
}*/
 +
 +
@media (max-width: 576px) {
 +
 +
  .checkmark-box {
 +
    width: 12%;
 +
  }
 +
 +
  .col-sm-9 {
 +
    margin-top: -22px !important;
 +
    margin-left: 40px;
 +
  }
 +
 +
  .col-sm-10 {
 +
    margin-top: -35px !important;
 +
    margin-left: 50px;
 +
  }
 +
 +
  .requirement-title {
 +
    font-family: 'objektiv-mk1';
 +
    font-weight: 400;
 +
    font-size: 130%;
 +
  }
 +
 +
  .requirements-subtitle {
 +
    font-family: 'objektiv-mk1';
 +
    font-weight: 400;
 +
    font-size: 120%;
 +
  }
 +
 +
  .requirements-description {
 +
    font-family: 'objektiv-mk1';
 +
    font-size: 90%;
 +
  }
 +
 +
  .proj-button-image {
 +
      opacity: 1;
 +
      display: inline-block;
 +
      width: 60%;
 +
      height: auto;
 +
      transition: .5s ease;
 +
      backface-visibility: hidden;
 +
    }
 +
 +
    .proj-button-desc {
 +
      transition: .5s ease;
 +
      opacity: 1;
 +
      position: absolute;
 +
      top: 62px;
 +
      left: 49%;
 +
      transform: translate(-50%, -50%);
 +
      -ms-transform: translate(-50%, -50%)
 +
  }
 +
 +
  .overlap-button-text {
 +
    background-color: transparent;
 +
    color: black;
 +
    font-size: 10px;
 +
    font-family: "Objektiv-mk1" !important;
 +
    font-weight: 400 !important;
 +
    padding: 16px 32px;
 +
  }
 +
 +
  .sub-container {
 +
    margin-left: 20px;
 +
    width: 90%;
 +
  }
 +
 +
  .firstword {
 +
    font-family: 'objektiv-mk1' !important;
 +
    font-size: 70px;
 +
  }
 +
 +
  .titleimg {
 +
    vertical-align: middle;
 +
    width: 90%;
 +
  }
 +
 +
  .text-container {
 +
    width: 100%;
 +
    margin-left: -15px;
 +
    margin-right: -15px;
 +
  }
 +
 +
  p {
 +
    font-family: 'objektiv-mk1' !important;
 +
    margin-left: 10px !important;
 +
    margin-right: 10px !important;
 +
    font-size: small !important;
 +
  }
 +
 +
  .row {
 +
    margin-bottom: 20px;
 +
    margin-top: 20px;
 +
  }
 +
 +
  .title_image_box {
 +
  width: 100%;
 +
  height: 100%;
 +
  margin-top: -60px;
 +
  }
 +
}
 +
 +
 +
@media (max-width: 480px) {
 +
 +
  .proj-button-desc {
 +
      transition: .5s ease;
 +
      opacity: 1;
 +
      position: absolute;
 +
      top: 55px;
 +
      left: 49%;
 +
      transform: translate(-50%, -50%);
 +
      -ms-transform: translate(-50%, -50%)
 +
  }
 +
 +
  .overlap-button-text {
 +
    background-color: transparent;
 +
    color: black;
 +
    font-size: 10px;
 +
    font-family: "Objektiv-mk1" !important;
 +
    font-weight: 400 !important;
 +
    padding: 16px 32px;
 +
  }
 +
 +
  .title_image_box {
 +
  width: 100%;
 +
  height: 100%;
 +
  margin-top: -70px;
 +
  }
 +
 +
}
 +
 +
 +
@media (max-width: 380px) {
 +
 +
  .proj-button-desc {
 +
      transition: .5s ease;
 +
      opacity: 1;
 +
      position: absolute;
 +
      top: 238%;
 +
      left: 49%;
 +
      transform: translate(-50%, -50%);
 +
      -ms-transform: translate(-50%, -50%)
 +
  }
 +
 +
  .overlap-button-text {
 +
    background-color: transparent;
 +
    color: black;
 +
    font-size: 9px;
 +
    font-family: "Objektiv-mk1" !important;
 +
    font-weight: 400 !important;
 +
    padding: 16px 32px;
 +
  }
 +
}
 +
 +
@media (max-width: 350px) {
 +
 +
  .checkmark-box {
 +
    width: 12%;
 +
  }
 +
 +
  .col-sm-9 {
 +
    margin-top: -25px !important;
 +
    margin-left: 40px;
 +
  }
 +
 +
  .col-sm-10 {
 +
    margin-top: -35px !important;
 +
    margin-left: 50px;
 +
  }
 +
 +
  .requirement-title {
 +
    font-family: 'objektiv-mk1';
 +
    font-weight: 400;
 +
    font-size: 115%;
 +
  }
 +
 +
  .requirements-subtitle {
 +
    font-family: 'objektiv-mk1';
 +
    font-weight: 400;
 +
    font-size: 112%;
 +
  }
 +
 +
  .requirements-description {
 +
    font-family: 'objektiv-mk1';
 +
    font-size: 90%;
 +
  }
 +
 +
  .container {
 +
    width: 100% !important;
 +
  }
 +
 +
  .sub-container {
 +
      margin-left: 5px;
 +
      width: 100%;
 +
    }
 +
 +
    .proj-button-desc {
 +
      transition: .5s ease;
 +
      opacity: 1;
 +
      position: absolute;
 +
      top: 238%;
 +
      left: 48%;
 +
      transform: translate(-50%, -50%);
 +
      -ms-transform: translate(-50%, -50%)
 +
  }
 +
 +
  .overlap-button-text {
 +
    background-color: transparent;
 +
    color: black;
 +
    font-size: 8px;
 +
    font-family: "Objektiv-mk1" !important;
 +
    font-weight: 400 !important;
 +
    padding: 16px 32px;
 +
  }
 +
}
 +
 +
@media (max-width: 330px) {
 +
 +
  .proj-button-desc {
 +
      transition: .5s ease;
 +
      opacity: 1;
 +
      position: absolute;
 +
      top: 230%;
 +
      left: 48%;
 +
      transform: translate(-50%, -50%);
 +
      -ms-transform: translate(-50%, -50%)
 +
  }
 +
 +
}
 +
}
 +
 +
 
</style>
 
</style>
  
 
<script type="text/javascript">
 
<script type="text/javascript">
−
  (function($) {
 
−
$.fn.menumaker = function(options) { 
 
−
var cssmenu = $(this), settings = $.extend({
 
−
  format: "dropdown",
 
−
  sticky: false
 
−
}, options);
 
−
return this.each(function() {
 
−
  $(this).find(".button-custom").on('click', function(){
 
−
    $(this).toggleClass('menu-opened');
 
−
    var mainmenu = $(this).next('ul');
 
−
    if (mainmenu.hasClass('open')) {
 
−
      mainmenu.slideToggle().removeClass('open');
 
−
    }
 
−
    else {
 
−
      mainmenu.slideToggle().addClass('open');
 
−
      if (settings.format === "dropdown") {
 
−
        mainmenu.find('ul').show();
 
−
      }
 
−
    }
 
−
  });
 
−
  cssmenu.find('li ul').parent().addClass('has-sub');
 
−
multiTg = function() {
 
−
    cssmenu.find(".has-sub").prepend('<span class="submenu-button-custom"></span>');
 
−
    cssmenu.find('.submenu-button-custom').on('click', function() {
 
−
      $(this).toggleClass('submenu-opened');
 
−
      if ($(this).siblings('ul').hasClass('open')) {
 
−
        $(this).siblings('ul').removeClass('open').slideToggle();
 
−
      }
 
−
      else {
 
−
        $(this).siblings('ul').addClass('open').slideToggle();
 
−
      }
 
−
    });
 
−
  };
 
−
  if (settings.format === 'multitoggle') multiTg();
 
−
  else cssmenu.addClass('dropdown');
 
−
  if (settings.sticky === true) cssmenu.css('position', 'fixed');
 
−
resizeFix = function() {
 
−
  var mediasize = 1208;
 
−
    if ($( window ).width() > mediasize) {
 
−
      cssmenu.find('ul').show();
 
−
    }
 
−
    // if ($(window).width() <= mediasize) {
 
−
    //  cssmenu.find('ul').hide().removeClass('open');
 
−
    // }
 
−
  };
 
−
  resizeFix();
 
−
  return $(window).on('resize', resizeFix);
 
−
});
 
−
  };
 
−
})(jQuery);
 
  
−
(function($){
+
//  $("button").click(function() {
−
$(document).ready(function(){
+
//      $('html,body').animate({
−
$("#cssmenu").menumaker({
+
//          scrollTop: $("#bronze").offset().top},'slow');
−
  format: "multitoggle"
+
// });
−
});
+
 
−
});
+
  $('a.medal_image_button').click(function () {
−
})(jQuery);
+
        $('html, body').animate({scrollTo: 700}, 11700);
 +
          return false;
 +
    });
  
 
</script>
 
</script>
  
 +
<body style="background-color: honeydew;">
 +
<div id="page">
 +
<center>
  
−
<header>
+
<!-- <img class="titleimg" src="https://static.igem.org/mediawiki/2017/b/b7/Medal.png"> -->
−
<nav id='cssmenu' style="position: fixed;">
+
 
−
<div class="logo-header-custom">
+
<div class="container">
−
  <a href="https://2017.igem.org/Team:UCSC">
+
  <div class="row">
−
      <img class="logo" src="https://static.igem.org/mediawiki/2017/2/23/UCSC-logo.png" height="60" width="auto">
+
    <div class="title_image_box">
−
      <!--<img class="logo" src="https://static.igem.org/mediawiki/2017/4/42/Logo_click6.png" height ="60" width="auto">-->
+
  <!-- <button type="button1" style="background: url(https://static.igem.org/mediawiki/2017/7/7f/Bronze_medal.png); width: 20%;"></button> -->
−
  </a>
+
  <!-- <button type="button">bronze button</button> -->
 +
  <!-- <a href="#" class="medal_image_button"> -->
 +
    <a href="#bronze" class="medal">
 +
      <img src="https://static.igem.org/mediawiki/2017/3/30/Bronze-medal.png" class="medal_image_button" alt="https://www.shareicon.net/object-sport-medal-winner-black-medals-sports-sportive-recognition-658963">
 +
        <div class="proj-button-desc">
 +
          <div class="overlap-button-text">BRONZE</div>
 +
        </div>
 +
    </a>
 +
 
 +
    <a href="#silver" class="medal">
 +
      <img src="https://static.igem.org/mediawiki/2017/a/a2/Silver-medal.png" class="medal_image_button" alt="https://www.shareicon.net/object-sport-medal-winner-black-medals-sports-sportive-recognition-658963">
 +
        <div class="proj-button-desc">
 +
          <div class="overlap-button-text">SILVER</div>
 +
        </div>
 +
    </a>
 +
 
 +
    <a href="#gold" class="medal">
 +
      <img src="https://static.igem.org/mediawiki/2017/a/a1/Gold-medal.png" class="medal_image_button" alt="https://www.shareicon.net/object-sport-medal-winner-black-medals-sports-sportive-recognition-658963">
 +
        <div class="proj-button-desc">
 +
          <div class="overlap-button-text">GOLD</div>
 +
        </div>
 +
    </a>
 +
  </div>
 +
  </div>
 
</div>
 
</div>
−
<div id="head-mobile"></div>
+
 
−
<div class="button-custom"></div>
+
<br>
−
<ul>
+
<br>
−
  <li><a href="https://2017.igem.org/Team:UCSC/Judging">JUDGING</a></li>
+
 
−
  <li><a href='https://2017.igem.org/Team:UCSC/Notebook'>NOTEBOOK</a></li>
+
<h1>JUDGING</h1><br>
−
  <li><a href='https://2017.igem.org/Team:UCSC/Moving-Forward'>MOVING FORWARD</a>
+
 
−
       <ul>
+
<div id="bronze"></div>
−
        <li><a href="https://2017.igem.org/Team:UCSC/Implementation">IMPLEMENTATION</a></li>
+
 
−
        <li><a href='https://2017.igem.org/Team:UCSC/Model-Organism'>TARGET ORGANISM</a></li>
+
</div>
−
       </ul>
+
<div class="color-change-box" style="background: -webkit-linear-gradient(top, rgba(240,255,240,1) 0%, rgba(240,255,240,1) 0%, rgba(240,139,56,1) 100%); margin-top: 0px; height: 200px; padding-bottom: 50px;">
−
  </li>
+
</div>
−
  <li><a href="https://2017.igem.org/Team:UCSC/Integrated-Human-Practices">HUMAN PRACTICES</a>
+
<div class="page" style="background: #f08b38;">
−
       <ul>
+
  <h2><b>B R O N Z E</b> REQUIREMENTS</h2>
−
        <li><a href="https://2017.igem.org/Team:UCSC/Integrated-Human-Practices">PROJECT INTEGRATION</a></li>
+
  <br>
−
        <li><a href="https://2017.igem.org/Team:UCSC/Safety">SAFETY</a></li>
+
 
−
        <li><a href="https://2017.igem.org/Team:UCSC/Engagement">EDUCATION</a></li>
+
  <div class="container">
−
        <li><a href="https://2017.igem.org/Team:UCSC/Collaborations">COLLABORATIONS</a></li>
+
    <div class="row no-gutters">
−
        <li><a href="https://2017.igem.org/Team:UCSC/HP/Silver">SILVER</a></li>
+
      <div class="col-sm-1">
−
        <li><a href="https://2017.igem.org/Team:UCSC/HP/Gold_Integrated">GOLD INTEGRATED</a></li>
+
        <div class="checkmark-box">
−
      </ul>
+
        <img src="https://static.igem.org/mediawiki/2017/5/5a/Checkmark.png">
−
  </li>
+
        </div>
−
  <li><a href="https://2017.igem.org/Team:UCSC/Project">PROJECT</a>
+
      </div>
−
       <ul>
+
      <div class="col-sm-10">
−
        <li><a href="https://2017.igem.org/Team:UCSC/Project">THE PROJECT</a></li>
+
        <span class="requirement-title">Register for iGEM</span>
−
        <li><a href="#">METABOLIC ENGINEERING</a>
+
      </div>
−
            <ul>
+
    </div>
−
              <li><a href="https://2017.igem.org/Team:UCSC/Acetaminophen">ACETAMINOPHEN</a></li>
+
    <ul>
−
              <li><a href="https://2017.igem.org/Team:UCSC/B-12">VITAMIN B12</a></li>
+
    <li><span class="requirements-description">We have registered for the iGEM Giant Jamboree and we look forward to presenting our project in Boston! We have had an amazing summer working together, collaborating with others, and reaching out to our community.</span></li>
−
            </ul>
+
    </ul>
−
        </li>
+
 
−
        <li><a href="https://2017.igem.org/Team:UCSC/Model">MODELING</a></li>
+
  </div>
−
        <li><a href="https://2017.igem.org/Team:UCSC/Results">RESULTS</a></li>
+
<br>
−
        <li><a href="https://2017.igem.org/Team:UCSC/Parts">PARTS</a></li>
+
  <div class="container">
−
        <li><a href="https://2017.igem.org/Team:UCSC/InterLab">INTERLAB STUDY</a></li>
+
    <div class="row no-gutters">
−
      </ul>
+
      <div class="col-sm-1">
−
  </li>
+
        <div class="checkmark-box">
−
  <li><a href="https://2017.igem.org/Team:UCSC/Team1">TEAM</a>
+
        <img src="https://static.igem.org/mediawiki/2017/5/5a/Checkmark.png">
−
       <ul>
+
        </div>
−
        <li><a href="https://2017.igem.org/Team:UCSC/Team1">MEET THE TEAM</a></li>
+
      </div>
−
        <li><a href="https://2017.igem.org/Team:UCSC/Attributions">ATTRIBUTIONS</a></li>
+
      <div class="col-sm-10">
−
       </ul>
+
        <span class="requirement-title">Meet all Competition Deliverables</span>
−
  </li>
+
      </div>
−
  <li><a href='https://2017.igem.org/Team:UCSC'>HOME</a></li>
+
    </div>
−
</ul>
+
<br>
−
</nav>
+
    <div class="sub-container">
−
</header>
+
      <div class="row no-gutters">
 +
        <div class="col-sm-1">
 +
          <div class="checkmark-box">
 +
          <img src="https://static.igem.org/mediawiki/2017/5/5a/Checkmark.png" style="width: 85%;">
 +
          </div>
 +
        </div>
 +
        <div class="col-sm-9">
 +
          <span class="requirements-subtitle">Complete the Team Wiki</span>
 +
        </div>
 +
      </div>
 +
      <div class="sub-container">
 +
        <ul>
 +
        <li><span class="requirements-description">Hover over any tab in the navigation menu to learn more about our project. Or, browse our completely mobile-friendly wiki on your smartphone, tablet, or any other device! Just like the rest of our project, we always aim to improve accessibility.</li>
 +
        </ul>
 +
      </div>
 +
<br>
 +
 
 +
      <div class="row no-gutters">
 +
        <div class="col-sm-1">
 +
          <div class="checkmark-box">
 +
          <img src="https://static.igem.org/mediawiki/2017/5/5a/Checkmark.png" style="width: 85%;"">
 +
          </div>
 +
        </div>
 +
        <div class="col-sm-9">
 +
          <span class="requirements-subtitle">Project Attributions</span>
 +
        </div>
 +
       </div>
 +
      <div class="sub-container">
 +
        <ul>
 +
        <li><span class="requirements-description">Check out<a href="https://2017.igem.org/Team:UCSC/Attributions"> our attributions page here</a> to learn more about the help we received along the way!</span></li>
 +
        </ul>
 +
      </div>
 +
<br>
 +
 
 +
      <div class="row no-gutters">
 +
        <div class="col-sm-1">
 +
          <div class="checkmark-box">
 +
          <img src="https://static.igem.org/mediawiki/2017/5/5a/Checkmark.png" style="width: 85%;"">
 +
          </div>
 +
        </div>
 +
        <div class="col-sm-9">
 +
          <span class="requirements-subtitle">Team Poster</span>
 +
        </div>
 +
       </div>
 +
      <div class="sub-container">
 +
        <ul>
 +
        <li><span class="requirements-description">We have created our project poster and will be presenting it at the Giant Jamboree.</span></li>
 +
        </ul>
 +
      </div>
 +
 
 +
<br>
 +
      <div class="row no-gutters">
 +
        <div class="col-sm-1">
 +
          <div class="checkmark-box">
 +
          <img src="https://static.igem.org/mediawiki/2017/5/5a/Checkmark.png" style="width: 85%;"">
 +
          </div>
 +
        </div>
 +
        <div class="col-sm-9">
 +
          <span class="requirements-subtitle">Team Presentation</span>
 +
        </div>
 +
       </div>
 +
      <div class="sub-container">
 +
        <ul>
 +
        <li><span class="requirements-description">We look forward to presenting our project at the Giant Jamboree and showing how our team takes manufacturing where it has never been before.</span></li>
 +
        </ul>
 +
      </div>
 +
 
 +
<br>
 +
      <div class="row no-gutters">
 +
        <div class="col-sm-1">
 +
          <div class="checkmark-box">
 +
          <img src="https://static.igem.org/mediawiki/2017/5/5a/Checkmark.png" style="width: 85%;"">
 +
          </div>
 +
        </div>
 +
        <div class="col-sm-9">
 +
          <span class="requirements-subtitle">Safety Form</span>
 +
        </div>
 +
      </div>
 +
      <div class="sub-container">
 +
        <ul>
 +
        <li><span class="requirements-description">With the submission of our safety form, we complete this competition deliverable. You can find<a href="https://2017.igem.org/Team:UCSC/Safety"> our safety page here!</a></span></li>
 +
        </ul>
 +
      </div>
 +
 
 +
<br>
 +
      <div class="row no-gutters">
 +
        <div class="col-sm-1">
 +
          <div class="checkmark-box">
 +
          <img src="https://static.igem.org/mediawiki/2017/5/5a/Checkmark.png" style="width: 85%;"">
 +
          </div>
 +
        </div>
 +
        <div class="col-sm-9">
 +
          <span class="requirements-subtitle">Judging Form</span>
 +
        </div>
 +
      </div>
 +
      <div class="sub-container">
 +
        <ul>
 +
        <li><span class="requirements-description">Our judging form has been submitted, and the breakdown of how we meet the medal requirements and project deliverables can be seen throughout this page. Here's a link to <a href="https://igem.org/2017_Judging_Form?id=2223">our Judging Form</a>.</span></li>
 +
        </ul>
 +
      </div>
 +
 
 +
<br>
 +
      <div class="row no-gutters">
 +
        <div class="col-sm-1">
 +
          <div class="checkmark-box">
 +
          <img src="https://static.igem.org/mediawiki/2017/5/5a/Checkmark.png" style="width: 85%;"">
 +
          </div>
 +
        </div>
 +
        <div class="col-sm-9">
 +
          <span class="requirements-subtitle">Registry Part Page</span>
 +
        </div>
 +
      </div>
 +
      <div class="sub-container">
 +
        <ul>
 +
        <li><span class="requirements-description">Our various registry parts have been fully documented and can be seen on <a href="https://2017.igem.org/Team:UCSC/Part_Collection">our parts page here!</a></span></li>
 +
        </ul>
 +
      </div>
 +
 
 +
<br>
 +
      <div class="row no-gutters">
 +
        <div class="col-sm-1">
 +
          <div class="checkmark-box">
 +
          <img src="https://static.igem.org/mediawiki/2017/5/5a/Checkmark.png" style="width: 85%;"">
 +
          </div>
 +
        </div>
 +
        <div class="col-sm-9">
 +
          <span class="requirements-subtitle">Sample Submission</span>
 +
        </div>
 +
      </div>
 +
      <div class="sub-container">
 +
        <ul>
 +
        <li><span class="requirements-description">DNA sequences of <a href="https://2017.igem.org/Team:UCSC/Part_Collection">our parts</a> have been submitted to the Registry to help make an even more comprehensive Registry Catalogue for next year.</span></li>
 +
        </ul>
 +
      </div>
 +
    </div>
 +
  </div>
 +
 
 +
  <div class="container">
 +
    <div class="row no-gutters">
 +
      <div class="col-sm-1">
 +
        <div class="checkmark-box">
 +
        <img src="https://static.igem.org/mediawiki/2017/5/5a/Checkmark.png">
 +
        </div>
 +
       </div>
 +
      <div class="col-sm-10">
 +
        <span class="requirement-title">Attribution</span>
 +
      </div>
 +
    </div>
 +
    <ul>
 +
    <li><span class="requirements-description">We couldn’t have developed our project without the help of others. The work accomplished by ourselves and the work and support we received from others has been fully documented, and can be found on<a href="https://2017.igem.org/Team:UCSC/Attributions"> our attributions page here!</a></span></li>
 +
    </ul>
 +
 
 +
  </div>
 +
 
 +
<br>
 +
  <div class="container">
 +
    <div class="row no-gutters">
 +
      <div class="col-sm-1">
 +
        <div class="checkmark-box">
 +
        <img src="https://static.igem.org/mediawiki/2017/5/5a/Checkmark.png">
 +
        </div>
 +
      </div>
 +
      <div class="col-sm-10">
 +
        <span class="requirement-title">Contribution</span>
 +
      </div>
 +
    </div>
 +
    <ul>
 +
    <li><span class="requirements-description">This year, the UCSC iGEM team has contributed by participating in the InterLab study! You can see our results on<a href="https://2017.igem.org/Team:UCSC/InterLab"> our InterLab page here!</a></span></li>
 +
    </ul>
 +
 
 +
<div id="silver"></div>
 +
 
 +
  </div>
 +
 
 +
<div class="color-change-box" style="background:  -webkit-linear-gradient(top, rgba(240,139,56,1) 0%, rgba(240,139,56,1) 0%, rgba(194,194,194,1) 100%); height: 200px;">
 +
</div>
 +
 
 +
<div class="page" style="background: #c2c2c2">
 +
  <h2><b>S I L V E R</b> REQUIREMENTS</h2>
 +
  <br>
 +
 
 +
  <div class="container">
 +
    <div class="row no-gutters">
 +
      <div class="col-sm-1">
 +
        <div class="checkmark-box">
 +
        <img src="https://static.igem.org/mediawiki/2017/5/5a/Checkmark.png">
 +
        </div>
 +
      </div>
 +
      <div class="col-sm-10">
 +
        <span class="requirement-title">Validated Part</span>
 +
      </div>
 +
    </div>
 +
    <ul>
 +
    <li><span class="requirements-description">The validation of our own part is not only a fascinating component of our project, but is also crucial for the synthesis of acetaminophen. Take a look at how <a href="https://2017.igem.org/Team:UCSC/Demonstrate#validate-part-div">we validated our part in <i>E. coli.</i></a></span></li>
 +
    </ul>
 +
 
 +
  </div>
 +
 
 +
 
 +
<br>
 +
  <div class="container">
 +
    <div class="row no-gutters">
 +
      <div class="col-sm-1">
 +
        <div class="checkmark-box">
 +
        <img src="https://static.igem.org/mediawiki/2017/5/5a/Checkmark.png">
 +
        </div>
 +
      </div>
 +
      <div class="col-sm-10">
 +
        <span class="requirement-title">Collaboration</span>
 +
      </div>
 +
    </div>
 +
    <ul>
 +
    <li><span class="requirements-description">Collaboration between laboratories across the world will always be essential for advancements within the scientific community. Check out <a href="https://2017.igem.org/Team:UCSC/Collaborations">our collaborations page</a> to learn more about how we worked with other iGEM teams.</span></li>
 +
    </ul>
 +
 
 +
  </div>
 +
 
 +
 
 +
<br>
 +
  <div class="container">
 +
    <div class="row no-gutters">
 +
      <div class="col-sm-1">
 +
        <div class="checkmark-box">
 +
        <img src="https://static.igem.org/mediawiki/2017/5/5a/Checkmark.png">
 +
        </div>
 +
      </div>
 +
      <div class="col-sm-10">
 +
        <span class="requirement-title">Human Practices Silver</span>
 +
      </div>
 +
    </div>
 +
    <ul>
 +
    <li><span class="requirements-description">Engaging in our community and outreach to regions around the world dramatically shaped our project. Here at UC Santa Cruz, we care deeply about real world problems and what we can do to help. Take a look at the <a href="https://2017.igem.org/Team:UCSC/HP/Silver">outreach we conducted.</a></span></li>
 +
    </ul>
 +
 
 +
<div id="gold"></div>
 +
 
 +
  </div>
 +
 
 +
<div class="color-change-box" style="background:  -webkit-linear-gradient(top, rgba(194,194,194,1) 0%, rgba(255,194,41,1) 100%); height: 200px;">
 +
</div>
 +
 
 +
<div class="page" style="background: #ffc229">
 +
  <h2><b>G O L D</b> REQUIREMENTS</h2>
 +
  <br>
 +
 
 +
  <div class="container">
 +
    <div class="row no-gutters">
 +
      <div class="col-sm-1">
 +
        <div class="checkmark-box">
 +
        <img src="https://static.igem.org/mediawiki/2017/5/5a/Checkmark.png">
 +
        </div>
 +
      </div>
 +
      <div class="col-sm-10">
 +
        <span class="requirement-title">Integrated Human Practices</span>
 +
      </div>
 +
    </div>
 +
    <ul>
 +
    <li><span class="requirements-description">We place an enormous emphasis on identifying real world problems before we delve into potential solutions using synthetic biology. Before we began our project, we conducted meaningful outreach to some remote locations around the world. With the information we received from multiple healthcare professionals, our project became focused on alleviating debilitating shortages in pharmaceuticals and dietary nutrients. Check out how <a href="https://2017.igem.org/Team:UCSC/HP/Gold_Integrated">human practices has been integrated into our project!</a></span></li>
 +
    </ul>
 +
 
 +
  </div>
 +
 
 +
 
 +
<br>
 +
  <div class="container">
 +
    <div class="row no-gutters">
 +
      <div class="col-sm-1">
 +
        <div class="checkmark-box">
 +
        <img src="https://static.igem.org/mediawiki/2017/5/5a/Checkmark.png">
 +
        </div>
 +
      </div>
 +
      <div class="col-sm-10">
 +
        <span class="requirement-title">Demonstrate Our Work</span>
 +
      </div>
 +
    </div>
 +
    <ul>
 +
    <li><span class="requirements-description">It's not enough to only think of good ways to approach a solution to a widespread global problem -- you have to act on it too! We have gathered an enormous amount of data and demonstrated that our concept works when applied in a biological system. Check out how <a href="https://2017.igem.org/Team:UCSC/Demonstrate">we demonstrated our work!</a></span></li>
 +
    </ul>
 +
 
 +
  </div>
 +
 
 +
 
 +
<br>
 +
  <div class="container">
 +
    <div class="row no-gutters">
 +
      <div class="col-sm-1">
 +
        <div class="checkmark-box">
 +
        <img src="https://static.igem.org/mediawiki/2017/5/5a/Checkmark.png">
 +
        </div>
 +
      </div>
 +
      <div class="col-sm-10">
 +
        <span class="requirement-title">Improve a Previous Part</span>
 +
       </div>
 +
    </div>
 +
    <ul>
 +
    <li><span class="requirements-description">The tremendous registry of parts allowed us choose a part that, with some improvements, could serve a meaningful purpose in our project. The improved part has been documented and submitted to the parts registry page. Take a look at how <a href="https://2017.igem.org/Team:UCSC/Part_Collection#improve-a-part-div">we improved a previous part</a> and used it as a means of detection.</span></li>
 +
    </ul>
 +
 
 +
  </div>
 +
 
 +
 
 +
<br>
 +
  <div class="container">
 +
    <div class="row no-gutters">
 +
      <div class="col-sm-1">
 +
        <div class="checkmark-box">
 +
        <img src="https://static.igem.org/mediawiki/2017/5/5a/Checkmark.png">
 +
        </div>
 +
      </div>
 +
       <div class="col-sm-10">
 +
        <span class="requirement-title">Modeling</span>
 +
      </div>
 +
    </div>
 +
    <ul>
 +
    <li><span class="requirements-description">Modelling product yield is an integral component of our project. Without it, the applicability of our work becomes undermined. Modelling not only allows one to predict the yield of a desired product, but also to optimize growth conditions to maximize product yield within a given timeframe. Take a look at our <a href="https://2017.igem.org/Team:UCSC/Model">modeling for acetaminophen and vitamin B<sub>12</sub></a></span></li>
 +
    </ul>
 +
 
 +
  </div>
 +
</div>
 +
 
 +
<div class="color-change-box" style="background: #ffc229; height: 100px; margin-top: 0px; margin-bottom: -50px;">
 +
</div>
 +
 
 +
<div class="color-change-box" style="background: -webkit-linear-gradient(top, rgba(255,194,41,1) 0%, rgba(240,255,240,1) 100%); height: 250px;">
 +
</div>
 +
 
 +
 
 +
</center>
 +
 
 +
</body>
 
</html>
 
</html>
  
−
{{Scroll}}
+
{{UCSC-Footer}}

Latest revision as of 03:56, 2 November 2017

https://www.shareicon.net/object-sport-medal-winner-black-medals-sports-sportive-recognition-658963
BRONZE
 https://www.shareicon.net/object-sport-medal-winner-black-medals-sports-sportive-recognition-658963
SILVER
 https://www.shareicon.net/object-sport-medal-winner-black-medals-sports-sportive-recognition-658963
GOLD


JUDGING


B R O N Z E REQUIREMENTS


Register for iGEM
  • We have registered for the iGEM Giant Jamboree and we look forward to presenting our project in Boston! We have had an amazing summer working together, collaborating with others, and reaching out to our community.

Meet all Competition Deliverables

Complete the Team Wiki
  • Hover over any tab in the navigation menu to learn more about our project. Or, browse our completely mobile-friendly wiki on your smartphone, tablet, or any other device! Just like the rest of our project, we always aim to improve accessibility.

Project Attributions

Team Poster
  • We have created our project poster and will be presenting it at the Giant Jamboree.

Team Presentation
  • We look forward to presenting our project at the Giant Jamboree and showing how our team takes manufacturing where it has never been before.

Safety Form
  • With the submission of our safety form, we complete this competition deliverable. You can find our safety page here!

Judging Form
  • Our judging form has been submitted, and the breakdown of how we meet the medal requirements and project deliverables can be seen throughout this page. Here's a link to our Judging Form.

Registry Part Page

Sample Submission
  • DNA sequences of our parts have been submitted to the Registry to help make an even more comprehensive Registry Catalogue for next year.
Attribution
  • We couldn’t have developed our project without the help of others. The work accomplished by ourselves and the work and support we received from others has been fully documented, and can be found on our attributions page here!

Contribution
  • This year, the UCSC iGEM team has contributed by participating in the InterLab study! You can see our results on our InterLab page here!

S I L V E R REQUIREMENTS


Validated Part
  • The validation of our own part is not only a fascinating component of our project, but is also crucial for the synthesis of acetaminophen. Take a look at how we validated our part in E. coli.

Collaboration
  • Collaboration between laboratories across the world will always be essential for advancements within the scientific community. Check out our collaborations page to learn more about how we worked with other iGEM teams.

Human Practices Silver
  • Engaging in our community and outreach to regions around the world dramatically shaped our project. Here at UC Santa Cruz, we care deeply about real world problems and what we can do to help. Take a look at the outreach we conducted.

G O L D REQUIREMENTS


Integrated Human Practices
  • We place an enormous emphasis on identifying real world problems before we delve into potential solutions using synthetic biology. Before we began our project, we conducted meaningful outreach to some remote locations around the world. With the information we received from multiple healthcare professionals, our project became focused on alleviating debilitating shortages in pharmaceuticals and dietary nutrients. Check out how human practices has been integrated into our project!

Demonstrate Our Work
  • It's not enough to only think of good ways to approach a solution to a widespread global problem -- you have to act on it too! We have gathered an enormous amount of data and demonstrated that our concept works when applied in a biological system. Check out how we demonstrated our work!

Improve a Previous Part
  • The tremendous registry of parts allowed us choose a part that, with some improvements, could serve a meaningful purpose in our project. The improved part has been documented and submitted to the parts registry page. Take a look at how we improved a previous part and used it as a means of detection.

Modeling
  • Modelling product yield is an integral component of our project. Without it, the applicability of our work becomes undermined. Modelling not only allows one to predict the yield of a desired product, but also to optimize growth conditions to maximize product yield within a given timeframe. Take a look at our modeling for acetaminophen and vitamin B12

S P O N S O R S
S O C I A L
C O N T A C T
Jack Baskin School of Engineering
University of California, Santa Cruz
1156 High Street
Santa Cruz, California, 95064