Difference between revisions of "Team:Munich/Testflow"

Line 1: Line 1:
 +
<!-- #919191 Grau1 -->
 +
<!-- #787878 Grau2 -->
 +
<!-- #51A7f9 Blau1 -->
 +
<!-- #3c7cb9 Blau2 -->
 +
<!-- #ffffff weiss -->
 
<html>
 
<html>
 
<head>
 
<head>
 +
<style>
 +
#home_logo, #sideMenu { display:none; }
 +
    #sideMenu, #top_title, .patrollink  {display:none;}
 +
    #content { width:100%; padding:0px;  margin-top:-7px; margin-left:0px;}
 +
    body {background-color:white; }
 +
    #bodyContent h1, #bodyContent h2, #bodyContent h3, #bodyContent h4, #bodyContent h5 { margin-bottom: 0px; }
  
 +
#HQ_page td not(#myContent){
 +
padding: 0 !important;
 +
}
  
−
<script src = "https://2017.igem.org/Template:Munich/Javascript?action=raw&ctype=text/javascript"></script>
+
#HQ_page td{
−
  <link rel="stylesheet" type="text/css" href="https://2017.igem.org/Template:Munich/CSS?action=raw&ctype=text/css">
+
border-style: none !important;
 +
vertical-align: middle !important;
 +
}
  
−
<style type="text/css">
 
  
−
/*
 
  
−
TODO:  
+
#HQ_page table{
 +
border-style: none !important;
 +
margin: 0 !important;
 +
}
  
−
1. Write text for each member.
 
  
−
2. Get picture for each member.
 
  
−
3. Get picture of three Dots. <- Super important.
+
html, body
 +
{
 +
margin: 0;
 +
padding: 0;
 +
font-family: "Helvetica", Arial, Serif;
 +
}
 +
.dropdown {
 +
    width: 137px;
 +
    margin: auto;
 +
    position: relative;
 +
    display: inline-block;
 +
}
  
−
4. Get proper team picture.
 
  
−
*/
 
  
−
 
+
.dropbtnCascAid {
−
p{
+
    background-image: url("https://static.igem.org/mediawiki/2017/b/ba/T--Munich--wiki_image_menu_cascaid_low.gif");
−
  font-size: 1em !important;
+
    position: relative;
−
  font-family: Helvetica, Arial, sans-serif !important;
+
    padding: 0px;
−
  color: rgb(147,149,152);
+
    border: none;
 +
    cursor: pointer;
 +
    width: 137px;
 +
    height: 32px;
 
}
 
}
−
 
+
.dropdown:hover .dropbtnCascAid {
−
.content > .header{
+
    background-image: url("https://static.igem.org/mediawiki/2017/1/1f/T--Munich--wiki_image_menu_cascaid_high.gif");
−
  font-size: 1.25em !important;
+
 
}
 
}
  
−
 
  
−
#home_logo, #sideMenu { display:none; }
 
−
    #sideMenu, #top_title, .patrollink  {display:none;}
 
−
    #content { width:100%; padding:0px;  margin-top:-7px; margin-left:0px;}
 
−
    body {background-color:white; }
 
−
    #bodyContent h1, #bodyContent h2, #bodyContent h3, #bodyContent h4, #bodyContent h5 { margin-bottom: 0px; }
 
  
 +
.dropbtnProject {
 +
    background-image: url("https://static.igem.org/mediawiki/2017/b/ba/T--Munich--wiki_image_menu_project_low.gif");
 +
    position: relative;
 +
    padding: 0px;
 +
    border: none;
 +
    cursor: pointer;
 +
    width: 137px;
 +
    height: 32px;
 +
}
 +
.dropdown:hover .dropbtnProject {
 +
    background-image: url("https://static.igem.org/mediawiki/2017/5/5d/T--Munich--wiki_image_menu_project_high.gif");
 +
}
  
−
    .footer{
 
−
      background-color: rgb(0,144,239);
 
−
      height: 100px;
 
−
      color: rgb(255,255,255);
 
−
        display: flex;
 
−
        align-items: center;
 
−
        justify-content: center;
 
−
        flex-direction: row;
 
−
    }
 
  
−
body{
+
 
−
  color: rgb(147,149,152);
+
.dropbtnWetlab {
 +
    background-image: url("https://static.igem.org/mediawiki/2017/9/9d/T--Munich--wiki_image_menu_wetlab_low.gif");
 +
    position: relative;
 +
    padding: 0px;
 +
    border: none;
 +
    cursor: pointer;
 +
    width: 137px;
 +
    height: 32px;
 +
}
 +
.dropdown:hover .dropbtnWetlab {
 +
    background-image: url("https://static.igem.org/mediawiki/2017/e/e1/T--Munich--wiki_image_menu_wetlab_high.gif");
 
}
 
}
  
−
.mydescription{
+
 
−
  height: 8em;  /* Change height to be responsive */
+
 
−
  overflow: hidden;
+
.dropbtnSoftHardware {
−
  /*-webkit-mask-image: -webkit-gradient(linear, left top, left bottom,
+
    background-image: url("https://static.igem.org/mediawiki/2017/b/bb/T--Munich--wiki_image_menu_softhardware_low.gif");
−
     from(rgba(0,0,0,1)), to(rgba(0,0,0,0))); /*This probably won't work on IE, so the text won't have a gradient.*/
+
     position: relative;
 +
    padding: 0px;
 +
    border: none;
 
     cursor: pointer;
 
     cursor: pointer;
−
     cursor: hand; /*IE callst it differently. */
+
     width: 137px;
 +
    height: 32px;
 +
}
 +
.dropdown:hover .dropbtnSoftHardware {
 +
    background-image: url("https://static.igem.org/mediawiki/2017/1/18/T--Munich--wiki_image_menu_softhardware_high.gif");
 +
}
 +
 
 +
 
 +
 
 +
.dropbtnModel {
 +
    background-image: url("https://static.igem.org/mediawiki/2017/7/7b/T--Munich--wiki_image_menu_model_low.gif");
 
     position: relative;
 
     position: relative;
 +
    padding: 0px;
 +
    border: none;
 +
    cursor: pointer;
 +
    width: 137px;
 +
    height: 32px;
 +
}
 +
.dropdown:hover .dropbtnModel {
 +
    background-image: url("https://static.igem.org/mediawiki/2017/3/3d/T--Munich--wiki_image_menu_model_high.gif");
 
}
 
}
  
−
.header{
 
−
  margin: 0 !important;
 
  
−
 
+
 
 +
.dropbtnHP {
 +
    background-image: url("https://static.igem.org/mediawiki/2017/7/78/T--Munich--wiki_image_menu_hp_low.gif");
 +
    position: relative;
 +
    padding: 0px;
 +
    border: none;
 +
    cursor: pointer;
 +
    width: 137px;
 +
    height: 32px;
 +
}
 +
.dropdown:hover .dropbtnHP {
 +
    background-image: url("https://static.igem.org/mediawiki/2017/d/df/T--Munich--wiki_image_menu_hp_high.gif");
 
}
 
}
−
#navigation-bar{
 
−
     
 
−
      background-color: white;
 
−
      z-index: 50;
 
−
    }
 
  
−
    #navigation-bar > *{
 
−
      color: rgb(147,149,152);
 
−
      font-family: Helvetica, Arial, sans-serif;
 
−
    }
 
  
−
.threeDots-container >img{
 
−
  height: auto;
 
−
  width: 50px;
 
−
  position: relative;
 
−
  left: -50%;
 
−
  top: -80%;
 
  
 +
.dropbtnTeam {
 +
    background-image: url("https://static.igem.org/mediawiki/2017/f/fd/T--Munich--wiki_image_menu_team_low.gif");
 +
    position: relative;
 +
    padding: 0px;
 +
    border: none;
 +
    cursor: pointer;
 +
    width: 137px;
 +
    height: 32px;
 +
}
 +
.dropdown:hover .dropbtnTeam {
 +
    background-image: url("https://static.igem.org/mediawiki/2017/5/57/T--Munich--wiki_image_menu_team_high.gif");
 
}
 
}
  
−
.threeDots-container{
 
−
  position: absolute;
 
−
  left: 50%;
 
−
  top: 80%;
 
−
 
 
−
} /*The container is there to make sure the threeDots picture is centered and on to bottom of the container (mydescription). No idea how or why this works. */
 
  
−
.mydescription >p{
+
 
−
  background: -webkit-linear-gradient(rgb(0,0,0),rgb(230,230,230) 50%, rgb(255,255,255));
+
.dropdown-contentDescription {
−
  -webkit-background-clip: text;
+
    background-image: url("wiki_image_menu_description_low.gif");
−
  -webkit-text-fill-color: transparent;
+
    display: none;
−
  /*color: rgb(147,149,152);*/
+
    position: absolute;
 +
    height: 32px;
 +
    width: 137px;
 +
    z-index: 1;
 +
}
 +
.dropdown:hover .dropdown-contentDescription {
 +
    background-image: url("wiki_image_menu_description_high.gif");
 +
    height: 32px;
 +
    width: 137px;
 +
    display: block;
 +
}
 +
.dropdown-contentDescription a {
 +
    background-image: url("wiki_image_menu_description_low.gif");
 +
    height: 32px;
 +
    width: 137px;
 +
    padding: 0px 0px;
 +
    text-decoration: none;
 +
    display: block;
 +
}
 +
.dropdown-contentDescription a:hover {
 +
    background-image: url("wiki_image_menu_description_high.gif");
 +
    height: 32px;
 +
    width: 137px;
 
}
 
}
  
−
.image > img{
+
 
−
  height: 200px !important;
+
 
 +
.dropdown-contentDesign {
 +
    background-image: url("wiki_image_menu_design_low.gif");
 +
    display: none;
 +
    position: absolute;
 +
    top: 64;
 +
    height: 32px;
 +
    width: 137px;
 +
    z-index: 1;
 +
}
 +
.dropdown:hover .dropdown-contentDesign {
 +
    background-image: url("wiki_image_menu_design_high.gif");
 +
    height: 32px;
 +
    width: 137px;
 +
    display: block;
 +
}
 +
.dropdown-contentDesign a {
 +
    background-image: url("wiki_image_menu_design_low.gif");
 +
    height: 32px;
 +
    width: 137px;
 +
    padding: 0px 0px;
 +
    text-decoration: none;
 +
    display: block;
 +
}
 +
.dropdown-contentDesign a:hover {
 +
    background-image: url("wiki_image_menu_design_high.gif");
 +
    height: 32px;
 +
    width: 137px;
 
}
 
}
  
−
.cards{
 
−
 
 
−
 
 
−
  align-items: flex-start;
 
−
  width: 70%;
 
−
  margin: auto !important;
 
−
 
 
−
 
 
  
 +
 +
.dropdown-contentProofofConcept {
 +
    background-image: url("wiki_image_menu_proofofconcept_low.gif");
 +
    display: none;
 +
    position: absolute;
 +
    top: 96;
 +
    height: 32px;
 +
    width: 137px;
 +
    z-index: 1;
 
}
 
}
 +
.dropdown:hover .dropdown-contentProofofConcept {
 +
    background-image: url("wiki_image_menu_proofofconcept_high.gif");
 +
    height: 32px;
 +
    width: 137px;
 +
    display: block;
 +
}
 +
.dropdown-contentProofofConcept a {
 +
    background-image: url("wiki_image_menu_proofofconcept_low.gif");
 +
    height: 32px;
 +
    width: 137px;
 +
    padding: 0px 0px;
 +
    text-decoration: none;
 +
    display: block;
 +
}
 +
.dropdown-contentProofofConcept a:hover {
 +
    background-image: url("wiki_image_menu_proofofconcept_high.gif");
 +
    height: 32px;
 +
    width: 137px;
 +
}
 +
 +
  
