Difference between revisions of "Team:Heidelberg/SandboxMarita"

Line 1: Line 1:
−
{{Heidelberg/SandboxMarita/headerMarita}}
+
<html lang="en" dir="ltr" class="client-nojs">
−
{{Heidelberg/SandboxMarita/navbarMarita}}
+
<head>
 +
<meta charset="UTF-8" />
 +
<meta name="viewport" content="width=device-width, initial-scale=1.0">
 +
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 +
<meta name="generator" content="MediaWiki 1.16.5" />
 +
<link rel="shortcut icon" href="/favicon.ico" />
 +
<link rel="search" type="application/opensearchdescription+xml" href="/wiki/opensearch_desc.php" title="2014.igem.org (en)" />
 +
<link title="Creative Commons" type="application/rdf+xml" href="/wiki/index.php?title=WikitemplateA_home&amp;action=creativecommons" rel="meta" />
 +
<link rel="copyright" href="http://creativecommons.org/licenses/by/3.0/" />
 +
<link rel="alternate" type="application/atom+xml" title="2014.igem.org Atom feed" href="/wiki/index.php?title=Special:RecentChanges&amp;feed=atom" /> <title>WikitemplateA home - 2014.igem.org</title>
 +
<style type="text/css" media="screen, projection">/*<![CDATA[*/
 +
@import "/wiki/skins/common/shared.css?270";
 +
@import "/wiki/skins/igem/main.css?270";
 +
/*]]>*/</style>
 +
<link rel="stylesheet" type="text/css" media="print" href="/wiki/skins/common/commonPrint.css?270" />
 +
<!--[if lt IE 5.5000]><style type="text/css">@import "/wiki/skins/igem/IE50Fixes.css?270";</style><![endif]-->
 +
<!--[if IE 5.5000]><style type="text/css">@import "/wiki/skins/igem/IE55Fixes.css?270";</style><![endif]-->
 +
<!--[if IE 6]><style type="text/css">@import "/wiki/skins/igem/IE60Fixes.css?270";</style><![endif]-->
 +
<!--[if IE 7]><style type="text/css">@import "/wiki/skins/igem/IE70Fixes.css?270";</style><![endif]-->
 +
<!--[if lt IE 7]><script type="text/javascript" src="/wiki/skins/common/IEFixes.js?270"></script>
 +
<meta http-equiv="imagetoolbar" content="no" /><![endif]-->
 +
           
 +
<script type="text/javascript" src="/wiki/skins/common/wikibits.js?270"><!-- wikibits js --></script>
 +
<!-- Head Scripts -->
 +
<script src="/wiki/skins/common/ajax.js?270"></script>
 +
<script src="/wiki/skins/common/mwsuggest.js?270"></script>
 +
<script type="text/javascript" src="/wiki/index.php?title=-&amp;action=raw&amp;gen=js&amp;useskin=igem"><!-- site js --></script>
 +
<!-- jQuery Javascript -->
 +
<script type='text/javascript'        src ='/common/jquery-latest.min.js'></script>
 +
<script type='text/javascript'        src ='/common/tablesorter/jquery.tablesorter.min.js'></script>
 +
        <link rel='stylesheet' type='text/css' href='/common/tablesorter/themes/groupparts/style.css' />
 +
        <link rel='stylesheet' type='text/css' href='/common/table_styles.css' />
 +
        <link rel='stylesheet' type='text/css' href='/forum/forum_styles.css' />
 +
<script type='text/javascript'        src ='/forum/forum_scripts.js'></script>
 +
</head>
  
 +
<body>
 +
 
  
