Difference between revisions of "Team:CIEI-BJ/Integrated Practices"

 
Line 2: Line 2:
 
<html>
 
<html>
  
 +
<html><head>
 +
<title>Safety</title>
 +
    <style>
  
 +
body,#bodyContent
 +
html {
 +
  height: 100%;
 +
}
 +
body,#bodyContent {
 +
  background-attachment: fixed;
 +
  background-repeat: repeat;
 +
}
 +
html {
 +
  overflow-y: scroll;
 +
}
 +
header > .container {
 +
  padding-top: 25px;
 +
  padding-bottom: 15px;
 +
}
 +
.absolute_center {
 +
  margin: auto;
 +
  position: absolute;
 +
  top: 0;
 +
  left: 0;
 +
  bottom: 0;
 +
  right: 0;
 +
}
 +
.sketch {
 +
  display: none;
 +
  opacity: 1;
 +
  position: fixed;
 +
  top: 0;
 +
}
 +
#masthead #big-video-wrap {
 +
  position: static;
 +
}
 +
#masthead #head_text {
 +
  margin: auto;
 +
  position: absolute;
 +
  top: 0;
 +
  left: 0;
 +
  bottom: 0;
 +
  right: 0;
 +
  height: 100px;
 +
}
 +
#masthead h1,
 +
#masthead h2 {
 +
  font-family: Lato;
 +
  color: white;
 +
  opacity: 0.99;
 +
  text-align: center;
 +
  margin: 0;
 +
}
 +
#masthead h1 {
 +
  letter-spacing: 6px;
 +
  margin-bottom: 5px;
 +
  font-size: 60px;
 +
}
 +
#masthead h2 {
 +
  font-size: 15px;
 +
}
 +
.nav #nav_left {
 +
  display: inline-block;
 +
  vertical-align: bottom;
 +
}
 +
.nav #nav_left img {
 +
  width: 170px;
 +
}
 +
.nav #nav_right {
 +
  margin-left: 15px;
 +
  display: inline-block;
 +
  vertical-align: bottom;
 +
}
 +
.nav #nav_right h2 {
 +
  color: white;
 +
  font-size: 70px;
 +
  margin-top: 0;
 +
  margin-bottom: 0;
 +
}
 +
.nav ul {
 +
  padding: 0;
 +
  margin-top: 0;
 +
}
 +
.nav ul li {
 +
  list-style-type: none;
 +
  display: inline-block;
 +
  color: white;
 +
  border-right: 1px solid white;
 +
  padding: 0 10px;
 +
  margin-left: -4px;
 +
}
 +
.nav ul li:last-child {
 +
  border: 0;
 +
}
 +
.quotespacer {
 +
  border-top: 1px solid white;
 +
  width: 150px;
 +
  height: 1px;
 +
  display: block;
 +
  margin: 0 auto;
 +
}
 +
#missionquote {
 +
  -webkit-animation: 20s huerotate linear infinite;
 +
  margin: 15px auto;
 +
}
 +
#telomere {
 +
  width: 100%;
 +
  height: 360px;
 +
  background-size: 100%;
 +
  background-repeat: no-repeat;
 +
  transition: 1s ease;
 +
}
 +
#telomere:hover {
 +
  -webkit-transform: scale(1.1);
 +
}
 +
#portrait_container {
 +
  border-right: 1px solid white;
 +
}
 +
#portrait_container img {
 +
  width: 15%;
 +
  padding: 5px;
 +
  transition: 0.2s ease;
 +
}
 +
#portrait_container img:hover {
 +
  cursor: pointer;
 +
  -webkit-transform: scale(1.3);
 +
}
 +
#portrait_container > .row {
 +
  padding-top: 5px;
 +
}
 +
#portrait_container > .row:last-child {
 +
  padding-bottom: 5px;
 +
}
 +
@-webkit-keyframes huerotate {
 +
  0% {
 +
    -webkit-filter: hue-rotate(0deg);
 +
  }
 +
  100% {
 +
    -webkit-filter: hue-rotate(360deg);
 +
  }
 +
}
 +
}
 +