−
.sectionContainer{
+
.dropdown-contentDemonstration {
−
  width: 75%;
+
    background-image: url("wiki_image_menu_demonstration_low.gif");
−
  margin: auto;
+
    display: none;
−
 
+
    position: absolute;
 +
    top: 128;
 +
    height: 32px;
 +
    width: 137px;
 +
    z-index: 1;
 
}
 
}
 +
.dropdown:hover .dropdown-contentDemonstration {
 +
    background-image: url("wiki_image_menu_demonstration_high.gif");
 +
    height: 32px;
 +
    width: 137px;
 +
    display: block;
 +
}
 +
.dropdown-contentDemonstration a {
 +
    background-image: url("wiki_image_menu_demonstration_low.gif");
 +
    height: 32px;
 +
    width: 137px;
 +
    padding: 0px 0px;
 +
    text-decoration: none;
 +
    display: block;
 +
}
 +
.dropdown-contentDemonstration a:hover {
 +
    background-image: url("wiki_image_menu_demonstration_high.gif");
 +
    height: 32px;
 +
    width: 137px;
 +
}
 +
 +
  
−
h2{
+
.dropdown-contentApplication {
−
 
+
    background-image: url("wiki_image_menu_application_low.gif");
 +
    display: none;
 +
    position: absolute;
 +
    top: 160;
 +
    height: 32px;
 +
    width: 137px;
 +
    z-index: 1;
 +
}
 +
.dropdown:hover .dropdown-contentApplication {
 +
    background-image: url("wiki_image_menu_application_high.gif");
 +
    height: 32px;
 +
    width: 137px;
 +
    display: block;
 +
}
 +
.dropdown-contentApplication a {
 +
    background-image: url("wiki_image_menu_application_low.gif");
 +
    height: 32px;
 +
    width: 137px;
 +
    padding: 0px 0px;
 +
    text-decoration: none;
 +
    display: block;
 +
}
 +
.dropdown-contentApplication a:hover {
 +
    background-image: url("wiki_image_menu_application_high.gif");
 +
    height: 32px;
 +
    width: 137px;
 
}
 
}
  
−
.card-active p {
 
−
  background: -webkit-linear-gradient(rgb(0,0,0),rgb(0,0,0));
 
−
  -webkit-background-clip: text;
 
  
 +
 +
.dropdown-contentFinalResults {
 +
    background-image: url("wiki_image_menu_finalresults_low.gif");
 +
    display: none;
 +
    position: absolute;
 +
    top: 192;
 +
    height: 32px;
 +
    width: 137px;
 +
    z-index: 1;
 +
}
 +
.dropdown:hover .dropdown-contentFinalResults {
 +
    background-image: url("wiki_image_menu_finalresults_high.gif");
 +
    height: 32px;
 +
    width: 137px;
 +
    display: block;
 +
}
 +
.dropdown-contentFinalResults a {
 +
    background-image: url("wiki_image_menu_finalresults_low.gif");
 +
    height: 32px;
 +
    width: 137px;
 +
    padding: 0px 0px;
 +
    text-decoration: none;
 +
    display: block;
 +
}
 +
.dropdown-contentFinalResults a:hover {
 +
    background-image: url("wiki_image_menu_finalresults_high.gif");
 +
    height: 32px;
 +
    width: 137px;
 
}
 
}
  
−
.card-active img {
 
−
  opacity: 0;
 
  
 +
 +
.dropdown-contentEntrepreneurship {
 +
    background-image: url("wiki_image_menu_entrepreneurship_low.gif");
 +
    display: none;
 +
    position: absolute;
 +
    top: 224;
 +
    height: 32px;
 +
    width: 137px;
 +
    z-index: 1;
 +
}
 +
.dropdown:hover .dropdown-contentEntrepreneurship {
 +
    background-image: url("wiki_image_menu_entrepreneurship_high.gif");
 +
    height: 32px;
 +
    width: 137px;
 +
    display: block;
 +
}
 +
.dropdown-contentEntrepreneurship a {
 +
    background-image: url("wiki_image_menu_entrepreneurship_low.gif");
 +
    height: 32px;
 +
    width: 137px;
 +
    padding: 0px 0px;
 +
    text-decoration: none;
 +
    display: block;
 +
}
 +
.dropdown-contentEntrepreneurship a:hover {
 +
    background-image: url("wiki_image_menu_entrepreneurship_high.gif");
 +
    height: 32px;
 +
    width: 137px;
 
}
 
}
  
−
.card{
+
 
−
  max-
+
 
 +
.dropdown-contentAchievements {
 +
    background-image: url("wiki_image_menu_achievements_low.gif");
 +
    display: none;
 +
    position: absolute;
 +
    top: 256;
 +
    height: 32px;
 +
    width: 137px;
 +
    z-index: 1;
 +
}
 +
.dropdown:hover .dropdown-contentAchievements {
 +
    background-image: url("wiki_image_menu_achievements_high.gif");
 +
    height: 32px;
 +
    width: 137px;
 +
    display: block;
 +
}
 +
.dropdown-contentAchievements a {
 +
    background-image: url("wiki_image_menu_achievements_low.gif");
 +
    height: 32px;
 +
    width: 137px;
 +
    padding: 0px 0px;
 +
    text-decoration: none;
 +
    display: block;
 +
}
 +
.dropdown-contentAchievements a:hover {
 +
    background-image: url("wiki_image_menu_achievements_high.gif");
 +
    height: 32px;
 +
    width: 137px;
 
}
 
}
  
−
.card-inactive{
+
 
−
  height: initial !important;
+
 
−
 
+
.dropdown-contentProtocolsMethods {
 +
    background-image: url("wiki_image_menu_protocolsmethods_low.gif");
 +
    display: none;
 +
    position: absolute;
 +
    top: 32;
 +
    height: 32px;
 +
    width: 137px;
 +
    z-index: 1;
 +
}
 +
.dropdown:hover .dropdown-contentProtocolsMethods {
 +
    background-image: url("wiki_image_menu_protocolsmethods_high.gif");
 +
    height: 32px;
 +
    width: 137px;
 +
    display: block;
 +
}
 +
.dropdown-contentProtocolsMethods a {
 +
    background-image: url("wiki_image_menu_protocolsmethods_low.gif");
 +
    height: 32px;
 +
    width: 137px;
 +
    padding: 0px 0px;
 +
    text-decoration: none;
 +
    display: block;
 +
}
 +
.dropdown-contentProtocolsMethods a:hover {
 +
    background-image: url("wiki_image_menu_protocolsmethods_high.gif");
 +
    height: 32px;
 +
    width: 137px;
 
}
 
}
  
−
.icons{
+
 
−
  color: rgb(147,149,152);
+
 
 +
.dropdown-contentMaterials {
 +
    background-image: url("wiki_image_menu_materials_low.gif");
 +
    display: none;
 +
    position: absolute;
 +
    top: 64;
 +
    height: 32px;
 +
    width: 137px;
 +
    z-index: 1;
 +
}
 +
.dropdown:hover .dropdown-contentMaterials {
 +
    background-image: url("wiki_image_menu_materials_high.gif");
 +
    height: 32px;
 +
    width: 137px;
 +
    display: block;
 +
}
 +
.dropdown-contentMaterials a {
 +
    background-image: url("wiki_image_menu_materials_low.gif");
 +
    height: 32px;
 +
    width: 137px;
 +
    padding: 0px 0px;
 +
    text-decoration: none;
 +
    display: block;
 +
}
 +
.dropdown-contentMaterials a:hover {
 +
    background-image: url("wiki_image_menu_materials_high.gif");
 +
    height: 32px;
 +
    width: 137px;
 
}
 
}
  
−
.container2{
+
 
−
  align-items: flex-start; /*This tells the cards element (which is just a flexbox) that it sould not try to fit its elements in the whole cross axis, but only align them at the top. Without it, every card stretches when one is stretched */
+
 
 +
.dropdown-contentLabJournal {
 +
    background-image: url("wiki_image_menu_labjournal_low.gif");
 +
    display: none;
 +
    position: absolute;
 +
    top: 96;
 +
    height: 32px;
 +
    width: 137px;
 +
    z-index: 1;
 +
}
 +
.dropdown:hover .dropdown-contentLabJournal {
 +
    background-image: url("wiki_image_menu_labjournal_high.gif");
 +
    height: 32px;
 +
    width: 137px;
 +
    display: block;
 +
}
 +
.dropdown-contentLabJournal a {
 +
    background-image: url("wiki_image_menu_labjournal_low.gif");
 +
    height: 32px;
 +
    width: 137px;
 +
    padding: 0px 0px;
 +
    text-decoration: none;
 +
    display: block;
 +
}
 +
.dropdown-contentLabJournal a:hover {
 +
    background-image: url("wiki_image_menu_labjournal_high.gif");
 +
    height: 32px;
 +
    width: 137px;
 
}
 
}
  
−
#navigation-bar{
 
−
     
 
−
      background-color: white;
 
−
      z-index: 50;
 
−
    }
 
  
−
    #navigation-bar > *{
 
−
      color: rgb(147,149,152);
 
−
      font-family: Helvetica, Arial, sans-serif;
 
−
    }
 
  
−
    section{
+
.dropdown-contentSafety {
−
      margin-top: 10%;
+
    background-image: url("wiki_image_menu_safety_low.gif");
−
     }
+
    display: none;
 +
    position: absolute;
 +
    top: 128;
 +
     height: 32px;
 +
    width: 137px;
 +
    z-index: 1;
 +
}
 +
.dropdown:hover .dropdown-contentSafety {
 +
    background-image: url("wiki_image_menu_safety_high.gif");
 +
    height: 32px;
 +
    width: 137px;
 +
    display: block;
 +
}
 +
.dropdown-contentSafety a {
 +
    background-image: url("wiki_image_menu_safety_low.gif");
 +
    height: 32px;
 +
    width: 137px;
 +
    padding: 0px 0px;
 +
    text-decoration: none;
 +
    display: block;
 +
}
 +
.dropdown-contentSafety a:hover {
 +
    background-image: url("wiki_image_menu_safety_high.gif");
 +
    height: 32px;
 +
    width: 137px;
 +
}
 +
 
  
  
−
#intro{
+
.dropdown-contentParts {
−
     text-align: center;
+
     background-image: url("wiki_image_menu_parts_low.gif");
 +
    display: none;
 +
    position: absolute;
 +
    top: 160;
 +
    height: 32px;
 +
    width: 137px;
 +
    z-index: 1;
 
}
 
}
 +
.dropdown:hover .dropdown-contentParts {
 +
    background-image: url("wiki_image_menu_parts_high.gif");
 +
    height: 32px;
 +
    width: 137px;
 +
    display: block;
 +
}
 +
.dropdown-contentParts a {
 +
    background-image: url("wiki_image_menu_parts_low.gif");
 +
    height: 32px;
 +
    width: 137px;
 +
    padding: 0px 0px;
 +
    text-decoration: none;
 +
    display: block;
 +
}
 +
.dropdown-contentParts a:hover {
 +
    background-image: url("wiki_image_menu_parts_high.gif");
 +
    height: 32px;
 +
    width: 137px;
 +
}
 +
 +
  
−
#intro > img{
+
.dropdown-contentInterlab {
−
  width: 60%;
+
    background-image: url("wiki_image_menu_interlab_low.gif");
−
  height: auto ;/*I wonder why !important is needed...*/
+
    display: none;
 +
    position: absolute;
 +
    top: 192;
 +
    height: 32px;
 +
    width: 137px;
 +
    z-index: 1;
 
}
 
}
 +
.dropdown:hover .dropdown-contentInterlab {
 +
    background-image: url("wiki_image_menu_interlab_high.gif");
 +
    height: 32px;
 +
    width: 137px;
 +
    display: block;
 +
}
 +