−
{{Heidelberg/templateus/Mainbody|Our Project.|Foundational Advance in Peptide Synthesis.|https://static.igem.org/mediawiki/2017/a/ae/T--Heidelberg--2017_Background_Tiger.jpg|
+
    <div id="top-section">
−
{{Heidelberg/templateus/AbstractboxV2|TITLE|
+
−
Several secondary metabolites, such as commonly used antibiotics, pigments and detoxifying enzymes, are synthesized by non-ribosomal peptide synthetases (NRPSs). These enzymes beautifully reflect one of the fundamental principles of synthetic biology, as they are remarkably modular. We will assemble new NRPSs by combining individual domains and modules of different origin, thus setting the basis for novel and customized synthesis of non-ribosomal peptidesTo make the use of NRPSs amenable to a wider community, we will devise a new software-tool, called NRPS Designer, which predicts the optimal modular composition of synthetic NRPSs for production of any desired peptide and outputs a cloning.
+
−
|https://static.igem.org/mediawiki/2013/5/58/Heidelberg_GRAPHICAL_ABSTRACT.png}}
+
  
 +
<script type="text/javascript"> if (window.isMSIE55) fixalpha(); </script>
  
−
{{Heidelberg/footer}}
+
 
 +
 
 +
 +
 
 +
<div class="right-menu noprint" id="menubar">
 +
    <ul>
 +
                <li id="pt-login"><a href="/wiki/index.php?title=Special:UserLogin&amp;returnto=WikitemplateA_home" title="You are encouraged to log in; however, it is not mandatory [o]" accesskey="o">Log in</a></li>     </ul>
 +
</div><!-- end right menubar -->
 +
 
 +
<div id="search-controls" class="noprint">
 +
<form action="/Special:Search" id="searchform">
 +
<input id="searchInput" name="search" type="text" title="Search 2014.igem.org [f]" accesskey="f" value="" />
 +
<input type='submit' name="go" class="searchButton" id="searchGoButton" value="Go" title="Go to a page with this exact name if exists" />&#160;
 +
      <input type='submit' name="fulltext" class="searchButton" id="mw-searchButton" value="Search" title="Search the pages for this text" />
 +
</form>
 +
</div> <!-- close search controls -->
 +
    </div> <!-- close top-section-->
 +
    <div id="content">
 +
<a name="top" id="top"></a>
 +
<h1 class="firstHeading">WikitemplateA home</h1>
 +
<div id="bodyContent">
 +
<h3 id="siteSub" class='noprint'>From 2014.igem.org</h3>
 +
<div id="contentSub"></div>
 +
<!--
 +
<div id="jump-to-nav">Jump to:                        <a href="#column-one">navigation</a>, <a href="#searchInput">search</a></div>-->
 +
<!-- start content -->
 +
<p>
 +
 
 +
 
 +
<!-- this section changes the default wiki template to a
 +
white full width background -->
 +
 
 +
<style type="text/css">
 +
#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: 14px;
 +
z-index: 100;
 +
top: 0;
 +
position: fixed;
 +
width: 975px;
 +
left: 50%;
 +
margin-left: -487px;
 +
}
 +
 
 +
#globalWrapper, #content { /*-- changes default wiki settings
 +
 
 +
--*/
 +
width: 100%;
 +
height: 100%;
 +
border: 0px;
 +
background-color: transparent;
 +
margin: 0px;
 +
padding: 0px;
 +
}
 +
 
 +
html, body, .wrapper { /*-- changes default wiki settings --
 +
 
 +
*/
 +
width: 100%;
 +
height: 100%;
 +
background-color: transparent;
 +
}
 +
</style>
 +
<link rel="stylesheet" type="text/css" href="https://2015.igem.org/Template:Heidelberg/css/jasnybootstrapmin?action=raw&amp;ctype=text/css" />
 +
 
 +
<link rel="stylesheet" type="text/css" href="https://2015.igem.org/Template:Heidelberg/css/bootstrapmin?action=raw&amp;ctype=text/css" />
 +
 
 +
<script type="text/javascript" src="https://2015.igem.org/Template:Heidelberg/js/jasnybootstrapmin?action=raw&amp;ctype=text/javascript"></script>
 +
<!-- Assets -->
 +
<link rel="stylesheet" href="http://static.tildacdn.com/css/tilda-grid-3.0.min.css" type="text/css" media="all" />
 +
 
 +
 
 +
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Josefin+Sans:300,400|Roboto:300,400,500">
 +
<link rel="stylesheet" href="http://azmind.com/demo/bootstrap-navbar-menu/layout-3/assets/bootstrap/css/bootstrap.min.css">
 +
 
 +
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css?action=raw&amp;ctype=text/css" type="text/css" rel="stylesheet">
 +
<link rel="stylesheet" href="http://azmind.com/demo/bootstrap-navbar-menu/layout-3/assets/font-awesome/css/font-awesome.min.css">
 +
 
 +
<link rel="stylesheet" type="text/css"
 +
href="https://2017.igem.org/Template:Heidelberg/general/CSS?action=raw&amp;ctype=text/css" />
 +
<style>
 +
body {
 +
    font-family: 'Josefin Sans' !important;
 +
    font-size: 16px;
 +
    font-weight: 300;
 +
    color: #888;
 +
   
 +
    text-align: center;
 +
}
 +
 
 +
    p {font-family: 'Josefin Sans' !important; font-size: 20px !important; color: #444 !important;font-weight: 300 !important;}
 +
 
 +
h1,h2,h3,h4,h5,h6{font-weight:100 !important; color: #393939 !important;font-family: 'Josefin Sans' !important;line-height: 70px !important;}
 +
   
 +
   
 +
    #footer-sec h4 {
 +
        color: white !important;
 +
        font-size: 26px !important;
 +
    }
 +
 
 +
#footer-sec p {
 +
color: grey !important;
 +
font-size: 18px !important;
 +
font-family: 'Josefin Sans' !important;
 +
text-align: center;
 +
}
 +
    #footer-sec a {
 +
        color: grey !important;
 +
    } 
 +
    #footer-sec a:hover {
 +
        color: white !important;
 +
        transition: color 1s !important;
 +
    } 
 +
   
 +
    article li {
 +
        text-align: justify;
 +
    }
 +
 
 +
    .inline_table {
 +
        font-size: 18px !important;
 +
        font-family: 'Josefin Sans' !important, sans-serif;
 +
    }
 +
   
 +
   
 +
    .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4,.col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12{
 +
      padding-top: 10px !important;
 +
        padding-bottom: 50px !important;
 +
    }
 +
  .mw-body {
 +
        background-color: red !important; 
 +
      height: 0px !important;
 +
    }
 +
 
 +
 
 +
    .table-of-contents {
 +
      float: right;
 +
      width: 100%;
 +
      background: #eee;
 +
      font-size: 0.8em;
 +
      padding-top: 15px;
 +
      padding-bottom: 10px;
 +
   
 +
 
 +
    }
 +
    .table-of-contents ul {
 +
      list-style: none;
 +
        text-align: left !important;
 +
        line-height: normal !important;
 +
 
 +
    }
 +
 
 +
    .table-of-contents a {
 +
      text-decoration: none;
 +
        font-size: 16px;
 +
        color: #393939 !important;
 +
       
 +
    }
 +
    .table-of-contents a:hover,
 +
    .table-of-contents a:active {
 +
      text-decoration: underline;
 +
    }
 +
 
 +
    .toc-nav li {
 +
        padding-bottom: 10px;
 +
    }
 +
    .toc-nav a {
 +
        font-family: 'Josefin Sans' !important;
 +
        font-size: 20px !important;
 +
        color: #444 !important;
 +
        font-weight: 300 !important;
 +
    }
 +
 
 +
 
 +
strong { font-weight: 500; }
 +
 
 +
a, a:hover, a:focus {
 +
color: black; text-decoration: none;
 +
    -o-transition: all .3s; -moz-transition: all .3s; -webkit-transition: all .3s; -ms-transition: all .3s; transition: all .3s;
 +
}
 +
 
 +