/******************* SLDIESJS ******************/
 +
#slides {
 +
  display: none;
 +
}
 +
#slides .slidesjs-navigation {
 +
  margin-top: 3px;
 +
}
 +
#slides .slidesjs-previous {
 +
  margin-right: 5px;
 +
  float: left;
 +
}
 +
#slides .slidesjs-next {
 +
  margin-right: 5px;
 +
  float: left;
 +
}
 +
.slidesjs-pagination {
 +
  margin: 6px 0 0;
 +
  float: right;
 +
  list-style: none;
 +
}
 +
.slidesjs-pagination li {
 +
  float: left;
 +
  margin: 0 1px;
 +
}
 +
.slidesjs-pagination li a {
 +
  display: block;
 +
  width: 13px;
 +
  height: 0;
 +
  padding-top: 13px;
 +
  background-position: 0 0;
 +
  float: left;
 +
  overflow: hidden;
 +
}
 +
.slidesjs-pagination li a.active,
 +
.slidesjs-pagination li a:hover.active {
 +
  background-position: 0 -13px;
 +
}
 +
.slidesjs-pagination li a:hover {
 +
  background-position: 0 -26px;
 +
}
 +
#slides a:link,
 +
#slides a:visited {
 +
  color: #333;
 +
}
 +
#slides a:hover,
 +
#slides a:active {
 +
  color: #9e2020;
 +
}
 +
.navbar {
 +
  overflow: hidden;
 +
}
 +
.slideContainer {
 +
  margin: 0 auto;
 +
}
 +
#projIntroContainer {
 +
  padding: 0px 0px 0px 0px;
 +
  text-align: center;
 +
}
 +
#projIntro {
 +
  margin-top: -8px;
 +
  padding-top: 0px;
 +
  text-align: justify;
 +
  padding-right: 40px;
 +
  font-size: 19px;
 +
  font-family: 'Poiret One', cursive;
 +
}
 +
/*************** BIGVIDEO.JS **************/
 +
#big-video-wrap {
 +
  overflow: hidden;
 +
  height: 100%;
 +
  width: 100%;
 +
  top: 0;
 +
  left: 0;
 +
}
 +
#big-video-vid,
 +
#big-video-image {
 +
  position: absolute;
 +
}
 +
#big-video-control-container {
 +
  position: fixed;
 +
  bottom: 0;
 +
  padding: 10px;
 +
  width: 100%;
 +
  background: rgba(0, 0, 0, 0.25);
 +
  -webkit-transition-duration: 0.6s;
 +
  -moz-transition-duration: 0.6s;
 +
  -ms-transition-duration: 0.6s;
 +
  -o-transition-duration: 0.6s;
 +
  transition-duration: 0.6s;
 +
}
 +
#big-video-control {
 +
  width: 100%;
 +
  height: 16px;
 +
  position: relative;
 +
}
 +
#big-video-control-middle {
 +
  margin: 0 56px 0 24px;
 +
}
 +
#big-video-control-bar {
 +
  width: 100%;
 +
  height: 16px;
 +
  position: relative;
 +
  cursor: pointer;
 +
}
 +
#big-video-control-progress {
 +
  position: absolute;
 +
  top: 7px;
 +
  height: 3px;
 +
  width: 0%;
 +
  background: #fff;
 +
}
 +
#big-video-control-track {
 +
  position: absolute;
 +
  top: 8px;
 +
  height: 1px;
 +
  width: 100%;
 +
  background: #fff;
 +
}
 +
#big-video-control-bound-left {
 +
  left: 0;
 +
}
 +
#big-video-control-bound-right {
 +
  right: -1px;
 +
}
 +
#big-video-control-track .ui-slider-handle {
 +
  opacity: 0;
 +
}
 +
#big-video-control-playhead {
 +
  left: 30%;
 +
}
 +
