(26 intermediate revisions by 2 users not shown) | |||
Line 1: | Line 1: | ||
− | {{KCL_UK}} | + | {{:Team:KCL_UK/Templates/Header}} |
<html> | <html> | ||
− | < | + | <head> |
− | + | ||
− | + | ||
− | < | + | <meta charset="UTF-8"> |
− | + | <meta name="viewport" content="width= device-width, initial-scale=1"> | |
− | </ | + | <title>KCL iGEM</title> |
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | < | + | <style> |
− | + | @import url('https://fonts.googleapis.com/css?family=Raleway'); | |
− | + | ||
− | + | #top_title {display:none;} | |
− | + | ||
− | + | #HQ_page p { | |
+ | font-family: 'Raleway', sans-serif; | ||
+ | font-size: 1em; | ||
+ | text-align: center; | ||
− | + | } | |
+ | |||
+ | #HQ_page h1,h2,h3 { | ||
+ | font-family: 'Raleway', sans-serif; | ||
+ | font-weight: 300; | ||
+ | } | ||
− | + | #content, #HQ_page { | |
− | + | animation : none; | |
− | + | animation-delay : 0; | |
− | + | animation-direction : normal; | |
− | + | animation-duration : 0; | |
− | + | animation-fill-mode : none; | |
− | + | animation-iteration-count : 1; | |
− | + | animation-name : none; | |
− | + | animation-play-state : running; | |
− | + | animation-timing-function : ease; | |
− | + | backface-visibility : visible; | |
− | + | background : 0; | |
+ | background-attachment : scroll; | ||
+ | background-clip : border-box; | ||
+ | background-color : transparent; | ||
+ | background-image : none; | ||
+ | background-origin : padding-box; | ||
+ | background-position : 0 0; | ||
+ | background-position-x : 0; | ||
+ | background-position-y : 0; | ||
+ | background-repeat : repeat; | ||
+ | background-size : auto auto; | ||
+ | border : 0; | ||
+ | border-style : none; | ||
+ | border-width : medium; | ||
+ | border-color : inherit; | ||
+ | border-bottom : 0; | ||
+ | border-bottom-color : inherit; | ||
+ | border-bottom-left-radius : 0; | ||
+ | border-bottom-right-radius : 0; | ||
+ | border-bottom-style : none; | ||
+ | border-bottom-width : medium; | ||
+ | border-collapse : separate; | ||
+ | border-image : none; | ||
+ | border-left : 0; | ||
+ | border-left-color : inherit; | ||
+ | border-left-style : none; | ||
+ | border-left-width : medium; | ||
+ | border-radius : 0; | ||
+ | border-right : 0; | ||
+ | border-right-color : inherit; | ||
+ | border-right-style : none; | ||
+ | border-right-width : medium; | ||
+ | border-spacing : 0; | ||
+ | border-top : 0; | ||
+ | border-top-color : inherit; | ||
+ | border-top-left-radius : 0; | ||
+ | border-top-right-radius : 0; | ||
+ | border-top-style : none; | ||
+ | border-top-width : medium; | ||
+ | bottom : auto; | ||
+ | box-shadow : none; | ||
+ | box-sizing : content-box; | ||
+ | caption-side : top; | ||
+ | clear : none; | ||
+ | clip : auto; | ||
+ | color : inherit; | ||
+ | columns : auto; | ||
+ | column-count : auto; | ||
+ | column-fill : balance; | ||
+ | column-gap : normal; | ||
+ | column-rule : medium none currentColor; | ||
+ | column-rule-color : currentColor; | ||
+ | column-rule-style : none; | ||
+ | column-rule-width : none; | ||
+ | column-span : 1; | ||
+ | column-width : auto; | ||
+ | content : normal; | ||
+ | counter-increment : none; | ||
+ | counter-reset : none; | ||
+ | cursor : auto; | ||
+ | direction : ltr; | ||
+ | display : inline; | ||
+ | empty-cells : show; | ||
+ | float : none; | ||
+ | font : normal; | ||
+ | font-family: 'Raleway', sans-serif; | ||
+ | font-size : medium; | ||
+ | font-style : normal; | ||
+ | font-variant : normal; | ||
+ | font-weight : normal; | ||
+ | height : auto; | ||
+ | hyphens : none; | ||
+ | left : auto; | ||
+ | letter-spacing : normal; | ||
+ | line-height : normal; | ||
+ | list-style : none; | ||
+ | list-style-image : none; | ||
+ | list-style-position : outside; | ||
+ | list-style-type : disc; | ||
+ | margin : 0; | ||
+ | margin-bottom : 0; | ||
+ | margin-left : 0; | ||
+ | margin-right : 0; | ||
+ | margin-top : 0; | ||
+ | max-height : none; | ||
+ | max-width : none; | ||
+ | min-height : 0; | ||
+ | min-width : 0; | ||
+ | opacity : 1; | ||
+ | orphans : 0; | ||
+ | outline : 0; | ||
+ | outline-color : invert; | ||
+ | outline-style : none; | ||
+ | outline-width : medium; | ||
+ | overflow : visible; | ||
+ | overflow-x : visible; | ||
+ | overflow-y : visible; | ||
+ | padding : 0; | ||
+ | padding-bottom : 0; | ||
+ | padding-left : 0; | ||
+ | padding-right : 0; | ||
+ | padding-top : 0; | ||
+ | page-break-after : auto; | ||
+ | page-break-before : auto; | ||
+ | page-break-inside : auto; | ||
+ | perspective : none; | ||
+ | perspective-origin : 50% 50%; | ||
+ | position : static; | ||
+ | /* May need to alter quotes for different locales (e.g fr) */ | ||
+ | quotes : '\201C' '\201D' '\2018' '\2019'; | ||
+ | right : auto; | ||
+ | tab-size : 8; | ||
+ | table-layout : auto; | ||
+ | text-align : inherit; | ||
+ | text-align-last : auto; | ||
+ | text-decoration : none; | ||
+ | text-decoration-color : inherit; | ||
+ | text-decoration-line : none; | ||
+ | text-decoration-style : solid; | ||
+ | text-indent : 0; | ||
+ | text-shadow : none; | ||
+ | text-transform : none; | ||
+ | top : auto; | ||
+ | transform : none; | ||
+ | transform-style : flat; | ||
+ | transition : none; | ||
+ | transition-delay : 0s; | ||
+ | transition-duration : 0s; | ||
+ | transition-property : none; | ||
+ | transition-timing-function : ease; | ||
+ | unicode-bidi : normal; | ||
+ | vertical-align : baseline; | ||
+ | visibility : visible; | ||
+ | white-space : normal; | ||
+ | widows : 0; | ||
+ | width : auto; | ||
+ | word-spacing : normal; | ||
+ | z-index : auto; | ||
+ | } | ||
− | + | h1 { | |
− | + | display: block; | |
− | + | font-size: 2em; | |
− | + | margin-bottom: 0.67em; | |
− | + | margin-left: 0; | |
− | + | margin-right: 0; | |
− | + | } | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | a:hover {text-decoration:none;} | |
− | + | a:visited { | |
− | + | color:red; | |
− | + | text-decoration:none; | |
− | + | } | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
+ | .dropdown-nav-buttonmasks:visited { | ||
+ | color:white; | ||
+ | text-decoration: none; | ||
+ | } | ||
+ | .standalonenav:visited { | ||
+ | color:white; | ||
+ | text-decoration: none; | ||
+ | } | ||
− | + | ||
− | + | ||
− | + | ||
− | <div class=" | + | * { |
− | <div class=" | + | box-sizing: border-box; |
− | <div class=" | + | font-family: 'Raleway', sans-serif; |
+ | } | ||
+ | |||
+ | |||
+ | body{ | ||
+ | margin: 0; | ||
+ | padding: 0; | ||
+ | font-family: 'Raleway', sans-serif; | ||
+ | text-align: center; | ||
+ | } | ||
+ | |||
+ | img { | ||
+ | max-width: 100%; | ||
+ | height: auto; | ||
+ | } | ||
+ | |||
+ | .container { | ||
+ | width: 95%; | ||
+ | margin: 0 auto; | ||
+ | } | ||
+ | .fixcontainer { | ||
+ | width:100%; | ||
+ | margin: 0 auto; | ||
+ | } | ||
+ | |||
+ | /*typography------------------------------*/ | ||
+ | .title { | ||
+ | font-weight: 900; | ||
+ | font-weight: bold; | ||
+ | font-size: 3.2rem; | ||
+ | margin-bottom: 1em; | ||
+ | padding-bottom: 2em; | ||
+ | text-emphasis: bold; | ||
+ | } | ||
+ | .smallertitle { | ||
+ | font-weight: 900; | ||
+ | font-weight: bold; | ||
+ | font-size: 1.4rem; | ||
+ | margin-bottom: 1em; | ||
+ | padding-top: 3.1em; | ||
+ | padding-bottom: 0em; | ||
+ | text-emphasis: bold; | ||
+ | |||
+ | } | ||
+ | h1 { | ||
+ | font-weight: 300; | ||
+ | font-size: 2.5em; | ||
+ | text-transform: capitalize; | ||
+ | } | ||
+ | .title span { | ||
+ | margin-top: 1em; | ||
+ | font-weight: 200; | ||
+ | display: block; | ||
+ | font-size: .9em; | ||
+ | } | ||
+ | |||
+ | |||
+ | /*buttonmasks -------------------------------*/ | ||
+ | .buttonmask { | ||
+ | display: inline-block; | ||
+ | font-size: 1.25rem; | ||
+ | text-decoration: none; | ||
+ | text-transform: uppercase; | ||
+ | border-width: 2px; | ||
+ | border-style: solid; | ||
+ | padding: .5em 1.75em; | ||
+ | |||
+ | } | ||
+ | .buttonmask} | ||
+ | |||
+ | .buttonmask-small { | ||
+ | font-size: .9rem; | ||
+ | font-weight: 700; | ||
+ | } | ||
+ | |||
+ | .buttonmask-accent { | ||
+ | color: #FF0000; | ||
+ | border-color: #FF0000; | ||
+ | } | ||
+ | |||
+ | .buttonmask-accent:hover { | ||
+ | background: #FF0000; | ||
+ | color: black; | ||
+ | } | ||
+ | |||
+ | |||
+ | /*header------------------------------*/ | ||
+ | |||
+ | header { | ||
+ | background-color: rgba(0,0,0,.75); | ||
+ | position: absolute; | ||
+ | left: 0; | ||
+ | right: 0; | ||
+ | max-height: 7em; | ||
+ | } | ||
+ | |||
+ | nav ul { | ||
+ | margin: 0; | ||
+ | padding: 0; | ||
+ | list-style: none; | ||
+ | float: right; | ||
+ | margin-right: 5em!important; | ||
+ | margin-top: 2em; | ||
+ | position: relative; | ||
+ | } | ||
+ | |||
+ | nav li { | ||
+ | display: inline-block; | ||
+ | margin: 1em; | ||
+ | position: relative; | ||
+ | } | ||
+ | |||
+ | .nav-buttonmasks { | ||
+ | font-weight: 900; | ||
+ | text-decoration: none; | ||
+ | text-transform: uppercase; | ||
+ | font-size: 0.95rem; | ||
+ | padding: .5em; | ||
+ | color: #FFF; | ||
+ | position: relative; | ||
+ | padding-bottom: 3em; | ||
+ | } | ||
+ | |||
+ | .nav-buttonmasks:hover {color: #FF0000;} | ||
+ | .dropdown-nav-buttonmasks:hover {color: #FF0000;} | ||
+ | |||
+ | .dropdown-nav-buttonmasks { | ||
+ | font-weight: 900; | ||
+ | text-decoration: none; | ||
+ | text-transform: uppercase; | ||
+ | font-size: 0.95rem; | ||
+ | padding: .5em; | ||
+ | color: #FFF; | ||
+ | display: none; | ||
+ | background-color: rgba(0,0,0,.75); | ||
+ | z-index: 1; | ||
+ | width: 10em; | ||
+ | margin-left: -3em; | ||
+ | } | ||
+ | #navadjust { | ||
+ | margin-left:-0.3em; | ||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | .nav-buttonmasks:hover .dropdown-nav-buttonmasks{ | ||
+ | display: block; | ||
+ | position: absolute; | ||
+ | } | ||
+ | .logo { | ||
+ | height: 90px; | ||
+ | width: 90px; | ||
+ | float: left; | ||
+ | margin-left: 6em; | ||
+ | margin-top: .5em; | ||
+ | } | ||
+ | |||
+ | /*home hero------------------------------*/ | ||
+ | |||
+ | .home-hero { | ||
+ | background-image: url(https://static.igem.org/mediawiki/2018/e/ed/T--KCL_UK--homehero.png); | ||
+ | background-repeat: no-repeat; | ||
+ | background-size: cover; | ||
+ | padding: 10em 0; | ||
+ | color: #FFF; | ||
+ | height: 100vh; | ||
+ | background-attachment: fixed; | ||
+ | background-position: center; | ||
+ | } | ||
+ | |||
+ | #seeourwork { | ||
+ | margin-top: 0em; | ||
+ | margin-bottom: 2em; | ||
+ | } | ||
+ | |||
+ | /*home-about------------------------------*/ | ||
+ | .home-about-textbox { | ||
+ | background-color: black; | ||
+ | padding: 15em; | ||
+ | |||
+ | margin-left: -2.5vw; | ||
+ | outline: 2px solid #FF0000; | ||
+ | outline-offset: -5em; | ||
+ | color: #FFF; | ||
+ | } | ||
+ | |||
+ | .home-about-textbox h1 { | ||
+ | color: #FF0000; | ||
+ | position: relative; | ||
+ | margin-top: -5em; | ||
+ | margin-bottom: 3em; | ||
+ | background: black; | ||
+ | margin-left: auto; | ||
+ | margin-right: auto; | ||
+ | width: 35vw; | ||
+ | text-align: center; | ||
+ | |||
+ | } | ||
+ | .home-about-textbox a { | ||
+ | margin-top: 2em; | ||
+ | margin-bottom: 0; | ||
+ | width: 60%; | ||
+ | } | ||
+ | |||
+ | #projectdescshort { | ||
+ | color: white; | ||
+ | font-size: 1.4em!important; | ||
+ | margin-top: 2em!important; | ||
+ | padding-top:2em!important; | ||
+ | |||
+ | |||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | /*portfolio------------------------------*/ | ||
+ | |||
+ | .portfolio h1 { | ||
+ | width: 12em; | ||
+ | margin: auto; | ||
+ | margin-top: -1.5em; | ||
+ | padding-bottom: .7em; | ||
+ | padding-top: 1em; | ||
+ | color: #FF0000; | ||
+ | } | ||
+ | .line { | ||
+ | width: 30%; | ||
+ | height: 1px; | ||
+ | margin: auto; | ||
+ | background: #FF0000; | ||
+ | } | ||
+ | .spacer { | ||
+ | width: 100%; | ||
+ | height: 2em; | ||
+ | } | ||
+ | .portfolio { | ||
+ | margin: 3em 0; | ||
+ | background-color: black; | ||
+ | |||
+ | } | ||
+ | |||
+ | .port-item { | ||
+ | position: relative; | ||
+ | margin: 0; | ||
+ | width: 50%; | ||
+ | float: left; | ||
+ | } | ||
+ | .port-item img { | ||
+ | display: block; | ||
+ | width: 100%; | ||
+ | height: 15em; | ||
+ | object-fit: cover; | ||
+ | |||
+ | } | ||
+ | .port-desc { | ||
+ | position: absolute; | ||
+ | z-index: 100; | ||
+ | bottom: 3em; | ||
+ | left: 3em; | ||
+ | right: 3em; | ||
+ | color: white; | ||
+ | background: rgba(0,0,0,.75); | ||
+ | padding-bottom: 1em; } | ||
+ | .port-desc p { | ||
+ | margin: 1em; | ||
+ | font-size: 1.2em; | ||
+ | |||
+ | } | ||
+ | #projectdescshort { | ||
+ | font-size: 1.5em!imporant; | ||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | </style> | ||
+ | |||
+ | |||
+ | </head> | ||
+ | |||
+ | |||
+ | <body> | ||
+ | |||
+ | |||
+ | |||
+ | <div class="loading"> | ||
+ | <div> | ||
+ | |||
+ | |||
+ | |||
+ | <section class="home-hero"> | ||
+ | <div class="container"> | ||
+ | <!-- | ||
+ | <h1 class="title titleadjust">3' Suspects | ||
+ | <span><h1 class="smallertitle">Investigating Untranslated regions on 3' end</h1></span> | ||
+ | </h1> | ||
+ | <a href="#" class="buttonmask buttonmask-accent" id="seeourwork">See Our Work</a> | ||
+ | </div> | ||
+ | ---> | ||
+ | </section> | ||
+ | |||
+ | <div class="fullcontainer" id="fix"> | ||
+ | <section class="home-about"> | ||
+ | <div class="home-about-textbox"> | ||
+ | <h1>What Have We Done?</h1> | ||
+ | <p id="projectdescshort">Our team have engineered a library of sRNA scaffolds that have the potential to be used as a tool in the understanding of sRNA functions such as regulation of protein expression. </br></br> | ||
+ | |||
+ | Our project is based on a “Proof of Concept” principle and we have used E.coli K12 to test this. Regulation of gene expression has been quantitively assessed through GFP signalling. We have chosen to focus on sRNAs that target the 3’ UTR of mRNA.</br></br> | ||
+ | |||
+ | We hope that future scientists will be able to use our novel tool as a way to use sRNAs to tackle issues involving sRNA interactions such as antibiotic resistance. | ||
+ | |||
+ | |||
+ | |||
+ | </p> | ||
+ | <a href="https://2018.igem.org/Team:KCL_UK/Description" class= "buttonmask buttonmask-accent">Full Project Description</a> | ||
+ | </div> | ||
+ | </section> | ||
+ | </div> | ||
+ | |||
+ | <section class="portfolio"> | ||
+ | <h1>Some of Our Work</h1> | ||
+ | <div class="line"></div> | ||
+ | <div class="spacer"></div> | ||
+ | <!-- portfolio item 1 --> | ||
+ | <figure class="port-item"> | ||
+ | <img src="https://static.igem.org/mediawiki/2018/f/fe/T--KCL_UK--symposium.png" alt="portfolio item"> | ||
+ | <figcaption class="port-desc"> | ||
+ | <p>Integrated Human Practices</p> | ||
+ | <a href="https://2018.igem.org/Team:KCL_UK/Human_Practices" class="buttonmask buttonmask-accent buttonmask-small">See More</a> | ||
+ | </figcaption> | ||
+ | </figure> | ||
+ | |||
+ | <!-- portfolio item 2 --> | ||
+ | <figure class="port-item"> | ||
+ | <img src="https://static.igem.org/mediawiki/2018/b/b7/T--KCL_UK--school.png" alt="portfolio item"> | ||
+ | <figcaption class="port-desc"> | ||
+ | <p>Bexley School Visit</p> | ||
+ | <a href="https://2018.igem.org/Team:KCL_UK/Public_Engagement" class="buttonmask buttonmask-accent buttonmask-small">See More</a> | ||
+ | </figcaption> | ||
+ | </figure> | ||
+ | |||
+ | <!-- portfolio item 3 --> | ||
+ | <figure class="port-item"> | ||
+ | <img src="https://static.igem.org/mediawiki/2018/8/80/T--KCL_UK--instagram.png" alt="portfolio item"> | ||
+ | <figcaption class="port-desc"> | ||
+ | <p>Social Media</p> | ||
+ | <a href="https://www.instagram.com/igem_kcl/" class="buttonmask buttonmask-accent buttonmask-small">See More</a> | ||
+ | </figcaption> | ||
+ | </figure> | ||
+ | |||
+ | <!-- portfolio item 4 --> | ||
+ | <figure class="port-item"> | ||
+ | <img src="https://static.igem.org/mediawiki/2018/0/0a/T--KCL_UK--lab.png" alt="portfolio item"> | ||
+ | <figcaption class="port-desc"> | ||
+ | <p>Lab Work</p> | ||
+ | <a href="https://2018.igem.org/Team:KCL_UK/Design" class="buttonmask buttonmask-accent buttonmask-small">See More</a> | ||
+ | </figcaption> | ||
+ | </figure> | ||
+ | </section> | ||
+ | |||
+ | <footer> | ||
+ | |||
+ | </footer> | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | </body> | ||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
</html> | </html> |
Latest revision as of 11:12, 17 October 2018
What Have We Done?
Our team have engineered a library of sRNA scaffolds that have the potential to be used as a tool in the understanding of sRNA functions such as regulation of protein expression. Our project is based on a “Proof of Concept” principle and we have used E.coli K12 to test this. Regulation of gene expression has been quantitively assessed through GFP signalling. We have chosen to focus on sRNAs that target the 3’ UTR of mRNA. We hope that future scientists will be able to use our novel tool as a way to use sRNAs to tackle issues involving sRNA interactions such as antibiotic resistance.
Full Project Description