Difference between revisions of "Team:TU Darmstadt"

 
(164 intermediate revisions by 3 users not shown)
Line 1: Line 1:
 +
{{Team:TU_Darmstadt/Viki}}
 
<html>
 
<html>
 
<head>
 
<head>
−
<title>iGEM - Darmstadt</title>
+
<style>
−
<meta charset="utf-8" />
+
−
<meta name="viewport" content="width=device-width, initial-scale=1" />
+
−
<!--[if lte IE 8]><script src="home/jonas/Documents/html/spectral/assets/js/ie/html5shiv.js"></script><![endif]-->
+
−
<!--[if lte IE 8]><link rel="stylesheet" href="assets/css/ie8.css" /><![endif]-->
+
−
<!--[if lte IE 9]><link rel="stylesheet" href="assets/css/ie9.css" /><![endif]-->
+
  
−
    <script>
+
  .startspalte{
−
$(document).ready(function(){ // Gaaaaaanz wichtig! Damit wird das Script erst nach vollständigem laden ausgeführt (guter stil und so ;))
+
    width:100%;
−
$(window).scroll(function(event){// Jetzt wirds interessant: Die .scroll function wird immer ausgeführt, wenn du durch die Seite scrollst
+
    float:none;
−
var scrollY = $(window).scrollTop(); // .scrollTop() ließt die Scrolleite aus, aber ich glaube in Pixel. Fun Fact: Zoomen macht dem nix ^^
+
    padding-top:42px;
−
if(scrollY > 213){ // Hier kannst du die Pixel einstellen, ab der umgeschaltet wird.
+
     padding-bottom:42px;
−
$(".navbar").css({"top": "0","position": "fixed"}); //Stellt im Element "nav" die Werte "top" und "position" um. Du kannst da auch noch was dranhängen, wenn du magst. Wichtig ist, dass du das Element "nav" durch ne class ersetzen kannst durch ".classname".
+
    padding-right:0;
−
}else{ // hier wird das ganze wieder rückgängig gemacht.
+
    padding-left:0;
−
$(".navbar").css({"top": "40","position": "static"}); //Das Gleiche wie oben
+
  }
−
}
+
  .startIMG {
−
})
+
    position: relative;
−
})
+
     width:42%;
−
     </script>
+
    padding:42px 42px;
−
<script>
+
   }
−
$(document).ready(function(){ // Gaaaaaanz wichtig! Damit wird das Script erst nach vollständigem laden ausgeführt (guter stil und so ;))
+
   .startText {
−
$(window).scroll(function(event){// Jetzt wirds interessant: Die .scroll function wird immer ausgeführt, wenn du durch die Seite scrollst
+
    text-align:center;
−
var scrollY = $(window).scrollTop(); // .scrollTop() ließt die Scrolleite aus, aber ich glaube in Pixel. Fun Fact: Zoomen macht dem nix ^^
+
    width:70%;
−
if(scrollY > 1251){ // Hier kannst du die Pixel einstellen, ab der umgeschaltet wird.
+
    font-size:70px;
−
$(".rechts").css({"top": "120","position": "fixed","right":"0"}); //Stellt im Element "nav" die Werte "top" und "position" um. Du kannst da auch noch was dranhängen, wenn du magst. Wichtig ist, dass du das Element "nav" durch ne class ersetzen kannst durch ".classname".
+
    padding-bottom:42px;
−
}else{ // hier wird das ganze wieder rückgängig gemacht.
+
    padding-top:42px;
−
$(".rechts").css({"top": "0","position": "static"}); //Das Gleiche wie oben
+
    color:white;
−
}
+
}
−
})
+
.startSubText {
−
})
+
    text-align:center;
−
</script>
+
    width:70%;
−
<!-- Dieses Funktion printet dir die Scrollweite aus-->
+
     font-size:42px;
−
<script>
+
     padding-bottom:42px;
−
$(document).ready(function(){  
+
     padding-top:20px;
−
$(window).scroll(function(event){
+
     color:white;
−
var scrollY = $(window).scrollTop(); 
+
     line-height:3rem;
−
if(scrollY > 05){
+
−
$(".show").text(scrollY) //Das Ding hier ändert den Text in .show zum Inhalt von scrollY
+
−
}
+
−
})
+
−
})
+
−
</script>
+
−
<script>
+
−
var amountScrolled = 820;
+
−
$(window).scroll(function(){
+
−
    if($(window).scrollTop() > amountScrolled){
+
−
    $('button.back_top').fadeIn('slow');
+
−
}
+
−
else{
+
−
    $('button.back_top').fadeOut('slow');
+
−
}
+
−
});
+
−
$('button.back_top').click(function(){
+
−
    $('html, body').animate({
+
−
    scrollTop:700
+
−
}, 1000);
+
−
});
+
−
</script>
+
−
      
+
−
</head>
+
−
<body class="landing">
+
−
    <style>
+
−
#slick-menu {
+
−
  width: 100%;
+
−
  list-style-type: none;
+
−
   overflow: hidden;
+
−
   text-align: center;
+
−
  margin: 0;
+
−
  padding: 0;
+
−
  background-color: #019ac8; }
+
−
 
+
−
#slick-menu > li {
+
−
  display: inline-block;
+
−
  margin: 0 5px;
+
−
  padding: 5px 0; }