.dropdown-contentInterlab a {
 +
    background-image: url("wiki_image_menu_interlab_low.gif");
 +
    height: 32px;
 +
    width: 137px;
 +
    padding: 0px 0px;
 +
    text-decoration: none;
 +
    display: block;
 +
}
 +
.dropdown-contentInterlab a:hover {
 +
    background-image: url("wiki_image_menu_interlab_high.gif");
 +
    height: 32px;
 +
    width: 137px;
 +
}
 +
 +
  
−
#intro-text{
+
.dropdown-contentSoftware {
−
  margin: auto;
+
    background-image: url("wiki_image_menu_software_low.gif");
−
  width: 75%;
+
    display: none;
−
  margin-top: 20px;
+
    position: absolute;
 +
    top: 32;
 +
    height: 32px;
 +
    width: 137px;
 +
    z-index: 1;
 +
}
 +
.dropdown:hover .dropdown-contentSoftware {
 +
    background-image: url("wiki_image_menu_software_high.gif");
 +
    height: 32px;
 +
    width: 137px;
 +
    display: block;
 +
}
 +
.dropdown-contentSoftware a {
 +
    background-image: url("wiki_image_menu_software_low.gif");
 +
    height: 32px;
 +
    width: 137px;
 +
    padding: 0px 0px;
 +
    text-decoration: none;
 +
    display: block;
 +
}
 +
.dropdown-contentSoftware a:hover {
 +
    background-image: url("wiki_image_menu_software_high.gif");
 +
    height: 32px;
 +
    width: 137px;
 
}
 
}
  
  
−
.cascaid{
+
 
−
  height:auto;
+
.dropdown-contentHardware {
−
  width: 150px;
+
    background-image: url("wiki_image_menu_hardware_low.gif");
 +
    display: none;
 +
    position: absolute;
 +
    top: 64;
 +
    height: 32px;
 +
    width: 137px;
 +
    z-index: 1;
 +
}
 +
.dropdown:hover .dropdown-contentHardware {
 +
    background-image: url("wiki_image_menu_hardware_high.gif");
 +
    height: 32px;
 +
    width: 137px;
 +
    display: block;
 +
}
 +
.dropdown-contentHardware a {
 +
    background-image: url("wiki_image_menu_hardware_low.gif");
 +
    height: 32px;
 +
    width: 137px;
 +
    padding: 0px 0px;
 +
    text-decoration: none;
 +
    display: block;
 +
}
 +
.dropdown-contentHardware a:hover {
 +
    background-image: url("wiki_image_menu_hardware_high.gif");
 +
    height: 32px;
 +
    width: 137px;
 
}
 
}
  
  
−
h1{
 
−
  color: rgb(147,149,152);
 
−
  font-family: Helvetica, Arial, sans-serif;
 
−
  font-size: 1em;
 
−
  text-align: justify !important;
 
  
 +
.dropdown-contentHPSilver {
 +
    background-image: url("wiki_image_menu_hpsilver_low.gif");
 +
    display: none;
 +
    position: absolute;
 +
    top: 32;
 +
    height: 32px;
 +
    width: 137px;
 +
    z-index: 1;
 +
}
 +
.dropdown:hover .dropdown-contentHPSilver {
 +
    background-image: url("wiki_image_menu_hpsilver_high.gif");
 +
    height: 32px;
 +
    width: 137px;
 +
    display: block;
 +
}
 +
.dropdown-contentHPSilver a {
 +
    background-image: url("wiki_image_menu_hpsilver_low.gif");
 +
    height: 32px;
 +
    width: 137px;
 +
    padding: 0px 0px;
 +
    text-decoration: none;
 +
    display: block;
 +
}
 +
.dropdown-contentHPSilver a:hover {
 +
    background-image: url("wiki_image_menu_hpsilver_high.gif");
 +
    height: 32px;
 +
    width: 137px;
 
}
 
}
−
</style>
 
  
  
−
</head>
 
  
−
<body>
+
.dropdown-contentIHPgold {
−
<div class="ui fixed seven item secondary menu" id="navigation-bar">
+
     background-image: url("wiki_image_menu_ihpgold_low.gif");
−
     <div class="ui just item">
+
     display: none;
−
        <img class="ui cascaid image" src="https://static.igem.org/mediawiki/2017/thumb/a/af/T--Munich--Logo_Final.svg/739px-T--Munich--Logo_Final.svg.png">
+
     position: absolute;
−
     </div>
+
    top: 64;
−
     <div class="ui dropdown item" tabindex="0">
+
    height: 32px;
−
        Project
+
    width: 137px;
−
        <div class="ui menu" tabindex="-1">
+
    z-index: 1;
−
            <a class="active item">Description</a>
+
}
−
            <a class="disabled item">Interlab</a>
+
.dropdown:hover .dropdown-contentIHPgold {
−
        </div>
+
    background-image: url("wiki_image_menu_ihpgold_high.gif");
−
     </div>
+
    height: 32px;
−
     <div class="ui disabled dropdown item" tabindex="0">
+
     width: 137px;
−
        <div class="text">Design</div>
+
     display: block;
−
        <div class="ui menu" tabindex="-1">
+
}
−
            <a class="item">Overall</a>
+
.dropdown-contentIHPgold a {
−
            <a class="item">Parts</a>
+
    background-image: url("wiki_image_menu_ihpgold_low.gif");
−
            <a class="item">Hardware</a>
+
    height: 32px;
−
            <a class="item">Software</a>
+
    width: 137px;
−
            <a class="item">Modeling</a>
+
     padding: 0px 0px;
−
        </div>
+
     text-decoration: none;
−
     </div>
+
    display: block;
−
     <div class="ui disabled dropdown item" tabindex="0">
+
}
−
        <div class="text">Lab</div>
+
.dropdown-contentIHPgold a:hover {
−
        <div class="ui menu" tabindex="-1">
+
    background-image: url("wiki_image_menu_ihpgold_high.gif");
−
            <a class="item">Lab journal</a>
+
    height: 32px;
−
            <a class="item">Experiments</a>
+
     width: 137px;
−
            <a class="item">Results</a>
+
}
−
            <a class="item">Safety</a>
+
−
        </div>
+
−
     </div>
+
  
−
    <div class="ui dropdown item" tabindex="0">
 
−
        <div class="text">Team</div>
 
−
        <div class="ui menu" tabindex="-1">
 
−
            <a class="item" href="https://2017.igem.org/Team:Munich/Team">The Team</a>
 
−
            <a class="disabled item">Attributions</a>
 
−
            <a class="disabled item">Collaborations</a>
 
−
        </div>
 
−
    </div>
 
  
−
    <div class="ui disabled dropdown item" tabindex="0">
 
−
        <div class="text">Human Practices</div>
 
−
        <div class="ui menu" tabindex="-1">
 
−
            <a class="item">Awards</a>
 
−
            <a class="item">Medals</a>
 
−
        </div>
 
−
    </div>
 
  
−
    <div class="ui disabled dropdown item" tabindex="0">
+
.dropdown-contentPublicEngagement {
−
        <div class="text">Awards</div>
+
    background-image: url("wiki_image_menu_publicengagement_low.gif");
−
        <div class="ui menu" tabindex="-1">
+
    display: none;
−
            <a class="item">Special prizes</a>
+
    position: absolute;
−
            <a class="item">Medals</a>
+
    top: 96;
−
        </div>
+
    height: 32px;
−
     </div>
+
    width: 137px;
 +
    z-index: 1;
 +
}
 +
.dropdown:hover .dropdown-contentPublicEngagement {
 +
    background-image: url("wiki_image_menu_publicengagement_high.gif");
 +
    height: 32px;
 +
    width: 137px;
 +
    display: block;
 +
}
 +
.dropdown-contentPublicEngagement a {
 +
    background-image: url("wiki_image_menu_publicengagement_low.gif");
 +
    height: 32px;
 +
    width: 137px;
 +
    padding: 0px 0px;
 +
    text-decoration: none;
 +
    display: block;
 +
}
 +
.dropdown-contentPublicEngagement a:hover {
 +
    background-image: url("wiki_image_menu_publicengagement_high.gif");
 +
    height: 32px;
 +
     width: 137px;
 +
}
  
−
</div>
 
  
  
 +
.dropdown-contentCollaborations {
 +
    background-image: url("wiki_image_menu_collaborations_low.gif");
 +
    display: none;
 +
    position: absolute;
 +
    top: 128;
 +
    height: 32px;
 +
    width: 137px;
 +
    z-index: 1;
 +
}
 +
.dropdown:hover .dropdown-contentCollaborations {
 +
    background-image: url("wiki_image_menu_collaborations_high.gif");
 +
    height: 32px;
 +
    width: 137px;
 +
    display: block;
 +
}
 +
.dropdown-contentCollaborations a {
 +
    background-image: url("wiki_image_menu_collaborations_low.gif");
 +
    height: 32px;
 +
    width: 137px;
 +
    padding: 0px 0px;
 +
    text-decoration: none;
 +
    display: block;
 +
}
 +
.dropdown-contentCollaborations a:hover {
 +
    background-image: url("https://static.igem.org/mediawiki/2017/1/1c/T--Munich--wiki_image_menu_teammembers_high.gif");
 +
    height: 32px;
 +
    width: 137px;
 +
}
  
−
<section id="maincontent">
 
  
−
  <div id="intro">
 
−
    <img src="https://static.igem.org/mediawiki/2017/a/ab/T--Munich--team-picture.png" alt="Team picture">
 
−
  </div>
 
  
−
  <div id="intro-text">
+
.dropdown-contentTeamMembers {
−
      <h1>
+
    background-image: url("https://static.igem.org/mediawiki/2017/2/2b/T--Munich--wiki_image_menu_teammembers_low.gif");
−
          We are a team of 17 students, 5 instructors, and 2 PIs, based in Munich and representing the Technical University of Munich (TUM), Ludwig Maximilian University of Munich (LMU), and the Max Planck Institute for Biochemistry. Most of our student members are majoring in Biochemistry, Biotechnology and Biology, but we also have two in Bioinformatics and one in Biophysics.
+
    display: none;
−
          We are a team of 17 students, 5 instructors, and 2 PIs, based in Munich and representing the Technical University of Munich (TUM), Ludwig Maximilian University of Munich (LMU), and the Max Planck Institute for Biochemistry. Most of our student members are majoring in Biochemistry, Biotechnology and Biology, but we also have two in Bioinformatics and one in Biophysics.
+
    position: absolute;
−
          We are a team of 17 students, 5 instructors, and 2 PIs, based in Munich and representing the Technical University of Munich (TUM), Ludwig Maximilian University of Munich (LMU), and the Max Planck Institute for Biochemistry. Most of our student members are majoring in Biochemistry, Biotechnology and Biology, but we also have two in Bioinformatics and one in Biophysics.
+
    top: 32;
−
      </h1>
+
    height: 32px;
−
  </div>
+
    width: 137px;
 +
    z-index: 1;
 +
}
 +
.dropdown:hover .dropdown-contentTeamMembers {
 +
    background-image: url("https://static.igem.org/mediawiki/2017/1/1c/T--Munich--wiki_image_menu_teammembers_high.gif");
 +
    height: 32px;
 +
    width: 137px;
 +
    display: block;
 +
}
 +
.dropdown-contentTeamMembers a {
 +
    background-image: url("wiki_image_menu_teammembers_low.gif");
 +
    height: 32px;
 +
    width: 137px;
 +
    padding: 0px 0px;
 +
    text-decoration: none;
 +
    display: block;
 +
}
 +
.dropdown-contentTeamMembers a:hover {
 +
    background-image: url("wiki_image_menu_teammembers_high.gif");
 +
    height: 32px;
 +
    width: 137px;
 +
}
  
  
−
  <div id="students" style="margin-top: 20px">
 
−
    <div class="sectionContainer">
 