#big-video-control-play {
 +
  position: absolute;
 +
  top: 0;
 +
  left: 0;
 +
  height: 16px;
 +
  width: 16px;
 +
}
 +
#big-video-control-timer {
 +
  position: absolute;
 +
  top: 1px;
 +
  right: 0;
 +
  color: #fff;
 +
  font-size: 11px;
 +
}
 +
#big-video-control-playhead,
 +
#big-video-control-bound-left,
 +
#big-video-control-bound-right {
 +
  position: absolute;
 +
  top: 0;
 +
  height: 16px;
 +
  width: 1px;
 +
  background: #fff;
 +
}
 +
#big-video-control .ui-slider-handle {
 +
  border-left: solid 1px #fff;
 +
  width: 16px;
 +
  height: 16px;
 +
  position: absolute;
 +
  top: -8px;
 +
}
 +
.transparent {
 +
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
 +
  filter: alpha(opacity=0);
 +
  -moz-opacity: 0;
 +
  -khtml-opacity: 0;
 +
  opacity: 0;
 +
}
 +
.vjs-big-play-button {
 +
  display: none !important;
 +
}
 +
canvas {
 +
  position: fixed;
 +
  top: 0px;
 +
  left: 0px;
 +
}
 +
.card {
 +
  margin-left: auto;
 +
  margin-right: auto;
 +
  background-color: white;
 +
  box-shadow: 0px 0px 5px black;
 +
  padding: 50px;
 +
}
 +
.card_pic {
 +
  margin-left: auto;
 +
  margin-right: auto;
 +
  background-color: white;
 +
  box-shadow: 0px 0px 5px black;
 +
  padding: 0px;
 +
}
 +
.container {
 +
  padding: 0px;
 +
  min-width: 1080px;
 +
}
 +
.container div nav {
 +
  min-width: 1080px;
 +
}
 +
button:focus {
 +
  outline: 0 !important;
 +
}
 +
a:focus {
 +
  outline: 0 !important;
 +
}
 +
img {
 +
  max-width: 100%;
 +
}
 +
a {
 +
  text-decoration: none;
 +
  color: inherit !important;
 +
}
 +
a:hover {
 +
  color: inherit;
 +
}
 +
.full {
 +
  padding: 0;
 +
}
 +
.slidesjs-pagination {
 +
  margin-top: -25px;
 +
  margin-right: 10px;
 +
  z-index: 10;
 +
  position: relative;
 +
}
 +
#slides .heroImageContainer {
 +
  background-size: cover;
 +
  padding-top: 54%;
 +
  background-position: 50% 50%;
 +
  background-repeat: no-repeat;
 +
}
 +
#slides .heroImageContainer h3 {
 +
  opacity: 0.85;
 +
  max-width: 400px;
 +
  position: absolute;
 +
  padding: 10px 20px;
 +
  font-weight: normal;
 +
  color: black;
 +
  font-size: 35px;
 +
  font-family: Lato;
 +
}
 +
#slides .heroImageContainer h3 span {
 +
  font-size: 21px;
 +
  display: block;
 +
}
 +
#slides .heroImageContainer h3.topleft {
 +
  top: 0;
 +
  left: 0;
 +
  margin-left: 20px;
 +
}
 +
#slides .heroImageContainer h3.topright {
 +
  top: 0;
 +
  right: 5px;
 +
  margin-right: 20px;
 +
}
 +
#slides .heroImageContainer h3.bottomleft {
 +
  bottom: 0;
 +
  left: 0;
 +
  margin-bottom: 35px;
 +
  margin-left: 20px;
 +
}
 +
#slides .heroImageContainer h3.bottomright {
 +
  bottom: 0;
 +
  right: 5px;
 +
  margin-bottom: 35px;
 +
  margin-right: 20px;
 +
}
 +
#slides .heroImageContainer h3.red {
 +
  background-color: #d10000;
 +
}
 +
#slides .heroImageContainer h3.purple {
 +
  background-color: #8e44ad;
 +
}
 +
