(19 intermediate revisions by the same user not shown) | |||
Line 1: | Line 1: | ||
− | |||
<html> | <html> | ||
+ | <head> | ||
+ | <meta name="viewport" content="width=device-width, initial-scale=1"> | ||
+ | <style type="text/css"> | ||
+ | /*GOOGLE FONTS*/ | ||
+ | /* latin */ | ||
+ | @font-face { | ||
+ | font-family: 'Dosis'; | ||
+ | font-style: normal; | ||
+ | font-weight: 400; | ||
+ | src: local('Dosis Regular'), local('Dosis-Regular'), url(https://static.igem.org/mediawiki/2018/4/4d/T--MIT--dosis2.woff) format('woff'); | ||
+ | unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; | ||
+ | } | ||
− | + | /* latin */ | |
+ | @font-face { | ||
+ | font-family: 'Raleway'; | ||
+ | font-style: normal; | ||
+ | font-weight: 400; | ||
+ | src: local('Raleway'), local('Raleway-Regular'), url(https://static.igem.org/mediawiki/2018/5/59/T--MIT--raleway2.woff) format('woff'); | ||
+ | unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; | ||
+ | } | ||
− | + | /* W3.CSS 4.10 February 2018 by Jan Egil and Borge Refsnes */ | |
+ | html{box-sizing:border-box}*,*:before,*:after{box-sizing:inherit} | ||
+ | /* Extract from normalize.css by Nicolas Gallagher and Jonathan Neal git.io/normalize */ | ||
+ | html{-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0} | ||
+ | article,aside,details,figcaption,figure,footer,header,main,menu,nav,section,summary{display:block} | ||
+ | audio,canvas,progress,video{display:inline-block}progress{vertical-align:baseline} | ||
+ | audio:not([controls]){display:none;height:0}[hidden],template{display:none} | ||
+ | a{background-color:transparent;-webkit-text-decoration-skip:objects} | ||
+ | a:active,a:hover{outline-width:0}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted} | ||
+ | dfn{font-style:italic}mark{background:#ff0;color:#000} | ||
+ | small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline} | ||
+ | sub{bottom:-0.25em}sup{top:-0.5em}figure{margin:1em 40px}img{border-style:none}svg:not(:root){overflow:hidden} | ||
+ | code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}hr{box-sizing:content-box;height:0;overflow:visible} | ||
+ | button,input,select,textarea{font:inherit;margin:0}optgroup{font-weight:bold} | ||
+ | button,input{overflow:visible}button,select{text-transform:none} | ||
+ | button,html [type=button],[type=reset],[type=submit]{-webkit-appearance:button} | ||
+ | button::-moz-focus-inner, [type=button]::-moz-focus-inner, [type=reset]::-moz-focus-inner, [type=submit]::-moz-focus-inner{border-style:none;padding:0} | ||
+ | button:-moz-focusring, [type=button]:-moz-focusring, [type=reset]:-moz-focusring, [type=submit]:-moz-focusring{outline:1px dotted ButtonText} | ||
+ | fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:.35em .625em .75em} | ||
+ | legend{color:inherit;display:table;max-width:100%;padding:0;white-space:normal}textarea{overflow:auto} | ||
+ | [type=checkbox],[type=radio]{padding:0} | ||
+ | [type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto} | ||
+ | [type=search]{-webkit-appearance:textfield;outline-offset:-2px} | ||
+ | [type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration{-webkit-appearance:none} | ||
+ | ::-webkit-input-placeholder{color:inherit;opacity:0.54} | ||
+ | ::-webkit-file-upload-button{-webkit-appearance:button;font:inherit} | ||
+ | /* End extract */ | ||
+ | html,body{font-family:Verdana,sans-serif;font-size:15px;line-height:1.5}html{overflow-x:hidden} | ||
+ | h1{font-size:36px}h2{font-size:30px}h3{font-size:24px}h4{font-size:20px}h5{font-size:18px}h6{font-size:16px}.w3-serif{font-family:serif} | ||
+ | h1,h2,h3,h4,h5,h6{font-family:"Segoe UI",Arial,sans-serif;font-weight:400;margin:10px 0}.w3-wide{letter-spacing:4px} | ||
+ | hr{border:0;border-top:1px solid #eee;margin:20px 0} | ||
+ | .w3-image{max-width:100%;height:auto}img{vertical-align:middle}a{color:inherit} | ||
+ | .w3-table,.w3-table-all{border-collapse:collapse;border-spacing:0;width:100%;display:table}.w3-table-all{border:1px solid #ccc} | ||
+ | .w3-bordered tr,.w3-table-all tr{border-bottom:1px solid #ddd}.w3-striped tbody tr:nth-child(even){background-color:#f1f1f1} | ||
+ | .w3-table-all tr:nth-child(odd){background-color:#fff}.w3-table-all tr:nth-child(even){background-color:#f1f1f1} | ||
+ | .w3-hoverable tbody tr:hover,.w3-ul.w3-hoverable li:hover{background-color:#ccc}.w3-centered tr th,.w3-centered tr td{text-align:center} | ||
+ | .w3-table td,.w3-table th,.w3-table-all td,.w3-table-all th{padding:8px 8px;display:table-cell;text-align:left;vertical-align:top} | ||
+ | .w3-table th:first-child,.w3-table td:first-child,.w3-table-all th:first-child,.w3-table-all td:first-child{padding-left:16px} | ||
+ | .w3-btn,.w3-button{border:none;display:inline-block;padding:8px 16px;vertical-align:middle;overflow:hidden;text-decoration:none;color:inherit;background-color:inherit;text-align:center;cursor:pointer;white-space:nowrap} | ||
+ | .w3-btn:hover{box-shadow:0 8px 16px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19)} | ||
+ | .w3-btn,.w3-button{-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none} | ||
+ | .w3-disabled,.w3-btn:disabled,.w3-button:disabled{cursor:not-allowed;opacity:0.3}.w3-disabled *,:disabled *{pointer-events:none} | ||
+ | .w3-btn.w3-disabled:hover,.w3-btn:disabled:hover{box-shadow:none} | ||
+ | .w3-badge,.w3-tag{background-color:#000;color:#fff;display:inline-block;padding-left:8px;padding-right:8px;text-align:center}.w3-badge{border-radius:50%} | ||
+ | .w3-ul{list-style-type:none;padding:0;margin:0}.w3-ul li{padding:8px 16px;border-bottom:1px solid #ddd}.w3-ul li:last-child{border-bottom:none} | ||
+ | .w3-tooltip,.w3-display-container{position:relative}.w3-tooltip .w3-text{display:none}.w3-tooltip:hover .w3-text{display:inline-block} | ||
+ | .w3-ripple:active{opacity:0.5}.w3-ripple{transition:opacity 0s} | ||
+ | .w3-input{padding:8px;display:block;border:none;border-bottom:1px solid #ccc;width:100%} | ||
+ | .w3-select{padding:9px 0;width:100%;border:none;border-bottom:1px solid #ccc} | ||
+ | .w3-dropdown-click,.w3-dropdown-hover{position:relative;display:inline-block;cursor:pointer} | ||
+ | .w3-dropdown-hover:hover .w3-dropdown-content{display:block} | ||
+ | .w3-dropdown-hover:first-child,.w3-dropdown-click:hover{background-color:#ccc;color:#000} | ||
+ | .w3-dropdown-hover:hover > .w3-button:first-child,.w3-dropdown-click:hover > .w3-button:first-child{background-color:#ccc;color:#000} | ||
+ | .w3-dropdown-content{cursor:auto;color:#000;background-color:#fff;display:none;position:absolute;min-width:160px;margin:0;padding:0;z-index:1} | ||
+ | .w3-check,.w3-radio{width:24px;height:24px;position:relative;top:6px} | ||
+ | .w3-sidebar{height:100%;width:200px;background-color:#fff;position:fixed!important;z-index:1;overflow:auto} | ||
+ | .w3-bar-block .w3-dropdown-hover,.w3-bar-block .w3-dropdown-click{width:100%} | ||
+ | .w3-bar-block .w3-dropdown-hover .w3-dropdown-content,.w3-bar-block .w3-dropdown-click .w3-dropdown-content{min-width:100%} | ||
+ | .w3-bar-block .w3-dropdown-hover .w3-button,.w3-bar-block .w3-dropdown-click .w3-button{width:100%;text-align:left;padding:8px 16px} | ||
+ | .w3-main,#main{transition:margin-left .4s} | ||
+ | .w3-modal{z-index:3;display:none;padding-top:100px;position:fixed;left:0;top:0;width:100%;height:100%;overflow:auto;background-color:rgb(0,0,0);background-color:rgba(0,0,0,0.4)} | ||
+ | .w3-modal-content{margin:auto;background-color:#fff;position:relative;padding:0;outline:0;width:600px} | ||
+ | .w3-bar{width:100%;overflow:hidden}.w3-center .w3-bar{display:inline-block;width:auto} | ||
+ | .w3-bar .w3-bar-item{padding:8px 16px;float:left;width:auto;border:none;display:block;outline:0} | ||
+ | .w3-bar .w3-dropdown-hover,.w3-bar .w3-dropdown-click{position:static;float:left} | ||
+ | .w3-bar .w3-button{white-space:normal} | ||
+ | .w3-bar-block .w3-bar-item{width:100%;display:block;padding:8px 16px;text-align:left;border:none;white-space:normal;float:none;outline:0} | ||
+ | .w3-bar-block.w3-center .w3-bar-item{text-align:center}.w3-block{display:block;width:100%} | ||
+ | .w3-responsive{display:block;overflow-x:auto} | ||
+ | .w3-container:after,.w3-container:before,.w3-panel:after,.w3-panel:before,.w3-row:after,.w3-row:before,.w3-row-padding:after,.w3-row-padding:before, | ||
+ | .w3-cell-row:before,.w3-cell-row:after,.w3-clear:after,.w3-clear:before,.w3-bar:before,.w3-bar:after{content:"";display:table;clear:both} | ||
+ | .w3-col,.w3-half,.w3-third,.w3-twothird,.w3-threequarter,.w3-quarter{float:left;width:100%} | ||
+ | .w3-col.s1{width:8.33333%}.w3-col.s2{width:16.66666%}.w3-col.s3{width:24.99999%}.w3-col.s4{width:33.33333%} | ||
+ | .w3-col.s5{width:41.66666%}.w3-col.s6{width:49.99999%}.w3-col.s7{width:58.33333%}.w3-col.s8{width:66.66666%} | ||
+ | .w3-col.s9{width:74.99999%}.w3-col.s10{width:83.33333%}.w3-col.s11{width:91.66666%}.w3-col.s12{width:99.99999%} | ||
+ | @media (min-width:601px){.w3-col.m1{width:8.33333%}.w3-col.m2{width:16.66666%}.w3-col.m3,.w3-quarter{width:24.99999%}.w3-col.m4,.w3-third{width:33.33333%} | ||
+ | .w3-col.m5{width:41.66666%}.w3-col.m6,.w3-half{width:49.99999%}.w3-col.m7{width:58.33333%}.w3-col.m8,.w3-twothird{width:66.66666%} | ||
+ | .w3-col.m9,.w3-threequarter{width:74.99999%}.w3-col.m10{width:83.33333%}.w3-col.m11{width:91.66666%}.w3-col.m12{width:99.99999%}} | ||
+ | @media (min-width:993px){.w3-col.l1{width:8.33333%}.w3-col.l2{width:16.66666%}.w3-col.l3{width:24.99999%}.w3-col.l4{width:33.33333%} | ||
+ | .w3-col.l5{width:41.66666%}.w3-col.l6{width:49.99999%}.w3-col.l7{width:58.33333%}.w3-col.l8{width:66.66666%} | ||
+ | .w3-col.l9{width:74.99999%}.w3-col.l10{width:83.33333%}.w3-col.l11{width:91.66666%}.w3-col.l12{width:99.99999%}} | ||
+ | .w3-content{max-width:980px;margin:auto}.w3-rest{overflow:hidden} | ||
+ | .w3-cell-row{display:table;width:100%}.w3-cell{display:table-cell} | ||
+ | .w3-cell-top{vertical-align:top}.w3-cell-middle{vertical-align:middle}.w3-cell-bottom{vertical-align:bottom} | ||
+ | .w3-hide{display:none!important}.w3-show-block,.w3-show{display:block!important}.w3-show-inline-block{display:inline-block!important} | ||
+ | @media (max-width:600px){.w3-modal-content{margin:0 10px;width:auto!important}.w3-modal{padding-top:30px} | ||
+ | .w3-dropdown-hover.w3-mobile .w3-dropdown-content,.w3-dropdown-click.w3-mobile .w3-dropdown-content{position:relative} | ||
+ | .w3-hide-small{display:none!important}.w3-mobile{display:block;width:100%!important}.w3-bar-item.w3-mobile,.w3-dropdown-hover.w3-mobile,.w3-dropdown-click.w3-mobile{text-align:center} | ||
+ | .w3-dropdown-hover.w3-mobile,.w3-dropdown-hover.w3-mobile .w3-btn,.w3-dropdown-hover.w3-mobile .w3-button,.w3-dropdown-click.w3-mobile,.w3-dropdown-click.w3-mobile .w3-btn,.w3-dropdown-click.w3-mobile .w3-button{width:100%}} | ||
+ | @media (max-width:768px){.w3-modal-content{width:500px}.w3-modal{padding-top:50px}} | ||
+ | @media (min-width:993px){.w3-modal-content{width:900px}.w3-hide-large{display:none!important}.w3-sidebar.w3-collapse{display:block!important}} | ||
+ | @media (max-width:992px) and (min-width:601px){.w3-hide-medium{display:none!important}} | ||
+ | @media (max-width:992px){.w3-sidebar.w3-collapse{display:none}.w3-main{margin-left:0!important;margin-right:0!important}} | ||
+ | .w3-top,.w3-bottom{position:fixed;width:100%;z-index:1}.w3-top{top:0}.w3-bottom{bottom:0} | ||
+ | .w3-overlay{position:fixed;display:none;width:100%;height:100%;top:0;left:0;right:0;bottom:0;background-color:rgba(0,0,0,0.5);z-index:2} | ||
+ | .w3-display-topleft{position:absolute;left:0;top:0}.w3-display-topright{position:absolute;right:0;top:0} | ||
+ | .w3-display-bottomleft{position:absolute;left:0;bottom:0}.w3-display-bottomright{position:absolute;right:0;bottom:0} | ||
+ | .w3-display-middle{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%)} | ||
+ | .w3-display-left{position:absolute;top:50%;left:0%;transform:translate(0%,-50%);-ms-transform:translate(-0%,-50%)} | ||
+ | .w3-display-right{position:absolute;top:50%;right:0%;transform:translate(0%,-50%);-ms-transform:translate(0%,-50%)} | ||
+ | .w3-display-topmiddle{position:absolute;left:50%;top:0;transform:translate(-50%,0%);-ms-transform:translate(-50%,0%)} | ||
+ | .w3-display-bottommiddle{position:absolute;left:50%;bottom:0;transform:translate(-50%,0%);-ms-transform:translate(-50%,0%)} | ||
+ | .w3-display-container:hover .w3-display-hover{display:block}.w3-display-container:hover span.w3-display-hover{display:inline-block}.w3-display-hover{display:none} | ||
+ | .w3-display-position{position:absolute} | ||
+ | .w3-circle{border-radius:50%} | ||
+ | .w3-round-small{border-radius:2px}.w3-round,.w3-round-medium{border-radius:4px}.w3-round-large{border-radius:8px}.w3-round-xlarge{border-radius:16px}.w3-round-xxlarge{border-radius:32px} | ||
+ | .w3-row-padding,.w3-row-padding>.w3-half,.w3-row-padding>.w3-third,.w3-row-padding>.w3-twothird,.w3-row-padding>.w3-threequarter,.w3-row-padding>.w3-quarter,.w3-row-padding>.w3-col{padding:0 8px} | ||
+ | .w3-container,.w3-panel{padding:0.01em 16px}.w3-panel{margin-top:16px;margin-bottom:16px} | ||
+ | .w3-code,.w3-codespan{font-family:Consolas,"courier new";font-size:16px} | ||
+ | .w3-code{width:auto;background-color:#fff;padding:8px 12px;border-left:4px solid #4CAF50;word-wrap:break-word} | ||
+ | .w3-codespan{color:crimson;background-color:#f1f1f1;padding-left:4px;padding-right:4px;font-size:110%} | ||
+ | .w3-card,.w3-card-2{box-shadow:0 2px 5px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12)} | ||
+ | .w3-card-4,.w3-hover-shadow:hover{box-shadow:0 4px 10px 0 rgba(0,0,0,0.2),0 4px 20px 0 rgba(0,0,0,0.19)} | ||
+ | .w3-spin{animation:w3-spin 2s infinite linear}@keyframes w3-spin{0%{transform:rotate(0deg)}100%{transform:rotate(359deg)}} | ||
+ | .w3-animate-fading{animation:fading 10s infinite}@keyframes fading{0%{opacity:0}50%{opacity:1}100%{opacity:0}} | ||
+ | .w3-animate-opacity{animation:opac 0.8s}@keyframes opac{from{opacity:0} to{opacity:1}} | ||
+ | .w3-animate-top{position:relative;animation:animatetop 0.4s}@keyframes animatetop{from{top:-300px;opacity:0} to{top:0;opacity:1}} | ||
+ | .w3-animate-left{position:relative;animation:animateleft 0.4s}@keyframes animateleft{from{left:-300px;opacity:0} to{left:0;opacity:1}} | ||
+ | .w3-animate-right{position:relative;animation:animateright 0.4s}@keyframes animateright{from{right:-300px;opacity:0} to{right:0;opacity:1}} | ||
+ | .w3-animate-bottom{position:relative;animation:animatebottom 0.4s}@keyframes animatebottom{from{bottom:-300px;opacity:0} to{bottom:0;opacity:1}} | ||
+ | .w3-animate-zoom {animation:animatezoom 0.6s}@keyframes animatezoom{from{transform:scale(0)} to{transform:scale(1)}} | ||
+ | .w3-animate-input{transition:width 0.4s ease-in-out}.w3-animate-input:focus{width:100%!important} | ||
+ | .w3-opacity,.w3-hover-opacity:hover{opacity:0.60}.w3-opacity-off,.w3-hover-opacity-off:hover{opacity:1} | ||
+ | .w3-opacity-max{opacity:0.25}.w3-opacity-min{opacity:0.75} | ||
+ | .w3-greyscale-max,.w3-grayscale-max,.w3-hover-greyscale:hover,.w3-hover-grayscale:hover{filter:grayscale(100%)} | ||
+ | .w3-greyscale,.w3-grayscale{filter:grayscale(75%)}.w3-greyscale-min,.w3-grayscale-min{filter:grayscale(50%)} | ||
+ | .w3-sepia{filter:sepia(75%)}.w3-sepia-max,.w3-hover-sepia:hover{filter:sepia(100%)}.w3-sepia-min{filter:sepia(50%)} | ||
+ | .w3-tiny{font-size:10px!important}.w3-small{font-size:12px!important}.w3-medium{font-size:15px!important}.w3-large{font-size:18px!important} | ||
+ | .w3-xlarge{font-size:24px!important}.w3-xxlarge{font-size:36px!important}.w3-xxxlarge{font-size:48px!important}.w3-jumbo{font-size:64px!important} | ||
+ | .w3-left-align{text-align:left!important}.w3-right-align{text-align:right!important}.w3-justify{text-align:justify!important}.w3-center{text-align:center!important} | ||
+ | .w3-border-0{border:0!important}.w3-border{border:1px solid #ccc!important} | ||
+ | .w3-border-top{border-top:1px solid #ccc!important}.w3-border-bottom{border-bottom:1px solid #ccc!important} | ||
+ | .w3-border-left{border-left:1px solid #ccc!important}.w3-border-right{border-right:1px solid #ccc!important} | ||
+ | .w3-topbar{border-top:6px solid #ccc!important}.w3-bottombar{border-bottom:6px solid #ccc!important} | ||
+ | .w3-leftbar{border-left:6px solid #ccc!important}.w3-rightbar{border-right:6px solid #ccc!important} | ||
+ | .w3-section,.w3-code{margin-top:16px!important;margin-bottom:16px!important} | ||
+ | .w3-margin{margin:16px!important}.w3-margin-top{margin-top:16px!important}.w3-margin-bottom{margin-bottom:16px!important} | ||
+ | .w3-margin-left{margin-left:16px!important}.w3-margin-right{margin-right:16px!important} | ||
+ | .w3-padding-small{padding:4px 8px!important}.w3-padding{padding:8px 16px!important}.w3-padding-large{padding:12px 24px!important} | ||
+ | .w3-padding-16{padding-top:16px!important;padding-bottom:16px!important}.w3-padding-24{padding-top:24px!important;padding-bottom:24px!important} | ||
+ | .w3-padding-32{padding-top:32px!important;padding-bottom:32px!important}.w3-padding-48{padding-top:48px!important;padding-bottom:48px!important} | ||
+ | .w3-padding-64{padding-top:64px!important;padding-bottom:64px!important} | ||
+ | .w3-left{float:left!important}.w3-right{float:right!important} | ||
+ | .w3-button:hover{color:#000!important;background-color:#ccc!important} | ||
+ | .w3-transparent,.w3-hover-none:hover{background-color:transparent!important} | ||
+ | .w3-hover-none:hover{box-shadow:none!important} | ||
+ | /* Colors */ | ||
+ | .w3-amber,.w3-hover-amber:hover{color:#000!important;background-color:#ffc107!important} | ||
+ | .w3-aqua,.w3-hover-aqua:hover{color:#000!important;background-color:#00ffff!important} | ||
+ | .w3-blue,.w3-hover-blue:hover{color:#fff!important;background-color:#2196F3!important} | ||
+ | .w3-light-blue,.w3-hover-light-blue:hover{color:#000!important;background-color:#87CEEB!important} | ||
+ | .w3-brown,.w3-hover-brown:hover{color:#fff!important;background-color:#795548!important} | ||
+ | .w3-cyan,.w3-hover-cyan:hover{color:#000!important;background-color:#00bcd4!important} | ||
+ | .w3-blue-grey,.w3-hover-blue-grey:hover,.w3-blue-gray,.w3-hover-blue-gray:hover{color:#fff!important;background-color:#607d8b!important} | ||
+ | .w3-green,.w3-hover-green:hover{color:#fff!important;background-color:#4CAF50!important} | ||
+ | .w3-light-green,.w3-hover-light-green:hover{color:#000!important;background-color:#8bc34a!important} | ||
+ | .w3-indigo,.w3-hover-indigo:hover{color:#fff!important;background-color:#3f51b5!important} | ||
+ | .w3-khaki,.w3-hover-khaki:hover{color:#000!important;background-color:#f0e68c!important} | ||
+ | .w3-lime,.w3-hover-lime:hover{color:#000!important;background-color:#cddc39!important} | ||
+ | .w3-orange,.w3-hover-orange:hover{color:#000!important;background-color:#ff9800!important} | ||
+ | .w3-deep-orange,.w3-hover-deep-orange:hover{color:#fff!important;background-color:#ff5722!important} | ||
+ | .w3-pink,.w3-hover-pink:hover{color:#fff!important;background-color:#e91e63!important} | ||
+ | .w3-purple,.w3-hover-purple:hover{color:#fff!important;background-color:#9c27b0!important} | ||
+ | .w3-deep-purple,.w3-hover-deep-purple:hover{color:#fff!important;background-color:#673ab7!important} | ||
+ | .w3-red,.w3-hover-red:hover{color:#fff!important;background-color:#f44336!important} | ||
+ | .w3-sand,.w3-hover-sand:hover{color:#000!important;background-color:#fdf5e6!important} | ||
+ | .w3-teal,.w3-hover-teal:hover{color:#fff!important;background-color:#009688!important} | ||
+ | .w3-yellow,.w3-hover-yellow:hover{color:#000!important;background-color:#ffeb3b!important} | ||
+ | .w3-white,.w3-hover-white:hover{color:#000!important;background-color:#fff!important} | ||
+ | .w3-black,.w3-hover-black:hover{color:#fff!important;background-color:#000!important} | ||
+ | .w3-grey,.w3-hover-grey:hover,.w3-gray,.w3-hover-gray:hover{color:#000!important;background-color:#9e9e9e!important} | ||
+ | .w3-light-grey,.w3-hover-light-grey:hover,.w3-light-gray,.w3-hover-light-gray:hover{color:#000!important;background-color:#f1f1f1!important} | ||
+ | .w3-dark-grey,.w3-hover-dark-grey:hover,.w3-dark-gray,.w3-hover-dark-gray:hover{color:#fff!important;background-color:#616161!important} | ||
+ | .w3-pale-red,.w3-hover-pale-red:hover{color:#000!important;background-color:#ffdddd!important} | ||
+ | .w3-pale-green,.w3-hover-pale-green:hover{color:#000!important;background-color:#ddffdd!important} | ||
+ | .w3-pale-yellow,.w3-hover-pale-yellow:hover{color:#000!important;background-color:#ffffcc!important} | ||
+ | .w3-pale-blue,.w3-hover-pale-blue:hover{color:#000!important;background-color:#ddffff!important} | ||
+ | .w3-text-amber,.w3-hover-text-amber:hover{color:#ffc107!important} | ||
+ | .w3-text-aqua,.w3-hover-text-aqua:hover{color:#00ffff!important} | ||
+ | .w3-text-blue,.w3-hover-text-blue:hover{color:#2196F3!important} | ||
+ | .w3-text-light-blue,.w3-hover-text-light-blue:hover{color:#87CEEB!important} | ||
+ | .w3-text-brown,.w3-hover-text-brown:hover{color:#795548!important} | ||
+ | .w3-text-cyan,.w3-hover-text-cyan:hover{color:#00bcd4!important} | ||
+ | .w3-text-blue-grey,.w3-hover-text-blue-grey:hover,.w3-text-blue-gray,.w3-hover-text-blue-gray:hover{color:#607d8b!important} | ||
+ | .w3-text-green,.w3-hover-text-green:hover{color:#4CAF50!important} | ||
+ | .w3-text-light-green,.w3-hover-text-light-green:hover{color:#8bc34a!important} | ||
+ | .w3-text-indigo,.w3-hover-text-indigo:hover{color:#3f51b5!important} | ||
+ | .w3-text-khaki,.w3-hover-text-khaki:hover{color:#b4aa50!important} | ||
+ | .w3-text-lime,.w3-hover-text-lime:hover{color:#cddc39!important} | ||
+ | .w3-text-orange,.w3-hover-text-orange:hover{color:#ff9800!important} | ||
+ | .w3-text-deep-orange,.w3-hover-text-deep-orange:hover{color:#ff5722!important} | ||
+ | .w3-text-pink,.w3-hover-text-pink:hover{color:#e91e63!important} | ||
+ | .w3-text-purple,.w3-hover-text-purple:hover{color:#9c27b0!important} | ||
+ | .w3-text-deep-purple,.w3-hover-text-deep-purple:hover{color:#673ab7!important} | ||
+ | .w3-text-red,.w3-hover-text-red:hover{color:#f44336!important} | ||
+ | .w3-text-sand,.w3-hover-text-sand:hover{color:#fdf5e6!important} | ||
+ | .w3-text-teal,.w3-hover-text-teal:hover{color:#009688!important} | ||
+ | .w3-text-yellow,.w3-hover-text-yellow:hover{color:#d2be0e!important} | ||
+ | .w3-text-white,.w3-hover-text-white:hover{color:#fff!important} | ||
+ | .w3-text-black,.w3-hover-text-black:hover{color:#000!important} | ||
+ | .w3-text-grey,.w3-hover-text-grey:hover,.w3-text-gray,.w3-hover-text-gray:hover{color:#757575!important} | ||
+ | .w3-text-light-grey,.w3-hover-text-light-grey:hover,.w3-text-light-gray,.w3-hover-text-light-gray:hover{color:#f1f1f1!important} | ||
+ | .w3-text-dark-grey,.w3-hover-text-dark-grey:hover,.w3-text-dark-gray,.w3-hover-text-dark-gray:hover{color:#3a3a3a!important} | ||
+ | .w3-border-amber,.w3-hover-border-amber:hover{border-color:#ffc107!important} | ||
+ | .w3-border-aqua,.w3-hover-border-aqua:hover{border-color:#00ffff!important} | ||
+ | .w3-border-blue,.w3-hover-border-blue:hover{border-color:#2196F3!important} | ||
+ | .w3-border-light-blue,.w3-hover-border-light-blue:hover{border-color:#87CEEB!important} | ||
+ | .w3-border-brown,.w3-hover-border-brown:hover{border-color:#795548!important} | ||
+ | .w3-border-cyan,.w3-hover-border-cyan:hover{border-color:#00bcd4!important} | ||
+ | .w3-border-blue-grey,.w3-hover-border-blue-grey:hover,.w3-border-blue-gray,.w3-hover-border-blue-gray:hover{border-color:#607d8b!important} | ||
+ | .w3-border-green,.w3-hover-border-green:hover{border-color:#4CAF50!important} | ||
+ | .w3-border-light-green,.w3-hover-border-light-green:hover{border-color:#8bc34a!important} | ||
+ | .w3-border-indigo,.w3-hover-border-indigo:hover{border-color:#3f51b5!important} | ||
+ | .w3-border-khaki,.w3-hover-border-khaki:hover{border-color:#f0e68c!important} | ||
+ | .w3-border-lime,.w3-hover-border-lime:hover{border-color:#cddc39!important} | ||
+ | .w3-border-orange,.w3-hover-border-orange:hover{border-color:#ff9800!important} | ||
+ | .w3-border-deep-orange,.w3-hover-border-deep-orange:hover{border-color:#ff5722!important} | ||
+ | .w3-border-pink,.w3-hover-border-pink:hover{border-color:#e91e63!important} | ||
+ | .w3-border-purple,.w3-hover-border-purple:hover{border-color:#9c27b0!important} | ||
+ | .w3-border-deep-purple,.w3-hover-border-deep-purple:hover{border-color:#673ab7!important} | ||
+ | .w3-border-red,.w3-hover-border-red:hover{border-color:#f44336!important} | ||
+ | .w3-border-sand,.w3-hover-border-sand:hover{border-color:#fdf5e6!important} | ||
+ | .w3-border-teal,.w3-hover-border-teal:hover{border-color:#009688!important} | ||
+ | .w3-border-yellow,.w3-hover-border-yellow:hover{border-color:#ffeb3b!important} | ||
+ | .w3-border-white,.w3-hover-border-white:hover{border-color:#fff!important} | ||
+ | .w3-border-black,.w3-hover-border-black:hover{border-color:#000!important} | ||
+ | .w3-border-grey,.w3-hover-border-grey:hover,.w3-border-gray,.w3-hover-border-gray:hover{border-color:#9e9e9e!important} | ||
+ | .w3-border-light-grey,.w3-hover-border-light-grey:hover,.w3-border-light-gray,.w3-hover-border-light-gray:hover{border-color:#f1f1f1!important} | ||
+ | .w3-border-dark-grey,.w3-hover-border-dark-grey:hover,.w3-border-dark-gray,.w3-hover-border-dark-gray:hover{border-color:#616161!important} | ||
+ | .w3-border-pale-red,.w3-hover-border-pale-red:hover{border-color:#ffe7e7!important}.w3-border-pale-green,.w3-hover-border-pale-green:hover{border-color:#e7ffe7!important} | ||
+ | .w3-border-pale-yellow,.w3-hover-border-pale-yellow:hover{border-color:#ffffcc!important}.w3-border-pale-blue,.w3-hover-border-pale-blue:hover{border-color:#e7ffff!important} | ||
− | |||
− | |||
− | |||
− | |||
+ | #contentSub, #footer-box, #catlinks, #search-controls, #p-logo, #sideMenu, #menubar, .logo_2017, .printfooter, .firstHeading,.visualClear { | ||
+ | display: none; | ||
+ | } /*-- hides default wiki settings --*/ | ||
− | + | #top-section { /*-- styling for default menu bar (edit, page, history, etc.) --*/ | |
− | + | border: 0 none; | |
− | + | height: 3vw; | |
− | + | z-index: 100; | |
− | + | top: 0; | |
− | + | position: fixed; | |
− | + | width: 975px; | |
− | + | left: 50%; | |
− | + | margin-left: -487px; | |
− | + | } | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | <div class=" | + | #top_title, #top { |
− | < | + | display: none; |
− | </ | + | z-index: -1000; |
+ | } | ||
+ | |||
+ | .logo_2018 { | ||
+ | display: none; | ||
+ | z-index: -1000; | ||
+ | } | ||
+ | |||
+ | #globalWrapper, #content { /*-- changes default wiki settings --*/ | ||
+ | width: 100%; | ||
+ | height: 100%; | ||
+ | border: none; | ||
+ | background-color: rgb(165,155,255); | ||
+ | margin: 0px; | ||
+ | padding: 0px; | ||
+ | letter-spacing: normal; | ||
+ | |||
+ | font-weight: light; | ||
+ | } | ||
+ | |||
+ | html, body, .wrapper { /*-- changes default wiki settings --*/ | ||
+ | width: 100%; | ||
+ | height: 100%; | ||
+ | background-color: rgb(165,155,255); | ||
+ | } | ||
+ | |||
+ | .menu { | ||
+ | list-style-type: none; | ||
+ | margin: 0vw; | ||
+ | padding: .3vw; | ||
+ | /*overflow: hidden;*/ | ||
+ | background-color: #333; | ||
+ | position: fixed; | ||
+ | width: 100%; | ||
+ | height: 4.5vw; | ||
+ | -webkit-box-shadow: 0 8px 6px -6px #2c2c2c; | ||
+ | -moz-box-shadow: 0 8px 6px -6px #2c2c2c; | ||
+ | box-shadow: 0 8px 6px -6px #2c2c2c; | ||
+ | top: 1.1vw; | ||
+ | z-index: 20; | ||
+ | } | ||
+ | |||
+ | .sub { | ||
+ | font-family: 'Dosis', sans-serif;; | ||
+ | font-size: 1.5vw; | ||
+ | float: left; | ||
+ | height: 4.5vw; | ||
+ | |||
+ | } | ||
+ | |||
+ | .sub a { | ||
+ | display: block; | ||
+ | color: white; | ||
+ | text-align: center; | ||
+ | padding: 1vw 1.5vw; | ||
+ | text-decoration: none; | ||
+ | } | ||
+ | |||
+ | .sub a:hover { | ||
+ | background-color: #410081; | ||
+ | } | ||
+ | |||
+ | .activemenu { | ||
+ | background-color: #9055ff; | ||
+ | } | ||
+ | |||
+ | .dropdown { | ||
+ | position: relative; | ||
+ | display: inline-block; | ||
+ | } | ||
+ | |||
+ | .dropdown-content { | ||
+ | font-family: 'Raleway', sans-serif;; | ||
+ | font-size: 1.2vw; | ||
+ | display: none; | ||
+ | position: absolute; | ||
+ | top: 4vw; | ||
+ | background-color: #2c2c2c; | ||
+ | min-width: 10vw; | ||
+ | box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); | ||
+ | z-index: 1; | ||
+ | } | ||
+ | |||
+ | .dropdown-content a { | ||
+ | color: white; | ||
+ | padding: .6vw .9vw; | ||
+ | text-decoration: none; | ||
+ | display: block; | ||
+ | } | ||
+ | |||
+ | .dropdown-content a:hover {background-color: #474747;} | ||
+ | |||
+ | .dropdown:hover .dropdown-content {display: block;} | ||
+ | |||
+ | body{ | ||
+ | margin:0; | ||
+ | } | ||
+ | .accordion { | ||
+ | font-family: 'Dosis', sans-serif;; | ||
+ | font-size: 1.5vw; | ||
+ | background-color: #2c2c2c; | ||
+ | color: #e8e8e8; | ||
+ | cursor: pointer; | ||
+ | padding: 18px; | ||
+ | width: 80vw; | ||
+ | border: none; | ||
+ | text-align: left; | ||
+ | outline: none; | ||
+ | transition: 0.4s; | ||
+ | } | ||
+ | |||
+ | .active, .accordion:hover { | ||
+ | background-color: #202020; | ||
+ | } | ||
+ | |||
+ | .accordion:after { | ||
+ | content: '\002B'; | ||
+ | color: #777; | ||
+ | font-weight: bold; | ||
+ | float: right; | ||
+ | margin-left: 5px; | ||
+ | } | ||
+ | |||
+ | .active:after { | ||
+ | content: "\2212"; | ||
+ | } | ||
+ | .h3{ | ||
+ | color: white; | ||
+ | font-family: 'Dosis', sans-serif;; | ||
+ | font-size: 5vw; | ||
+ | position: absolute; | ||
+ | top: 7vw; | ||
+ | left: 2vw; | ||
+ | z-index: 5; | ||
+ | } | ||
+ | .p1{ | ||
+ | font-family: 'Raleway', sans-serif;; | ||
+ | font-size: 1.2vw; | ||
+ | } | ||
+ | .p2{ | ||
+ | font-family: 'Dosis', sans-serif;; | ||
+ | font-size: 1.4vw; | ||
+ | } | ||
+ | |||
+ | .panel { | ||
+ | padding: 0 18px; | ||
+ | background-color: white; | ||
+ | width: 80vw; | ||
+ | max-height: 0; | ||
+ | overflow: hidden; | ||
+ | transition: max-height 0.2s ease-out; | ||
+ | } | ||
+ | |||
+ | .mySlides { | ||
+ | display:none; | ||
+ | width: 60vw; | ||
+ | } | ||
+ | |||
+ | object{ | ||
+ | positon: absolute; | ||
+ | left: 50vw; | ||
+ | } | ||
+ | </style> | ||
+ | |||
+ | |||
+ | |||
+ | </head> | ||
+ | |||
+ | |||
+ | |||
+ | <body style="background-color: rgb(165,155,255)"> | ||
+ | <div class="menu"> | ||
+ | <div class="sub"><a href="https://2018.igem.org/Team:MIT">Home</a></div> | ||
+ | <div class="dropdown"> | ||
+ | <div class="sub"><a href="https://2018.igem.org/Team:MIT/Team">Team</a></div> | ||
+ | <div class="dropdown-content"> | ||
+ | <a href="https://2018.igem.org/Team:MIT/Team">Team Members</a> | ||
+ | <a href="https://2018.igem.org/Team:MIT/Collaborations">Collaborations</a> | ||
+ | </div> | ||
+ | </div> | ||
+ | <div class="dropdown"> | ||
+ | <div class="sub"><a href="https://2018.igem.org/Team:MIT/Description">Project</a></div> | ||
+ | <div class="dropdown-content"> | ||
+ | <a href="https://2018.igem.org/Team:MIT/Design">Design</a> | ||
+ | <a href="https://2018.igem.org/Team:MIT/Results">Results</a> | ||
+ | <a href="https://2018.igem.org/Team:MIT/InterLab">InterLab</a> | ||
+ | <a href="https://2018.igem.org/Team:MIT/Notebook">Notebook</a> | ||
+ | <a href="https://2018.igem.org/Team:MIT/Experiments">Protocols</a> | ||
+ | <a href ="https://2018.igem.org/Team:MIT/Attributions"> Attributions </a> | ||
+ | </div> | ||
+ | </div> | ||
+ | <div class="dropdown"> | ||
+ | <div class="sub"><a href="https://2018.igem.org/Team:MIT/Parts">Parts</a></div> | ||
+ | <div class="dropdown-content"> | ||
+ | <a href="https://2018.igem.org/Team:MIT/Basic_Part">Basic Parts</a> | ||
+ | <a href="https://2018.igem.org/Team:MIT/Composite_Part">Composite Parts</a> | ||
+ | </div> | ||
+ | </div> | ||
+ | <div class="sub"><a href="https://2018.igem.org/Team:MIT/Safety">Safety</a></div> | ||
+ | <div class="dropdown"> | ||
+ | <div class="sub"><a class="activemenu" href="https://2018.igem.org/Team:MIT/Human_Practices">Human Practices</a></div> | ||
+ | <div class="dropdown-content"> | ||
+ | <a href="https://2018.igem.org/Team:MIT/Human_Practices">Integrated Human Practices</a> | ||
+ | <a href="https://2018.igem.org/Team:MIT/Public_Engagement">Public Engagement</a> | ||
+ | </div> | ||
+ | </div> | ||
+ | <div class="sub"><a href="https://2018.igem.org/Team:MIT/Model">Model</a></div> | ||
+ | </div> | ||
+ | |||
+ | |||
+ | <div class="h3">Public Engagement</div> | ||
+ | |||
+ | <div class="w3-content w3-section" style="width:60vw; position: absolute; top: 12vw; left: 20vw;"> | ||
+ | <img class="mySlides" src="https://static.igem.org/mediawiki/2018/7/7a/T--MIT--MITpe1.JPG" style="width:60vw"> | ||
+ | <img class="mySlides" src="https://static.igem.org/mediawiki/2018/a/a3/T--MIT--MITpe2.JPG" style="width:60vw"> | ||
+ | <img class="mySlides" src="https://static.igem.org/mediawiki/2018/8/89/T--MIT--MITmus2.jpg" style="width:60vw"> | ||
+ | <img class="mySlides" src="https://static.igem.org/mediawiki/2018/7/7d/T--MIT--MITmus6.jpg" style="width:60vw"> | ||
+ | <img class="mySlides" src="https://static.igem.org/mediawiki/2018/3/31/T--MIT--MITmus1.jpg" style="width:60vw"> | ||
</div> | </div> | ||
+ | |||
+ | <div class="p1" style="position: absolute; top: 55vw; left: 3vw; margin-right: 5vw;">This year, Team MIT wanted to continue | ||
+ | some of the public engagement efforts carried out by last year's team and also build on top of that in order to provide | ||
+ | an even stronger foundation for future iGEM teams. We planned to be a part of the BioBuilder's Program again, which is a | ||
+ | synthetic biology program for high-schoolers and college students. However, this year we wanted to talk to them about ethical | ||
+ | science instead of just synthetic biology, so we developed a "Responsible Science" curriculum following guidelines set by ESPRC | ||
+ | in their Responsible Research and Innovation (RRI) tools. We developed a crash-course out of this somewhat extensive curriculum | ||
+ | to teach the Biobuilder high-schoolers for a day.</div> | ||
+ | <p> </p> | ||
+ | <div class="p1" style="position: absolute; top: 65vw; left: 3vw; margin-right: 5vw;"> | ||
+ | Additionally, we developed a short "Intro to Synthetic Biology" lesson plan for a syn-bio crash course, oriented towards high-schoolers. | ||
+ | We used this lesson plan to teach middle school and high school students at the HSSP program as well as at the MIT BoSTEM Scholars Program. Through these programs, we reached between 100-150 students. | ||
</div> | </div> | ||
+ | <p> </p> | ||
+ | <div class="p1" style="position: absolute; top: 73vw; left: 3vw; margin-right: 5vw;"> | ||
+ | Finally, we presented our project at MIT Museum in order to reach to the general public. Our museum set-up was interactive | ||
+ | and oriented towards younger kids and people with minimal knowledge of synthetic biology. Overall, our goals for public engagement were: | ||
+ | |||
+ | </div> | ||
+ | <p> </p> | ||
+ | <div class="p1" style="position: absolute; top: 80vw; left: 5vw;"> | ||
+ | 1) Reach to a large and varied audience | ||
+ | <p> </p> | ||
+ | 2) Break stigmas attached to synthetic biology so that future syn-bio therapeutics would be more easily accepted by | ||
+ | the general public | ||
+ | <p> </p> | ||
+ | 3) Create a modular tool(s) for public engagement that can be used by the iGEM community in the future | ||
+ | </div> | ||
+ | <p> </p> | ||
+ | |||
+ | |||
+ | <div class="p1" style="position: absolute; top: 90vw; left: 3vw; margin-right: 5vw;"> | ||
+ | Team MIT believes that our public engagement efforts met the goals we had set for ourselves and we were able to contribute something | ||
+ | to iGEM and the synthetic biology community that we, as a team, are proud of. | ||
+ | </div> | ||
+ | |||
+ | <div style="position: absolute; top: 96vw; left: 10vw;"> | ||
+ | <button class="accordion">Curriculum: Responsible Research and Innovation in Synthetic Biology</button> | ||
+ | <div class="panel"> | ||
+ | |||
+ | <p> </p> | ||
+ | <div class="p1"> | ||
+ | The course was developed as a result of the iGEM MIT team delving into iGEM Human Practices literature and | ||
+ | realizing that currently used synthetic biology curriculums do not include enough about the impact of research | ||
+ | and technological advancements on society. To remove public mistrust of new synthetic advancements, it's very | ||
+ | important to cultivate an environment that promotes responsible research within the scientific community. | ||
+ | <p> </p> | ||
+ | The curriculum developed by team MIT is meant to be an optional addition to synthetic biology courses that | ||
+ | already exist (such as the BioBuilder Club). It does not hope to replace these courses, but rather augment them | ||
+ | by providing a fuller picture of synthetic biology and its intersections with the real world. The course consists | ||
+ | of 4 one-hour modules following the AREA guidelines: Anticipate, Reflect, Engage, and Act. These guidelines were | ||
+ | followed by team MIT in our own scientific endeavours and we hoped that by formalizing our method into a curriculum, | ||
+ | we could teach and encourage other young researchers to develop responsive research habits and therefore create a | ||
+ | culture of responsive and transparent science. | ||
+ | <p> </p> | ||
+ | Each module in our curriculum consists of a lecture section, an individual activity section and a group activity | ||
+ | section. The short lecture sections will involve dissemination of information that will teach students the Responsible | ||
+ | Research and Innovation (RRI) framework: how to anticipate potential opportunities of a research project, what | ||
+ | considerations must be reflected upon before diving into commercialization of a product, how to engage with the | ||
+ | public and relevant stakeholders in order to gain a deeper insight into the impact of the technology, and finally | ||
+ | how can we, as researchers, scientists, teachers and policymakers, act appropriately in order to ensure that research | ||
+ | is done responsibly. | ||
+ | <p> </p> | ||
+ | The individual activity sections will vary from reading case studies and filling out Stakeholder/Value matrices | ||
+ | to writing policy drafts as policymakers in order to amend laws regulating biotechnology and synthetic biology. | ||
+ | <p> </p> | ||
+ | The group activity sections will range from group discussions for carrying out SWOT (Strengths, Weaknesses, | ||
+ | Opportunities, Threats) analysis to role-playing a possible dialogue/engagement between a researcher and a stakeholder | ||
+ | affected by the researcher's technology. | ||
+ | <p> </p> | ||
+ | The course aims to foster a habit of healthy discourse in students and emphasizes critical thinking as a major tool | ||
+ | to navigate the political, ethical, economic, and societal implications of all our actions. | ||
+ | </div> | ||
+ | <object width="1000vw" height="800vw" data="https://static.igem.org/mediawiki/2018/a/ac/T--MIT--rrifixed.pdf"></object> | ||
+ | |||
+ | |||
+ | </div> | ||
+ | <button class="accordion">BioBuilder's Club</button> | ||
+ | <div class="panel"> | ||
+ | <img src="https://static.igem.org/mediawiki/2018/6/69/T--MIT--MITbbc2.png" style="width: 78vw; "> | ||
+ | <p> </p> | ||
+ | <div class="p1"> | ||
+ | BioBuilder Club is a program that "engages high school teams around the world who use synthetic biology to develop novel | ||
+ | biotechnologies." We reached out to the founder of the program, Natalie Kuldell and she offered to let us teach an upcoming | ||
+ | delegation from Wuhan University, China. We developed a one-hour crash course for this delegation in order to gauge how | ||
+ | responsive the students were to our interactive responsible science curriculum. | ||
+ | </div> | ||
+ | <object width="1000vw" height="800vw" data="https://static.igem.org/mediawiki/2018/8/8f/T--MIT--biob.pdf"></object> | ||
+ | |||
+ | <p> </p> | ||
+ | |||
+ | |||
+ | </div> | ||
+ | <button class="accordion">HSSP and BOSTEM</button> | ||
+ | <div class="panel"> | ||
+ | <img src="https://static.igem.org/mediawiki/2018/a/a5/T--MIT--MITbostem2.png" style="width: 78vw;"> | ||
+ | <p> </p> | ||
+ | <div class="p1">HSSP is multi-weekend program held once during the spring and once during the summer at MIT, open to rising 7th | ||
+ | graders to current 12th graders. We taught a group of about 80-100 students during the last week of July. We developed a | ||
+ | 90-minute lesson-plan that included a quick intro to synthetic biology, some examples of synthetic tools used and an ethical | ||
+ | science segment where we divided the students into groups in order to lead discussions about how some new upcoming controversial | ||
+ | synthetic solutions were considered ethically problematic and what could be done to make them more acceptable by the public. | ||
+ | <p> </p> | ||
+ | Similarly, we taught this crash-course to students from the BoSTEM scholars program. The MIT BoSTEM Scholars Academy addresses issues related to STEM education access and targets students who will increase diversity in those fields. The program aims to provide Greater Boston area high school students, the majority of which are women and underrepresented minorities, with the opportunity to gain an experience in STEM. Team MIT was really eager to collaborate with their program, so that we could inspire more interest in the young kids who joined us for the crash-course as well as a lab tour. | ||
+ | |||
+ | </div> | ||
+ | <object width="1000vw" height="800vw" data="https://static.igem.org/mediawiki/2018/b/b0/T--MIT--Summer_Class_Hand-Out1_MIT.pdf"></object> | ||
+ | |||
+ | |||
+ | </div> | ||
+ | <button class="accordion">MIT Museum Exhibit</button> | ||
+ | <div class="panel"> | ||
+ | |||
+ | <img src="https://static.igem.org/mediawiki/2018/3/37/T--MIT--MITmus.png" style="width: 78vw;"> | ||
+ | |||
+ | |||
+ | <div class="p1">Team MIT reached out to MIT Museum so that we could present our project to the general public. We wanted to reach out to a varied population, which included young kids, tourists and general science enthusiasts and normalize the idea of syn-bio therapeutics such as our treatment for dental caries. Our project was interactive and avoided using too much biology jargon so that the information we were trying to impart was easily accessible to all. | ||
+ | <p> </p> | ||
+ | To demonstrate how biofilm form on teeth, we used magnets and iron filings. We illustrated how one bacterial cell could attract other bacteria around it and how this signalling and attraction lead to all of them accumulating on our teeth and forming biofilm! | ||
+ | <img src="https://static.igem.org/mediawiki/2018/e/e2/T--MIT--MITiron.png" style="width: 40vw"> | ||
+ | <p> </p> | ||
+ | To demonstrate how biological circuits worked in synthetic biology, we used an actual circuit, where we represented different parts of the circuit by different biological parts. We illustrated how we had transplanted a signalling system from a bacterial cell into a mammalian cell and how that transplantation leads to the turning on of an LED light (which represented our output protein that prevents biofilm formation). | ||
+ | </div> | ||
+ | <img src="https://static.igem.org/mediawiki/2018/9/98/T--MIT--MITcirc.png"style="width: 40vw"> | ||
+ | <p> </p> | ||
+ | <div class="p1"> | ||
+ | The MIT Museum demonstration was on overall success and we managed to interact with people of different ages and from different parts of the world. We also added an "Ask a Synthetic Biologist Anything" booth so if people had extra questions after our demo could learn even more. We felt that this was very essential to breaking down incorrect myths people believed about synthetic biology. | ||
+ | </div> | ||
+ | <img src="https://static.igem.org/mediawiki/2018/5/5d/T--MIT--MITmus5.jpg" style="width: 30vw"><img src="https://static.igem.org/mediawiki/2018/3/32/T--MIT--MITasba.png" style="width: 30vw"> | ||
+ | <div class="p1"> | ||
+ | Here are the posters we created for this exhibit. Feel free to use them to host conversations about synthetic biology within your own communities! | ||
+ | </div> | ||
+ | <object width="1000vw" height="800vw" data="https://static.igem.org/mediawiki/2018/3/31/T--MIT--MITmusposters.pdf"></object> | ||
+ | |||
+ | </div> | ||
+ | </div> | ||
+ | |||
+ | |||
+ | |||
+ | <script> | ||
+ | var acc = document.getElementsByClassName("accordion"); | ||
+ | var i; | ||
+ | |||
+ | for (i = 0; i < acc.length; i++) { | ||
+ | acc[i].addEventListener("click", function() { | ||
+ | this.classList.toggle("active"); | ||
+ | var panel = this.nextElementSibling; | ||
+ | if (panel.style.maxHeight){ | ||
+ | panel.style.maxHeight = null; | ||
+ | } else { | ||
+ | panel.style.maxHeight = panel.scrollHeight + "px"; | ||
+ | } | ||
+ | }); | ||
+ | } | ||
+ | </script> | ||
+ | <script> | ||
+ | var myIndex = 0; | ||
+ | carousel(); | ||
+ | |||
+ | function carousel() { | ||
+ | var i; | ||
+ | var x = document.getElementsByClassName("mySlides"); | ||
+ | for (i = 0; i < x.length; i++) { | ||
+ | x[i].style.display = "none"; | ||
+ | } | ||
+ | myIndex++; | ||
+ | if (myIndex > x.length) {myIndex = 1} | ||
+ | x[myIndex-1].style.display = "block"; | ||
+ | setTimeout(carousel, 2000); // Change image every 2 seconds | ||
+ | } | ||
+ | </script> | ||
+ | </body> | ||
+ | |||
+ | </html> |
Latest revision as of 01:27, 18 October 2018
Public Engagement
This year, Team MIT wanted to continue
some of the public engagement efforts carried out by last year's team and also build on top of that in order to provide
an even stronger foundation for future iGEM teams. We planned to be a part of the BioBuilder's Program again, which is a
synthetic biology program for high-schoolers and college students. However, this year we wanted to talk to them about ethical
science instead of just synthetic biology, so we developed a "Responsible Science" curriculum following guidelines set by ESPRC
in their Responsible Research and Innovation (RRI) tools. We developed a crash-course out of this somewhat extensive curriculum
to teach the Biobuilder high-schoolers for a day.
Additionally, we developed a short "Intro to Synthetic Biology" lesson plan for a syn-bio crash course, oriented towards high-schoolers.
We used this lesson plan to teach middle school and high school students at the HSSP program as well as at the MIT BoSTEM Scholars Program. Through these programs, we reached between 100-150 students.
Finally, we presented our project at MIT Museum in order to reach to the general public. Our museum set-up was interactive
and oriented towards younger kids and people with minimal knowledge of synthetic biology. Overall, our goals for public engagement were:
1) Reach to a large and varied audience
2) Break stigmas attached to synthetic biology so that future syn-bio therapeutics would be more easily accepted by the general public
3) Create a modular tool(s) for public engagement that can be used by the iGEM community in the future
Team MIT believes that our public engagement efforts met the goals we had set for ourselves and we were able to contribute something
to iGEM and the synthetic biology community that we, as a team, are proud of.
The course was developed as a result of the iGEM MIT team delving into iGEM Human Practices literature and
realizing that currently used synthetic biology curriculums do not include enough about the impact of research
and technological advancements on society. To remove public mistrust of new synthetic advancements, it's very
important to cultivate an environment that promotes responsible research within the scientific community.
The curriculum developed by team MIT is meant to be an optional addition to synthetic biology courses that already exist (such as the BioBuilder Club). It does not hope to replace these courses, but rather augment them by providing a fuller picture of synthetic biology and its intersections with the real world. The course consists of 4 one-hour modules following the AREA guidelines: Anticipate, Reflect, Engage, and Act. These guidelines were followed by team MIT in our own scientific endeavours and we hoped that by formalizing our method into a curriculum, we could teach and encourage other young researchers to develop responsive research habits and therefore create a culture of responsive and transparent science.
Each module in our curriculum consists of a lecture section, an individual activity section and a group activity section. The short lecture sections will involve dissemination of information that will teach students the Responsible Research and Innovation (RRI) framework: how to anticipate potential opportunities of a research project, what considerations must be reflected upon before diving into commercialization of a product, how to engage with the public and relevant stakeholders in order to gain a deeper insight into the impact of the technology, and finally how can we, as researchers, scientists, teachers and policymakers, act appropriately in order to ensure that research is done responsibly.
The individual activity sections will vary from reading case studies and filling out Stakeholder/Value matrices to writing policy drafts as policymakers in order to amend laws regulating biotechnology and synthetic biology.
The group activity sections will range from group discussions for carrying out SWOT (Strengths, Weaknesses, Opportunities, Threats) analysis to role-playing a possible dialogue/engagement between a researcher and a stakeholder affected by the researcher's technology.
The course aims to foster a habit of healthy discourse in students and emphasizes critical thinking as a major tool to navigate the political, ethical, economic, and societal implications of all our actions.
BioBuilder Club is a program that "engages high school teams around the world who use synthetic biology to develop novel
biotechnologies." We reached out to the founder of the program, Natalie Kuldell and she offered to let us teach an upcoming
delegation from Wuhan University, China. We developed a one-hour crash course for this delegation in order to gauge how
responsive the students were to our interactive responsible science curriculum.
HSSP is multi-weekend program held once during the spring and once during the summer at MIT, open to rising 7th
graders to current 12th graders. We taught a group of about 80-100 students during the last week of July. We developed a
90-minute lesson-plan that included a quick intro to synthetic biology, some examples of synthetic tools used and an ethical
science segment where we divided the students into groups in order to lead discussions about how some new upcoming controversial
synthetic solutions were considered ethically problematic and what could be done to make them more acceptable by the public.
Similarly, we taught this crash-course to students from the BoSTEM scholars program. The MIT BoSTEM Scholars Academy addresses issues related to STEM education access and targets students who will increase diversity in those fields. The program aims to provide Greater Boston area high school students, the majority of which are women and underrepresented minorities, with the opportunity to gain an experience in STEM. Team MIT was really eager to collaborate with their program, so that we could inspire more interest in the young kids who joined us for the crash-course as well as a lab tour.
Team MIT reached out to MIT Museum so that we could present our project to the general public. We wanted to reach out to a varied population, which included young kids, tourists and general science enthusiasts and normalize the idea of syn-bio therapeutics such as our treatment for dental caries. Our project was interactive and avoided using too much biology jargon so that the information we were trying to impart was easily accessible to all.
To demonstrate how biofilm form on teeth, we used magnets and iron filings. We illustrated how one bacterial cell could attract other bacteria around it and how this signalling and attraction lead to all of them accumulating on our teeth and forming biofilm!
To demonstrate how biological circuits worked in synthetic biology, we used an actual circuit, where we represented different parts of the circuit by different biological parts. We illustrated how we had transplanted a signalling system from a bacterial cell into a mammalian cell and how that transplantation leads to the turning on of an LED light (which represented our output protein that prevents biofilm formation).
The MIT Museum demonstration was on overall success and we managed to interact with people of different ages and from different parts of the world. We also added an "Ask a Synthetic Biologist Anything" booth so if people had extra questions after our demo could learn even more. We felt that this was very essential to breaking down incorrect myths people believed about synthetic biology.
Here are the posters we created for this exhibit. Feel free to use them to host conversations about synthetic biology within your own communities!