h1 { margin-top: 10px; font-family: 'Josefin Sans', sans-serif !important; font-size: 58px !important; font-weight: 300 !important; color: #393939 !important; line-height: 58px !important; opacity: 0.9; text-align:center; color: #393939;}
 +
h2 { margin-top: 10px; font-family: 'Josefin Sans', sans-serif; font-size: 48px; font-weight: 300; color: #393939; line-height: 56px; opacity: 0.9; text-align:center}
 +
 
 +
h3 { font-family: 'Josefin Sans', sans-serif; font-size: 40px; font-weight: 300; color: #555; line-height: 40px; }
 +
h4 { font-family: 'Josefin Sans', sans-serif; font-size: 35px; font-weight: 300; color: #555; line-height: 40px; }
 +
h5 { font-family: 'Josefin Sans', sans-serif; font-size: 30px; font-weight: 300; color: #555; line-height: 40px; }
 +
h6 { font-family: 'Josefin Sans', sans-serif; font-size: 25px; font-weight: 300; color: #555; line-height: 40px; }
 +
h7 { font-family: 'Josefin Sans', sans-serif; font-size: 22px; font-weight: 300; color: #555; line-height: 40px; }
 +
 
 +
img { max-width: 100%; }
 +
 
 +
.medium-paragraph { font-size: 18px; line-height: 34px; }
 +
 
 +
.colored { color: #df6482; }
 +
 
 +
::-moz-selection { background: #df6482; color: #fff; text-shadow: none; }
 +
::selection { background: #df6482; color: #fff; text-shadow: none; }
 +
 
 +
/***** General style, all sections *****/
 +
 
 +
.section-container { margin: 0 auto; padding-bottom: 80px; }
 +
.section-description { margin-top: 60px; padding-bottom: 10px; }
 +
.section-description p { margin-top: 20px; padding: 0 120px; }
 +
 
 +
/***** Divider *****/
 +
 
 +
.divider-1 { padding: 25px 0 15px 0; }
 +
.divider-1 .line { width: 160px; margin: 0 auto; border-bottom: 1px dashed #ccc; }
 +
 
 +
/***** Top menu *****/
 +
.navbar {
 +
margin-bottom: 0;
 +
    z-index: 10;
 +
    position: fixed;
 +
background: white;
 +
border-bottom: 1px solid white;
 +
    box-shadow: 2px 0px 30px black ;
 +
-moz-border-radius: 0; -webkit-border-radius: 0; border-radius: 0;
 +
}
 +
 
 +
.navbar-no-bg { padding-top: 10px; background: white; }
 +
 
 +
ul.navbar-nav {
 +
        padding-top: 10px;
 +
font-family: 'Josefin Sans', sans-serif;
 +
font-size: 14px;
 +
color: #fff;
 +
font-weight: 400;
 +
    display: inline-block;
 +
text-transform: uppercase;
 +
}
 +
.navbar-inverse ul.navbar-nav li a { color: grey; border: 0; }
 +
.navbar-inverse ul.navbar-nav li a:hover { color: #000; border: 0; }
 +
.navbar-inverse ul.navbar-nav li a:focus { color: #000; outline: 0; border: 0; }
 +
 
 +
 
 +
.navbar-brand {
 +
width: 100%;
 +
    position: absolute;
 +
    top: 1px;
 +
}
 +
 
 +
 
 +
 
 +
.navbar>.container .navbar-brand, .navbar>.container-fluid .navbar-brand { margin-left: 0; }
 +
 
 +
.dropdown:hover .dropdown-menu {
 +
    display: block;
 +
    background-color: white;
 +
    font-family: 'Josefin Sans', sans-serif;
 +
font-size: 14px;
 +
font-weight: 400;
 +
text-transform: uppercase;
 +
    border-top: none;
 +
}
 +
.dropdown-menu>li>a {
 +
    color: grey;
 +
}
 +
 
 +
/* Animate */
 +
 
 +
 
 +
 
 +
.top-content .text h1 { color: #393939; }
 +
 
 +
.top-content .description { margin: 30px 0 10px 0; }
 +
.top-content .description p { opacity: 0.8; }
 +
.top-content .description a { color: #fff; border-bottom: 1px dotted #fff; }
 +
.top-content .description a:hover, .top-content .description a:focus { color: #fff; border: 0; }
 +
 
 +
 
 +
/***** Features *****/
 +
 
 +
.features-box { margin-top: 30px; text-align: left; }
 +
.features-box .features-box-icon { font-size: 60px; color: #df6482; line-height: 60px; text-align: center; }
 +
.features-box h3 { margin-top: 0; padding: 0 0 10px 0; }
 +
 
 +
 
 +
#footer-sec {
 +
    position: relative;
 +
    background-color: #393939;
 +
font-family: 'Josefin Sans', sans-serif;
 +
}
 +
#footer-sec h4 {
 +
color: white;
 +
 
 +
}
 +
#footer-sec  li > a {
 +
color: grey;
 +
font-size: 16x;
 +
}
 +
#footer-sec  span {
 +
font-family: 'Josefin Sans', sans-serif;
 +
color: grey;
 +
font-size: 16px;
 +
}
 +
 
 +
#footer-sec  li {
 +
color: grey;
 +
font-size: 16px;
 +
list-style: none;
 +
    padding-bottom: 2px;
 +
}
 +
 
 +
 
 +
#footer-sec li > a:hover{
 +
    color: white;
 +
    text-decoration: none;
 +
    transition-delay: 0.1s;
 +
    -webkit-transition: color 1s; /* Safari */
 +
    transition: color 1s;
 +
}
 +
#facebook, #twitter {
 +
color: grey
 +
}
 +
#facebook:hover,#twitter:hover {
 +
    color: white;
 +
    transition-delay: 0.1s;
 +
    -webkit-transition: color 1s; /* Safari */
 +
    transition: color 1s;
 +
}
 +
 
 +
 
 +
/***** MEDIA QUERIES *****/
 +
 
 +
@media (max-width: 1211px) {
 +
    .navbar-header {
 +
        float: none;
 +
    }
 +
    .navbar-toggle {
 +
        display: block;
 +
    }
 +
    .navbar-collapse {
 +
        border-top: 1px solid transparent;
 +
        box-shadow: inset 0 1px 0 rgba(255,255,255,0.1);
 +
    }
 +
    .navbar-collapse.collapse {
 +
        display: none!important;
 +
    }
 +
    .navbar-brand {position: absolute; left: 10px;top: 1px;}
 +
    #circle:before {
 +
        height: 61px !important;
 +
    }
 +
    .navbar {
 +
        height: 77px;
 +
    }
 +
    .navbar-nav {
 +
        float: none!important;
 +
        margin: 7.5px -15px;
 +
    }
 +
    .navbar-nav>li {
 +
        float: none;
 +
    }
 +
    .navbar-nav>li>a {
 +
        padding-top: 10px;
 +
        padding-bottom: 10px;
 +
    }
 +
    .navbar-text {
 +
        float: none;
 +
        margin: 15px 0;
 +
    }
 +
    /* since 3.1.0 */
 +
    .navbar-collapse.collapse.in {
 +
        display: block!important;
 +
    }
 +
    .collapsing {
 +
        overflow: hidden!important;
 +
    }
 +
}
 +
   
 +
 
 +
 
 +
 
 +
 
 +
 
 +
 
 +
#circle {
 +
    position: relative;
 +
    box-shadow: 2px 0px 30px black ;
 +
    background-color: blue;
 +
    height: 120px;
 +
    width: 120px;
 +
    border-radius: 50%;
 +
   
 +
   
 +
}
 +
 
 +
#circle:before{
 +
    position: absolute;
 +
    content: "";
 +
    width: 260%;
 +
    height: 60px;
 +
   
 +
    left: -90%;
 +
    background: white;
 +
}
 +
 
 +
 
 +
#circle:after{
 +
    position: absolute;
 +
    content: "";
 +
    width: 100%;
 +
    height: 100%;
 +
    left: 0;
 +
    top: 0;
 +
    background: white;
 +
    border-radius: 50%;
 +
    background-image: url('https://static.igem.org/mediawiki/2017/8/8f/Heidelberg_2017_phage_logo.svg');
 +
    background-size: 90px 90px;
 +
    background-repeat: no-repeat;
 +
    background-position: center;
 +
}
 +
 
 +
 
 +
 
 +
  .input_form {
 +
                        background-color: #939393;
 +
                        border: none;
 +
                        color: white;
 +
                        padding: 5px 32px;
 +
                        margin-top: 25px;
 +
                        text-align: center;
 +
                        text-decoration: none;
 +
                        display: inline-block;
 +
                        font-size: 16px; 
 +
                        }
 +
                       
 +
                        input[type="text"] {
 +
                          display: block;
 +
                          margin: 0;
 +
                          width: 100%;
 +
                          height: 30px;
 +
                          font-size: 18px;
 +
                          -webkit-appearance: none;
 +
                          -moz-appearance: none;
 +
                          appearance: none;
 +
                          -webkit-box-shadow: none;
 +
                          -moz-box-shadow: none;
 +
                          box-shadow: none;
 +
                          -webkit-border-radius: none;
 +
                          -moz-border-radius: none;
 +
                          -ms-border-radius: none;
 +
                          -o-border-radius: none;
 +
                          border-radius: none;
 +
                        }
 +
                       
 +
                        #sidenav {
 +
                            font-family: 'Josefin Sans', sans-serif;
 +
                            font-size: 14px;
 +
                            color: #fff;
 +
                            font-weight: 400;
 +
                            text-transform: uppercase;
 +
                           
 +
                          list-style: none;
 +
                        }
 +
                        #sidenav {
 +
                            font-family: 'Josefin Sans', sans-serif;
 +
                            font-size: 14px;
 +
                            color: #fff;
 +
                            font-weight: 400;
 +
                            text-transform: uppercase;
 +
                           
 +
                        }
 +
                        #sidenav > li > ul > li {
 +
                            list-style: none;
 +
                        }
 +
                        #sidenav > li > ul > li > a {
 +
                            color: firebrick;
 +
                        }
 +
                        #sidenav > li > ul > li > a:hover {
 +
                            color: #393939;
 +
                            transition: color 1s ease;
 +
                        }
 +
                       
 +
                        .navmenu-brand > img {
 +
                            border-radius: 200px;
 +
                            width: 100px;
 +
                            height: auto;
 +
                        }
 +
                       
 +
                        .navmenu-brand {
 +
                            text-align: center;
 +
                            font-size: 20px;
 +
                            color: #fff;
 +
                            font-weight: 400;
 +
                           
 +
                           
 +
                        }
 +
               
 +
               
 +