+
−
 
+
−
#slick-menu > li > a {
+
−
  display: block;
+
−
  padding: 10px;
+
−
  margin: 0;
+
−
  color: #fff;
+
−
  text-decoration: none;
+
−
  font-family: calibri;
+
−
}
+
−
 
+
−
#slick-menu > li > a:hover, #slick-menu > li > a.current {
+
−
  font-weight: 600;
+
−
  color: white; }
+
−
 
+
−
@media only screen and (max-width: 1250px) {
+
−
  #slick-menu {
+
−
     padding-top: 20px;
+
−
     margin-bottom: 22px;
+
−
     float: left;
+
−
    text-align: left;
+
−
     width: 100%; }
+
−
 
+
−
  #slick-menu {
+
−
     padding-top: 0px; }
+
 
}
 
}
  
−
@media only screen and (max-width: 1250px) {
+
</style>
−
  #slick-menu > li {
+
</head>
−
    width: 100%;
+
<body>
−
    padding: 7px 0;
+
<div class="vviki" id="vviki">
−
    margin: 0; } }
+
</html>{{Team:TU_Darmstadt/MainMenu}}<html>
 +
<center><img style="width:100%" src="https://static.igem.org/mediawiki/2016/a/a0/T--TU_Darmstadt--startViki.png"/></center></div>
 +
<center><div style="background-color:#2a2a2f;width:100%;padding-top:70px;padding-bottom:120px;"><img src="https://static.igem.org/mediawiki/2016/2/2a/T--TU_Darmstadt--colSQ_20.10.png" style="width:42%;"/></div></center>
  
−
.open-nav {
 
−
  max-height: 100% !important; }
 
  
−
.open-nav .mobile-toggle {
+
<div class="startspalte" style="background-color:#333337;">
−
  transform-origin: 25x 25px;
+
<center><div class="startIMG"><img src="https://static.igem.org/mediawiki/2016/9/93/T--TU_Darmstadt--Killswitch.png" style="width:100%;"></div>
−
  -webkit-transform: rotate(180deg);
+
<div class="startText">WETLAB</div>
−
  transform: rotate(180deg); }
+
<div class="startSubText">our work at making synbio safer can be found <a href="https://2016.igem.org/Team:TU_Darmstadt/Lab">here</a></div></center>
 +
</div>
  
−
.mobile-toggle {
+
<div class="startspalte" style="background-color:#2a2a2f;">
−
  display: none;
+
<center><div class="startIMG"><img src="https://static.igem.org/mediawiki/2016/1/1e/T--TU_Darmstadt--ColE2.png" style="width:100%;"></div>
−
  float: left;
+
<div class="startText">Modeling</div><div class="startSubText">information about the molecular dynamics simulations of our proteins can be found <a href="https://2016.igem.org/Team:TU_Darmstadt/Model">here</a></div></center>
−
  cursor: pointer;
+
</div>
−
  transition: all 200ms ease-in; }
+
  
−
@media only screen and (max-width: 1250px) {
+
<div class="startspalte" style="background-color:#141419;">
−
  .mobile-toggle {
+
<center><div class="startIMG"><img src="https://static.igem.org/mediawiki/2016/c/c6/T--TU_Darmstadt--printer_landing.png" style="width:100%;"></div>
−
    display: block; } }
