Team:Heidelberg/Testibactin class

From 2013.igem.org

(Difference between revisions)
m
m
 
(44 intermediate revisions not shown)
Line 1: Line 1:
-
__NOTOC__
+
{{:Team:Heidelberg/Templates/style2-css}}
-
<html>
+
{{:Team:Heidelberg/Templates/bootstrap-css}}
-
<style type="text/css">
+
{{:Team:Heidelberg/Templates/carousel-css}}
-
<!-- copy paste code below to remove banner and other igem wiki default settings-->
+
{{:Team:Heidelberg/Templates/basic-css}}
-
#contentSub, #search-controls, .firstHeading, #footer-box, #catlinks, #p-logo {
+
<html lang="en">
-
    display:none;}
+
-
#top-section {
+
-
    border: none;
+
-
    height: 0px;}
+
-
#content {
+
-
 
+
-
    border: none;}
+
-
 
+
-
.firstHeading {
+
-
    height:0px;
+
-
    visibility:hidden;
+
-
}
+
-
 
+
-
/* Removes "teams" from the menubar */
+
-
#menubar > ul > li:last-child {
+
-
    display: none;}
+
-
/* Resizes the menubar to fik the links (default is 400px) */
+
-
#menubar {
+
-
    width: auto;}
+
-
body {
+
-
    margin: 10px 0 0 0;
+
-
    padding: 0;}
+
-
#top-section {
+
-
    width: 965px;
+
-
    height: 0;
+
-
    margin: 0 auto;
+
-
    padding: 0;
+
-
    border: none;}
+
-
#menubar {
+
-
    font-size: 65%;
+
-
    top: 0;
+
-
    }
+
-
.left-menu:hover {
+
-
    background-color: transparent;}
+
-
#menubar li a {
+
-
    background-color: transparent;}
+
-
#menubar:hover {
+
-
    color: white;}
+
-
#menubar li a {
+
-
    color: transparent;}
+
-
#menubar:hover li a {
+
-
    color: #CCC;}
+
-
 
+
-
<!-- copy paste until here to remove default igem settings-->
+
-
*{
+
-
                margin:0;
+
-
                padding:0;
+
-
            }
+
-
            body{
+
-
                background:#fff  no-repeat top left;
+
-
            }
+
-
            div:after {
+
-
                content: "";
+
-
               
+
-
                background-repeat: no-repeat;
+
-
                opacity: 0.8;
+
-
                top: 0;
+
-
                left: 0;
+
-
                bottom:0;
+
-
                right: 0;
+
-
                position: absolute;
+
-
                z-index: -1; 
+
-
            }
+
-
            .title{
+
-
                width:548px;
+
-
                height:119px;
+
-
                position:absolute;
+
-
                top:400px;
+
-
                left:150px;   
+
-
            }
+
-
            #content{
+
-
                margin:0 auto;
+
-
            }
+
-
            .months{
+
-
                position:absolute;
+
-
                left:0.5%;
+
-
                top:260px;
+
-
                z-index:8;
+
-
            }
+
-
            .slider{
+
-
                position:absolute;
+
-
                left:0.5%;
+
-
                top:410px;
+
-
                width:37%;
+
-
            }
+
-
            .weekly-tabs{
+
-
                position:absolute;
+
-
                top:320px;
+
-
                left:39%;
+
-
                width:61%;
+
-
            }
+
-
            #weekly{
+
-
                position:absolute;
+
-
                top:350px;
+
-
                left:39%;
+
-
                width:61%;
+
-
            }
+
-
            #scrollContent{
+
-
                height:850px;
+
-
                overflow:auto;
+
-
                position:relative;
+
-
            }
+
-
            #scrollContent2{
+
-
                height:280px;
+
-
                overflow:auto;
+
-
                position:relative;
+
-
                top:15px;
+
-
                width:63%;
+
-
            }
+
-
            #methods{
+
-
                background-color: #eeeeee;
+
-
                position:absolute;
+
-
                left:0.5%;
+
-
                top:650px;
+
-
                width:37%;
+
-
                height:615px;
+
-
                overflow:auto;
+
-
                position:relative;
+
-
 
+
-
            }
+
-
 
+
-
</style>
+
-
<link rel="stylesheet" href="https://2013.igem.org/Team:Heidelberg/Templates/bootstrap-css" type="text/css" />
+
-
<link rel="stylesheet" href="https://2013.igem.org/Team:Heidelberg/Templates/carousel-css" type="text/css" />
+
-
<link rel="stylesheet" href="https://2013.igem.org/Team:Heidelberg/Templates/style2-css" type="text/css" media="screen"/>
+
<div id="content">
<div id="content">
Line 282: Line 157:
                 </div>
                 </div>
                 <div>
                 <div>
-
                     <a href="https://2013.igem.org/Team:Heidelberg"><object data="images/TeamLogoGray.png" height="70" style="position:absolute; left:93%; top:2%"></object></a>
