|
|
Line 1: |
Line 1: |
− | | + | {{Example}} |
| <html> | | <html> |
− | <head>
| |
− | <link href="https://fonts.googleapis.com/css?family=Raleway" rel="stylesheet">
| |
− |
| |
− | <meta charset="UTF-8">
| |
− | <meta name="viewport" content="width= device-width, initial-scale=1">
| |
− | <title>KCL iGEM</title>
| |
− |
| |
− |
| |
− | <style>
| |
− |
| |
− |
| |
− | #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-top: 0.67em;
| |
− | 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;
| |
− | }
| |
− |
| |
− |
| |
− |
| |
− | * {
| |
− | box-sizing: border-box;
| |
− | 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;
| |
− | margin-top: 1em;
| |
− | }
| |
− | .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;
| |
− | }
| |
− |
| |
− | .dropdownone {
| |
− | margin-top: 2.58em!important;
| |
− | }
| |
− | .dropdowntwo {
| |
− | margin-top: 4.75em!important;
| |
− | }
| |
− | .dropdownthree {
| |
− | margin-top: 6.93em!important;
| |
− | }
| |
− |
| |
− | .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: 17em;
| |
− | 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>
| |
− |
| |
− | <header>
| |
− | <img src="https://static.igem.org/mediawiki/2018/0/08/T--KCL_UK--kclfinallogo.gif" alt="logo" class="logo">
| |
− |
| |
− | <nav>
| |
− | <ul>
| |
− | <li><a href="index.html" class="nav-buttonmasks standalonenav">Home</a></li>
| |
− | <li class="nav-buttonmasks">Team
| |
− | <a href="teammembers.html" class="dropdown-nav-buttonmasks dropdownone">Team Members</a>
| |
− | <a href="#" class="dropdown-nav-buttonmasks dropdowntwo">Collaborations</a>
| |
− | </li>
| |
− | <li class="nav-buttonmasks">Project
| |
− | <a href="#" class="dropdown-nav-buttonmasks dropdownone">Description</a>
| |
− | <a href="#" class="dropdown-nav-buttonmasks dropdowntwo">Design</a>
| |
− | <a href="#" class="dropdown-nav-buttonmasks dropdownthree">Results</a>
| |
− | </li>
| |
− | <li class="nav-buttonmasks">Parts
| |
− | <a href="#" class="dropdown-nav-buttonmasks dropdownone">Parts Overview</a>
| |
− | <a href="#" class="dropdown-nav-buttonmasks dropdowntwo">Basic Parts</a>
| |
− | <a href="#" class="dropdown-nav-buttonmasks dropdownthree">Composite Parts</a>
| |
− | </li>
| |
− | <a href="#" class="nav-buttonmasks standalonenav">Safety</a>
| |
− | <li class="nav-buttonmasks">Human Practices
| |
− | <a href="integratedhumanpractices.html" class="dropdown-nav-buttonmasks dropdownone" id="navadjust">Integrated HP</a>
| |
− | <a href="educationandengagement.html" class="dropdown-nav-buttonmasks dropdowntwo" id="navadjust">Education and Engagement</a>
| |
− | </li>
| |
− | <a href="acknowledgements.html" class="nav-buttonmasks standalonenav">Acknowledgements</a>
| |
− | </ul>
| |
− | </nav>
| |
− | </header>
| |
− |
| |
− | <div class="loading">
| |
− | <div>
| |
| | | |
| | | |
| + | <div class="column full_size"> |
| | | |
− | <section class="home-hero">
| + | <h1> Safety </h1> |
− | <div class="container">
| + | <p>Please visit the <a href="https://2018.igem.org/Safety">Safety Hub</a> to find this year's safety requirements & deadlines, and to learn about safe & responsible research in iGEM.</p> |
− | <!--
| + | |
− | <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">
| + | <p>On this page of your wiki, you should write about how you are addressing any safety issues in your project. The wiki is a place where you can <strong>go beyond the questions on the safety forms</strong>, and write about whatever safety topics are most interesting in your project. (You do not need to copy your safety forms onto this wiki page.)</p> |
− | <section class="home-about">
| + | |
− | <div class="home-about-textbox">
| + | |
− | <h1>what are we doing?</h1>
| + | |
− | <p id="projectdescshort">We are developing a new technology platform based on 3'UTR sequence characterisation to control soluble protein expression in E.coli. <br> <br>We will use E.coli K12 to test our "Proof of Concept" Principle by engineering 3'UTR sequences (Sharma et al, 2011) to interact with either cytosolic proteins or 5'UTR sequences of our gene of interest: trxA and gor. Down regulation of these genes will be quantified by assessing quantitatively GFP signal. Efficiency of down regulation of genes will be quantified by assessing reaction kinetics of Alkaline Phosphatase (AP).</p>
| + | |
− | <a href="#" class= "buttonmask buttonmask-accent">Full Project Description</a>
| + | |
− | </div>
| + | |
− | </section>
| + | |
− | </div>
| + | |
| | | |
− | <section class="portfolio">
| + | </div> |
− | <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>iGEM Symposium</p>
| + | |
− | <a href="" 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="" class="buttonmask buttonmask-accent buttonmask-small">See More</a>
| |
− | </figcaption>
| |
− | </figure>
| |
| | | |
− | <!-- portfolio item 3 -->
| + | <div class="column two_thirds_size"> |
− | <figure class="port-item">
| + | <h3>Safe Project Design</h3> |
− | <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="" class="buttonmask buttonmask-accent buttonmask-small">See More</a>
| + | |
− | </figcaption>
| + | |
− | </figure>
| + | |
| | | |
− | <!-- portfolio item 4 -->
| + | <p>Does your project include any safety features? Have you made certain decisions about the design to reduce risks? Write about them here! For example:</p> |
− | <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="" class="buttonmask buttonmask-accent buttonmask-small">See More</a>
| + | |
− | </figcaption>
| + | |
− | </figure>
| + | |
− | </section>
| + | |
| | | |
− | <footer>
| + | <ul> |
| + | <li>Choosing a non-pathogenic chassis</li> |
| + | <li>Choosing parts that will not harm humans / animals / plants</li> |
| + | <li>Substituting safer materials for dangerous materials in a proof-of-concept experiment</li> |
| + | <li>Including an "induced lethality" or "kill-switch" device</li> |
| + | </ul> |
| | | |
− | </footer>
| + | </div> |
| | | |
| + | <div class="column third_size"> |
| + | <h3>Safe Lab Work</h3> |
| | | |
| + | <p>What safety procedures do you use every day in the lab? Did you perform any unusual experiments, or face any unusual safety issues? Write about them here!</p> |
| | | |
| | | |
| + | <h3>Safe Shipment</h3> |
| | | |
− | </body>
| + | <p>Did you face any safety problems in sending your DNA parts to the Registry? How did you solve those problems?</p> |
| + | </div> |
| | | |
| | | |
| </html> | | </html> |