#slides .heroImageContainer h3.blue {
 +
  background-color: #2c3e50;
 +
}
 +
#slides .heroImageContainer h3.belize {
 +
  background-color: #2980b9;
 +
}
 +
#slides .heroImageContainer h3.green {
 +
  background-color: #27ae60;
 +
}
 +
#slides .heroImageContainer h3.orange {
 +
  background-color: #f39c12;
 +
}
 +
#slides .heroImageContainer h3.hide {
 +
  display: none;
 +
}
 +
#slides .heroImageContainer .slidesjs-control,
 +
#slides .heroImageContainer .slidesjs-container {
 +
  width: 100% !important;
 +
}
 +
nav ul {
 +
  margin: 0;
 +
  padding: 0;
 +
}
 +
nav .dropdown-menu {
 +
  border: 0px;
 +
  margin-top: 0px;
 +
  padding: 10px;
 +
  box-shadow: 0px 0px 5px black;
 +
  z-index: -1;
 +
}
 +
nav .dropdown-menu img {
 +
  width: 90px;
 +
  opacity: 0.85;
 +
  float: left;
 +
  margin-right: 5px;
 +
}
 +
nav .dropdown-menu h4 {
 +
  color: white;
 +
  padding: 5px;
 +
  margin: 0;
 +
  font-family: Lato;
 +
  font-size: 20px;
 +
}
 +
nav .dropdown-menu .subcategories_container {
 +
  display: inline-block;
 +
  width: 100%;
 +
  cursor: pointer;
  
 +
}
 +
nav .dropdown-menu .subcategories_container > div {
 +
  min-width: 200px;
 +
  display: inline-block;
 +
  text-align: center;
 +
  border: 1px solid white;
 +
  padding-left:15px;
 +
  padding-right:15px;
 +
}
 +
nav .dropdown-menu .subcategories_container h5 {
 +
  font-family: Lato;
 +
  text-transform: uppercase;
 +
  font-size: 16px;
 +
  color: white;
 +
}
 +
nav li.dropdown {
 +
  width: 180px;
 +
  display: inline-block;
 +
  margin-right: -4px;
 +
  height: 40px;
 +
  margin-bottom: 0px;
 +
}
 +
nav li.dropdown > a {
 +
  height:35px;
 +
  text-decoration: none;
 +
  display: block;
 +
  text-align: center;
 +
  margin: 10px;
 +
}
 +
nav li.dropdown a > h4 {
 +
  color: white;
 +
  font-weight: normal;
 +
  font-size: 16px;
 +
  padding: 0;
 +
  margin: 0;
 +
  text-align: center;
 +
}
 +
nav li.dropdown {
 +
  color: white;
 +
}
 +
nav li.dropdown:nth-child(1) {
 +
  background-color: #2196f3;
 +
}
 +
nav li.dropdown:nth-child(1) > .dropdown-menu {
 +
  background-color: #2196f3;
 +
  background-size: 400px;
 +
  width: 1080px;
 +
}
 +
nav li.dropdown:nth-child(1) > .dropdown-menu .subcategories_container > div {
 +
  background-color: rgba(33, 150, 243, 0.6);
 +
}
 +
nav li.dropdown:nth-child(2) {
 +
  background-color: #2196f3;
 +
}
 +
nav li.dropdown:nth-child(2) > .dropdown-menu {
 +
  background-color: #2196f3;
 +
  background-size: 1080;
 +
  width: 1080px;
 +
  margin-left: -180px;
 +
}
 +
nav li.dropdown:nth-child(2) > .dropdown-menu .subcategories_container > div {
 +
  background-color: rgba(33, 150, 243, 0.6);
 +
}
 +
nav li.dropdown:nth-child(3) {
 +
  background-color: #2196f3;
 +
}
 +
nav li.dropdown:nth-child(3) > .dropdown-menu {
 +
  background-color: #2196f3;
 +
  background-size: 400px;
 +
  width: 1080px;
 +
  margin-left: -360px;
 +
}
 +