</style>
 +
<link rel="stylesheet" type="text/css"
 +
href="https://2017.igem.org/Template:Heidelberg/table_layout/CSS?action=raw&amp;ctype=text/css" />
 +
                        <!-- Favicon and touch icons -->
 +
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
 +
 
 +
 
 +
 
 +
 
 +
<script type="text/javascript" src="https://2015.igem.org/Template:Heidelberg/js/jasnybootstrapmin?action=raw&amp;ctype=text/javascript"></script>
 +
 
 +
                        <link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">
 +
 
 +
<!-- jQuery CDN -->
 +
        <script src="https://code.jquery.com/jquery-1.12.0.min.js"></script>
 +
        <!-- Bootstrap Js CDN -->
 +
        <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
 +
        <!-- jQuery Nicescroll CDN -->
 +
        <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.nicescroll/3.6.8-fix/jquery.nicescroll.min.js"></script>
 +
<style>
 +
   
 +
    #sidebarCollapse {
 +
        background-color: white;
 +
    }
 +
    #overall-wrapper {
 +
        min-width: 700px;
 +
    }
 +
    body {
 +
        background-color: #010101;
 +
    }
 +
      #textblock1 {
 +
          position: absolute;
 +
          top: 200px;
 +
          left: 0px;
 +
          width: 500px;
 +
      }     
 +
      #textblock2 {
 +
          position: absolute;
 +
          top: 1050px;
 +
          left: 150px;
 +
          width: 500px;
 +
      } 
 +
      #textblock3 {
 +
            position: absolute;
 +
          top: 950px;
 +
          right: 50px;
 +
          width: 500px;
 +
          height: 400px;
 +
         
 +
      }
 +
      #textblock4 {
 +
            position: absolute;
 +
          top: 1600px;
 +
          left: 100px;
 +
          width: 500px;
 +
      }
 +
      #textblock5 {
 +
            position: absolute;
 +
          top: 2150px;
 +
          right: 100px;
 +
          width: 600px;
 +
      }
 +
      #textblock6 {
 +
            position: absolute;
 +
          top: 2700px;
 +
          left: 0px;
 +
          width: 500px;
 +
      },
 +
        #textblock6 {
 +
            position: absolute;
 +
          top: 2800px;
 +
          left: 0px;
 +
          width: 400px;
 +
      }
 +
    #textblock7 {
 +
            position: absolute;
 +
          top: 3250px;
 +
          right: 100px;
 +
          width: 400px;
 +
      }
 +
#textblock1 > p, #textblock3 > p, #textblock5 > p,#textblock2 > p, #textblock4 > p, #textblock6 > p, #textblock7 > p {
 +
    color: white !important;
 +
    text-align: center;
 +
    font-size: 28px !important;
 +
    font-weight: 300 !important;
 +
}
 +
 
 +
#textblock1 > a {
 +
    color: #F8991D;
 +
    font-size: 50px;
 +
}
 +
#textblock1 > a:hover, #textblock2 > a:hover, #textblock3 > a:hover, #textblock4 > a:hover, #textblock5 > a:hover, #textblock6 > a:hover, #textblock7 > a:hover, #textblock8 > a:hover  {
 +
    text-decoration: underline;
 +
}
 +
#textblock2 > a {
 +
    color: whitesmoke;
 +
    font-size: 50px;
 +
    line-height: 50px;
 +
}
 +
 
 +
#textblock4 > a {
 +
  color:#FEE000;
 +
    font-size: 50px;
 +
    line-height: 50px;
 +
}
 +
#textblock5 > a {
 +
  color:whitesmoke;
 +
    font-size: 50px;
 +
    line-height: 50px;
 +
}
 +
#textblock6 > a {
 +
  color:#9D1C20;
 +
    font-size: 50px;
 +
    line-height: 50px;
 +
}
 +
 
 +
 
 +
#textblock7 > a {
 +
    color: #6698be;
 +
    font-size: 50px;
 +
    line-height: 50px;
 +
}
 +
#textblock8 > a {
 +
    color: #393939;
 +
    font-size: 50px;
 +
}
 +
 
 +
    #toolbox-icon1 {
 +
position: absolute;
 +
top: 4460px;
 +