+
<div class="startText">Robotics</div><div class="startSubText">information about our robot can be found <a href="https://2016.igem.org/Team:TU_Darmstadt/Hardware">here</a></div></center>
 +
</div>
  
−
.mobile-toggle span {
+
<div class="startspalte" style="background-color:#2a2a2f;">
−
  width: 30px;
+
<center>
−
  height: 4px;
+
<div class="startText">Human Practices</div><div class="startSubText">all our work involving human beings can be found <a href="https://2016.igem.org/Team:TU_Darmstadt/Human_Practices">here</a></div></center>
−
  margin-bottom: 6px;
+
</div>
−
  border-radius: 1000px;
+
</html>{{Team:TU_Darmstadt/Footer}}<html>
−
  background: #c8c8c8;
+
−
  display: block; }
+
−
 
+
−
.navbar {
+
−
  max-height: 50px;
+
−
  overflow: hidden;
+
−
  background-color: #019ac8;
+
−
  -webkit-transition: all 0.3s ease-in;
+
−
  -moz-transition: all 0.3s ease-in;
+
−
  -ms-transition: all 0.3s ease-in;
+
−
  -o-transition: all 0.3s ease-in;
+
−
  transition: all 0.3s ease-in;
+
−
}
+
−
 
+
−
.mobile-toggle img {
+
−
  height: 20px;
+
−
  margin: 15px
+
−
}
+
−
 
+
−
.top-fixed {
+
−
  position: fixed;
+
−
  top: 10px;
+
−
}
+
−
</style>
+
−
    <div id="page-wrapper">
+
−
        <!-- header -->
+
−
      <div class="navbar">
+
−
  <div class="mobile-toggle">
+
−
      <img src="https://static.igem.org/mediawiki/2016/c/c9/T--TU_Darmstadt--zahnrad.png" alt="menu" id="menu-zahnrad">
+
−
  </div>
+
−
  <ul id="slick-menu">
+
−
    <li><a href="https://2016.igem.org/Team:TU_Darmstadt/Achievements">Achievements</a></li>
+
−
    <li><a href="https://2016.igem.org/Team:TU_Darmstadt/Lab" class="current">In the Lab</a></li>
+
−
    <li><a href="https://2016.igem.org/Team:TU_Darmstadt/Parts">Parts</a></li>
+
−
    <li><a href="#">Results</a></li>            
+
−
    <li><a href="https://2016.igem.org/Team:TU_Darmstadt/Hardware">Robotics</a></li>
+
−
    <li><a href="https://2016.igem.org/Team:TU_Darmstadt/Model">Modeling</a></li>
+
−
    <li><a href="https://2016.igem.org/Team:TU_Darmstadt/Human_Practices">Human Practices</a></li>
+
−
    <li><a href="https://2016.igem.org/Team:TU_Darmstadt/Collaborations">Collaborations</a></li>
+
−
    <li><a href="https://2016.igem.org/Team:TU_Darmstadt/Notebook">Notebook</a></li>
+
−
    <li><a href="https://2016.igem.org/Team:TU_Darmstadt/Team">Team</a></li>
+
−
  </ul>
+
 
</div>
 
</div>
−
   
 
−
        <!-- Banner -->
 
−
        <section id="banner" style="">
 
−
            <div class="inner">
 
−
<h2 style="color: #FFF; text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;">Colicide Squad</h2>
 
−
<p style="color: #FFF; font-weight: bold; text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;">Glow<br />
 
−
  before you<br />
 
−
    go.</p>
 
−
            </div>
 
−
<a href="#one" class="more scrolly">learn more</a>
 
−
        </section>
 
−
  <!-- One -->
 
−
<section id="one" class="wrapper style1 special">
 
−
            <div class="inner">
 
−
                <header class="major">
 
−
                    <h2>This page is dedicated to the project<br />
 
−
                        of iGEM Technische Universität Darmstadt 2016</h2>
 
−
<p>Aliquam ut ex ut augue consectetur interdum. Donec amet imperdiet eleifend<br />
 
−
fringilla tincidunt. Nullam dui leo Aenean mi ligula, rhoncus ullamcorper.</p>
 
−
</header>
 
−
            </div>
 
−
        </section>             
 
−
           
 
−
   
 
−
        <!-- Two -->
 