−
      <h2>Students</h2> 
 
−
    </div>
 
  
−
    <div class="ui cards centered stackable">
+
.dropdown-contentSupervisors {
−
      <div onmouseenter="toggleCard($('#Pattrick'))" onmouseleave="toggleCard($('#Pattrick'))" class="ui card">
+
    background-image: url("wiki_image_menu_supervisors_low.gif");
−
          <div class="image">
+
    display: none;
−
            <img src="https://scontent.xx.fbcdn.net/v/t31.0-8/19620192_1330888160294409_2188843335813625575_o.jpg?oh=69121d1a6ff668899a5c1ab4d0039730&oe=59F6976C">
+
    position: absolute;
−
          </div>
+
    top: 64;
−
        <div class="content">
+
    height: 32px;
−
          <p class="header">Pattrick Wilke</p>
+
    width: 137px;
−
          <div class="meta">
+
    z-index: 1;
−
            <span class="date">Masters Biochemistry (TUM)</span>
+
}
−
          </div>
+
.dropdown:hover .dropdown-contentSupervisors {
−
          <div class="description" >
+
    background-image: url("wiki_image_menu_supervisors_high.gif");
−
          <div class="mydescription" id="Pattrick" >
+
    height: 32px;
−
            <div class="threeDots-container">
+
    width: 137px;
−
              <img alt ="three dots" src="https://static1.squarespace.com/static/5654cf16e4b00b463710ff91/t/56568104e4b0509ba9df9296/1448509701389/?format=750w">
+
    display: block;
−
            </div>
+
}
−
            <p>
+
.dropdown-contentSupervisors a {
−
            He is currently in the Master in Biochemistry at TUM and is part of our Wet Lab Team. After spending too much time in the lab he has developed some side effects: he turned into a pipetting-robot and started to perceive reality in terms of incubation times. While he waits for the experiments to be done, he likes to play table football with Julian (you will know about him soon). Also, his laugh is very contagious.
+
    background-image: url("wiki_image_menu_supervisors_low.gif");
−
            </p>
+
    height: 32px;
−
          </div>
+
    width: 137px;
−
          </div>
+
    padding: 0px 0px;
−
        </div>
+
    text-decoration: none;
−
      </div>
+
    display: block;
 +
}
 +
.dropdown-contentSupervisors a:hover {
 +
    background-image: url("wiki_image_menu_supervisors_high.gif");
 +
    height: 32px;
 +
    width: 137px;
 +
}
  
−
      <div onmouseenter="toggleCard($('#nn'))" onmouseleave="toggleCard($('#nn'))" class="ui card">
 
−
          <div class="image">
 
−
            <img src="https://scontent.xx.fbcdn.net/v/t31.0-8/19620192_1330888160294409_2188843335813625575_o.jpg?oh=69121d1a6ff668899a5c1ab4d0039730&oe=59F6976C">
 
−
          </div>
 
−
        <div class="content">
 
−
          <p class="header">Pattrick Wilke</p>
 
−
          <div class="meta">
 
−
            <span class="date">Masters Biochemistry (TUM)</span>
 
−
          </div>
 
−
          <div class="description" >
 
−
          <div class="mydescription" id="NN" >
 
−
            <div class="threeDots-container">
 
−
              <img alt ="three dots" src="https://static1.squarespace.com/static/5654cf16e4b00b463710ff91/t/56568104e4b0509ba9df9296/1448509701389/?format=750w">
 
−
            </div>
 
−
            <p>
 
−
            He is currently in the Master in Biochemistry at TUM and is part of our Wet Lab Team. After spending too much time in the lab he has developed some side effects: he turned into a pipetting-robot and started to perceive reality in terms of incubation times. While he waits for the experiments to be done, he likes to play table football with Julian (you will know about him soon). Also, his laugh is very contagious.
 
−
            </p>
 
−
          </div>
 
−
          </div>
 
−
        </div>
 
−
      </div>
 
  
−
      <div onmouseenter="toggleCard($('#nn'))" onmouseleave="toggleCard($('#nn'))" class="ui card">
 
−
          <div class="image">
 
−
            <img src="https://scontent.xx.fbcdn.net/v/t31.0-8/19620192_1330888160294409_2188843335813625575_o.jpg?oh=69121d1a6ff668899a5c1ab4d0039730&oe=59F6976C">
 
−
          </div>
 
−
        <div class="content">
 
−
          <p class="header">Pattrick Wilke</p>
 
−
          <div class="meta">
 
−
            <span class="date">Masters Biochemistry (TUM)</span>
 
−
          </div>
 
−
          <div class="description" >
 
−
          <div class="mydescription" id="NN" >
 
−
            <div class="threeDots-container">
 
−
              <img alt ="three dots" src="https://static1.squarespace.com/static/5654cf16e4b00b463710ff91/t/56568104e4b0509ba9df9296/1448509701389/?format=750w">
 
−
            </div>
 
−
            <p>
 
−
            He is currently in the Master in Biochemistry at TUM and is part of our Wet Lab Team. After spending too much time in the lab he has developed some side effects: he turned into a pipetting-robot and started to perceive reality in terms of incubation times. While he waits for the experiments to be done, he likes to play table football with Julian (you will know about him soon). Also, his laugh is very contagious.
 
−
            </p>
 
−
          </div>
 
−
          </div>
 
−
        </div>
 
−
      </div>
 
  
−
      <div onmouseenter="toggleCard($('#nn'))" onmouseleave="toggleCard($('#nn'))" class="ui card">
+
.dropdown-contentPIs {
−
          <div class="image">
+
    background-image: url("wiki_image_menu_pis_low.gif");
−
            <img src="https://scontent.xx.fbcdn.net/v/t31.0-8/19620192_1330888160294409_2188843335813625575_o.jpg?oh=69121d1a6ff668899a5c1ab4d0039730&oe=59F6976C">
+
    display: none;
−
          </div>
+
    position: absolute;
−
        <div class="content">
+
    top: 96;
−
          <p class="header">Pattrick Wilke</p>
+
    height: 32px;
−
          <div class="meta">
+
    width: 137px;
−
            <span class="date">Masters Biochemistry (TUM)</span>
+
    z-index: 1;
−
          </div>
+
}
−
          <div class="description" >
+
.dropdown:hover .dropdown-contentPIs {
−
          <div class="mydescription" id="NN" >
+
    background-image: url("wiki_image_menu_pis_high.gif");
−
            <div class="threeDots-container">
+
    height: 32px;
−
              <img alt ="three dots" src="https://static1.squarespace.com/static/5654cf16e4b00b463710ff91/t/56568104e4b0509ba9df9296/1448509701389/?format=750w">
+
    width: 137px;
−
            </div>
+
    display: block;
−
            <p>
+
}
−
            He is currently in the Master in Biochemistry at TUM and is part of our Wet Lab Team. After spending too much time in the lab he has developed some side effects: he turned into a pipetting-robot and started to perceive reality in terms of incubation times. While he waits for the experiments to be done, he likes to play table football with Julian (you will know about him soon). Also, his laugh is very contagious.
+
.dropdown-contentPIs a {
−
            </p>
+
    background-image: url("wiki_image_menu_pis_low.gif");
−
          </div>
+
    height: 32px;
−
          </div>
+
    width: 137px;
−
        </div>
+
    padding: 0px 0px;
−
      </div>
+
    text-decoration: none;
 +
    display: block;
 +
}
 +
.dropdown-contentPIs a:hover {
 +
    background-image: url("wiki_image_menu_pis_high.gif");
 +
    height: 32px;
 +
    width: 137px;
 +
}
  
−
      <div onmouseenter="toggleCard($('#nn'))" onmouseleave="toggleCard($('#nn'))" class="ui card">
 
−
          <div class="image">
 
−
            <img src="https://scontent.xx.fbcdn.net/v/t31.0-8/19620192_1330888160294409_2188843335813625575_o.jpg?oh=69121d1a6ff668899a5c1ab4d0039730&oe=59F6976C">
 
−
          </div>
 
−
        <div class="content">
 
−
          <p class="header">Pattrick Wilke</p>
 
−
          <div class="meta">
 
−
            <span class="date">Masters Biochemistry (TUM)</span>
 
−
          </div>
 
−
          <div class="description" >
 
−
          <div class="mydescription" id="NN" >
 
−
            <div class="threeDots-container">
 
−
              <img alt ="three dots" src="https://static1.squarespace.com/static/5654cf16e4b00b463710ff91/t/56568104e4b0509ba9df9296/1448509701389/?format=750w">
 
−
            </div>
 
−
            <p>
 
−
            He is currently in the Master in Biochemistry at TUM and is part of our Wet Lab Team. After spending too much time in the lab he has developed some side effects: he turned into a pipetting-robot and started to perceive reality in terms of incubation times. While he waits for the experiments to be done, he likes to play table football with Julian (you will know about him soon). Also, his laugh is very contagious.
 
−
            </p>
 
−
          </div>
 
−
          </div>
 
−
        </div>
 
−
      </div>
 
  
−
      <div onmouseenter="toggleCard($('#nn'))" onmouseleave="toggleCard($('#nn'))" class="ui card">
 
−
          <div class="image">
 
−
            <img src="https://scontent.xx.fbcdn.net/v/t31.0-8/19620192_1330888160294409_2188843335813625575_o.jpg?oh=69121d1a6ff668899a5c1ab4d0039730&oe=59F6976C">
 
−
          </div>
 
−
        <div class="content">
 
−
          <p class="header">Pattrick Wilke</p>
 
−
          <div class="meta">
 
−
            <span class="date">Masters Biochemistry (TUM)</span>
 
−
          </div>
 
−
          <div class="description" >
 
−
          <div class="mydescription" id="NN" >
 
−
            <div class="threeDots-container">
 
−
              <img alt ="three dots" src="https://static1.squarespace.com/static/5654cf16e4b00b463710ff91/t/56568104e4b0509ba9df9296/1448509701389/?format=750w">
 
−
            </div>
 
−
            <p>
 
−
            He is currently in the Master in Biochemistry at TUM and is part of our Wet Lab Team. After spending too much time in the lab he has developed some side effects: he turned into a pipetting-robot and started to perceive reality in terms of incubation times. While he waits for the experiments to be done, he likes to play table football with Julian (you will know about him soon). Also, his laugh is very contagious.
 
−
            </p>
 
−
          </div>
 
−
          </div>
 
−
        </div>
 
−
      </div>
 
−
      <div onmouseenter="toggleCard($('#nn'))" onmouseleave="toggleCard($('#nn'))" class="ui card">
 
−
          <div class="image">
 
−
            <img src="https://scontent.xx.fbcdn.net/v/t31.0-8/19620192_1330888160294409_2188843335813625575_o.jpg?oh=69121d1a6ff668899a5c1ab4d0039730&oe=59F6976C">
 
−
          </div>
 
−
        <div class="content">
 
−
          <p class="header">Pattrick Wilke</p>
 
−
          <div class="meta">
 
−
            <span class="date">Masters Biochemistry (TUM)</span>
 
−
          </div>
 
−
          <div class="description" >
 
−
          <div class="mydescription" id="NN" >
 
−
            <div class="threeDots-container">
 
−
              <img alt ="three dots" src="https://static1.squarespace.com/static/5654cf16e4b00b463710ff91/t/56568104e4b0509ba9df9296/1448509701389/?format=750w">
 
−
            </div>
 
−
            <p>
 
−
            He is currently in the Master in Biochemistry at TUM and is part of our Wet Lab Team. After spending too much time in the lab he has developed some side effects: he turned into a pipetting-robot and started to perceive reality in terms of incubation times. While he waits for the experiments to be done, he likes to play table football with Julian (you will know about him soon). Also, his laugh is very contagious.
 
−
            </p>
 
−
          </div>
 