nav li.dropdown:nth-child(3) > .dropdown-menu .subcategories_container > div {
 +
  background-color: rgba(33, 150, 243, 0.6);
 +
}
 +
nav li.dropdown:nth-child(4) {
 +
  background-color: #2196f3;
 +
}
 +
nav li.dropdown:nth-child(4) > .dropdown-menu {
 +
  background-color: #2196f3;
 +
  background-size: 400px;
 +
  margin-left: -540px;
 +
  width: 1080px;
 +
}
 +
nav li.dropdown:nth-child(4) > .dropdown-menu .subcategories_container > div {
 +
  background-color: rgba(33, 150, 243, 0.6);
 +
}
 +
nav li.dropdown:nth-child(5) {
 +
  background-color: #2196f3;
 +
}
 +
nav li.dropdown:nth-child(5) > .dropdown-menu {
 +
  background-color: #2196f3;
 +
  background-size: 300px;
 +
  margin-left: -720px;
 +
  width: 1080px;
 +
}
 +
nav li.dropdown:nth-child(5) > .dropdown-menu .subcategories_container > div {
 +
  background-color: rgba(33, 150, 243, 0.6);
 +
}
 +
nav li.dropdown:nth-child(6) {
 +
  background-color: #2196f3;
 +
}
 +
nav li.dropdown:nth-child(6) > .dropdown-menu {
 +
  background-color: #2196f3;
 +
  background-size: 300px;
 +
  width: 1080px;
 +
  margin-left: -900px;
 +
}
 +
nav li.dropdown:nth-child(6) > .dropdown-menu .subcategories_container > div {
 +
  background-color: rgba(33, 150, 243, 0.6);
 +
}
 +
footer {
 +
  height: 20px;
 +
  background-color: #2c3e50;
 +
}
 +
footer .cornered {
 +
  float: left;
 +
  width: 300px;
 +
  height: 0px;
 +
  border-top: 20px solid #bdc3c7;
 +
  border-right: 45px solid transparent;
 +
}
 +
footer .footer_right {
 +
  color: white;
 +
  padding: 25px;
 +
  float: right;
 +
  height: 100%;
 +
}
 +
footer .footer_right span {
 +
  opacity: 0.5;
 +
}
 +
#bodycontainer {
 +
  min-width: 1080px;
 +
  margin: auto;
 +
  padding: 10px 0;
 +
  text-align:left;
 +
}
 +
#bodycontainer .overview_header {
 +
  text-align: center;
 +
}
 +
#bodycontainer h3,
 +
#bodycontainer h4,
 +
#bodycontainer h5 {
 +
  font-family: Lato;
 +
  text-transform: uppercase;
 +
  margin: 0px 0px 0px 0px;
 +
  padding-top: 30px;
 +
}
 +
#bodycontainer h1,
 +
#bodycontainer h2{
 +
  font-family: Lato;
 +
  text-transform: uppercase;
 +
  margin: 0px 0px 0px 0px;
 +
  padding-top: 80px; 
 +
}
 +
#bodycontainer .buttonrow {
 +
  margin-bottom: 20px;
 +
}
 +
#bodycontainer .igem_button {
 +
  position: relative;
 +
  overflow: hidden;
 +
}
 +
#bodycontainer .igem_button img {
 +
  transition: 0.4s ease;
 +
  -webkit-filter: grayscale(0%);
 +
}
 +
#bodycontainer .igem_button .button_description {
 +
  transition: 0.5s ease;
 +
  background: rgba(44, 62, 80, 0.75);
 +
  position: absolute;
 +
  top: 100%;
 +
  left: 0;
 +
  width: 100%;
 +
  height: 100%;
 +
}
 +
#bodycontainer .igem_button h2 {
 +
  margin: 0 auto;
 +
  margin-top: -27px;
 +
  color: #dddddd;
 +
  font-size: 16px;
 +
  text-align: center;
 +
  width: 100%;
 +
  padding: 5px 0px;
 +
  background: rgba(0, 0, 0, 0.41);
 +
  font-family: Lato;
 +
  text-transform: uppercase;
 +
  border-bottom: 1px solid rgba(255, 255, 255, 0.3);
 +
}
 +