+
                     <a href="https://2013.igem.org/Team:Heidelberg"><object data="" style="position:absolute; left:93%; top:2%"></object></a>
-
                     <a href="https://2013.igem.org"><object data="images/iGEM.png" height="70" style="position:absolute; left:1%; top:2%"></object></a>
+
                     <a href="https://2013.igem.org"><object data="https://static.igem.org/mediawiki/2013/0/02/TB_IGEM_official_logo.png" height="70" style="position:absolute; left:1%; top:2%"></object></a>
                     <a href="http://www.facebook.com/pages/IGEM-Team-Heidelberg-2013/265102553624765"><object data="images/fb.png" height="30" style="position:absolute; left:93%; top:14%"></object></a>
                     <a href="http://www.facebook.com/pages/IGEM-Team-Heidelberg-2013/265102553624765"><object data="images/fb.png" height="30" style="position:absolute; left:93%; top:14%"></object></a>
                     <a href="http://twitter.com/igem_heidelberg"><object data="images/tw.png" height="30" style="position:absolute; left:96%; top:14%"></object></a>
                     <a href="http://twitter.com/igem_heidelberg"><object data="images/tw.png" height="30" style="position:absolute; left:96%; top:14%"></object></a>
Line 292: Line 167:
             <!--Project Description-->
             <!--Project Description-->
             <div style="position:absolute; top:110px; left:1%">
             <div style="position:absolute; top:110px; left:1%">
-
                         <h1><span style="font-size:200%;color:#EEDF3E;">Delftibactin.</span><span class="text-muted" style="font-size:130%"> Recycling Gold from Electronic Waste.</span></h1>
+
                         <h1><span style="font-size:200%;color:#EEDF3E;">Testibactin.</span><span class="text-muted" style="font-size:130%"> It'll blow your mind.</span></h1>
-
                         <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</p>
+
                         <p style="font-size:10px">Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</p>
             </div>
             </div>
Line 307: Line 182:
                     <button type="button" class="btn btn-default">October</button>-->
                     <button type="button" class="btn btn-default">October</button>-->
-
                   <li><a href="#">&laquo;</a></li>
+
                   <li><a href="#" id="backwards">&laquo;</a></li>
-
                   <li class="active"><a href="#">May</a></li>
+
                   <li class="active month_tab" id="may"><a href="#" style="width:100px; text-align:center">May</a></li>
-
                   <li><a href="#">June</a></li>
+
                   <li class="month_tab" id="june"><a href="#" style="width:100px; text-align:center">June</a></li>
-
                   <li><a href="#">July</a></li>
+
                   <li class="month_tab"><a href="#" style="width:100px; text-align:center" >July</a></li>
-
                   <li><a href="#">August</a></li>
+
 
-
                   <li><a href="#">September</a></li>
+
                   <li class="month_tab"><a href="#" style="width:100px; text-align:center">August</a></li>
-
                   <li><a href="#">October</a></li>
+
                   <li class="month_tab"><a href="#" style="width:100px; text-align:center">September</a></li>
-
                   <li><a href="#">&raquo;</a></li>
+
                   <li class="month_tab"><a href="#" style="width:100px; text-align:center">October</a></li>
 +
                   <li><a href="#" id="forwards">&raquo;</a></li>
                 </ul>
                 </ul>
             </div>
             </div>
Line 332: Line 208:
                       </ol>
                       </ol>
                       <div class="carousel-inner">
                       <div class="carousel-inner">
-
                         <div class="item active">