−
          </div>
 
−
        </div>
 
−
      </div>
 
  
−
      <div onmouseenter="toggleCard($('#nn'))" onmouseleave="toggleCard($('#nn'))" class="ui card">
+
.dropdown-contentCollaboratingInstitutions {
−
          <div class="image">
+
    background-image: url("wiki_image_menu_collaboratinginstitutions_low.gif");
−
            <img src="https://scontent.xx.fbcdn.net/v/t31.0-8/19620192_1330888160294409_2188843335813625575_o.jpg?oh=69121d1a6ff668899a5c1ab4d0039730&oe=59F6976C">
+
    display: none;
−
          </div>
+
    position: absolute;
−
        <div class="content">
+
    top: 128;
−
          <p class="header">Pattrick Wilke</p>
+
    height: 32px;
−
          <div class="meta">
+
    width: 137px;
−
            <span class="date">Masters Biochemistry (TUM)</span>
+
    z-index: 1;
−
          </div>
+
}
−
          <div class="description" >
+
.dropdown:hover .dropdown-contentCollaboratingInstitutions {
−
          <div class="mydescription" id="NN" >
+
    background-image: url("wiki_image_menu_collaboratinginstitutions_high.gif");
−
            <div class="threeDots-container">
+
    height: 32px;
−
              <img alt ="three dots" src="https://static1.squarespace.com/static/5654cf16e4b00b463710ff91/t/56568104e4b0509ba9df9296/1448509701389/?format=750w">
+
    width: 137px;
−
            </div>
+
    display: block;
−
            <p>
+
}
−
            He is currently in the Master in Biochemistry at TUM and is part of our Wet Lab Team. After spending too much time in the lab he has developed some side effects: he turned into a pipetting-robot and started to perceive reality in terms of incubation times. While he waits for the experiments to be done, he likes to play table football with Julian (you will know about him soon). Also, his laugh is very contagious.
+
.dropdown-contentCollaboratingInstitutions a {
−
            </p>
+
    background-image: url("wiki_image_menu_collaboratinginstitutions_low.gif");
−
          </div>
+
    height: 32px;
−
          </div>
+
    width: 137px;
−
        </div>
+
    padding: 0px 0px;
−
      </div>
+
    text-decoration: none;
 +
    display: block;
 +
}
 +
.dropdown-contentCollaboratingInstitutions a:hover {
 +
    background-image: url("wiki_image_menu_collaboratinginstitutions_high.gif");
 +
    height: 32px;
 +
    width: 137px;
 +
}
  
−
      <div onmouseenter="toggleCard($('#nn'))" onmouseleave="toggleCard($('#nn'))" class="ui card">
 
−
          <div class="image">
 
−
            <img src="https://scontent.xx.fbcdn.net/v/t31.0-8/19620192_1330888160294409_2188843335813625575_o.jpg?oh=69121d1a6ff668899a5c1ab4d0039730&oe=59F6976C">
 
−
          </div>
 
−
        <div class="content">
 
−
          <p class="header">Pattrick Wilke</p>
 
−
          <div class="meta">
 
−
            <span class="date">Masters Biochemistry (TUM)</span>
 
−
          </div>
 
−
          <div class="description" >
 
−
          <div class="mydescription" id="NN" >
 
−
            <div class="threeDots-container">
 
−
              <img alt ="three dots" src="https://static1.squarespace.com/static/5654cf16e4b00b463710ff91/t/56568104e4b0509ba9df9296/1448509701389/?format=750w">
 
−
            </div>
 
−
            <p>
 
−
            He is currently in the Master in Biochemistry at TUM and is part of our Wet Lab Team. After spending too much time in the lab he has developed some side effects: he turned into a pipetting-robot and started to perceive reality in terms of incubation times. While he waits for the experiments to be done, he likes to play table football with Julian (you will know about him soon). Also, his laugh is very contagious.
 
−
            </p>
 
−
          </div>
 
−
          </div>
 
−
        </div>
 
−
      </div>
 
  
−
      <div onmouseenter="toggleCard($('#nn'))" onmouseleave="toggleCard($('#nn'))" class="ui card">
 
−
          <div class="image">
 
−
            <img src="https://scontent.xx.fbcdn.net/v/t31.0-8/19620192_1330888160294409_2188843335813625575_o.jpg?oh=69121d1a6ff668899a5c1ab4d0039730&oe=59F6976C">
 
−
          </div>
 
−
        <div class="content">
 
−
          <p class="header">Pattrick Wilke</p>
 
−
          <div class="meta">
 
−
            <span class="date">Masters Biochemistry (TUM)</span>
 
−
          </div>
 
−
          <div class="description" >
 
−
          <div class="mydescription" id="NN" >
 
−
            <div class="threeDots-container">
 
−
              <img alt ="three dots" src="https://static1.squarespace.com/static/5654cf16e4b00b463710ff91/t/56568104e4b0509ba9df9296/1448509701389/?format=750w">
 
−
            </div>
 
−
            <p>
 
−
            He is currently in the Master in Biochemistry at TUM and is part of our Wet Lab Team. After spending too much time in the lab he has developed some side effects: he turned into a pipetting-robot and started to perceive reality in terms of incubation times. While he waits for the experiments to be done, he likes to play table football with Julian (you will know about him soon). Also, his laugh is very contagious.
 
−
            </p>
 
−
          </div>
 
−
          </div>
 
−
        </div>
 
−
      </div>
 
  
−
      <div onmouseenter="toggleCard($('#nn'))" onmouseleave="toggleCard($('#nn'))" class="ui card">
+
.dropdown-contentSponsors {
−
          <div class="image">
+
    background-image: url("wiki_image_menu_sponsors_low.gif");
−
            <img src="https://scontent.xx.fbcdn.net/v/t31.0-8/19620192_1330888160294409_2188843335813625575_o.jpg?oh=69121d1a6ff668899a5c1ab4d0039730&oe=59F6976C">
+
    display: none;
−
          </div>
+
    position: absolute;
−
        <div class="content">
+
    top: 160;
−
          <p class="header">Pattrick Wilke</p>
+
    height: 32px;
−
          <div class="meta">
+
    width: 137px;
−
            <span class="date">Masters Biochemistry (TUM)</span>
+
    z-index: 1;
−
          </div>
+
}
−
          <div class="description" >
+
.dropdown:hover .dropdown-contentSponsors {
−
          <div class="mydescription" id="NN" >
+
    background-image: url("wiki_image_menu_sponsors_high.gif");
−
            <div class="threeDots-container">
+
    height: 32px;
−
              <img alt ="three dots" src="https://static1.squarespace.com/static/5654cf16e4b00b463710ff91/t/56568104e4b0509ba9df9296/1448509701389/?format=750w">
+
    width: 137px;
−
            </div>
+
    display: block;
−
            <p>
+
}
−
            He is currently in the Master in Biochemistry at TUM and is part of our Wet Lab Team. After spending too much time in the lab he has developed some side effects: he turned into a pipetting-robot and started to perceive reality in terms of incubation times. While he waits for the experiments to be done, he likes to play table football with Julian (you will know about him soon). Also, his laugh is very contagious.
+
.dropdown-contentSponsors a {
−
            </p>
+
    background-image: url("wiki_image_menu_sponsors_low.gif");
−
          </div>
+
    height: 32px;
−
          </div>
+
    width: 137px;
−
        </div>
+
    padding: 0px 0px;
−
      </div>
+
    text-decoration: none;
 +
    display: block;
 +
}
 +
.dropdown-contentSponsors a:hover {
 +
    background-image: url("wiki_image_menu_sponsors_high.gif");
 +
    height: 32px;
 +
    width: 137px;
 +
}
  
−
      <div onmouseenter="toggleCard($('#Pattrick'))" onmouseleave="toggleCard($('#Pattrick'))" class="ui card">
 
−
          <div class="image">
 
−
            <img src="https://scontent.xx.fbcdn.net/v/t31.0-8/19620192_1330888160294409_2188843335813625575_o.jpg?oh=69121d1a6ff668899a5c1ab4d0039730&oe=59F6976C">
 
−
          </div>
 
−
        <div class="content">
 
−
          <p class="header">Pattrick Wilke</p>
 
−
          <div class="meta">
 
−
            <span class="date">Masters Biochemistry (TUM)</span>
 
−
          </div>
 
−
          <div class="description" >
 
−
          <div class="mydescription" id="Pattrick" >
 
−
            <div class="threeDots-container">
 
−
              <img alt ="three dots" src="https://static1.squarespace.com/static/5654cf16e4b00b463710ff91/t/56568104e4b0509ba9df9296/1448509701389/?format=750w">
 
−
            </div>
 
−
            <p>
 
−
            He is currently in the Master in Biochemistry at TUM and is part of our Wet Lab Team. After spending too much time in the lab he has developed some side effects: he turned into a pipetting-robot and started to perceive reality in terms of incubation times. While he waits for the experiments to be done, he likes to play table football with Julian (you will know about him soon). Also, his laugh is very contagious.
 
−
            </p>
 
−
          </div>
 
−
          </div>
 
−
        </div>
 
−
      </div>
 
  
−
      <div onmouseenter="toggleCard($('#nn'))" onmouseleave="toggleCard($('#nn'))" class="ui card">
 
−
          <div class="image">
 
−
            <img src="https://scontent.xx.fbcdn.net/v/t31.0-8/19620192_1330888160294409_2188843335813625575_o.jpg?oh=69121d1a6ff668899a5c1ab4d0039730&oe=59F6976C">
 
−
          </div>
 
−
        <div class="content">
 
−
          <p class="header">Pattrick Wilke</p>
 
−
          <div class="meta">
 
−
            <span class="date">Masters Biochemistry (TUM)</span>
 
−
          </div>
 
−
          <div class="description" >
 
−
          <div class="mydescription" id="NN" >
 
−
            <div class="threeDots-container">
 
−
              <img alt ="three dots" src="https://static1.squarespace.com/static/5654cf16e4b00b463710ff91/t/56568104e4b0509ba9df9296/1448509701389/?format=750w">
 
−
            </div>
 
−
            <p>
 
−
            He is currently in the Master in Biochemistry at TUM and is part of our Wet Lab Team. After spending too much time in the lab he has developed some side effects: he turned into a pipetting-robot and started to perceive reality in terms of incubation times. While he waits for the experiments to be done, he likes to play table football with Julian (you will know about him soon). Also, his laugh is very contagious.
 
−
            </p>
 
−
          </div>
 
−
          </div>
 
−
        </div>
 
−
      </div>
 
  
−
      <div onmouseenter="toggleCard($('#nn'))" onmouseleave="toggleCard($('#nn'))" class="ui card">
+
.dropdown-contentAttributions {
−
          <div class="image">
+
    background-image: url("wiki_image_menu_attributions_low.gif");
−
            <img src="https://scontent.xx.fbcdn.net/v/t31.0-8/19620192_1330888160294409_2188843335813625575_o.jpg?oh=69121d1a6ff668899a5c1ab4d0039730&oe=59F6976C">
+
    display: none;
−
          </div>
+
    position: absolute;
−
        <div class="content">
+
    top: 192;
−
          <p class="header">Pattrick Wilke</p>
+
    height: 32px;
−
          <div class="meta">
+
    width: 137px;
−
            <span class="date">Masters Biochemistry (TUM)</span>
+
    z-index: 1;
−
          </div>
+
}
−
          <div class="description" >
+
.dropdown:hover .dropdown-contentAttributions {
−
          <div class="mydescription" id="NN" >
+
    background-image: url("wiki_image_menu_attributions_high.gif");
−
            <div class="threeDots-container">
+
    height: 32px;
−
              <img alt ="three dots" src="https://static1.squarespace.com/static/5654cf16e4b00b463710ff91/t/56568104e4b0509ba9df9296/1448509701389/?format=750w">
+
    width: 137px;
−
            </div>
+
    display: block;
−
            <p>
+
}
−
            He is currently in the Master in Biochemistry at TUM and is part of our Wet Lab Team. After spending too much time in the lab he has developed some side effects: he turned into a pipetting-robot and started to perceive reality in terms of incubation times. While he waits for the experiments to be done, he likes to play table football with Julian (you will know about him soon). Also, his laugh is very contagious.