left: 430px;
 +
} 
 +
   
 +
    #toolbox-row1 {
 +
        top: 0px;
 +
    }
 +
    #toolbox-row2 {
 +
        top: 200px;
 +
    }
 +
    #toolbox-row3 {
 +
        top: 400px;
 +
    }
 +
    wrapper {
 +
        padding-bottom: 0px;
 +
    }
 +
 
 +
     
 +
                              video {
 +
                            position: relative;
 +
                         
 +
                            width: 100%;
 +
                            height: auto;
 +
                            background: url('') no-repeat;
 +
                         
 +
 
 +
                        }   
 +
      #Icon1 {
 +
            position: absolute;
 +
          width: 400px;
 +
            left: 4%;
 +
      }
 +
      #Icon2 {
 +
          position: absolute;
 +
          width: 400px;
 +
          left: 1%;
 +
 
 +
      }
 +
      #Icon3 {
 +
            position: absolute;
 +
          left: 6%;
 +
          width: 400px;
 +
      }
 +
      #Icon4 {
 +
            position: absolute;
 +
            right: 11%;
 +
          width: 300px;
 +
      }
 +
      #Icon5 {
 +
        position: absolute;
 +
        right: 8%;
 +
          width: 300px;
 +
      }
 +
      #Icon6 {
 +
          position: absolute;
 +
            right: 11%;
 +
          width: 300px;
 +
      }
 +
     
 +
      .icon-text {
 +
          position: relative;
 +
          top: 20px;
 +
          left: 130px;
 +
      }
 +
     
 +
      .icon-text-right {
 +
          position: relative;
 +
          top: 20px;
 +
          right: 0px;
 +
          width: 300px;
 +
      }
 +
     
 +
      #Icon1 > .icon-text > h5 {
 +
          text-transform: uppercase;
 +
          color: #009E73 !important;
 +
          font-weight: 400 !important;
 +
          line-height: 40px !important;
 +
      }
 +
     
 +
      #Icon1:hover > .icon-text > p,#Icon2:hover > .icon-text > p,#Icon3:hover > .icon-text > p,#Icon4:hover > .icon-text-right > p,#Icon5:hover > .icon-text-right > p,#Icon6:hover > .icon-text-right > p {
 +
          visibility: visible !important;
 +
          text-align: center;
 +
          transition: color 1s ease;
 +
          color: white !important;
 +
      }
 +
      #Icon1 > .icon-text > p,#Icon2 > .icon-text > p,#Icon3 > .icon-text > p,#Icon4 > .icon-text-right > p,#Icon5 > .icon-text-right > p,#Icon6 > .icon-text-right > p  {
 +
          visibility: hidden!important;
 +
      }
 +
      #Icon2 > .icon-text > h5 {
 +
          text-transform: uppercase;
 +
          color: #F8991D !important;
 +
          font-weight: 400 !important;
 +
          line-height: 40px !important;
 +
      } 
 +
 
 +
     
 +
      #Icon3 > .icon-text > h5 {
 +
          text-transform: uppercase;
 +
          color: #6698BE !important;
 +
          font-weight: 400 !important;
 +
          line-height: 40px !important;
 +
      } 
 +
     
 +
 
 +
     
 +
      #Icon4 > .icon-text-right > h5 {
 +
          text-transform: uppercase;
 +
          color: #FEE000 !important;
 +
          font-weight: 400 !important;
 +
          line-height: 40px !important;
 +
      }
 +
 
 +
     
 +
      #Icon5 > .icon-text-right > h5 {
 +
          text-transform: uppercase;
 +
          color: #009193 !important;
 +
          font-weight: 400 !important;
 +
          line-height: 40px !important;
 +
      }
 +
     
 +
 
 +
     
 +
      #Icon6 > .icon-text-right > h5 {
 +
          text-transform: uppercase;
 +
          color: #9D1C20 !important;
 +
          font-weight: 400 !important;
 +
          line-height: 40px !important;
 +
      }
 +
     
 +
      .phage-scroller {
 +
              width: 150px;
 +
              height: auto;
 +
          }
 +
     
 +
      #toolbox {
 +
          position: absolute;
 +
          top: 3800px;
 +
          min-height: 600px ;
 +
          width: 100%;
 +
          max-width: 1200px;
 +
          margin: 0 auto;
 +
         
 +
      }
 +
     
 +
      #toolbox-image {
 +
          position: absolute;
 +
          left: 380px;
 +
          width: 500px;
 +
          top: 10%
 +
      }
 +
   
 +
      .icon {
 +
            cursor: pointer;
 +
      }
 +
      .toolbox-icon {
 +
          width: 120px;
 +
          height: 120px;
 +
          border-radius: 100%;
 +
          float: left;
 +
          background-color: white;
 +
          position: absolute;
 +
         
 +
      }
 +
     
 +
      .icon:hover > .toolbox-icon {
 +
         
 +
          transform: scale(1.2,1.2);
 +
          transition: all 1s ease-out;
 +
      }
 +
      @media (max-width: 1200px) {
 +
         
 +
          #wrapper {
 +
              padding-bottom: 600px;
 +
          }
 +
         
 +
         
 +
         
 +
              #textblock1 {
 +
          position: absolute;
 +
          top: 100px;
 +
          left: 0px;
 +
          width: 400px;
 +
      }     
 +
          #textblock1 > p, #textblock3 > p, #textblock5 > p {
 +
    color: white !important;
 +
   
 +
    text-align: center;
 +
    font-size: 24px !important;
 +
    font-weight: 300 !important;
 +
}
 +
         
 +
    #textblock1 > a {
 +
    line-height: 50px;
 +
    font-size: 50px;
 +
}
 +
         
 +
      #textblock2 {
 +
          position: absolute;
 +
          top: 800px;
 +
          left: 150px;
 +
          width: 500px;
 +
      } 
 +
       
 +
      #textblock3 {
 +
            position: absolute;
 +
          top: 780px;
 +
          right: 0px;
 +
          width: 300px;
 +
          height: 220px;
 +
      }
 +
      #textblock4 {
 +
            position: absolute;
 +
          top: 1300px;
 +
          left: 0px;
 +
          width: 500px;
 +
      }
 +
      #textblock5 {
 +
            position: absolute;
 +
          top: 1770px;
 +
          right: 30px;
 +
          width: 500px;
 +
      }
 +
      #textblock6 {
 +
            position: absolute;
 +
          top: 2200px;
 +
          left: 0px;
 +
          width: 400px;
 +
      }
 +
         
 +
          #textblock7 {
 +
              position: absolute;
 +
              top: 2650px;
 +
              right: 50px;
 +
          }
 +
         
 +
          #toolbox {
 +
              position: absolute;
 +
              top: 3600px;
 +
             
 +
             
 +
          }
 +
          #toolbox-image {
 +
              position: relative;
 +
              left: 30px !important;
 +
          }
 +
          #Icon1 {
 +
              left: 100px;
 +
          }
 +
          #Icon2 {
 +
              left: 100px;
 +
          }
 +
          #Icon3 {
 +
              left: 100px;
 +
          }
 +
          #Icon4 {
 +
              right: 200px;
 +
          }
 +
          #Icon5 {
 +
              right: 200px;
 +
                       
 +
          }
 +
          #Icon6 {
 +
              right: 200px;
 +
          }
 +
      }
 +
      @media (max-width: 960px) {
 +
       
 +
            #wrapper {
 +
              padding-bottom: 980px;
 +
             
 +
          }
 +
            .phage-scroller {
 +
              width: 100px;
 +
              height: auto;
 +
          }
 +
              #textblock1 {
 +
          position: absolute;
 +
          top: 20px;
 +
          left: 0px;
 +
          width: 280px;
 +
      }     
 +
         
 +
        #textblock1 > p,#textblock2 > p, #textblock3 > p,#textblock4 > p, #textblock5 > p,#textblock6 > p, #textblock7 > p {
 +
            color: white !important;
 +
            text-align: center;
 +
            font-size: 20px !important;
 +
            font-weight: 300 !important;
 +
        }
 +
          #textblock1 > a,#textblock2 > a, #textblock4 > a,  #textblock6 > a, #textblock7 > a {
 +
    font-size: 35px;
 +
    line-height: 30px;
 +
}
 +
          #textblock5 > a {
 +
              font-size: 25px;
 +
            line-height: 20px; 
 +
          }
 +
             
 +
      #textblock2 {
 +
          position: absolute;
 +
          top: 520px;
 +
          left: 120px;
 +
          width: 300px;
 +
      } 
 +
       
 +
      #textblock3 {
 +
            position: absolute;
 +
          top: 530px;
 +
          right: 0px;
 +
          width: 200px;
 +
          height: 120px;
 +
         
 +
      }
 +
      #textblock4 {
 +
            position: absolute;
 +
          top: 820px;
 +
          left: 0px;
 +
          width: 350px;
 +
      }
 +
      #textblock5 {
 +
            position: absolute;
 +
          top: 1110px;
 +
          right: 0px;
 +
          width: 360px;
 +
      }
 +
      #textblock6 {
 +
            position: absolute;
 +
          top: 1380px;
 +
          left: 0px;
 +
          width: 300px;
 +
      } 
 +
        #textblock7 {
 +
            position: absolute;
 +
          top: 1680px;
 +
          right: 0px;
 +
          width: 300px;
 +
      } 
 +
         
 +
          #toolbox {
 +
              top: 2300px;
 +
          }
 +
         
 +
         
 +
          #toolbox-image {
 +
              position: relative;
 +
              left: 30px !important;
 +
          }
 +
          #Icon1 {
 +
              left: 100px;
 +
              top: 0px;
 +
          }
 +
          #Icon2 {
 +
              left: 100px;
 +
              top: 150px;
 +
          }
 +
          #Icon3 {
 +
              left: 100px;
 +
              top: 300px;
 +
          }
 +
          #Icon4 {
 +
              right: 200px;
 +
              top: 150px;
 +
          }
 +
          #Icon5 {
 +
              right: 200px;
 +
              top: 300px; 
 +
          }
 +
          #Icon6 {
 +
              right: 200px;
 +
              top: 450px;
 +
          }
 +
           
 +
      }
 +
     
 +
   
 +
     
 +
     
 +
 
 +
     
 +
     
 +
     
 +
     
 +
 +