#bodycontainer .igem_button p {
 +
  color: #dddddd;
 +
  padding: 5px;
 +
}
 +
#bodycontainer .igem_button:hover > .button_description {
 +
  top: 27px;
 +
}
 +
#bodycontainer .igem_button:hover > img {
 +
  -webkit-filter: grayscale(100%);
 +
}
 +
#bodycontainer .red h2 {
 +
  background: #d10000;
 +
}
 +
#bodycontainer .purple h2 {
 +
  background: #8e44ad;
 +
}
 +
#bodycontainer .blue h2 {
 +
  background: #2c3e50;
 +
}
 +
#bodycontainer .belize h2 {
 +
  background: #2980b9;
 +
}
 +
#bodycontainer .green h2 {
 +
  background: #27ae60;
 +
}
 +
#bodycontainer .orange h2 {
 +
  background: #f39c12;
 +
}
 +
#category_navbar {
 +
  color: black;
 +
  padding-left: 0;
 +
  padding: 5px;
 +
}
 +
#category_navbar .active {
 +
  background: rgba(255, 156, 0, 0.17);
 +
  border: 1px solid rgba(0, 0, 0, 0.17);
 +
}
 +
#category_navbar .nav > li > a {
 +
  text-transform: uppercase;
 +
  font-size: 16px;
 +
  font-family: Lato;
 +
}
 +
#category_navbar .nav > ul > li,
 +
#category_navbar .nav > ul > ul > li {
 +
  list-style-type: none;
 +
  display: block;
 +
  color: inherit;
 +
  border: 0;
 +
  margin-left: 10px;
 +
  padding-top: 4px;
 +
  padding-bottom: 4px;
 +
}
 +
#category_navbar .nav > ul > li a,
 +
#category_navbar .nav > ul > ul > li a {
 +
  font-size: 14px;
 +
  font-family: Lato;       
 +
}
 +
#category_navbar .nav > ul > ul > li {
 +
  margin-left: 35px;
 +
}
 +
#category_navbar .nav > ul > li:hover,
 +
#category_navbar .nav > ul > ul > li:hover {
 +
  background: rgba(255, 255, 255, 0.5);
 +
}
 +
#member_spotlight h5 {
 +
  padding: 5px 7px;
 +
  color: white;
 +
}
 +
#member_spotlight .intro_large h5 {
 +
  font-size: 20px;
 +
  padding: 15px 15px;
 +
  margin-bottom: 10px;
 +
}
 +
#member_spotlight #spotlight_question_1 h5 {
 +
  background: #c0392b;
 +
  width:auto;
 +
}
 +
#member_spotlight #spotlight_question_2 h5 {
 +
  background: #8e44ad;
 +
  width:auto;
 +
}
 +
#member_spotlight #spotlight_question_3 h5 {
 +
  background: #2980b9;
 +
  width:auto;
 +
}
 +
#member_spotlight #spotlight_question_intro h5 {
 +
  background: #e67e22;
 +
  width:auto;
 +
}
 +
#lab_notes {
 +
  text-align: center;
 +
}
 +
#lab_notes img {
 +
  margin: 0 auto;
 +
  display: block;
 +
}
 +
#lab_notes :hover img {
 +
  -webkit-transform: scale(1.1);
 +
}
 +
.block_header {
 +
  display: inline-block;
 +
  color: white;
 +
  padding: 7px 11px;
 +
  padding-bottom: 5px;
 +
}
 +
.affix {
 +
  top: 60px;
 +
}
 +
.container {
 +
  min-width: 1080px;
 +
}
 +
.container div nav {
 +
  min-width: 1080px;
 +
}
 +
p,
 +
ol > li,
 +
td,
 +
th,
 +
caption,
 +
.ulstyled > li,
 +