+
.dropdown-contentAttributions a {
−
            </p>
+
    background-image: url("wiki_image_menu_attributions_low.gif");
−
          </div>
+
    height: 32px;
−
          </div>
+
    width: 137px;
−
        </div>
+
    padding: 0px 0px;
−
      </div>
+
    text-decoration: none;
 +
    display: block;
 +
}
 +
.dropdown-contentAttributions a:hover {
 +
    background-image: url("wiki_image_menu_attributions_high.gif");
 +
    height: 32px;
 +
    width: 137px;
 +
}
  
−
      <div onmouseenter="toggleCard($('#Pattrick'))" onmouseleave="toggleCard($('#Pattrick'))" class="ui card">
+
</style>
−
          <div class="image">
+
</head><body>
−
            <img src="https://scontent.xx.fbcdn.net/v/t31.0-8/19620192_1330888160294409_2188843335813625575_o.jpg?oh=69121d1a6ff668899a5c1ab4d0039730&oe=59F6976C">
+
<table width=100% height=100% cellpadding=0 cellspacing=0 border=0>
−
          </div>
+
−
        <div class="content">
+
−
          <p class="header">Pattrick Wilke</p>
+
−
          <div class="meta">
+
−
            <span class="date">Masters Biochemistry (TUM)</span>
+
−
          </div>
+
−
          <div class="description" >
+
−
          <div class="mydescription" id="Pattrick" >
+
−
            <div class="threeDots-container">
+
−
              <img alt ="three dots" src="https://static1.squarespace.com/static/5654cf16e4b00b463710ff91/t/56568104e4b0509ba9df9296/1448509701389/?format=750w">
+
−
            </div>
+
−
            <p>
+
−
            He is currently in the Master in Biochemistry at TUM and is part of our Wet Lab Team. After spending too much time in the lab he has developed some side effects: he turned into a pipetting-robot and started to perceive reality in terms of incubation times. While he waits for the experiments to be done, he likes to play table football with Julian (you will know about him soon). Also, his laugh is very contagious.
+
−
            </p>
+
−
          </div>
+
−
          </div>
+
−
        </div>
+
−
      </div>
+
  
−
      <div onmouseenter="toggleCard($('#nn'))" onmouseleave="toggleCard($('#nn'))" class="ui card">
+
<!-- Bar -->
−
          <div class="image">
+
<tr><td height="32" bgcolor=#51A7f9></td><td bgcolor=#51A7f9 height="32" width="960" align=center>
−
            <img src="https://scontent.xx.fbcdn.net/v/t31.0-8/19620192_1330888160294409_2188843335813625575_o.jpg?oh=69121d1a6ff668899a5c1ab4d0039730&oe=59F6976C">
+
<div class="dropdown">
−
          </div>
+
  <a href="index"><button class="dropbtnCascAid"><img src="overlay.png"></button></a>
−
        <div class="content">
+
  <div class="dropdown-content">
−
          <p class="header">Pattrick Wilke</p>
+
  </div>
−
          <div class="meta">
+
</div><div class="dropdown">
−
            <span class="date">Masters Biochemistry (TUM)</span>
+
  <a href="project" target=content><button class="dropbtnProject"><img src="overlay.png"></button></a>
−
          </div>
+
  <div class="dropdown-contentDescription">
−
          <div class="description" >
+
    <a href="description" target=content></a>
−
          <div class="mydescription" id="NN" >
+
  </div>
−
            <div class="threeDots-container">
+
  <div class="dropdown-contentDesign">
−
              <img alt ="three dots" src="https://static1.squarespace.com/static/5654cf16e4b00b463710ff91/t/56568104e4b0509ba9df9296/1448509701389/?format=750w">
+
    <a href="design" target=content></a>
−
            </div>
+
  </div>
−
            <p>
+
  <div class="dropdown-contentProofofConcept">
−
            He is currently in the Master in Biochemistry at TUM and is part of our Wet Lab Team. After spending too much time in the lab he has developed some side effects: he turned into a pipetting-robot and started to perceive reality in terms of incubation times. While he waits for the experiments to be done, he likes to play table football with Julian (you will know about him soon). Also, his laugh is very contagious.
+
    <a href="proofofconcept" target=content></a>
−
            </p>
+
  </div>
−
          </div>
+
  <div class="dropdown-contentDemonstration">
−
          </div>
+
    <a href="demonstration" target=content></a>
−
        </div>
+
  </div>
−
      </div>
+
  <div class="dropdown-contentApplication">
 +
    <a href="application" target=content></a>
 +
  </div>
 +
  <div class="dropdown-contentFinalResults">
 +
    <a href="finalresults" target=content></a>
 +
  </div>
 +
  <div class="dropdown-contentEntrepreneurship">
 +
    <a href="entrepreneurship" target=content></a>
 +
  </div>
 +
  <div class="dropdown-contentAchievements">
 +
    <a href="achievements" target=content></a>
 +
  </div>
 +
</div><div class="dropdown" valign=center>
 +
  <a href="wetlab" target=content><button class="dropbtnWetlab" valign=center><img src="overlay.png"></button></a>
 +
  <div class="dropdown-contentProtocolsMethods">
 +
    <a href="protocolsmethods" target=content></a>
 +
  </div>
 +
  <div class="dropdown-contentMaterials">
 +
    <a href="materials" target=content></a>
 +
  </div>
 +
  <div class="dropdown-contentLabJournal">
 +
    <a href="labjournal" target=content></a>
 +
  </div>
 +
  <div class="dropdown-contentSafety">
 +
    <a href="safety" target=content></a>
 +
  </div>
 +
  <div class="dropdown-contentParts">
 +
    <a href="parts" target=content></a>
 +
  </div>
 +
  <div class="dropdown-contentInterlab">
 +
    <a href="interlab" target=content></a>
 +
  </div>
 +
</div><div class="dropdown">
 +
  <a href="model" target=content><button class="dropbtnModel"><img src="overlay.png"></button></a>
 +
  <div class="dropdown-content">
 +
  </div>
 +
</div><div class="dropdown">
 +
  <a href="softhardware" target=content><button class="dropbtnSoftHardware"><img src="overlay.png"></button></a>
 +
  <div class="dropdown-contentSoftware">
 +
    <a href="software" target=content></a>
 +
  </div>
 +
  <div class="dropdown-contentHardware">
 +
    <a href="hardware" target=content></a>
 +
  </div>
 +
</div><div class="dropdown">
 +
  <a href="hp" target=content><button class="dropbtnHP"><img src="overlay.png"></button></a>
 +
  <div class="dropdown-contentHPSilver">
 +
    <a href="hpsilver" target=content></a>
 +
  </div>  
 +
  <div class="dropdown-contentIHPgold">
 +
    <a href="ihpgold" target=content></a>
 +
  </div>
 +
  <div class="dropdown-contentPublicEngagement">
 +
    <a href="publicengagement" target=content></a>
 +
  </div>
 +
  <div class="dropdown-contentCollaborations">
 +
    <a href="collaborations" target=content></a>
 +
  </div>
 +
</div><div class="dropdown">
 +
  <a href="Team" target=content><button class="dropbtnTeam"><img src="overlay.png"></button></a>
 +
  <div class="dropdown-contentTeamMembers">
 +
    <a href="teammembers" target=content></a>
 +
  </div>  
 +
  <div class="dropdown-contentSupervisors">
 +
    <a href="supervisors" target=content></a>
 +
  </div>
 +
  <div class="dropdown-contentPIs">
 +
    <a href="pis" target=content></a>
 +
  </div>
 +
  <div class="dropdown-contentCollaboratingInstitutions">
 +
    <a href="collaboratinginstitutions" target=content></a>
 +
  </div>
 +
  <div class="dropdown-contentSponsors">
 +
    <a href="sponsors" target=content></a>
 +
  </div>
 +
  <div class="dropdown-contentAttributions">
 +
    <a href="attributions" target=content></a>
 +
  </div>
 +
</div>
 +
</td><td height="32" bgcolor=#51A7f9></td></tr>
 +
<!-- Content -->
 +
<tr><td width="100%" colspan=3>
 +
<table width=100% height=100% cellpadding=0 cellspacing=0 border=0>
 +
<tr>
 +
<td width="40%">
 +
</td>
 +
<td id="myContent" width="20%" valign=top align=center>
 +
<br>
 +
<!-- Head End -->
 +
<!-- Content Begin -->
 +
<video height="270" width="960" autoplay="autoplay">
 +
<source src="https://static.igem.org/mediawiki/2017/4/44/T--Munich--FrontPageVideo.mp4" type="video/mp4">
 +
Your browser does not support the video tag.
 +
</video>
 +
<table width="900" border=0 cellspacing=0 cellpadding=10>
 +
<tr><td colspan=2 align=left valign=center>
 +
<font size=7 color=#444444><b>Abstract</b></font>
 +
</td></tr>
 +
<tr><td align=center valign=center>
 +
<p style="text-align:justify">
 +
<font size=3 color=#444444>
 +
The ongoing crisis of increasing antibiotic resistance demands innovative preventive strategies. Recently, the RNA-targeting protein CRISPR-Cas13a has been used for highly sensitive DNA and RNA detection, promising diverse applications in point-of-care diagnostics. We integrated Cas13a in the detection unit of CascAID, our GMO-free diagnostic platform. CascAID combines an automated microfluidic device for rapid lysis and extraction of nucleic acids with a paper-based readout system. We demonstrated the performance of our device by targeting the 16S RNA from E. coli. We improved the detection limit of our platform, using simulations to optimize our amplification scheme and the final readout.
 +
</font>
 +
</p>
 +
</font>
 +
</td><td align=center valign=center>
 +
<img src="https://static.igem.org/mediawiki/2017/thumb/a/af/T--Munich--Logo_Final.svg/739px-T--Munich--Logo_Final.svg.png" width="420">
 +
</td></tr>
 +
<tr><td align=center valign=center>
 +
<p style="text-align:justify">
 +
<font size=3 color=#444444>
 +
Conceived as a distributable platform for rapid point-of-care diagnostics, CascAID can be used to distinguish between bacterial and viral infections, thus minimizing the widespread use of antibiotics.
 +
</font>
 +
</p>
 +
</td><td align=center valign=center>
 +
<p style="text-align:justify">
 +
<font size=3 color=#444444>
 +
Furthermore, Cas13a allows the fast design of target sequences, making our system adaptive to the emergence of new viral outbreaks or fast mutating pathogens.
 +
</font>
 +
</p>
 +
</td></tr>
 +
<tr><td colspan=2 align=right valign=center height=10>
 +
<font size=2>| The iGem Munich 2017 Team | 2017.07.13 |</font><br><br><br><center><hr></center>
 +
</td></tr>
 +
</table>
 +
<!-- Content End -->
  
−
      <div onmouseenter="toggleCard($('#Pattrick'))" onmouseleave="toggleCard($('#Pattrick'))" class="ui card">
 
−
          <div class="image">
 
−
            <img src="https://scontent.xx.fbcdn.net/v/t31.0-8/19620192_1330888160294409_2188843335813625575_o.jpg?oh=69121d1a6ff668899a5c1ab4d0039730&oe=59F6976C">
 
−
          </div>
 
−
        <div class="content">
 
−
          <p class="header">Pattrick Wilke</p>
 
−
          <div class="meta">
 
−
            <span class="date">Masters Biochemistry (TUM)</span>
 
