Difference between revisions of "Team:SZMS 15 Shenzhen"

Revision as of 10:13, 3 September 2015

<html> <style type="text/css"> @charset "UTF-8"; /*@font-face { font-family: NotoSansHans; src: url('../font-face/NotoSansHans-Thin.otf'); }*/ @media screen and (min-width:320px) and (max-width:780px) { #nav-div { width: 100%; margin-left: -33px; } .nav-li { display:none; } .nav-button { display: block; } .sub{ width: 100%; margin-bottom: 5px; } .sub-heading{ height:896px; } } @media screen and (min-width:780px) and (max-width:1000px) { #nav-div { width: 100%; } .nav-li { display: block; width: 14.5%; } .nav-button { display: none; } .sub{ width: 25%; } .sub-heading{ height:224px; } } @media screen and (min-width:1000px) { #nav-div { width:1000px; margin-left: auto; margin-right: auto; } .nav-li { display: block; width: 150px; } .nav-button { display: none; } .sub{ width: 25%; } .sub-heading{ height:224px; } } body{ margin: 0px; padding: 0px; font-family: NotoSansHans, NotoSansHans-Thin, Calibri, Arial, sans-serif; /*change if necessary*/ } #heading{ position: relative; z-index: 1; margin-bottom: 10px; cursor:pointer; } .nav-list{ display: block; margin: 0px; } .nav-li{ font-family: NotoSansHans, NotoSansHans-Thin, Calibri, Arial, sans-serif; float: left; list-style-type: none; text-align: center; line-height: 2.6; } .nav-logo{ list-style-type: none; } .nav-list li a{ text-decoration: none; display: block; color: #FFFFFF; } .nav-list li a:hover{ color: #BBBBBB; } #menubar{ margin-top: 20px; background-color: rgba(16, 38, 67, 0.7); height: 42px; width:100%; position: fixed; z-index: 3; } .nav-logo img{ width:200px; padding-top: 4px; margin: 0px; } .nav-logo { padding: 0px; margin: 0px; float: left; } #nav-div{ height:42px; z-index: 3; margin-top: px; margin-bottom: 0px; padding: 0px; position: relative; text-align: center; color: aliceblue; } #nav-tem{ margin-left: auto; z-index: 3; margin-right: auto; margin-top: 10px; } .nav-button { float:left; } .nav-button img { height:25px; margin-top:9px; } #leftbar_f{ width:100%; height: 100%; position: fixed; z-index: 2; } .sub-heading{ margin-left: 5%; width: 90%; position: relative; z-index: 1; } .sub{ height:220px; padding: 0px; float: left; } .subi{ margin-left: 2px; margin-right:2px; background-color: rgb(240,240,240); height: 100%; text-align: center; font-family: NotoSansHans, NotoSansHans-Thin, Calibri, Arial, sans-serif; line-height: 1.3; cursor:pointer; overflow-y: hidden; display:block; } .subi img{ margin-top:10px; width: 80%; max-width: 230px; margin-bottom: 10px; } .sub ul{ padding: 0px; margin: 0px; } .bottombar { width: 100%; position:relative; z-index: 1; text-align: center; padding-top: 10px; padding-bottom: 10px; } .buttom-intro{ font-family: NotoSansHans, NotoSansHans-Thin, Calibri, Arial, sans-serif; font-size: 70%; } .subi-f{ background-color: rgba(0, 62, 147, 0.6); color: rgb(256,256,256); position: relative; bottom: -50px; display: none; height: 80px; padding-top: 15px; z-index: 2; } #b-intro{ position: relative; width: 90%; height: 50px; margin: 15px; background-color: rgb(235, 235, 235); margin-left: 5%; margin-right: 5%; padding-bottom: 30px; padding-top: 30px; } #b-intro-title{ vertical-align: middle; padding:10px; padding-left: 50px; font-weight: bold; } .heading{ top: 50px; position: relative; height: 500px; width: 80%; margin-left: 5%; margin-bottom: 70px; background-color: rgba(225, 225, 225, 0.2); padding: 5%; } .heading-text{ width: 50%; float: left; } .heading-text-title{ width: 100%; text-align: center; font-size: 150%; font-weight: bold; margin-bottom: 5px; } .heading-pic{ margin:2.5%; width: 45%; float: right; height: 95%; background-color: rgba(1,1,1,0.02) } .content1{ top: 0px; position: relative; height: 500px; width: 80%; margin-left: 5%; margin-bottom: 70px; padding: 5%; } .content1-text{ width: 50%; float: right; } .content1-text-title{ width: 100%; text-align: center; font-size: 150%; font-weight: bold; margin-bottom: 5px; } .content1-pic{ margin:2.5%; width: 45%; float: left; height: 95%; background-color: rgba(1,1,1,0.02) } .content2{ top: 0px; position: relative; height: 500px; width: 80%; margin-left: 5%; margin-bottom: 70px; padding: 5%; } .content2-text{ width: 50%; float: left; } .content2-text-title{ width: 100%; text-align: center; font-size: 150%; font-weight: bold; margin-bottom: 5px; } .content2-pic{ margin:2.5%; width: 45%; float: right; height: 95%; background-color: rgba(1,1,1,0.02) } @charset "UTF-8"; /*@font-face { font-family: NotoSansHans; src: url('../font-face/NotoSansHans-Thin.otf'); }*/ @media screen and (min-width:320px) and (max-width:780px) { #nav-div { width: 100%; margin-left: -33px; } .nav-li { display:none; } .nav-button { display: block; } .sub{ width: 100%; margin-bottom: 5px; } .sub-heading{ height:896px; } } @media screen and (min-width:780px) and (max-width:1000px) { #nav-div { width: 100%; } .nav-li { display: block; width: 14.5%; } .nav-button { display: none; } .sub{ width: 25%; } .sub-heading{ height:224px; } } @media screen and (min-width:1000px) { #nav-div { width:1000px; margin-left: auto; margin-right: auto; } .nav-li { display: block; width: 150px; } .nav-button { display: none; } .sub{ width: 25%; } .sub-heading{ height:224px; } } body{ margin: 0px; padding: 0px; font-family: NotoSansHans, NotoSansHans-Thin, Calibri, Arial, sans-serif; /*change if necessary*/ } #heading{ position: relative; z-index: 1; margin-bottom: 10px; cursor:pointer; } .nav-list{ display: block; margin: 0px; } .nav-li{ font-family: NotoSansHans, NotoSansHans-Thin, Calibri, Arial, sans-serif; float: left; list-style-type: none; text-align: center; line-height: 2.6; } .nav-logo{ list-style-type: none; } .nav-list li a{ text-decoration: none; display: block; color: #FFFFFF; } .nav-list li a:hover{ color: #BBBBBB; } #menubar{ background-color: rgba(16, 38, 67, 0.7); height: 42px; width:100%; position: fixed; z-index: 3; } .nav-logo img{ width:200px; padding-top: 4px; margin: 0px; } .nav-logo { padding: 0px; margin: 0px; float: left; } #nav-div{ height:42px; z-index: 3; margin-top: 0px; margin-bottom: 0px; padding: 0px; position: relative; } .nav-button { float:left; } .nav-button img { height:25px; margin-top:9px; } #leftbar_f{ width:100%; height: 100%; position: fixed; z-index: 2; } .sub-heading{ margin-left: 5%; width: 90%; position: relative; z-index: 1; } .sub{ height:220px; padding: 0px; float: left; } .subi{ margin-left: 2px; margin-right:2px; background-color: rgb(240,240,240); height: 100%; text-align: center; font-family: NotoSansHans, NotoSansHans-Thin, Calibri, Arial, sans-serif; line-height: 1.3; cursor:pointer; overflow-y: hidden; display:block; } .subi img{ margin-top:10px; width: 80%; max-width: 230px; margin-bottom: 10px; } .sub ul{ padding: 0px; margin: 0px; } .bottombar { width: 100%; position:relative; z-index: 1; text-align: center; padding-top: 10px; padding-bottom: 10px; } .buttom-intro{ font-family: NotoSansHans, NotoSansHans-Thin, Calibri, Arial, sans-serif; font-size: 70%; } .subi-f{ background-color: rgba(0, 62, 147, 0.6); color: rgb(256,256,256); position: relative; bottom: -50px; display: none; height: 80px; padding-top: 15px; z-index: 2; } #b-intro{ position: relative; width: 90%; height: 50px; margin: 15px; background-color: rgb(235, 235, 235); margin-left: 5%; margin-right: 5%; padding-bottom: 30px; padding-top: 30px; } #b-intro-title{ vertical-align: middle; padding:10px; padding-left: 50px; font-weight: bold; } .heading{ top: 50px; height: 500px; width: 90%; z-index: 2; position: relative; margin-left: 5%; margin-bottom: 70px; <style type="text/css"> @charset "UTF-8"; /*@font-face { font-family: NotoSansHans; src: url('../font-face/NotoSansHans-Thin.otf'); }*/ @media screen and (min-width:320px) and (max-width:780px) { #nav-div { width: 100%; margin-left: -33px; } .nav-li { display:none; } .nav-button { display: block; } .sub{ width: 100%; margin-bottom: 5px; } .sub-heading{ height:896px; } } @media screen and (min-width:780px) and (max-width:1000px) { #nav-div { width: 100%; } .nav-li { display: block; width: 14.5%; } .nav-button { display: none; } .sub{ width: 25%; } .sub-heading{ height:224px; } } @media screen and (min-width:1000px) { #nav-div { width:1000px; margin-left: auto; margin-right: auto; } .nav-li { display: block; width: 150px; } .nav-button { display: none; } .sub{ width: 25%; } .sub-heading{ height:224px; } } body{ margin: 0px; padding: 0px; font-family: NotoSansHans, NotoSansHans-Thin, Calibri, Arial, sans-serif; /*change if necessary*/ } #heading{ position: relative; z-index: 1; margin-bottom: 10px; cursor:pointer; } .nav-list{ display: block; margin: 0px; } .nav-li{ font-family: NotoSansHans, NotoSansHans-Thin, Calibri, Arial, sans-serif; float: left; list-style-type: none; text-align: center; line-height: 2.6; } .nav-logo{ list-style-type: none; } .nav-list li a{ text-decoration: none; display: block; color: #FFFFFF; } .nav-list li a:hover{ color: #BBBBBB; } #menubar{ margin-top: 20px; background-color: rgba(16, 38, 67, 0.7); height: 42px; width:100%; position: fixed; z-index: 3; } .nav-logo img{ width:200px; padding-top: 4px; margin: 0px; } .nav-logo { padding: 0px; margin: 0px; float: left; } #nav-div{ height:42px; z-index: 3; margin-top: px; margin-bottom: 0px; padding: 0px; position: relative; text-align: center; color: aliceblue; } #nav-tem{ margin-left: auto; z-index: 3; margin-right: auto; margin-top: 10px; } .nav-button { float:left; } .nav-button img { height:25px; margin-top:9px; } #leftbar_f{ width:100%; height: 100%; position: fixed; z-index: 2; } .sub-heading{ margin-left: 5%; width: 90%; position: relative; z-index: 1; } .sub{ height:220px; padding: 0px; float: left; } .subi{ margin-left: 2px; margin-right:2px; background-color: rgb(240,240,240); height: 100%; text-align: center; font-family: NotoSansHans, NotoSansHans-Thin, Calibri, Arial, sans-serif; line-height: 1.3; cursor:pointer; overflow-y: hidden; display:block; } .subi img{ margin-top:10px; width: 80%; max-width: 230px; margin-bottom: 10px; } .sub ul{ padding: 0px; margin: 0px; } .bottombar { width: 100%; position:relative; z-index: 1; text-align: center; padding-top: 10px; padding-bottom: 10px; } .buttom-intro{ font-family: NotoSansHans, NotoSansHans-Thin, Calibri, Arial, sans-serif; font-size: 70%; } .subi-f{ background-color: rgba(0, 62, 147, 0.6); color: rgb(256,256,256); position: relative; bottom: -50px; display: none; height: 80px; padding-top: 15px; z-index: 2; } #b-intro{ position: relative; width: 90%; height: 50px; margin: 15px; background-color: rgb(235, 235, 235); margin-left: 5%; margin-right: 5%; padding-bottom: 30px; padding-top: 30px; } #b-intro-title{ vertical-align: middle; padding:10px; padding-left: 50px; font-weight: bold; } .heading{ top: 50px; position: relative; height: 500px; width: 80%; margin-left: 5%; margin-bottom: 70px; background-color: rgba(225, 225, 225, 0.2); padding: 5%; } .heading-text{ width: 50%; float: left; } .heading-text-title{ width: 100%; text-align: center; font-size: 150%; font-weight: bold; margin-bottom: 5px; } .heading-pic{ margin:2.5%; width: 45%; float: right; height: 95%; background-color: rgba(1,1,1,0.02) } .content1{ top: 0px; position: relative; height: 500px; width: 80%; margin-left: 5%; margin-bottom: 70px; padding: 5%; } .content1-text{ width: 50%; float: right; } .content1-text-title{ width: 100%; text-align: center; font-size: 150%; font-weight: bold; margin-bottom: 5px; } .content1-pic{ margin:2.5%; width: 45%; float: left; height: 95%; background-color: rgba(1,1,1,0.02) } .content2{ top: 0px; position: relative; height: 500px; width: 80%; margin-left: 5%; margin-bottom: 70px; padding: 5%; } .content2-text{ width: 50%; float: left; } .content2-text-title{ width: 100%; text-align: center; font-size: 150%; font-weight: bold; margin-bottom: 5px; } .content2-pic{ margin:2.5%; width: 45%; float: right; height: 95%; background-color: rgba(1,1,1,0.02) } @charset "UTF-8"; /*@font-face { font-family: NotoSansHans; src: url('../font-face/NotoSansHans-Thin.otf'); }*/ @media screen and (min-width:320px) and (max-width:780px) { #nav-div { width: 100%; margin-left: -33px; } .nav-li { display:none; } .nav-button { display: block; } .sub{ width: 100%; margin-bottom: 5px; } .sub-heading{ height:896px; } } @media screen and (min-width:780px) and (max-width:1000px) { #nav-div { width: 100%; } .nav-li { display: block; width: 14.5%; } .nav-button { display: none; } .sub{ width: 25%; } .sub-heading{ height:224px; } } @media screen and (min-width:1000px) { #nav-div { width:1000px; margin-left: auto; margin-right: auto; } .nav-li { display: block; width: 150px; } .nav-button { display: none; } .sub{ width: 25%; } .sub-heading{ height:224px; } } body{ margin: 0px; padding: 0px; font-family: NotoSansHans, NotoSansHans-Thin, Calibri, Arial, sans-serif; /*change if necessary*/ } #heading{ position: relative; z-index: 1; margin-bottom: 10px; cursor:pointer; } .nav-list{ display: block; margin: 0px; } .nav-li{ font-family: NotoSansHans, NotoSansHans-Thin, Calibri, Arial, sans-serif; float: left; list-style-type: none; text-align: center; line-height: 2.6; } .nav-logo{ list-style-type: none; } .nav-list li a{ text-decoration: none; display: block; color: #FFFFFF; } .nav-list li a:hover{ color: #BBBBBB; } #menubar{ background-color: rgba(16, 38, 67, 0.7); height: 42px; width:100%; position: fixed; z-index: 3; } .nav-logo img{ width:200px; padding-top: 4px; margin: 0px; } .nav-logo { padding: 0px; margin: 0px; float: left; } #nav-div{ height:42px; z-index: 3; margin-top: 0px; margin-bottom: 0px; padding: 0px; position: relative; } .nav-button { float:left; } .nav-button img { height:25px; margin-top:9px; } #leftbar_f{ width:100%; height: 100%; position: fixed; z-index: 2; } .sub-heading{ margin-left: 5%; width: 90%; position: relative; z-index: 1; } .sub{ height:220px; padding: 0px; float: left; } .subi{ margin-left: 2px; margin-right:2px; background-color: rgb(240,240,240); height: 100%; text-align: center; font-family: NotoSansHans, NotoSansHans-Thin, Calibri, Arial, sans-serif; line-height: 1.3; cursor:pointer; overflow-y: hidden; display:block; } .subi img{ margin-top:10px; width: 80%; max-width: 230px; margin-bottom: 10px; } .sub ul{ padding: 0px; margin: 0px; } .bottombar { width: 100%; position:relative; z-index: 1; text-align: center; padding-top: 10px; padding-bottom: 10px; } .buttom-intro{ font-family: NotoSansHans, NotoSansHans-Thin, Calibri, Arial, sans-serif; font-size: 70%; } .subi-f{ background-color: rgba(0, 62, 147, 0.6); color: rgb(256,256,256); position: relative; bottom: -50px; display: none; height: 80px; padding-top: 15px; z-index: 2; } #b-intro{ position: relative; width: 90%; height: 50px; margin: 15px; background-color: rgb(235, 235, 235); margin-left: 5%; margin-right: 5%; padding-bottom: 30px; padding-top: 30px; } #b-intro-title{ vertical-align: middle; padding:10px; padding-left: 50px; font-weight: bold; } .heading{ top: 50px; height: 500px; width: 90%; z-index: 2; position: relative; margin-left: 5%; margin-bottom: 70px; background-color: rgba(16, 38, 67, 0.2); } #b-intro{ position: relative; width: 90%; height: 50px; margin: 15px; background-color: rgb(235, 235, 235); margin-left: 5%; margin-right: 5%; padding-bottom: 30px; padding-top: 30px; } #b-intro-title{ vertical-align: middle; padding:10px; padding-left: 50px; font-weight: bold; } </style> <body> <div id="content"> <div class="heading"> <div class="heading-text"> <div class="heading-text-title">Project Description</div> <div class="heading-text-content"> Our project serves as real live models of different stories from various cultures. Our genetically engineered E. coli bacteria is able to perform a series of reactions visibly and distinctively in order to represent the plot in different stories. We have chose three particular stories to be the basis of our project: “The Ugly Duckling”, “The Fox and the Grapes”, and “Houyi Shoots the Sun”. All of these stories are well known by people. Our ultimate purpose of our project is to further publicise the idea of bioengineering as well as serve as an educational model for the young to observe and experience. </div> </div> <div class="content1-pic"> </div> </div> <div class="content1"> <div class="content1-pic"> </div> <div class="content1-text"> <div class="content1-text-title">“The Ugly Duckling”</div> <div class="content1-text-content"> The E.coli we constructed is able to gradually turn from colourless to green in a lactose included culture medium. The working mechanism is described in the following: constitutive promoter express lacI protein continuously. lacI protein binds with the lactose contained in the culture medium when there is a fair amount of lactose. Plac, a promoter that is oppressed by lacI protein will not be inhibited due to the lack of lacI protein, because lacI protein all binds with lactose. Plac will promote the expression of C0051, which is a kind of cI protein that exists in λ bacteriophage. The expression of C0051 will constantly inhibit the promoter R0051. As time elapse, the lactose in the culture medium will be gradually consumed, leaving no more lactose to bind with lacI protein, which will oppress the Plac promoter R0010, causing the end to the expression C0051. Because of the LVA tail, the remaining C0051 will be degraded, With the lack of C0051, the promoter R0051 will no longer be inhibited. The promoter R0051 can express GFP (green fluorescence protein), causing the E. coli to turn green.</div> </div> </div> <div class="content2"> <div class="content2-text"> <div class="content2-text-title">“The Fox and the Grape”</div> <div class="content2-text-content"> The system we created contains two kinds of E. coli bacteria, one represents the fox and the other represents the grapes. The working mechanism is described in the following: under the stimulation of L-arabinose, the plasmid in the E. coli representing the fox starts to transcript C0071, which produced rhlR, a quorum sensing signal factor that leads to the working of R0071 in the plasmid of the E. coli representing the grapes. Then, with the transcription of C0061 in the E. coli representing the grapes, LuxR starts to produce continuously. LuxR stimulates the promoter R0062 and starts its promotion, which results in the expression of E0422 and produce enhanced cyan fluorescence protein (ECFP); at the same time, it represses the expression of R0063, which stops the E. coli representing the grapes from giving out the scent of bananas.</div> </div> <div class="content2-pic"> </div> </div> </div> <div id="b-intro"> <div id="b-intro-title"> <a href="https://2015.igem.org/Team:SZMS_15_Shenzhen/InterLab" >Our InterLab</a> </div> </div> <div class="bottombar"> <font class="buttom-intro" color="#555555">Introduction</font> </div> </body> </html>

@@ Line 1: / Line 1: @@
-{{:Team:SZMS 15 Shenzhen/tmp/homehead}}
+<nowiki>
 <html>
 <style type="text/css">
@@ Line 1,190: / Line 1,190: @@
 </html>
-{{:Team:SZMS 15 Shenzhen/tmp/foot}}
+</nowiki>