Difference between revisions of "Team:CIEI-BJ/Engagement"

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;
 +
}
  
  
  
 +
.red1 {  background: #c0392b;
 +
}
 +
    </style>
  
 +
<script>localStorage.clear();</script>
  
−
<div class="column full_size">
 
  
 +
</head>
  
−
<p>Do you want to be considered for the <a href="https://2016.igem.org/Judging/Awards#SpecialPrizes">Best Education and Public Engagement award</a>? Help the judges consider your team for this award by describing your work on this page.</p>
+
 
 +
<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>Engagement</h1>
 +
      </div>
 +
      <div class="row" id='environmental_safety'>
 +
    <div class="col-sm-10 col-sm-offset-1">
 +
  <h3 class='block_header red' style = "padding-top: 50px"><strong>how we interact with society.</strong></h3>
 +
  <ul>
 +
                    <li>
 +
                      <p>Our team members come from all parts of China, covering five parts of China's east and west, north and south. While we do our project, all of us have some presentations in our hometown to introduce our project. After this, they have a more intense interest in genetic engineering and know what we want to do through this project. Thus, more people learned about iGEM through this project and willing to engage the job in it.</p>
 +
                      <p><br>
 +
                        <img width="487" height="366" src="https://static.igem.org/mediawiki/2016/e/e5/T--CIEI-BJ--Engage1.png" align="left" hspace="9" alt="演讲"></p>
 +
                      <p>&nbsp;</p>
 +
                      <p>&nbsp;</p>
 +
                      <p>&nbsp;</p>
 +
                      <p>&nbsp;</p>
 +
                      <p>&nbsp;</p>
 +
                      <p>&nbsp;</p>
 +
                      <p>&nbsp;</p>
 +
                      <p>&nbsp;</p>
 +
                      <p>&nbsp;</p>
 +
                      <p>&nbsp;</p>
 +
                      <p>&nbsp;</p>
 +
                      <p>We also did a survey on how many people have relatives or friends with CVD, and we found that 50.67% of these people are using medicines which contain tanshinone, so that greatly proves that this medicine has an important effect in curing CVD. People who are taking this kind of medicine also have positive testing results on many metrics. Finally, almost 30% of the petients want to use our medicine, if we finally produce it, so there'll be a bright future for Tanshinone, which we are currently studying at in our project.</p>
 +
                      <p><br>
 +
                        <img width="322" height="430" src="https://static.igem.org/mediawiki/2016/0/06/T--CIEI-BJ--Engage2.png" align="left" hspace="9" alt="questionnaire"></p>
 +
                      <p>&nbsp;</p>
 +
                      <p>&nbsp;</p>
 +
                      <p>&nbsp;</p>
 +
                      <p>&nbsp;</p>
 +
                      <p>&nbsp;</p>
 +
                      <p>&nbsp;</p>
 +
                      <p>&nbsp;</p>
 +
                      <p>&nbsp;</p>
 +
                      <p>&nbsp;</p>
 +
                      <p>&nbsp;</p>
 +
                      <p>&nbsp;</p>
 +
                      <p>&nbsp;</p>
 +
                      <p>&nbsp;</p>
 +
                      <p>We looked for some sponsors and explained our project. They were amazed at what we thought and supported our projected through helping us produce uniforms and providing experimental equipment and funds. They are International teenager competition and communication center; Genewiz biotech Co. Ltd; Beijing ZHKH medical Co., Kltd.; Anhui Haofang electromechanics Co., Ltd; Yifeng pharmacy; Runtian pharmacy. And they said that  they will put more attention into education, and let more children get a good education, cultivate more people who can contribute the society just like us.<br>
 +
                        <img width="377" height="503" src="https://static.igem.org/mediawiki/2016/6/63/T--CIEI-BJ--Engage3.png" align="left" hspace="9" alt="赞助"></p>
 +
                      <p>&nbsp;</p>
 +
                      <p>&nbsp;</p>
 +
                      <p>&nbsp;</p>
 +
          </ul>
 +
  <p>&nbsp;</p>
 +
  <p>&nbsp;</p>
 +
  <p>&nbsp;</p>
 +
  <p>&nbsp;</p>
 +
  <p>&nbsp;</p>
 +
  <p>&nbsp;</p>
 +
  <p>&nbsp;</p>
 +
  <p>&nbsp;</p>
 +
  <p>&nbsp;</p>
 +
  <p>&nbsp;</p>
 +
  <p>&nbsp;</p>
 +
  <p>&nbsp;</p>
 +
    </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);
 +
}
  
−
<p>Here are two examples of excellent Education and Public Engagement from 2015:</p>
+
function wiggle(){
−
<ul>
+
  for (var i = 0; i < stripeCount; i++){
−
<li><a href="https://2015.igem.org/Team:UFMG_Brazil/Public_Engagement"> UFMG Brazil 2015</a></li>
+
    stripeVelocity[i] += random(-.1, .1);
−
<li><a href="https://2015.igem.org/Team:William_and_Mary/Practices"> William and Mary 2015</a></li>
+
    if(Math.abs(stripeVelocity[i]) > 3){
−
</ul>
+
      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;
 +
    }
 +
  }
 +
}
  
−
</div>
+
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>

Revision as of 17:41, 19 October 2016

Template

Top

 

Safety

Engagement

how we interact with society.

  • Our team members come from all parts of China, covering five parts of China's east and west, north and south. While we do our project, all of us have some presentations in our hometown to introduce our project. After this, they have a more intense interest in genetic engineering and know what we want to do through this project. Thus, more people learned about iGEM through this project and willing to engage the job in it.


    演讲

     

     

     

     

     

     

     

     

     

     

     

    We also did a survey on how many people have relatives or friends with CVD, and we found that 50.67% of these people are using medicines which contain tanshinone, so that greatly proves that this medicine has an important effect in curing CVD. People who are taking this kind of medicine also have positive testing results on many metrics. Finally, almost 30% of the petients want to use our medicine, if we finally produce it, so there'll be a bright future for Tanshinone, which we are currently studying at in our project.


    questionnaire

     

     

     

     

     

     

     

     

     

     

     

     

     

    We looked for some sponsors and explained our project. They were amazed at what we thought and supported our projected through helping us produce uniforms and providing experimental equipment and funds. They are International teenager competition and communication center; Genewiz biotech Co. Ltd; Beijing ZHKH medical Co., Kltd.; Anhui Haofang electromechanics Co., Ltd; Yifeng pharmacy; Runtian pharmacy. And they said that  they will put more attention into education, and let more children get a good education, cultivate more people who can contribute the society just like us.
    赞助