−
          </div>
 
−
          <div class="description" >
 
−
          <div class="mydescription" id="Pattrick" >
 
−
            <div class="threeDots-container">
 
−
              <img alt ="three dots" src="https://static1.squarespace.com/static/5654cf16e4b00b463710ff91/t/56568104e4b0509ba9df9296/1448509701389/?format=750w">
 
−
            </div>
 
−
            <p>
 
−
            He is currently in the Master in Biochemistry at TUM and is part of our Wet Lab Team. After spending too much time in the lab he has developed some side effects: he turned into a pipetting-robot and started to perceive reality in terms of incubation times. While he waits for the experiments to be done, he likes to play table football with Julian (you will know about him soon). Also, his laugh is very contagious.
 
−
            </p>
 
−
          </div>
 
−
          </div>
 
−
        </div>
 
−
      </div>
 
  
  
−
    </div>
 
  
  
  
  
−
<!--<button onclick="debugging()">Debugging</button>-->
 
  
−
  </div>
 
  
−
  <div id="Supervisors" style="margin-top: 20px">
 
−
    <div class="sectionContainer">
 
−
      <h2>Supervisors</h2> 
 
−
    </div>
 
−
    <div class="ui cards stackable centered">
 
−
      <div onmouseenter="toggleCard($('#nn'))" onmouseleave="toggleCard($('#nn'))" class="ui card">
 
−
          <div class="image">
 
−
            <img src="https://scontent.xx.fbcdn.net/v/t31.0-8/19620192_1330888160294409_2188843335813625575_o.jpg?oh=69121d1a6ff668899a5c1ab4d0039730&oe=59F6976C">
 
−
          </div>
 
−
        <div class="content">
 
−
          <p class="header">Pattrick Wilke</p>
 
−
          <div class="meta">
 
−
            <span class="date">Masters Biochemistry (TUM)</span>
 
−
          </div>
 
−
          <div class="description" >
 
−
          <div class="mydescription" id="NN" >
 
−
            <div class="threeDots-container">
 
−
              <img alt ="three dots" src="https://static1.squarespace.com/static/5654cf16e4b00b463710ff91/t/56568104e4b0509ba9df9296/1448509701389/?format=750w">
 
−
            </div>
 
−
            <p>
 
−
            He is currently in the Master in Biochemistry at TUM and is part of our Wet Lab Team. After spending too much time in the lab he has developed some side effects: he turned into a pipetting-robot and started to perceive reality in terms of incubation times. While he waits for the experiments to be done, he likes to play table football with Julian (you will know about him soon). Also, his laugh is very contagious.
 
−
            </p>
 
−
          </div>
 
−
          </div>
 
−
        </div>
 
−
      </div>
 
−
      <div onmouseenter="toggleCard($('#nn'))" onmouseleave="toggleCard($('#nn'))" class="ui card">
 
−
          <div class="image">
 
−
            <img src="https://scontent.xx.fbcdn.net/v/t31.0-8/19620192_1330888160294409_2188843335813625575_o.jpg?oh=69121d1a6ff668899a5c1ab4d0039730&oe=59F6976C">
 
−
          </div>
 
−
        <div class="content">
 
−
          <p class="header">Pattrick Wilke</p>
 
−
          <div class="meta">
 
−
            <span class="date">Masters Biochemistry (TUM)</span>
 
−
          </div>
 
−
          <div class="description" >
 
−
          <div class="mydescription" id="NN" >
 
−
            <div class="threeDots-container">
 
−
              <img alt ="three dots" src="https://static1.squarespace.com/static/5654cf16e4b00b463710ff91/t/56568104e4b0509ba9df9296/1448509701389/?format=750w">
 
−
            </div>
 
−
            <p>
 
−
            He is currently in the Master in Biochemistry at TUM and is part of our Wet Lab Team. After spending too much time in the lab he has developed some side effects: he turned into a pipetting-robot and started to perceive reality in terms of incubation times. While he waits for the experiments to be done, he likes to play table football with Julian (you will know about him soon). Also, his laugh is very contagious.
 
−
            </p>
 
−
          </div>
 
−
          </div>
 
−
        </div>
 
−
      </div>
 
  
−
      <div onmouseenter="toggleCard($('#nn'))" onmouseleave="toggleCard($('#nn'))" class="ui card">
 
−
          <div class="image">
 
−
            <img src="https://scontent.xx.fbcdn.net/v/t31.0-8/19620192_1330888160294409_2188843335813625575_o.jpg?oh=69121d1a6ff668899a5c1ab4d0039730&oe=59F6976C">
 
−
          </div>
 
−
        <div class="content">
 
−
          <p class="header">Pattrick Wilke</p>
 
−
          <div class="meta">
 
−
            <span class="date">Masters Biochemistry (TUM)</span>
 
−
          </div>
 
−
          <div class="description" >
 
−
          <div class="mydescription" id="NN" >
 
−
            <div class="threeDots-container">
 
−
              <img alt ="three dots" src="https://static1.squarespace.com/static/5654cf16e4b00b463710ff91/t/56568104e4b0509ba9df9296/1448509701389/?format=750w">
 
−
            </div>
 
−
            <p>
 
−
            He is currently in the Master in Biochemistry at TUM and is part of our Wet Lab Team. After spending too much time in the lab he has developed some side effects: he turned into a pipetting-robot and started to perceive reality in terms of incubation times. While he waits for the experiments to be done, he likes to play table football with Julian (you will know about him soon). Also, his laugh is very contagious.
 
−
            </p>
 
−
          </div>
 
−
          </div>
 
−
        </div>
 
−
      </div>
 
−
      <div onmouseenter="toggleCard($('#nn'))" onmouseleave="toggleCard($('#nn'))" class="ui card">
 
−
          <div class="image">
 
−
            <img src="https://scontent.xx.fbcdn.net/v/t31.0-8/19620192_1330888160294409_2188843335813625575_o.jpg?oh=69121d1a6ff668899a5c1ab4d0039730&oe=59F6976C">
 
−
          </div>
 
−
        <div class="content">
 
−
          <p class="header">Pattrick Wilke</p>
 
−
          <div class="meta">
 
−
            <span class="date">Masters Biochemistry (TUM)</span>
 
−
          </div>
 
−
          <div class="description" >
 
−
          <div class="mydescription" id="NN" >
 
−
            <div class="threeDots-container">
 
−
              <img alt ="three dots" src="https://static1.squarespace.com/static/5654cf16e4b00b463710ff91/t/56568104e4b0509ba9df9296/1448509701389/?format=750w">
 
−
            </div>
 
−
            <p>
 
−
            He is currently in the Master in Biochemistry at TUM and is part of our Wet Lab Team. After spending too much time in the lab he has developed some side effects: he turned into a pipetting-robot and started to perceive reality in terms of incubation times. While he waits for the experiments to be done, he likes to play table football with Julian (you will know about him soon). Also, his laugh is very contagious.
 
−
            </p>
 
−
          </div>
 
−
          </div>
 
−
        </div>
 
−
      </div>
 
  
  
−
    </div>
 
  
−
  </div>
 
  
 +
<!-- Foot Begin -->
 +
<table width=960 height=35 cellpadding=0 cellspacing=0 border=0><tr><td align=right valign=center>
  
−
</section>
+
<table width=300 height=35 cellpadding=0 cellspacing=0 border=0><tr>
  
−
<section class ="footer text-center">
+
<td align=center valign=center>
 +
<a href="https://www.en.uni-muenchen.de/index.html" target="_blank3" >
 +
<img src="https://static.igem.org/mediawiki/2017/8/83/T--Munich--wiki_image_coop_lmu_low.svg" border=0 height="20" onmouseover="this.src='https://static.igem.org/mediawiki/2017/f/fd/T--Munich--wiki_image_coop_lmu_high.svg'" onmouseout="this.src='https://static.igem.org/mediawiki/2017/8/83/T--Munich--wiki_image_coop_lmu_low.svg'">
 +
</a>
 +
</td>
  
−
  <a href="https://www.facebook.com/Munich.iGEM/">
+
<td align=center valign=center>
−
    <i class= "icon facebook huge icons"> </i>
+
<a href="https://www.tum.de/" target="_blank4" >
−
  </a>
+
<img src="https://static.igem.org/mediawiki/2017/a/ae/T--Munich--wiki_image_coop_tum_low.svg" border=0 height="20" onmouseover="this.src='https://static.igem.org/mediawiki/2017/1/1e/T--Munich--wiki_image_coop_tum_high.svg'" onmouseout="this.src='https://static.igem.org/mediawiki/2017/a/ae/T--Munich--wiki_image_coop_tum_low.svg'">
−
  <a href="https://www.instagram.com/igem.munich.2017/">
+
</a>
−
    <i class= "icon instagram huge icons"> </i>
+
</td>
−
  </a> 
+
−
  <a href ="mailto:igem.munich@gmail.com">
+
−
    <i class= "icon mail huge icons"> </i>
+
−
  </a>
+
  
−
</section>
+
<td align=center valign=center>
 +
<a href="http://www.e14.ph.tum.de/en/home/" target="_blank5" >
 +
<img src="https://static.igem.org/mediawiki/2017/a/a3/T--Munich--wiki_image_coop_e14_low.svg" border=0 height="25" onmouseover="this.src='https://static.igem.org/mediawiki/2017/7/72/T--Munich--wiki_image_coop_e14_high.svg'" onmouseout="this.src='https://static.igem.org/mediawiki/2017/a/a3/T--Munich--wiki_image_coop_e14_low.svg'">
 +
</a>
 +
</td>
  
−
<script type="text/javascript">
+
<td align=center valign=center>
 +
<a href="http://www.biochem.mpg.de/en" target="_blank5" >
 +
<img src="https://static.igem.org/mediawiki/2017/d/da/T--Munich--wiki_image_coop_maxplanck_low.svg" border=0 height="30" onmouseover="this.src='https://static.igem.org/mediawiki/2017/d/df/T--Munich--wiki_image_coop_maxplanck_high.svg'" onmouseout="this.src='https://static.igem.org/mediawiki/2017/d/da/T--Munich--wiki_image_coop_maxplanck_low.svg'">
 +
</a>
 +
</td>
  
 +
<td align=center valign=center>
 +
<a href="https://www.helmholtz-muenchen.de/" target="_blank5" >
 +
<img src="https://static.igem.org/mediawiki/2017/0/05/T--Munich--wiki_image_coop_helmholtzzentrum_low.svg" border=0 height="20" onmouseover="this.src='https://static.igem.org/mediawiki/2017/6/6b/T--Munich--wiki_image_coop_helmholtzzentrum_high.svg'" onmouseout="this.src='https://static.igem.org/mediawiki/2017/0/05/T--Munich--wiki_image_coop_helmholtzzentrum_low.svg'">
 +
</a>
 +
</td>
  
−
$(".card").click(function(){
+
<td align=center valign=center>
 +
<a href="https://igem.org/Main_Page" target="_blank6" >
 +
<img src="https://static.igem.org/mediawiki/2017/0/0f/T--Munich--wiki_image_coop_igem_low.svg" border=0 height="25" onmouseover="this.src='https://static.igem.org/mediawiki/2017/7/79/T--Munich--wiki_image_coop_igem_high.svg'" onmouseout="this.src='https://static.igem.org/mediawiki/2017/0/0f/T--Munich--wiki_image_coop_igem_low.svg'">
 +
</a>
 +
</td>
  
−
  $(this).toggleClass("locked");
+
</tr></table></td><td align=center valign=center><table width=35 height=35 cellpadding=0 cellspacing=0 border=0><tr><td width="35" align=center valign=center></td></tr></table></td><td align=left valign=center><table width=200 height=35 cellpadding=0 cellspacing=0 border=0><tr>
  
−
}); //With this click function, the locked class is added. Locked is simply use for a boolean expression no determine whether the animation on mouse hover should be trigger (see toggleCard).
+
<td align=center valign=center>
 +