.fa-twitter{
 +
background: #393939;
 +
color: #FFFFFF;
 +
  padding: 0.1em 0.1em;
 +
    font-size: 2em;
 +
}
 +
    .fa-facebook{
 +
background: #393939;
 +
color: #FFFFFF;
 +
  padding: 0.1em 0.3em;
 +
        font-size: 2em;
 +
}
 +
 
 +
                    </style>
 +
         
 +
</head>
 +
<body class="t-body">
 +
      <div id="overall-wrapper">
 +
    <!-- Top menu -->
 +
<nav class="navbar navbar-inverse navbar-fixed-top navbar-no-bg " role="navigation">
 +
<div class="container">
 +
<div class="navbar-header">
 +
                 
 +
                      <a class="navbar-brand" href="https://2017.igem.org/Team:Heidelberg"><div id="circle">
 +
                        </div></a>
 +
              <a type="button" data-canvas="body" id="sidebarCollapse" class="navbar-toggle" data-toggle="offcanvas" data-target="#sidebar" style="color: #393939;margin-top: 10px;">SIDEBAR 
 +
                    </a>
 +
             
 +
</div>
 +
<!-- Collect the nav links, forms, and other content for toggling -->
 +
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
 +
<ul class="nav navbar-nav navbar-right">
 +
<li><a href="https://2017.igem.org/Team:Heidelberg/Achievements">Achievements</a></li>
 +
<li class="dropdown"><a href="https://2017.igem.org/Team:Heidelberg/Description">Project <span class="caret"></span></a>
 +
                        <ul class="dropdown-menu">
 +
                        <li><a href="https://2017.igem.org/Team:Heidelberg/Description">Overview</a></li> 
 +
                        <li><a href="https://2017.igem.org/Team:Heidelberg/Results">Results</a></li>
 +
                        <li><a href="https://2017.igem.org/Team:Heidelberg/Parts">Parts</a></li>
 +
                        </ul>
 +
                        </li>
 +
<li class="dropdown"><a href="https://2017.igem.org/Team:Heidelberg/Model">Modeling <span class="caret"></span></a>
 +
                        <ul class="dropdown-menu">
 +
                        <li><a href="https://2017.igem.org/Team:Heidelberg/iGEMGoesGreen">iGEM goes Green</a></li> 
 +
                        <li><a href="https://2017.igem.org/Team:Heidelberg/Model">Modeling</a></li>
 +
                        </ul>
 +
                        </li>
 +
<li class="dropdown"><a href="https://2017.igem.org/Team:Heidelberg/Software&amp;Hardware">Software &amp; Hardware <span class="caret"></span></a>
 +
                        <ul class="dropdown-menu">
 +
                        <li><a href="https://2017.igem.org/Team:Heidelberg/Software">AI</a></li> 
 +
                        <li><a href="https://2017.igem.org/Team:Heidelberg/Hardware">Hardware</a></li>
 +
                        </ul>
 +
                        </li>
 +
<li class="dropdown"><a href="https://2017.igem.org/Team:Heidelberg/HP">Human Practice <span class="caret"></span></a>
 +
                        <ul class="dropdown-menu">
 +
                            <li><a href="https://2017.igem.org/Team:Heidelberg/Safety">Safety &amp; Security</a></li>
 +
                            <li class="divider"></li>
 +
                            <li><a href="https://2017.igem.org/Team:Heidelberg/Description">Integrated Human Practice</a></li>
 +
                            <li><a href="https://2017.igem.org/Team:Heidelberg/Engagement">Public Engagement</a></li>
 +
                            <li class="divider"></li>
 +
                            <li><a href="https://2017.igem.org/Team:Heidelberg/Education">Education</a></li>
 +
                            <li><a href="https://2017.igem.org/Team:Heidelberg/Collaborations">Collaborations</a></li>
 +
                        </ul>
 +
                       
 +
                        </li>
 +
<li class="dropdown"><a href="https://2017.igem.org/Team:Heidelberg/Team">People <span class="caret"></span></a>
 +
                        <ul class="dropdown-menu">
 +
                            <li><a href="https://2017.igem.org/Team:Heidelberg/Team">Team</a></li>
 +
                            <li><a href="https://2017.igem.org/Team:Heidelberg/Attributions">Attributions</a></li>
 +
                        </ul>
 +
                       
 +
                        </li>
 +
                        <li><a href="https://2017.igem.org/Team:Heidelberg/Toolbox">Toolbox</a></li>
 +
