Difference between revisions of "Team:TU Darmstadt"

Line 1: Line 1:
{{TU_Darmstadt}}
+
{{Team:TU_Darmstadt/Viki}}
 
<html>
 
<html>
 +
<head>
 +
<title>iGEM - Darmstadt</title>
 +
<meta charset="utf-8" />
 +
   
 +
<meta name="viewport" content="width=device-width, initial-scale=1" />
 +
<!--[if lte IE 8]><script src="assets/js/ie/html5shiv.js"></script><![endif]-->
 +
<link rel="stylesheet" href="x" />
 +
<!--[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]-->
  
<div class="column full_size" >
+
    <script>
<img src="https://static.igem.org/mediawiki/2016/thumb/0/01/Tud-team_foto_bw.jpeg/800px-Tud-team_foto_bw.jpeg">
+
$(document).ready(function(){ // Gaaaaaanz wichtig! Damit wird das Script erst nach vollständigem laden ausgeführt (guter stil und so ;))
 +
$(window).scroll(function(event){// Jetzt wirds interessant: Die .scroll function wird immer ausgeführt, wenn du durch die Seite scrollst
 +
var scrollY = $(window).scrollTop();  // .scrollTop() ließt die Scrolleite aus, aber ich glaube in Pixel. Fun Fact: Zoomen macht dem nix ^^
 +
if(scrollY > 213){ // Hier kannst du die Pixel einstellen, ab der umgeschaltet wird.
 +
$(".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".
 +
}else{ // hier wird das ganze wieder rückgängig gemacht.
 +
$(".navbar").css({"top": "40","position": "static"}); //Das Gleiche wie oben
 +
}
 +
})
 +
})
 +
    </script>
 +
<script>
 +
$(document).ready(function(){ // Gaaaaaanz wichtig! Damit wird das Script erst nach vollständigem laden ausgeführt (guter stil und so ;))
 +
$(window).scroll(function(event){// Jetzt wirds interessant: Die .scroll function wird immer ausgeführt, wenn du durch die Seite scrollst
 +
var scrollY = $(window).scrollTop();  // .scrollTop() ließt die Scrolleite aus, aber ich glaube in Pixel. Fun Fact: Zoomen macht dem nix ^^
 +
if(scrollY > 1251){ // Hier kannst du die Pixel einstellen, ab der umgeschaltet wird.
 +
$(".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".
 +
}else{ // hier wird das ganze wieder rückgängig gemacht.
 +
$(".rechts").css({"top": "0","position": "static"}); //Das Gleiche wie oben
 +
}
 +
})
 +
})
 +
</script>
 +
<!-- Dieses Funktion printet dir die Scrollweite aus-->
 +
<script>
 +
$(document).ready(function(){
 +
$(window).scroll(function(event){
 +
var scrollY = $(window).scrollTop(); 
 +
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; }
  
</div>
+
#slick-menu > li {
 +
  display: inline-block;
 +
  margin: 0 5px;
 +
  padding: 5px 0; }
  
<div class="column full_size" >
+
#slick-menu > li > a {
    <h2> iGEM TU Darmstadt 2016</h2>
+
  display: block;
</div>
+
  padding: 10px;
 +
  margin: 0;
 +
  color: #fff;
 +
  text-decoration: none;
 +
  font-family: calibri;
 +
}
  
<div class="column full_size" style="text-align:justify">
+
#slick-menu > li > a:hover, #slick-menu > li > a.current {
     <h3>Glow before you go (working title)</h3>
+
  font-weight: 600;
     <h4>Project description</h4>
+
  color: white; }
     <p>
+
 
        The critical evaluation of the project’s safety is required from each iGEM Team participating in the competition. Therefore the iGEM HQ created an entire subpage on their website where the teams can find all the necessary information, such as risk levels or general safety requirements. Unfortunately there is no chance to look up complete, working safety approaches from previous teams.
+
@media only screen and (max-width: 1250px) {
        <br>
+
  #slick-menu {
         <br>
+
    padding-top: 20px;
    </p>
+
    margin-bottom: 22px;
        <p style="margin-left:2em; margin-right:2em;">
+
    float: left;
        <i>
+
    text-align: left;
            It should be easy for teams to choose a well characterized safety approach which is suitable for their own project out of a catalog and directly see how to easily incorporate it. Our project is supposed to lead the way into that direction.  
+
     width: 100%; }
        </i>
+
 
        </p>
+
  #slick-menu {
     <p>
+
    padding-top: 0px; }
        <br>
+
}
        In our 2016 project we focus on easily enabling teams to work safely with <i>E.coli</i>. By integrating genetic circuits into the <i>E.coli</i> genome we ensure that genetically modified bacteria cannot survive outside of the required lab with the particular conditions they need. The genetic circuit is based on the availability of an unnatural amino acid (UAA) and is regulated within two steps:<br>
+
 
     </p>
+
@media only screen and (max-width: 1250px) {
        <ol>
+
  #slick-menu > li {
            <li>When the concentration of the unnatural amino acid is low a reporter protein is expressed which signalizes the low level of UAA.</li>
+
     width: 100%;
            <li>When the UAA concentration reaches zero (which is also the case if bacteria get out of the lab) the expression of colicin is induced which then kills the bacteria.</li><br>
+
     padding: 7px 0;
        </ol>
+
    margin: 0; } }
     <p>
+
 
        Additionally we hope to facilitate and accelerate the molecular cloning process of DNA through a new standard based on the RFC10 standard. We use riboswitches to show a successful ligation without additional testing procedures.<br>
+
.open-nav {
     </p>
+
  max-height: 100% !important; }
<br>
+
 
     <h3>Project brainstorming</h3>
+
.open-nav .mobile-toggle {
     <p>
+
  transform-origin: 25x 25px;
        Like every year we started our weekly team meetings in january and thought about possible projects. This year it took us a bit longer to find a project but around the end of march we were closing in on a safety project around colicin. By mid march we had our project overview and started dividing into several lab groups that focused on their individual pathways.
+
  -webkit-transform: rotate(180deg);
        By now the first cloning procedures have been succesful and we are looking forward to conduct first measurements.
+
  transform: rotate(180deg); }
    </p>
+
 
</div>  
+
.mobile-toggle {
 +
  display: none;
 +
  float: left;
 +
  cursor: pointer;
 +
  transition: all 200ms ease-in; }
 +
 
 +
@media only screen and (max-width: 1250px) {
 +
  .mobile-toggle {
 +
    display: block; } }
 +
 
 +
.mobile-toggle span {
 +
  width: 30px;
 +
  height: 4px;
 +
  margin-bottom: 6px;
 +
  border-radius: 1000px;
 +
  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>
 
      
 
      
 +
        <!-- 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>
 
</html>
 
</html>

Revision as of 18:39, 13 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.
iGEM - Darmstadt

This page is dedicated to the project
of iGEM Technische Universität Darmstadt 2016

Aliquam ut ex ut augue consectetur interdum. Donec amet imperdiet eleifend
fringilla tincidunt. Nullam dui leo Aenean mi ligula, rhoncus ullamcorper.

metabolic
Engineering

Work in the laboratory and achievements can be found here

Modeling

This page is dedicated to the project
of iGEM Technische Universität Darmstadt 2016

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.
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 O-methyl tyrosine.here

Human Practices

All our work with human beings can be found here

Thank you!

For your interest in our project
Sincerely, the team