.calendar > li {
 +
  font-family: Lato;
 +
  font-size: 15px;
 +
}
 +
p a,
 +
ol > li a,
 +
td a,
 +
th a,
 +
caption a,
 +
.ulstyled > li a,
 +
.calendar > li a {
 +
  text-decoration: underline;
 +
  color: #3b5998;
 +
}
 +
.calendar {
 +
  padding-left: 10px;
 +
}
 +
.calendar > li {
 +
  font-size: 13px;
 +
}
 +
figcaption {
 +
  color: white;
 +
  padding: 4px 5px;
 +
  display: inline-block;
 +
  font-size:14px;
 +
}
 +
figure {
 +
  margin-bottom: 10px;
 +
}
 +
.red {
 +
  background: #c0392b;
 +
}
 +
.purple {
 +
  background: #8e44ad;
 +
}
 +
.blue {
 +
  background: #2c3e50;
 +
}
 +
.belize {
 +
  background: #2980b9;
 +
}
 +
.green {
 +
  background: #27ae60;
 +
}
 +
.orange {
 +
  background: #f39c12;
 +
}
 +
.darkblue {
 +
  background: #34495e;
 +
}
 +
.table-bordered,
 +
.table-bordered > thead > tr > th,
 +
.table-bordered > tbody > tr > th,
 +
.table-bordered > tfoot > tr > th,
 +
.table-bordered > thead > tr > td,
 +
.table-bordered > tbody > tr > td,
 +
.table-bordered > tfoot > tr > td {
 +
  border: 1px solid black;
 +
}
 +
.col-lg-offset-1half {
 +
  margin-left: 11.111111111111%;
 +
}
 +
.clearfix:after {
 +
  content: " ";
 +
  display: block;
 +
  height: 0;
 +
  clear: both;
 +
}
  
  
−
<div class="column full_size">
 
  
−
<p>Do you want to be considered for the <a href="https://2016.igem.org/Judging/Awards#SpecialPrizes">Best Integrated Human Practices award</a>? Help the judges consider your team for this award by describing your work on this page.</p>
+
.red1 {  background: #c0392b;
 +
}
 +
    </style>
  
 +
<script>localStorage.clear();</script>
  
−
<p>Here are two examples of excellent Integrated Human Practices work from 2015:</p>
 
−
<ul>
 
−
<li><a href="https://2015.igem.org/Team:Bielefeld-CeBiTec/Practices">Bielefeld 2015</a></li>
 
−
<li><a href="https://2015.igem.org/Team:Edinburgh/Practices">Edinburgh 2015</a></li>
 
−
</ul>
 
  
 +
</head>
 +
 +
 +
<body data-spy="scroll" data-target="#category_navbar">
 +
<div class="container" style='z-index:10;position:relative;'>
 +
  <div id='bodycontainer' class='row card'>
 +
    <div class="col-sm-10">
 +
      <div class="col-xs-12 text-center">
 +
        <h1>Integrated Practices</h1>
 +
      </div>
 +
      <div class="row" id='environmental_safety'>
 +
    <div class="col-sm-10 col-sm-offset-1">
 +
  <p>As we all know, human practices is an important part in iGEM that we need to do some research to ensure our project are well known and can be used on a large scale without risk.<br>
 +
    For our project, we communicate with some iGEM teams to discuss the feasible and progressive of our program. While we have the experiment on our project, we do some questionnaire and presentation in order to let people have some understanding of our project. Besides, we talked to some of the Cardiovascular physicians and comprehend the profound meaning of our project and enhance our self-confidence. What&rsquo;s more, we imagined the prospects of our project. Now, take a look what we do on human practice!</p>
 +
<h3 class='block_header red' style = "padding-top: 50px">Check our gold/ silver and other sections in human practice to find more.</h3>
 +
    </div>
 +
  </div>
 +
  <div class="row" id='environmental_safety3'>
 +
    <div class="col-sm-10 col-sm-offset-1">
 +
      <div class="row" id='environmental_safety2'>
 +
        <div class="col-sm-10 col-sm-offset-1"></div>
 +
      </div>
 +
    </div>
 +
  </div>
 +
    </div>
 +
 +
  </div>
 