−
<section id="two" class="wrapper alt style2">
 
−
    <section class="spotlight">
 
−
                <div class="image"><img src="images/Laboratory.png" alt="" /></div><div class="content">
 
−
    <h2>metabolic<br />
 
−
Engineering</h2>
 
−
                    <p>Work in the laboratory and achievements can be found <a href="http://google.com">here</a></p>
 
−
</div>
 
−
            </section>
 
−
            <section class="spotlight">
 
−
                <div class="image"><img src="images/lambdaCapsid.jpg" alt="" /></div><div class="content">
 
−
    <h2>Modeling</h2>
 
−
                    <h2>
 
−
                        <p>This page is dedicated to the project<br />
 
−
                        of iGEM Technische Universität Darmstadt 2016</h2>
 
−
<p>Bonding between Colicin E2 and its immunity protein depends highly on structural properties. Changing the amino acid sequence of Colicin E2's immunity protein can therefore take strong influence in it's effecitveness.<br/>
 
−
Hence we tried to approximate the influence of our noncanonical amino acid in the immunity protein. We achieved this by applying molecular dynamics simualtions to explore relevant configurations and free energie calcualtions to compare the bonding properties of our mutation variants. We also developed an extended CHARMm force field for our noncanonical amino acid <i>O</i>-methyl tyrosine.<a href="http://google.com">here</a></p>
 
−
                </div>
 
−
            </section>
 
−
            <section class="spotlight">
 
−
                <div class="image"><img src="images/maxresdefault.jpg" alt="" /></div><div class="content">
 
−
                    <h2>Human Practices</h2>
 
−
                    <p>All our work with human beings can be found <a href="http://google.com">here</a></p>
 
−
                </div>
 
−
            </section>
 
−
</section>
 
−
           
 
−
        <!-- CTA -->
 
−
<section id="cta" class="wrapper style4">
 
−
<div class="inner">
 
−
<header>
 
−
<h2>Thank you!</h2>
 
−
<p>For your interest in our project<br />
 
−
                                Sincerely, the team
 
−
                                </p>
 
−
</header>
 
−
<ul class="actions vertical">
 
−
<li><a href="#" class="button fit">Sponsors</a></li>
 
−
<li><a href="#" class="button fit">Impressum</a></li>
 
−
</ul>
 
−
</div>
 
−
</section>
 
−
 
−
 
−
          <!-- Footer -->
 
−
  <footer id="footer">
 
−
  <ul class="icons">
 
−
<li><a href="https://twitter.com/igem_darmstadt" class="icon fa-twitter"><span class="label">Twitter</span></a></li>
 
−
<li><a href="https://de-de.facebook.com/IGEM-TU-Darmstadt-656627597701598/info?tab=page_info" class="icon fa-facebook"><span class="label">Facebook</span></a></li>
 
−
<li><a href="mailto:igem@bio.tu-darmstadt.de" class="icon fa-envelope-o"><span class="label">Email</span></a></li>
 
−
  </ul>
 
−
  <ul class="copyright">
 
−
<li>&copy; iGEM Technische Universität Darmstadt</li><li>Design: <a href="http://html5up.net">HTML5 UP</a></li>
 
−
  </ul>
 
−
  </footer>
 
−
 
−
 
−
       
 
−
        <!-- Scripts -->
 
−
<script src="assets/js/jquery.min.js"></script>
 
−
            <script src="assets/js/jquery.scrollex.min.js"></script>
 
−
            <script src="assets/js/jquery.scrolly.min.js"></script>
 
−
<script src="assets/js/skel.min.js"></script>
 
−
<script src="assets/js/util.js"></script>
 
−
<!--[if lte IE 8]><script src="assets/js/ie/respond.min.js"></script><![endif]-->
 
−
<script src="assets/js/main.js"></script>
 
−
 
 
</body>
 
</body>
 
</html>
 
</html>

Latest revision as of 23:15, 19 October 2016

If you can see this message, you do not use Javascript. This Website is best to use with Javascript enabled. Without Javascript enabled, many features including the mobile version are not usable.
menu
WETLAB
our work at making synbio safer can be found here
Modeling
information about the molecular dynamics simulations of our proteins can be found here
Robotics
information about our robot can be found here
Human Practices
all our work involving human beings can be found here