</ul>
 +
</div>
 +
</div>
 +
</nav>
 +
 
 +
          <nav id="sidebar" style="background-color: white;border: none;box-shadow:1px 0px 0px #393939;" class="navmenu navmenu-default navmenu-fixed-left offcanvas" role="navigation">
 +
        <a class="navmenu-brand" href="#"><img src="https://static.igem.org/mediawiki/2017/8/8f/Heidelberg_2017_phage_logo.svg"><br><br> iGEM TEAM HEIDELBERG 2017</a>
 +
        <hr>
 +
        <ul class="nav navmenu-nav" id="sidenav">
 +
          <li><a href="https://2017.igem.org/Team:Heidelberg/Achievements">Achievements</a></li>
 +
<li><a data-toggle="collapse" data-target="#Project_side">Project <i class="fa fa-fw fa-caret-down"></i></a>
 +
                        <ul id="Project_side" class="collapse side">
 +
                        <li><a href="https://2017.igem.org/Team:Heidelberg/Description">Overview</a></li> 
 +
                        <li><a href="https://2017.igem.org/Team:Heidelberg/Results">Results</a></li>
 +
                        <li><a href="https://2017.igem.org/Team:Heidelberg/Parts">Parts</a></li>
 +
                        </ul>
 +
                        </li>
 +
                        <li><a data-toggle="collapse" data-target="#Model_side">Modeling <i class="fa fa-fw fa-caret-down"></i></a>
 +
                        <ul id="Model_side" class="collapse side">
 +
                        <li><a href="https://2017.igem.org/Team:Heidelberg/iGEMGoesGreen">iGEM goes Green</a></li> 
 +
                        <li><a href="https://2017.igem.org/Team:Heidelberg/Model">Modeling</a></li>
 +
                        </ul>
 +
                        </li>
 +
                        <li><a data-toggle="collapse" data-target="#AI_side">Software &amp; Hardware <i class="fa fa-fw fa-caret-down"></i></a>
 +
                        <ul id="AI_side" class="collapse side">
 +
                        <li><a href="https://2017.igem.org/Team:Heidelberg/Software">AI</a></li> 
 +
                        <li><a href="https://2017.igem.org/Team:Heidelberg/Hardware">Hardware</a></li>
 +
                        </ul>
 +
                        </li>
 +
                        <li><a data-toggle="collapse" data-target="#HP_side">Human Practice <i class="fa fa-fw fa-caret-down"></i></a>
 +
                        <ul id="HP_side" class="collapse side">
 +
                            <li><a href="https://2017.igem.org/Team:Heidelberg/HP" data-toggle="collapse" data-target="#HP_side">Overview</a></li>
 +
                            <li><a href="https://2017.igem.org/Team:Heidelberg/Safety">Safety &amp; Security</a></li>
 +
                            <li class="divider"></li>
 +
                            <li><a href="https://2017.igem.org/Team:Heidelberg/Description">Integrated Human Practice</a></li>
 +
                            <li><a href="https://2017.igem.org/Team:Heidelberg/Engagement">Public Engagement</a></li>
 +
                            <li class="divider"></li>
 +
                            <li><a href="https://2017.igem.org/Team:Heidelberg/Education">Education</a></li>
 +
                            <li><a href="https://2017.igem.org/Team:Heidelberg/Collaborations">Collaborations</a></li>
 +
                        </ul>
 +
                       
 +
                        </li>
 +
                        <li><a data-toggle="collapse" data-target="#People_side">People <i class="fa fa-fw fa-caret-down"></i></a>
 +
                        <ul id="People_side" class="collapse side">
 +
                            <li><a href="https://2017.igem.org/Team:Heidelberg/Team">Team</a></li>
 +
                            <li><a href="https://2017.igem.org/Team:Heidelberg/Attributions">Attributions</a></li>
 +
                        </ul>
 +
                       
 +
                        </li>
 +
                        <li><a href="https://2017.igem.org/Team:Heidelberg/Toolbox">Toolbox</a></li>
 +
        </ul>
 +
    </nav>
 +
 
 +
      <!-- cover -->
 +
<div class="t-cover"  style="height:100vh;" >
 +
 
 +
 
 +
                                    <div id="media-box">
 +
                                      <video id="landing-page-video" poster="" style="position:absolute" playsinline autoplay muted>
 +
                                        <source src="https://static.igem.org/mediawiki/2017/2/25/T--Heidelberg--2017_Wiki_Intro_iGEM2017.mp4" type="video/mp4">
 +
                                      </video>
 +
                                    </div>
 +
</div>
 +
 +
<div style="position:relative; height: 15px; ; z-index: 5; box-shadow: 0em -0.1em 3em 0.5em black; background-color: white">
 +
                                            <a href="#textblock1" style="position: absolute; bottom: 40px;right: 40px; background-color:transparent;">
 +
                                            <img src="https://static.igem.org/mediawiki/2017/4/46/T--Heidelberg--2017_Phage_on_top.svg" class="phage-scroller"></a>
 +
</div>
 +
<div style="background: #393939; z-index: 5;" id="wrapper">
 +
 +
 +
<div class="t-container" style="position: relative; padding-bottom: 50px; background-color: transparent;">
 +
<div class="t-col t-col_12">
 +
                                                        <img src="https://static.igem.org/mediawiki/2017/4/4a/T--Heidelberg--2017_Red_Thread.svg">
 +
 
 +
</div>
 +
 +
<div  id="textblock1">
 +
                                                                    <p>This year´s iGEM Team Heidelberg aims at harnessing the enormous power of</p>
 +
                                                                    <a href="#" id="accelerated_evolution"><strong>Accelerated evolution</strong></a>
 +
                                                                    <p>by using Phage-assisted continious evolution (PACE) and our newly created method called PREDCEL</p>
 +
                                                                </div>
 +
                                                                <div id="textblock2">
 +
                                                                    <p>Let us introduce you to the next generation of directed evolution...</p>
 +
                                                                    <a href="#"><strong>Come discover the diversity of Nature</strong></a>
 +
                                                                </div>
 +
                                                                <div id="textblock3">
 +
                                                                   
 +
                                                                   
 +
</div>
 +
<div id="textblock4">
 +
                                                                    <p>As finding the right startersequence is quite difficult we used</p>
 +
                                                                    <a href="#" id="artificial_intelligence"><strong>Artificial Intelligence</strong></a>
 +
                                                                    <p>for protein classification & generation of entirely new functional sequences</p>
 +
                                                                   
 +
</div>
 +
                                                            <div id="textblock5">
 +
                                                                  <p>Right at the beginning our major ambition was it utilize PACE for</p>
 +
                                                                    <a href="#"><strong>Carbon-Silicon Bond Formation</strong></a>
 +
                                                                    <p> which could ultimately affect a lot of different aspects of our life and life in general</p>
 +