</div>
 
</div>
 +
<br>
 +
<br><br>
 +
<script language="javascript">
 +
var c = document.getElementById("canvas-container");
 +
var ctx = c.getContext("2d");
 +
var stripeFill = [];
 +
var stripeVelocity = [];
 +
var unitSize;
 +
var colorText = "200, 200, 200,";
 +
var stripeCount = 100;
 +
ctx.canvas.width  = window.innerWidth;
 +
ctx.canvas.height = window.innerHeight;
 +
var upperLimit = 100;
 +
var lowerLimit = 0;
 +
 +
unitSize = window.innerWidth/stripeCount;
 +
 +
for (var i = 0; i < stripeCount; i++){
 +
  stripeFill[i] = Math.round(Math.random()*upperLimit);
 +
  stripeVelocity[i] = random(-.6,.6);
 +
}
 +
 +
function wiggle(){
 +
  for (var i = 0; i < stripeCount; i++){
 +
    stripeVelocity[i] += random(-.1, .1);
 +
    if(Math.abs(stripeVelocity[i]) > 3){
 +
      stripeVelocity[i] = 3*Math.abs(stripeVelocity[i])/stripeVelocity[i];
 +
    }
 +
    stripeFill[i] += stripeVelocity[i];
 +
    if (stripeFill[i]<lowerLimit){
 +
      stripeFill[i] = lowerLimit;
 +
      stripeVelocity[i] = 3;
 +
    }
 +
    else if (stripeFill[i]>upperLimit){
 +
      stripeFill[i] = upperLimit;
 +
      stripeVelocity[i] = -3;
 +
    }
 +
  }
 +
}
 +
 +
setInterval(execute,50);
 +
 +
function execute(){
 +
    wiggle();
 +
    ctx.fillStyle = "rgba(255, 255, 255, 1)";
 +
    ctx.fillRect(0,0,window.innerWidth,window.innerHeight);
 +
 +
    for (var i = 0; i < stripeCount; i++){
 +
      ctx.fillStyle = "rgba(180,180,180," + stripeFill[i]/255 + ")" ;
 +
      ctx.fillRect(i*unitSize,0,unitSize,window.innerHeight)
 +
    }
 +
}
 +
 +
function bob(item){
 +
  return function(){item.css({display:"none"});}
 +
}
 +
 +
function random (x, y){
 +
  var answer = Math.random()*(y-x)+x;
 +
  return answer;
 +
}
 +
 +
  
  
  
 +
$(".dropdown").mouseenter(function(){
 +
  //console.log("bobby");
 +
    $(this).find(".dropdown-menu").css({height:"0px"});
 +
    $(this).find(".dropdown-menu").css({display:"block"});
 +
    $(this).find(".dropdown-menu").animate({height:"180px"},150,"swing",function(){});
 +
});
  
 +
$(".dropdown").mouseleave(function(){
 +
  $(this).find(".dropdown-menu").animate({height:"0px"},150,"swing", bob($(this).find(".dropdown-menu")));//};
 +
});
  
 +
function bob(item){
 +
  return function(){item.css({display:"none"});};
 +
}
 +
</script>
  
 +
</body>
 
</html>
 
</html>

Latest revision as of 17:46, 19 October 2016

Template

Top

 

Safety

Integrated Practices

As we all know, human practices is an important part in iGEM that we need to do some research to ensure our project are well known and can be used on a large scale without risk.
For our project, we communicate with some iGEM teams to discuss the feasible and progressive of our program. While we have the experiment on our project, we do some questionnaire and presentation in order to let people have some understanding of our project. Besides, we talked to some of the Cardiovascular physicians and comprehend the profound meaning of our project and enhance our self-confidence. What’s more, we imagined the prospects of our project. Now, take a look what we do on human practice!

Check our gold/ silver and other sections in human practice to find more.