+
                         <div class="item active week1" id="may_weeks">
                             <img src="data:image/png;base64,"/>
                             <img src="data:image/png;base64,"/>
 +
                            <div class="container">
 +
                            <div class="carousel-caption scrollContent2" data-spy="scroll" data-target="#navbarExample" data-offset="0">
 +
                              <p style="font-size:18pt;font-style:bold">Week 1</p>
 +
                              <p style="font-size:10pt; text-align:justify; margin-right:1%">Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. ..</p>
 +
                            </div>
 +
                          </div>
 +
                        </div>
 +
                        <div class="item">
 +
                          <img src="data:image/png;base64,"/>
 +
                          <div class="container">
 +
                            <div class="carousel-caption scrollContent2" data-spy="scroll" data-target="#navbarExample" data-offset="0">
 +
                              <h1>Week 2</h1>
 +
                              <p style="font-size:10pt; text-align:justify">Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
 +
                              <p><a class="btn btn-large btn-primary" href="#">Learn more</a></p>
 +
                            </div>
 +
                          </div>
 +
                        </div>
 +
                        <div class="item">
 +
                          <img src="data:image/png;base64,"/>
 +
                          <div class="container">
 +
                            <div class="carousel-caption scrollContent2" data-spy="scroll" data-target="#navbarExample" data-offset="0">
 +
                              <h1>Week 3</h1>
 +
                              <p style="font-size:10pt; text-align:justify">Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
 +
                              <p><a class="btn btn-large btn-primary" href="#">Browse gallery</a></p>
 +
                            </div>
 +
                          </div>
 +
                        </div>
 +
                        <div class="item">
 +
                          <img src="data:image/png;base64,"/>
 +
                          <div class="container">
 +
                            <div class="carousel-caption scrollContent2" data-spy="scroll" data-target="#navbarExample" data-offset="0">
 +
                              <h1>Week 4</h1>
 +
                              <p style="font-size:10pt; text-align:justify">Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
 +
                              <p><a class="btn btn-large btn-primary" href="#">Browse gallery</a></p>
 +
                            </div>
 +
                          </div>
 +
                        </div>
 +
                        <div class="item" id="june_weeks">
 +
                          <img src="data:image/png;base64,"/>
 +
                          <div class="container">
 +
                            <div class="carousel-caption scrollContent2" data-spy="scroll" data-target="#navbarExample" data-offset="0">
 +
                              <h1>Week 5</h1>
 +
                              <p style="font-size:10pt; text-align:justify; position:relative; right:1%">Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</p>
 +
                            </div>
 +
                          </div>
 +
                        </div>
 +
                        <div class="item">
 +
                          <img src="data:image/png;base64,"/>
 +
                          <div class="container">
 +
                            <div class="carousel-caption scrollContent2" data-spy="scroll" data-target="#navbarExample" data-offset="0">
 +
                              <h1>Week 6</h1>
 +
                              <p style="font-size:10pt; text-align:justify">Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
 +
                              <p><a class="btn btn-large btn-primary" href="#">Learn more</a></p>
 +
                            </div>
 +
                          </div>
 +
                        </div>
 +
                        <div class="item">
 +
                          <img src="data:image/png;base64,"/>
 +
                          <div class="container">
 +
                            <div class="carousel-caption scrollContent2" data-spy="scroll" data-target="#navbarExample" data-offset="0">
 +
                              <h1>Week 7</h1>
 +
                              <p style="font-size:10pt; text-align:justify">Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
 +
                              <p><a class="btn btn-large btn-primary" href="#">Browse gallery</a></p>
 +
                            </div>
 +
                          </div>
 +
                        </div>
 +
                        <div class="item">
 +
                          <img src="data:image/png;base64,"/>
 +
                          <div class="container">
 +
                            <div class="carousel-caption scrollContent2" data-spy="scroll" data-target="#navbarExample" data-offset="0">
 +
                              <h1>Week 8</h1>
 +
                              <p style="font-size:10pt; text-align:justify">Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
 +
                              <p><a class="btn btn-large btn-primary" href="#">Browse gallery</a></p>
 +
                            </div>
 +
                          </div>
 +
                        </div>
 +
                      <a class="left carousel-control" href="#myCarousel" data-slide="prev"><span class="glyphicon glyphicon-chevron-left"></span></a>
 +
                      <a class="right carousel-control" href="#myCarousel" data-slide="next"><span class="glyphicon glyphicon-chevron-right"></span></a>
 +
                    </div>
 +
                  </div>
 +
                </div><!-- /.carousel -->
 +
                <div class="jumbotron" id="methods" data-spy="scroll" data-target="#navbarExample" data-offset="0">
 +
                    <h4>Methods:</h4>
 +
                    <p style="font-size:10pt; text-align:justify">Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. .   
 +
                    </p>
 +
                </div>
 +
 +
 +
            <!--Start Weekly Labjournal-->
 +
            <div class="weekly-tabs">
 +
                <ul class="nav nav-tabs">
 +
                  <li class="active"><a href="#">Del H</a></li>
 +
                  <li><a href="#">Del A-E</a></li>
 +
                  <li><a href="#">Del E-G</a></li>
 +
                </ul>
 +
            </div>
 +
            <div class="jumbotron" id="weekly">
 +
                <div class="nav navbar" data-spy="scroll" data-target="#navbarExample" data-offset="0" id="scrollContent">
 +
                    <h4>Amplification of... </h4>
 +
                    <p style="font-size:10pt; text-align:justify; position:absolute; right:2%"></html>
 +
:'''1.1.1. Reaction of DelA-F'''
 +
{| class="wikitable"
 +
|-
 +
! what !! µl 2nd PCR
 +
|-
 +
| FS_02 (1/10) || 2.5
 +
|-
 +
| FS_05 (1/10) || 2.5
 +
|-
 +
| ''D. acidovorans'' || 1
 +
|-
 +
| Phusion Master Mix || 25
 +
|-
 +
| dd H<sub>2</sub>O || 16.5
 +
|-
 +
| DMSO || 2.5
 +
|}                <html></p>
 +
                </div>
 +
            </div>
 +
</html>
 +
{{:Team:Heidelberg/Templates/Footer}}

Latest revision as of 21:55, 24 September 2013

Testibactin. It'll blow your mind.

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

Methods:

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. .