</div>
 +
                                                    <div id="textblock6">
 +
                                                                <p>In order to make PREDCEL work, we also had a lot to model</p><br><p> Therefore check out our</p>
 +
                                                                    <a href="#"><strong>Interactive modeling</strong></a>
 +
</div>
 +
                                                    <div id="textblock7">
 +
                                                        <p> As we affect the world & <br> the world affects us, we need</p>
 +
                                                                    <a href="#"><strong>Human Practice</strong></a>
 +
</div>
 +
                                                   
 +
                                                    <div id="toolbox">
 +
                                                           
 +
                                                          <div style="position: relative;" id="toolbox-row1">
 +
                                                                <div id="Icon1" class="icon"><img src="https://static.igem.org/mediawiki/2017/7/79/T--Heidelberg--2017_T--Heidelberg--2017_Icon_Destructase.svg" class="toolbox-icon" style="left: 0px;"><div class="icon-text" style="width: 230px;"><h5>Destructase Screening</h5><p>Screen</p></div></div>
 +
                                                                <div id="Icon4" class="icon"><img src="https://static.igem.org/mediawiki/2017/e/e9/T--Heidelberg--2017_T--Heidelberg--2017_Icon_Carbonsilicones.svg" class="toolbox-icon" style="left: 250px;"><div class="icon-text-right"><h5>Organo silicones</h5><p>Produce</p></div></div>
 +
                                                            </div>
 +
                                                       
 +
                                                            <div style="position: relative;" id="toolbox-row2">
 +
                                                                <div id="Icon2" class="icon"><img src="https://static.igem.org/mediawiki/2017/c/cd/T--Heidelberg--2017_T--Heidelberg--2017_Icon_DNA_Editing.svg" class="toolbox-icon" style="left: 0px;"><div class="icon-text" style="width: 200px;"><h5>DNA Editing</h5><p>Edit</p></div></div>
 +
                                                           
 +
                                                                <div id="Icon5" class="icon"><img src="https://static.igem.org/mediawiki/2017/4/4b/T--Heidelberg--2017_T--Heidelberg--2017_Icon_Protein_Interaction.svg" class="toolbox-icon" style="left: 270px;"><div class="icon-text-right"><h5>Protein Interaction</h5><p>Interact</p></div></div>
 +
                                                                </div>
 +
                                                           
 +
                                                            <div style="position: relative;t" id="toolbox-row3">
 +
                                                                  <div id="Icon3" class="icon"><img src="https://static.igem.org/mediawiki/2017/3/38/T--Heidelberg--2017_T--Heidelberg--2017_Icon_Opto_Genetics.svg" class="toolbox-icon" style="left: 0px;"><div class="icon-text" style="width: 200px;"><h5>Opto-Genetics</h5><p>Turn on</p></div></div>   
 +
                                                                  <div id="Icon6" class="icon"><img src="https://static.igem.org/mediawiki/2017/9/9c/T--Heidelberg--2017_T--Heidelberg--2017_Icon_Product_Specificity.svg" class="toolbox-icon" style="left: 250px;"><div class="icon-text-right"><h5>Protein Specificity</h5><p>Specify</p></div></div>
 +
                                                          </div> 
 +
                                                </div>
 +
                                            </div>
 +
                                    </div>     
 +
                                         
 +
 +
 +
 +
 
 +
                                            <section id="footer-sec">
 +
        <div class="t-container">
 +
            <div class="t-row" style="padding-top: 30px;">
 +
                <div class="t-col t-col_3">
 +
                    <h4>ABOUT US </h4>
 +
                    <p>"We are an extremely motivated team of young students competing in the worlds biggest synthetic biology competition"</p>
 +
 
 +
                </div>
 +
                <div class="t-col t-col_3">
 +
                    <h4> Useful <strong>Links</strong> </h4>
 +
 
 +
<li>
 +
<a href="#">
 +
<i class="fa fa-angle-right">
 +
</i>
 +
Special pages
 +
</a>
 +
</li>
 +
<li>
 +
<a href="#">
 +
<i class="fa fa-angle-right">
 +
</i>
 +
Main Page
 +
</a>
 +
</li>
 +
</div>
 +
                <div class="t-col t-col_3">
 +
                    <h4> Follow us on </h4>
 +
                    <a href="#" target="_blank"><i class="fa fa-facebook" id="facebook"></i></a> 
 +
                    <span style="color: grey">&</span>
 +
                    <a href="#" target="_blank"><i class="fa fa-twitter" id="twitter"></i></a>
 +
                </div>
 +
                <div class="t-col t-col_3">
 +
                    <h4> Contact us </h4>
 +
                    <li>
 +
<i class="fa fa-map-marker fa-lg">
 +
</i>
 +
Im Neuenheimer Feld 267
 +
<br>
 +
69120 Heidelberg
 +
</li>
 +
<li>
 +
<i class="fa fa-phone">
 +
</i>
 +
1 -234 -456 -7890
 +
</li>
 +
 
 +
<li>
 +
<a href="mailto:info@yourdomain.com">
 +
<i class="fa fa-envelope">
 +
</i>
 +
bioquant@uni-heidelberg.de
 +
</a>
 +
</li>
 +
                </div>
 +
            </div>
 +
        </div>
 +
    </section>
 +
    </div>
 +
    <script>
 +
 
 +
$('a[href^="#textblock1"]').on('click',function (e) {
 +
    e.preventDefault();
 +
 
 +
    var target = this.hash;
 +
    var $target = $(target);
 +
        var scroll = $target.offset().top-200;
 +
    $('html').stop().animate({
 +
        'scrollTop': scroll
 +
    }, 1000, 'swing')
 +
});
 +
</script>
 +
 
 +
 
 +
       
 +
 
 +
        </body></div></div>
 +
</html>

Revision as of 22:35, 25 October 2017

WikitemplateA home - 2014.igem.org

 

WikitemplateA home

From 2014.igem.org

This year´s iGEM Team Heidelberg aims at harnessing the enormous power of

Accelerated evolution

by using Phage-assisted continious evolution (PACE) and our newly created method called PREDCEL

Let us introduce you to the next generation of directed evolution...

Come discover the diversity of Nature

As finding the right startersequence is quite difficult we used

Artificial Intelligence

for protein classification & generation of entirely new functional sequences

Right at the beginning our major ambition was it utilize PACE for

Carbon-Silicon Bond Formation

which could ultimately affect a lot of different aspects of our life and life in general

In order to make PREDCEL work, we also had a lot to model


Therefore check out our

Interactive modeling

As we affect the world &
the world affects us, we need

Human Practice
Destructase Screening

Screen

Organo silicones

Produce

DNA Editing

Edit

Protein Interaction

Interact

Opto-Genetics

Turn on

Protein Specificity

Specify