<a href="https://www.facebook.com/Munich.iGEM" target="_blank7" >
 +
<img src="https://static.igem.org/mediawiki/2017/7/76/T--Munich--wiki_image_sm_facebook_low.svg" border=0 height="25" onmouseover="https://static.igem.org/mediawiki/2017/6/6e/T--Munich--wiki_image_sm_instagram_high.svg'" onmouseout="this.src='https://static.igem.org/mediawiki/2017/7/76/T--Munich--wiki_image_sm_facebook_low.svg'">
 +
</a>
 +
</td>
  
−
var initialheight = $(".mydescription").css("height"); // We save the initialheight of any card (they all should have the same inital height) so we can use its value to reset the height once the card is deactivated.
+
<td align=center valign=center>
 +
<a href="https://twitter.com/iGEM_Munich" target="_blank8" >
 +
<img src="https://static.igem.org/mediawiki/2017/8/8b/T--Munich--wiki_image_sm_twitter_low.svg" border=0 height="25" onmouseover="this.src='https://static.igem.org/mediawiki/2017/c/cc/T--Munich--wiki_image_sm_twitter_high.svg'" onmouseout="this.src='https://static.igem.org/mediawiki/2017/8/8b/T--Munich--wiki_image_sm_twitter_low.svg'">
 +
</a>
 +
</td>
  
−
function debugging(){
+
<td align=center valign=center>
−
  alert(initialheight);
+
<a href="mailto:igem.munich@gmail.com">
 +
<img src="https://static.igem.org/mediawiki/2017/7/79/T--Munich--wiki_image_sm_mail_low.svg" border=0 height="25" onmouseover="this.src='https://static.igem.org/mediawiki/2017/9/93/T--Munich--wiki_image_sm_mail_high.svg'" onmouseout="this.src='https://static.igem.org/mediawiki/2017/7/79/T--Munich--wiki_image_sm_mail_low.svg'">
 +
</a>
 +
</td>
  
−
}
+
<td align=center valign=center>
 +
<a href="https://www.instagram.com/igem.munich.2017/" target="_blank9" >
 +
<img src="https://static.igem.org/mediawiki/2017/e/e9/T--Munich--wiki_image_sm_instagram_low.svg" border=0 height="25" onmouseover="this.src='https://static.igem.org/mediawiki/2017/6/6e/T--Munich--wiki_image_sm_instagram_high.svg'" onmouseout="this.src='https://static.igem.org/mediawiki/2017/e/e9/T--Munich--wiki_image_sm_instagram_low.svg'">
 +
</a>
 +
</td>
  
−
  function toggleCard(object){
+
<td align=center valign=center>
 +
<a href="https://2017.igem.org/Team:Munich" target="_blank10" >
 +
<img src="https://static.igem.org/mediawiki/2017/1/1d/T--Munich--wiki_image_sm_web_low.svg" border=0 height="25" onmouseover="this.src='https://static.igem.org/mediawiki/2017/6/61/T--Munich--wiki_image_sm_web_high.svg'" onmouseout="this.src='https://static.igem.org/mediawiki/2017/1/1d/T--Munich--wiki_image_sm_web_low.svg'">
 +
</a>
 +
</td>
  
−
    if(!(object.parents().hasClass("locked"))){
+
</tr></table>
 +
</td></table>
 +
</td>
 +
<td width="40%">
 +
</td>
 +
</tr>
 +
</table>
 +
</body>
 +
</td></tr>
 +
<tr><td height="25" bgcolor=#ffffff></td><td bgcolor=#ffffff height="25" width="960" align=center>
 +
<hr>
 +
<table height=25 cellpadding=0 cellspacing=2 border=0><tr>
  
−
      if(!(object.hasClass("card-active"))){
+
<td bgcolor=#ffffff height="25" width="90" align=center valign=center>
−
        object.addClass("card-active");
+
<a href="https://www.eurofinsgenomics.eu/" target="_blank1" ><img src="https://static.igem.org/mediawiki/2017/c/c7/T--Munich--wiki_image_sponsors_eurofins.svg" border=0 height="15"></a>
−
     
+
</td>
−
          object.animate({
+
  
−
            height: object.children("p").css("height")
+
<td bgcolor=#ffffff height="25" width="10" align=center valign=center></td>
  
−
          },500, function(){
+
<td bgcolor=#ffffff height="25" width="60" align=center valign=center>
−
       
+
<a href="https://www.neb.com/" target="_blank2" ><img src="https://static.igem.org/mediawiki/2017/8/87/T--Munich--wiki_image_sponsors_neb.svg" border=0 height="21"></a>
−
            if((object.hasClass("card-active"))){
+
</td>
  
−
          object.clearQueue();
+
<td bgcolor=#ffffff height="25" width="10" align=center valign=center></td>
  
−
        } 
+
<td bgcolor=#ffffff height="25" width="60" align=center valign=center>
−
       
+
<a href="https://www.biomers.net" target="_blank2" ><img src="https://static.igem.org/mediawiki/2017/a/a9/T--Munich--wiki_image_sponsors_biomers.png" border=0 height="21"></a>
−
          });
+
</td>
−
   
+
−
    } else {
+
−
        object.removeClass("card-active");     
+
−
   
+
−
        object.animate({
+
  
−
          height: initialheight
+
<td bgcolor=#ffffff height="25" width="10" align=center valign=center></td>
  
−
          },500, function(){
+
<td bgcolor=#ffffff height="25" width="60" align=center valign=center>
−
     
+
<a href="https://www.gatc-biotech.com" target="_blank2" ><img src="https://static.igem.org/mediawiki/2017/5/59/T--Munich--wiki_image_sponsors_gatc.png" border=0 height="21"></a>
−
                    if(!(object.hasClass("card-active"))){
+
</td>
  
−
          object.clearQueue();
+
<td bgcolor=#ffffff height="25" width="10" align=center valign=center></td>
  
−
        }
+
<td bgcolor=#ffffff height="25" width="70" align=center valign=center>
−
       
+
<a href="https://www3.gehealthcare.com" target="_blank2" ><img src="https://static.igem.org/mediawiki/2017/1/1b/T--Munich--wiki_image_sponsors_gehealthcare.svg" border=0 height="21"></a>
 +
</td>
  
−
        });     
+
<td bgcolor=#ffffff height="25" width="10" align=center valign=center></td>
−
     
+
−
      }
+
  
−
  }
+
<td bgcolor=#ffffff height="25" width="85" align=center valign=center>
−
       
+
<a href="https://eu.idtdna.com" target="_blank2" ><img src="https://static.igem.org/mediawiki/2017/1/1a/T--Munich--wiki_image_sponsors_idt.png" border=0 height="21"></a>
−
} //Toggle function. Changes the card to its active, inactive state by using the animate function to gradually change its height to match that of the p (active) or to become initalheight (inactive). Adds the card-active class at the end to change the other css properties that do not require animation.
+
</td>
  
−
function toggleCardSudden(object){
+
<td bgcolor=#ffffff height="25" width="10" align=center valign=center></td>
−
  if(!(object.hasClass("card-active"))){
+
−
    if(object.attr("id")=="Dali") {
+
−
      $("#DaliF").attr("src","https://scontent.xx.fbcdn.net/v/t31.0-8/19488772_1328753460507879_5404459836438295641_o.jpg?oh=42fee72c3e799515ca59f9a20809b612&oe=5A070989");
+
−
     
+
  
−
    }/* TODO: Delete this later and implement it in an good way. */
+
<td bgcolor=#ffffff height="25" width="60" align=center valign=center>
−
    object.animate({
+
<a href="https://www.nano-initiative-munich.de/" target="_blank2" ><img src="https://static.igem.org/mediawiki/2017/a/a7/T--Munich--wiki_image_sponsors_nim.png" border=0 height="21"></a>
 +
</td>
  
−
      height: object.children("p").css("height")
+
<td bgcolor=#ffffff height="25" width="10" align=center valign=center></td>
  
−
      },500, function(){
+
<td bgcolor=#ffffff height="25" width="120" align=center valign=center>
−
       
+
<a href="https://www.promega.de/" target="_blank2" ><img src="https://static.igem.org/mediawiki/2017/3/3f/T--Munich--wiki_image_sponsors_promega.png" border=0 height="21"></a>
 +
</td>
  
−
      });
+
<td bgcolor=#ffffff height="25" width="10" align=center valign=center></td>
  
−
    } else {
+
<td bgcolor=#ffffff height="25" width="40" align=center valign=center>
−
      if(object.attr("id")=="Dali") {
+
<a href="https://www.qiagen.com" target="_blank2" ><img src="https://static.igem.org/mediawiki/2017/9/99/T--Munich--wiki_image_sponsors_qiagen.svg" border=0 height="21"></a>
−
      $("#DaliF").attr("src","D:\\Documentos\\IGEM\\wiki\\ProfileFotos\\Dali.jpg");
+
</td>
−
     
+
  
−
    }/* TODO: Delete this later and implement it in an good way.  */
+
<td bgcolor=#ffffff height="25" width="10" align=center valign=center></td>
−
      object.css("height",initialheight);
+
−
    }
+
  
−
    object.toggleClass("card-active");
+
<td bgcolor=#ffffff height="25" width="40" align=center valign=center>
−
}
+
<a href="https://www.carlroth.com" target="_blank2" ><img src="https://static.igem.org/mediawiki/2017/d/d6/T--Munich--wiki_image_sponsors_roth.png" border=0 height="21"></a>
 +
</td>
  
 +
<td bgcolor=#ffffff height="25" width="10" align=center valign=center></td>
  
−
function and(a, b){
+
<td bgcolor=#ffffff height="25" width="130" align=center valign=center>
−
  return (!(!(a || a) || !(b || b)));
+
<a href="https://www.scienova.com" target="_blank2" ><img src="https://static.igem.org/mediawiki/2017/3/3b/T--Munich--wiki_image_sponsors_scienova.png" border=0 height="21"></a>
−
}  //Calculates the value of a and b, because why should the &&; operator work?
+
</td>
  
−
$('.dropdown').dropdown({on:'hover'});
+
<td bgcolor=#ffffff height="25" width="10" align=center valign=center></td>
−
</script>
+
  
 +
<td bgcolor=#ffffff height="25" width="120" align=center valign=center>
 +
<a href="https://www.unternehmertum.de" target="_blank2" ><img src="https://static.igem.org/mediawiki/2017/b/b2/T--Munich--wiki_image_sponsors_unternehmertum.png" border=0 height="21"></a>
 +
</td>
  
 +
</tr></table>
  
−
</body>
+
 
−
</html>
+
</td><td height="25" bgcolor=#ffffff></td></tr>
 +
</table></body></html>

Revision as of 10:34, 13 September 2017


Abstract

The ongoing crisis of increasing antibiotic resistance demands innovative preventive strategies. Recently, the RNA-targeting protein CRISPR-Cas13a has been used for highly sensitive DNA and RNA detection, promising diverse applications in point-of-care diagnostics. We integrated Cas13a in the detection unit of CascAID, our GMO-free diagnostic platform. CascAID combines an automated microfluidic device for rapid lysis and extraction of nucleic acids with a paper-based readout system. We demonstrated the performance of our device by targeting the 16S RNA from E. coli. We improved the detection limit of our platform, using simulations to optimize our amplification scheme and the final readout.

Conceived as a distributable platform for rapid point-of-care diagnostics, CascAID can be used to distinguish between bacterial and viral infections, thus minimizing the widespread use of antibiotics.

Furthermore, Cas13a allows the fast design of target sequences, making our system adaptive to the emergence of new viral outbreaks or fast mutating pathogens.

| The iGem Munich 2017 Team | 2017.07.13 |