Difference between revisions of "Team:TUDelft/Test"

 
(428 intermediate revisions by 2 users not shown)
Line 2: Line 2:
 
{{:Team:TUDelft/Head}}
 
{{:Team:TUDelft/Head}}
 
{{:Team:TUDelft/Header}}
 
{{:Team:TUDelft/Header}}
{{:Team:TUDelft/Banner}}
+
 
 
<html>
 
<html>
 
     <head>
 
     <head>
         <meta name="viewport" content="width=device-width, initial-scale=1">
+
         <link rel="stylesheet" href="https://2019.igem.org/Team:TUDelft/SlickCSS?action=raw&ctype=text/css">
         <style>     
+
         <script src="https://2019.igem.org/Team:TUDelft/Slickjs2?action=raw&ctype=text/javascript" crossorigin="anonymous"></script>
            /* Create two unequal columns that floats next to each other */
+
        <script src="https://2019.igem.org/Team:TUDelft/Slickjs1?action=raw&ctype=text/javascript" crossorigin="anonymous"></script>
            .column {
+
        <style>
                box-sizing: border-box;
+
                vertical-align: middle;
+
                display: table-cell;
+
            }
+
  
             .left {
+
            body{
                 width: 30%;
+
                background-color:#ffffff}
 +
 
 +
 
 +
             .Banner{
 +
              background: linear-gradient( rgba(188, 233, 246,1), rgba(251, 251, 251,1));
 +
                background-repeat: no-repeat;
 +
                background-size:100% 100%;
 +
                 width:100%;
 +
 
 +
            } 
 +
            .boxx {
 +
                border: 1px solid #888888;
 
                 padding: 10px;
 
                 padding: 10px;
                 padding-left: 40px;
+
                 box-shadow: 2.5px 5px rgba(136, 136, 136,0.8);
                padding-top:5%;
+
  
 
             }
 
             }
             .left2 {
+
             .boxx3 {
                width: 70%;
+
 
                 padding: 10px;
 
                 padding: 10px;
                 padding-left: 40px;
+
                box-shadow: 2.5px 5px rgba(136, 136, 136,0.8);
 +
                border-radius:0.4em;
 +
                background-color:#f3f3f3;
 +
            }
 +
            .boxx4 {
 +
                 padding: 10px;
 +
                box-shadow: 2.5px 5px rgba(136, 136, 136,0.8);
 +
                border-radius:0.4em;
 +
                background-color:#d4d4d4;
 
             }
 
             }
  
             .right {
+
             .rowhm{
                 width: 70%;
+
                display:flex;}
 +
            /* Create three equal columns that sits next to each other */
 +
            .columnhm {
 +
                flex: 20%;
 +
                padding: 5px;
 +
                margin:0.5%;
 +
            }
 +
 
 +
            .left{
 +
                float: left;
 +
                box-sizing: border-box;
 +
                 width: 50%;
 +
                display: flex;
 +
                justify-content: center;
 +
                background-color:#000000;
 
                 padding:10px;
 
                 padding:10px;
                 padding-right: 40px;
+
                 padding-bottom: 99999px;
 +
                margin-bottom: -99999px;
 
             }
 
             }
             .right2 {
+
             .right{
                 width: 30%;
+
                float: left;
 +
                padding-right: 10%;
 +
                box-sizing: border-box;
 +
                width: 50%;
 +
                padding:10px;
 +
                background-color:#fbfbfb;
 +
                padding-bottom: 99999px;
 +
                margin-bottom: -99999px;
 +
            }
 +
            .left3{
 +
                float: left;
 +
                box-sizing: border-box;
 +
                width: 50%;
 +
                display: flex;
 +
                justify-content: center;
 +
                background-color:#e1e1e1;
 +
                padding-bottom: 99999px;
 +
                margin-bottom: -99999px;
 +
            }
 +
            .right3{
 +
                float: left;
 +
                box-sizing: border-box;
 +
                width: 50%;
 +
                background-color:#d4d4d4;
 +
                justify-content: center;
 +
                padding-bottom: 99999px;
 +
                margin-bottom: -99999px;
 +
            }
 +
 
 +
            .left2{
 +
                float: left;
 +
                padding-right: 10%;
 +
                box-sizing: border-box;
 +
                 width: 50%;
 
                 padding:10px;
 
                 padding:10px;
 
                 padding-right: 40px;
 
                 padding-right: 40px;
                 padding-top:5%;
+
                background-color:#fbfbfb;
 +
                 padding-bottom: 99999px;
 +
                margin-bottom: -99999px;
 
             }
 
             }
             .row {
+
             .right2{
                 display: table;
+
                float: left;
 +
                box-sizing: border-box;
 +
                width: 50%;
 +
                 display: flex;
 +
                justify-content: center;
 +
                background-color:#000000;
 +
                padding:10px;
 +
                padding-bottom: 99999px;
 +
                margin-bottom: -99999px;
 
             }
 
             }
             /* Clear floats after the columns */
+
             .row{
 +
            overflow: hidden;
 +
            }
 
             .row:after {
 
             .row:after {
 
                 content: "";
 
                 content: "";
Line 47: Line 120:
 
                 clear: both;
 
                 clear: both;
 
             }
 
             }
 
+
             .center2 {
             img.team{
+
                border-radius: 50%;
+
 
                 display: block;
 
                 display: block;
                 width:100%;
+
                 margin-left: auto;
                max-width:250px;
+
                 margin-right: auto;
                height:auto;
+
 
            }   
+
            h3{
+
                color:#00a6d6;
+
                 margin:0px;
+
                margin-bottom:-10px;
+
 
             }
 
             }
             h4{
+
             .hero-home {
                 margin:0px;
+
                 text-align: center;
                 margin-bottom: 10px;
+
                 position: absolute;
 +
                top: 90%;
 +
                left: 50%;
 +
                transform: translate(-50%, -50%);
 +
                color: white;
 
             }
 
             }
 +
            .buttontu {
  
 
+
                border-color: #0072b2;
            #box{
+
                 border-style: solid;
                 -webkit-box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.26);
+
                 border-width:medium;
                 -moz-box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.26);
+
                 color: #0072b2!important;
                 box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.26);
+
                padding: 1%;
 
+
                 text-align: center;
                 border-radius: 10px 10px 10px 10px;
+
                 text-decoration: none;
                 -moz-border-radius: 10px 10px 10px 10px;
+
                 display: inline-block;
                 -webkit-border-radius: 10px 10px 10px 10px;
+
                cursor: pointer;
                 border: 1px solid #BFBFBF;
+
                 border-radius: 8px;
 
             }
 
             }
 
+
             .buttontu:hover {
             .supervisors{
+
                 background-color: #0072b2;
                 background-color: #f8fcfe;
+
                opacity: 0.75;
 +
                text-decoration:none;
 +
                color:#fff !important;
 
             }
 
             }
             .supervisors td {
+
             .buttontu2 {
                 padding:18px;
+
 
 +
                border-color: #0072b2;
 +
                border-style: solid;
 +
                border-width:medium;
 +
                color: #0072b2;!important;
 +
                 padding: 0.5%;
 +
                text-align: center;
 +
                text-decoration: none;
 +
                display: inline-block;
 +
                cursor: pointer;
 +
                border-radius: 8px;
 +
                margin-left:auto;
 +
                margin-right:auto;
 +
 
 
             }
 
             }
             #boxsupervisors{
+
             .buttontu2:hover {
                 -webkit-box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.26);
+
                 background-color: #0072b2;
                 -moz-box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.26);
+
                 opacity: 0.75;  
                 box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.26);
+
                 text-decoration:none;
 +
                color:#ffffff!important;
 
             }
 
             }
  
             div.polaroid {
+
             .buttontu3 {
                width: 250px;
+
                border-radius: 10px 10px 10px 10px;
+
                -moz-border-radius: 10px 10px 10px 10px;
+
                -webkit-border-radius: 10px 10px 10px 10px;
+
            }
+
 
+
 
+
            div.container {
+
                padding: 10px;
+
  
 +
                border-color: #ffffff;
 +
                border-style: solid;
 +
                border-width:medium;
 +
                color: #ffffff!important;
 +
                padding: 0.5%;
 
                 text-align: center;
 
                 text-align: center;
 +
                text-decoration: none;
 +
                display: inline-block;
 +
                cursor: pointer;
 +
                border-radius: 8px;
 +
                margin-left:auto;
 +
                margin-right:auto;
 +
 
             }
 
             }
             p2 {
+
             .buttontu3:hover {
                 font-size: 75%;
+
                 background-color: #ffffff;
 +
                opacity: 0.75;
 +
                text-decoration:none;
 +
                color:#000000!important;
 
             }
 
             }
             p {
+
             .centerjustify2 {
                 line-height:normal;
+
                 margin-left: auto;
 +
                margin-right: auto;
 +
                width: 80%;
 +
                margin-top: 60px;
 +
                margin-bottom: 60px;
 +
                text-align: justify;
 
             }
 
             }
             .centerjustify {
+
             .centerjustify3 {
 
                 margin-left: auto;
 
                 margin-left: auto;
 
                 margin-right: auto;
 
                 margin-right: auto;
                 width: 70%;
+
                 width: 30%;
 
                 margin-top: 60px;
 
                 margin-top: 60px;
 
                 margin-bottom: 60px;
 
                 margin-bottom: 60px;
 
                 text-align: justify;
 
                 text-align: justify;
 
             }
 
             }
 +
            .hero-home {
 +
                text-align: center;
 +
                position: absolute;
 +
                top: 90%;
 +
                left: 50%;
 +
                transform: translate(-50%, -50%);
 +
                color: white;
 +
            }
 +
            .mySlides {display: none}
 +
            img {vertical-align: middle;}
  
 +
            /* Slideshow container */
 +
            .slideshow-container {
 +
                max-width: 100%;
 +
                position: relative;
 +
                margin:auto;
 +
            }
 +
 +
 +
            /* The dots/bullets/indicators */
 +
            .dot {
 +
                cursor: pointer;
 +
                height: 20px;
 +
                width: 20px;
 +
                margin: 0.6%;
 +
                margin-top:1%;
 +
                background-color: #bbb;
 +
                border-radius: 50%;
 +
                display: inline-block;
 +
                transition: background-color 0.6s ease;
 +
            }
 +
 +
            .active, .dot:hover {
 +
                background-color: #717171;
 +
            }
 +
 +
            /* Fading animation */
 +
            .fade {
 +
                -webkit-animation-name: fade;
 +
                -webkit-animation-duration: 3s;
 +
                animation-name: fade;
 +
                animation-duration: 3s;
 +
            }
 +
            .w3-display-bottommiddle{position:absolute;left:50%;bottom:0;transform:translate(-50%,0%);-ms-transform:translate(-50%,0%)}
 +
            @-webkit-keyframes fade {
 +
                from{opacity: 0}
 +
                to {opacity: 1}
 +
 +
            }
 +
 +
            @keyframes fade {
 +
                from{opacity: 0}
 +
                to {opacity: 1}
 +
            }
 +
            /*****************************************
 +
            *  --------------------------------------*
 +
            *  Vars                                  *
 +
            *  --------------------------------------*
 +
            *****************************************/
 +
 +
            $bg: #34495e;
 +
            $white: #fff;
 +
            $raleway: 'Raleway', sans-serif;
 +
 +
            /*****************************************
 +
            *  --------------------------------------*
 +
            *  General                              *
 +
            *  --------------------------------------*
 +
            *****************************************/
 +
 +
            .hmcontainer {
 +
                padding: 50px;
 +
            }
 +
 +
 +
            /*****************************************
 +
            *  --------------------------------------*
 +
            *  Slick                                *
 +
            *  --------------------------------------*
 +
            *****************************************/
 +
 +
            .cl {
 +
                padding:0%;
 +
                cursor:pointer;
 +
            }
 +
 +
            .slick-active {
 +
                padding: 20px 0;
 +
            }
 +
 +
            .slick-center {
 +
                transform: scale(1.08)
 +
            }
 +
 +
            .slick-slide:not(.slick-active) {
 +
                margin: 20px 0;
 +
            }
 +
 +
            .child {
 +
                width:100%;
 +
            }
 +
 +
            .hmcontainer.slide:not(.slick-active) {
 +
                cursor: pointer;
 +
            }
 +
 +
            .pagination {
 +
                text-align: center;
 +
                color: $white;
 +
                font-family: $raleway;
 +
                font-size: 1.2rem;
 +
            }
 +
            .banneroh10{
 +
            width:10%;
 +
            }
 +
            .banneroh40{
 +
            width:40%;
 +
            }
 +
            .banneroh18{
 +
            width:18%;
 +
            }
 
             @media screen and (max-width: 800px) {
 
             @media screen and (max-width: 800px) {
 
                 .row {
 
                 .row {
 
                     display: flex;
 
                     display: flex;
 
                     flex-wrap: wrap;
 
                     flex-wrap: wrap;
 
 
                 }
 
                 }
                 .left,
+
                 .left{
                .right,
+
                .right2,
+
                .left2 {
+
 
                     flex: 0 0 100%;
 
                     flex: 0 0 100%;
 
                     max-width: 100%;
 
                     max-width: 100%;
 
                     width:100%;
 
                     width:100%;
                     padding:10px;
+
                     padding:25px;
 +
                    background-color:#000000;
 +
                    padding-bottom: 0px;
 +
                    margin-bottom: 0px;
 
                 }
 
                 }
                 img.team{
+
                 .right {
                     border-radius: 50%;
+
                     flex: 0 0 100%;
 +
                    max-width: 100%;
 +
                    width:100%;
 +
                    padding:25px;
 +
                    background-color:#fbfbfb;
 +
                    padding-bottom: 0px;
 +
                    margin-bottom: 0px;
 +
                } 
 +
                .left3{
 +
                    flex: 0 0 100%;
 +
                    max-width: 100%;
 +
                    width:100%;
 +
                    padding:25px;
 +
                    background-color:#e1e1e1;
 +
                    padding-bottom: 0px;
 +
                    margin-bottom: 0px;
 +
                }
 +
                .right3 {
 +
                    flex: 0 0 100%;
 +
                    max-width: 100%;
 +
                    width:100%;
 +
                    padding:25px;
 +
                    background-color:#eeeeee;
 +
                    padding-bottom: 0px;
 +
                    margin-bottom: 0px;
 +
                } 
 +
 
 +
                .right2
 +
                {
 +
                    flex: 0 0 100%;
 +
                    max-width: 100%;
 +
                    width:100%;
 +
                    padding:25px;
 +
                    background-color:#000000;
 +
                    padding-bottom: 0px;
 +
                    margin-bottom: 0px;
 +
                }
 +
                .left2
 +
                {
 +
                    flex: 0 0 100%;
 +
                    max-width: 100%;
 +
                    width:100%;
 +
                    padding:25px;
 +
                    background-color:#fbfbfb;
 +
                    padding-bottom: 0px;
 +
                    margin-bottom: 0px;
 +
                }
 +
 
 +
                img.sponsorpage {
 
                     display: block;
 
                     display: block;
                     width:50%;
+
                     margin:auto;
                     height:auto;
+
                     width:100%;
 +
                }
 +
                .centerjustify2 {
 
                     margin-left: auto;
 
                     margin-left: auto;
 
                     margin-right: auto;
 
                     margin-right: auto;
 +
                    width: 90%;
 +
                    margin-top: 60px;
 +
                    margin-bottom: 60px;
 +
                    text-align: justify;
 
                 }
 
                 }
                 .right2 {
+
                 .centerjustify3 {
                     order: 1;
+
                     margin-left: auto;
                }
+
                    margin-right: auto;
                .left2 {
+
                    width: 90%;
                     order: 2;
+
                    margin-top: 60px;
 +
                    margin-bottom: 60px;
 +
                     text-align: justify;
 
                 }
 
                 }
 +
            .banneroh10{
 +
            width:25%;
 +
            }
 +
            .banneroh40{
 +
            width:100%;
 +
            }
 +
            .banneroh18{
 +
            width:80%;
 +
            }
 +
.containerhome {
 +
                width: 100%;
 +
                height: auto;
 +
                margin: 0 auto 40px;
  
                td {
 
                    display: table-row;
 
                }
 
 
             }
 
             }
 +
}
 +
#my_centered_buttons { display: flex; justify-content: center; }
 +
 +
.centerfoto {
 +
  display: block;
 +
  margin-left: auto;
 +
  margin-right: auto;
 +
  width: 85%;
 +
}
 +
 +
@media screen and (max-width: 800px) {
 +
.centerfoto {
 +
  display: block;
 +
  margin-left: auto;
 +
  margin-right: auto;
 +
  margin-top:10%;
 +
  margin-bottom:6%;
 +
  width: 85%;
 +
}
 +
}
 
         </style>
 
         </style>
 +
 
     </head>
 
     </head>
 +
 
     <body>
 
     <body>
 
+
        <div class="Banner">
        <div class="Banner container-fluid text-center mb-0 align-items-center ">
+
  
 
             <div class="display-2 mb-0">  
 
             <div class="display-2 mb-0">  
                <br>
+
              <div class="slideshow-container">
                <br>
+
<br>
                <br>
+
<br>
                <br>        
+
<br>
                <img src = "https://static.igem.org/mediawiki/2019/a/ae/T--TUDelft--Opentrons_Team.png" alt="TeamMemberlogo" style="width:60%"; >
+
<br>
 +
<div class="mySlides fade">
 +
  <img class="centerfoto" src = "https://static.igem.org/mediawiki/2019/c/c8/T--TUDelft--HomeAfter.png" alt="slide 1" >
 +
 
 +
</div>
 +
 
 +
<div class="mySlides fade">
 +
  <img class="centerfoto" src = "https://static.igem.org/mediawiki/2019/5/5b/T--TUDelft--HomeAfter5.png" alt="slide 2" >
 +
 
 +
</div>
 +
 
 +
<div class="mySlides fade">
 +
 
 +
  <img class="centerfoto" src = "https://static.igem.org/mediawiki/2019/3/3b/T--TUDelft--HomeAfter8.png" alt="slide 3" >
 +
 
 +
</div>
 +
 
 +
 
 +
<div class="mySlides fade">
 +
 
 +
  <img class="centerfoto" src = "https://static.igem.org/mediawiki/2019/2/2e/T--TUDelft--HomeAfter4.png" alt="slide 4" >
 +
 
 +
</div>
 +
 
 +
<div class="mySlides fade">
 +
 
 +
  <img class="centerfoto" src = "https://static.igem.org/mediawiki/2019/e/e4/T--TUDelft--HomeAfter3.png" alt="slide 5" >
 +
 
 +
</div>
 +
 
 +
<div class="mySlides fade">
 +
 
 +
  <img class="centerfoto" src = "https://static.igem.org/mediawiki/2019/9/95/T--TUDelft--HomeAfter7.png" alt="slide 6" >
 +
 
 +
</div>
 +
 
 +
<div class="mySlides fade">
 +
 
 +
  <img class="centerfoto" src = "https://static.igem.org/mediawiki/2019/8/85/T--TUDelft--HomeAfter6.png" alt="slide 7" >
 +
 
 +
</div>
 +
 
 +
<div class="mySlides fade">
 +
 
 +
  <img class="centerfoto" src = "https://static.igem.org/mediawiki/2019/e/e3/T--TUDelft--HomeAfter2.png" alt="slide 8" >
 +
 
 +
</div>
 +
</div>
 +
 
 +
<div style="text-align:center">
 +
  <span class="dot" onclick="currentSlide(1)"></span>
 +
  <span class="dot" onclick="currentSlide(2)"></span>
 +
  <span class="dot" onclick="currentSlide(3)"></span>
 +
  <span class="dot" onclick="currentSlide(4)"></span>
 +
  <span class="dot" onclick="currentSlide(5)"></span>
 +
  <span class="dot" onclick="currentSlide(6)"></span>
 +
  <span class="dot" onclick="currentSlide(7)"></span>
 +
  <span class="dot" onclick="currentSlide(8)"></span>
 +
</div>
 +
 
 
             </div>             
 
             </div>             
 +
        </div>       
 
         </div>
 
         </div>
  
 +
        <div style="background-color:#fbfbfb;">
 +
            <br>
  
        <div class="centerjustify">
+
            <div class="centerjustify2">
            <h2>Team Members</h2><br>
+
<div id="ScrollDown1"></div>
            <div id="box">
+
                <div class="rowhm">
  
 +
                    <a href="https://2019.igem.org/Team:TUDelft/Description"><div class="boxx columnhm">
 +
                        <img src = "https://static.igem.org/mediawiki/2019/9/96/T--TUDelft--mini_project_logo.png" alt="Project logo" style="width:100%;">
 +
                        </div></a>
  
                <div class="row">
+
                    <a href="https://2019.igem.org/Team:TUDelft/Results"><div class="boxx columnhm">
                    <div class="column left">
+
                         <img src = "https://static.igem.org/mediawiki/2019/f/f5/T--TUDelft--Minilogoresults_logo.png" alt="Results logo" style="width:100%;">
                         <img class="team"  src="https://static.igem.org/mediawiki/2019/3/3a/T--TUDelft--Hafsa.png" alt="Hafsa">
+
                        </div></a>
  
                     </div>
+
                     <a href="https://2019.igem.org/Team:TUDelft/Parts"><div class="boxx columnhm">
                    <div class="column right">
+
                         <img src = "https://static.igem.org/mediawiki/2019/8/88/T--TUDelft--Minilogoparts_logo.png" alt="Parts logo" style="width:100%;">  
                         <h3>Hafsa Akaouche</h3>
+
                        </div></a>
                        <h4>Sponsoring Manager</h4>
+
                        <p>Hello everyone! My name is Hafsa Akaouche and I am this year’s Sponsor Manager. I am a first year Nanobiology Master student. In the team my job is to make sure that money will not be an issue. To achieve this I reach out to companies, institutes and apply for funds. When I am not busy with iGEM I like to play games and read books.</p>
+
                    </div>
+
                </div>
+
  
                <div class="row">
+
                     <a href="https://2019.igem.org/Team:TUDelft/Model"><div class="boxx columnhm">
                     <div class="column left2">
+
                         <img src = "https://static.igem.org/mediawiki/2019/2/2b/T--TUDelft--mini_model_logo.png" alt="Model logo" style="width:100%;">  
                        <h3 style="text-align: right;">Joel Clotet i Peretó</h3>
+
                        </div></a>
                        <h4 style="text-align: right;">Communications Manager &amp; Human Practice Manager</h4>
+
                        <p>Hey! My name is Joel and I am this year’s Communications Manager & Human Practice Manager. This means I make sure everyone (either the sponsors or the general public) has a clear idea of how our project goes and what we do, through our newsletter, posters, and social media. I am currently a LST MSc student at the TU Delft, but I come from the Autonomous University of Barcelona, where I did my BSc in Biotechnology. There I organised multiple scientific events with the Catalan Association of Biotechnologists (ASBTEC), and I was involved in scientific communication initiatives. I think iGEM gives young students the opportunity to come up with solutions to current problems and materialize them.</p>
+
                    </div>
+
                    <div class="column right2">
+
                         <img class="team"  src="https://static.igem.org/mediawiki/2019/c/ca/T--TUDelft--Joel.png" alt="Joel">
+
                    </div>
+
                </div>
+
  
                <div class="row">
+
                    <a href="https://2019.igem.org/Team:TUDelft/Human_Practices"><div class="boxx columnhm">
                    <div class="column left">
+
                         <img src = "https://static.igem.org/mediawiki/2019/5/53/T--TUDelft--HP_mini_logo.png" alt="Human Pratices logo" style="width:100%;">  
                         <img class="team"  src="https://static.igem.org/mediawiki/2019/3/36/T--TUDelft--Osman.png" alt="Osman">
+
                         </div></a>
                    </div>
+
                    <div class="column right">
+
                         <h3>Osman Esen</h3>
+
                        <h4>Finance Manager</h4>
+
                        <p>Hey hey! My name is Osman and I am currently doing my Master in Biomedical Engineering after having completed the Life Science and Technology
+
                            Bachelor. I am this year’s Finance Manager and it is my job to keep track of all the finances. Besides being part of this awesome team, I’m also coaching eight talented girls at my rowing association. Sometimes, if you look very carefully to the river, you might spot me rowing on the water to clear my mind. Otherwise you will probably find me in a store buying new shoes.</p>
+
                    </div>
+
 
                 </div>
 
                 </div>
  
                 <div class="row">
+
                 <br>
                    <div class="column left2" >
+
                <br>
                        <h3 style="text-align: right;">Sagarika Govindaraju</h3>
+
                <br>
                        <h4 style="text-align: right;">Lab Manager</h4>
+
                <br>
                        <p>Hey! I’m Sagarika and I’m a student of the Life Science and Technology Master. I will be the Lab Manager of this year’s iGEM team. As the Lab Manager, I’m involved in designing the wet lab modules and maintaining the lab. The potential of synthetic biology fascinates me and I’m excited to work with my team on a great project.</p>
+
            </div>
                    </div>
+
        </div>
                    <div class="column right2">
+
                        <img class="team"  src="https://static.igem.org/mediawiki/2019/6/6d/T--TUDelft--Sagarika.png" alt="Sagarika">
+
                    </div>
+
                </div>
+
  
 +
        <div  data-aos="fade-up" data-aos-duration="3000">
 +
            <div style="background-color:#fbfbfb;cursor: pointer;" onclick="window.location='https://2019.igem.org/Team:TUDelft/Description';">
  
 +
                <div class="centerjustify2" style="text-align:center;">
 +
                    <br>
 +
                    <p style="font-size:xx-large;"> <b> Engineering organism-specific parts and utilizing existing parts across different species is extremely laborious and expensive </b> </p>
 +
                        <p style="font-size:large;">which restricts the scope of synthetic biology to a small subset of the bacterial cosmos.</p>
 +
                    <br>
 +
                    <img class="banneroh" src = "https://static.igem.org/mediawiki/2019/8/84/T--TUDelft--steps_parts.png" alt="Parts road">
 +
                </div>
 +
                <br>
 +
            </div>
 +
        </div>
 +
        <br>
 +
        <br>
  
                <div class="row">
+
        <div class="row">
                    <div class="column left">
+
            <div data-aos="fade-up" data-aos-duration="3000">
                        <img class="team"  src="https://static.igem.org/mediawiki/2019/2/25/T--TUDelft--Esther.png" alt="Esther">
+
                    </div>
+
                    <div class="column right">
+
                        <h3>Esther Hoogerwerf</h3>
+
                        <h4>Secretary & Collaborations Manager &amp; Safety Officer</h4>
+
                        <p>Hey there! My name is Esther Hoogerwerf and I am this year’s Collaborations Manager and Safety Officer. This means I get to talk to people and make sure we do not do anything illegal in the lab 😉. For me iGEM is part of my MSc Nanobiology at the Technical University of Delft. This is also where I did my BSc Nanobiology. I see iGEM as a unique opportunity to work in a team on a cool and relevant project. In my free time you can find me hanging out with my family or friends, reading thrillers or playing games.</p>
+
                    </div>
+
                </div>
+
  
                 <div class="row">
+
                 <div class="left" style="text-align:center;">
                    <div class="column left2" >
+
                    <div class="centerjustify2">
                        <h3 style="text-align: right;">Weronika Hoska van Aken</h3>
+
                         <p>hm</p>
                        <h4 style="text-align: right;">Data Manager</h4>
+
                        <br>
                         <p>Hello! I am Weronika and I am in my first year of the Master Nanobiology. In iGEM I will be the Data Manager, meaning I will be the bridge between the wet and dry lab. The generated data of the wet lab will be used for modeling in the dry lab and vice versa by testing the results of the modelling in the wet lab to see if the modeling is accurate. My specific tasks will be to collect the data and analyze it. Moreover, I will assure the quality of the generated data. In my free time I like to play handball and watch soccer.</p>
+
                    </div>
+
                    <div class="column right2">
+
                      <img class="team"  src="https://static.igem.org/mediawiki/2019/a/a8/T--TUDelft--Weronika.png" alt="Weronika">
+
                    </div>
+
                </div>
+
  
                <div class="row">
+
                         <img src = "https://static.igem.org/mediawiki/2019/e/e7/T--TUDELFT--logonavbar-white.png" alt="Sci-Phi 29" style="width:100%;">  
                    <div class="column left">
+
                         <img class="team"  src="https://static.igem.org/mediawiki/2019/8/85/T--TUDelft--Dennis.png" alt="Dennis">
+
                    </div>
+
                    <div class="column right">
+
                        <h3>Dennis Kenbeek</h3>
+
                        <h4>Modeling Manager</h4>
+
                        <p>Hi there! My name is Dennis Kenbeek and I am currently doing my Bachelor Nanobiology. I am interested in how computational methods can be used to solve problems in biology. It therefore excites me to fulfill the task of Modeling Manager this year, together with the dry lab team we will use the power of computers to help the team in the wet lab.  When I’m not busy with iGEM, I am probably homebrewing. For anything beer related you can always contact me!</p>
+
                    </div>
+
                </div>
+
                <div class="row">
+
                    <div class="column left2">
+
                        <h3 style="text-align: right;">Huyen My Nguyen</h3>
+
                        <h4 style="text-align: right;">Wiki Manager & Team Captain</h4>
+
                        <p>Hi all! My name is Huyen My and I am an MSc Biomedical Engineering student with a Life Science and Technology bachelor degree. This year I decided to take on a challenge, thus I started to learn HTML to be responsible for our wiki page. Furthermore, you can find me at the wet lab, sponsoring or communication team if I am not behind the keyboard. iGEM provides a great opportunity to expand my knowledge in science and to develop myself in many different areas.</p>
+
                    </div>
+
                    <div class="column right2">
+
                      <img class="team"  src="https://static.igem.org/mediawiki/2019/9/9a/T--TUDelft--HuyenMy.png" alt="HuyenMy">
+
                    </div>
+
                </div>
+
  
                 <div class="row">
+
                        <br>
                    <div class="column left">
+
                        <br>
                      <img class="team" src="https://static.igem.org/mediawiki/2019/c/cf/T--TUDelft--Marco.png" alt="Marco">
+
                        <p>hm</p>
                     </div>
+
 
                    <div class="column right">
+
                    </div>
                        <h3>Marco Valentim Becker</h3>
+
                 </div>  
                        <h4>Science Manager</h4>
+
            </div>
                        <p>Hello! My name is Marco and I am from Brazil. As the Science Manager, I am responsible for organizing the project design and dividing the project into modules. I’m really passionate about discussing possible directions with the team and finding solutions to scientific problems together! I’ll be working in both the wet lab and dry lab and keep an overview on both of them. If not in the office or the lab I am probably obsessing over iGEM somewhere else.</p>
+
 
 +
            <div  data-aos="fade-up" data-aos-duration="3000">
 +
                <div style="cursor: pointer;" onclick="window.location='https://2019.igem.org/Team:TUDelft/Description';">              
 +
                     <div class="right">
 +
                        <div class="centerjustify2">
 +
                            <p style="font-size:large; line-height: 200%;"> We developed <b style="font-size:xx-large;color:#0072b2;">Sci-Phi 29</b>, a platform that expands the scope of synthetic biology by providing essential tools required to engineer a repertoire of bacterial species.</p>
 +
                            <br>
 +
                            <br>
 +
                            <a href="https://2019.igem.org/Team:TUDelft/Description" class="buttontu "><b>Read More</b></a>                     
 +
                        </div>        
 
                     </div>
 
                     </div>
 
                 </div>
 
                 </div>
 +
                <br>
 +
            </div>
 +
        </div>
  
                <div class="row">
+
        <div data-aos="fade-up" data-aos-duration="3000">
                    <div class="column left2">
+
            <div style="background-color:#fbfbfb;cursor: pointer;" onclick="window.location='https://2019.igem.org/Team:TUDelft/Description';">
                        <h3 style="text-align: right;">Renée van der Winden</h3>
+
                        <h4 style="text-align: right;">Team Captain</h4>
+
                            <p>Hi everyone! My name is Renée van der Winden and I am currently doing my Master in Nanobiology after having completed the Nanobiology Bachelor. I am this year’s Team Captain and it is my job to make sure everything gets done that needs to be done. Of course, I also make sure everyone’s spirits are up, so we can keep working hard as a team! I am really passionate about iGEM and cannot wait to see what we will achieve as a team. When I manage to tear myself away from iGEM for a moment, I like to read or play board games. You can also always call me to help assemble your IKEA furniture.</p>
+
 
+
                            </div>
+
                        <div class="column right2">
+
                            <img class="team" src="https://static.igem.org/mediawiki/2019/3/3c/T--TUDelft--renee.jpg" alt="Renee">
+
                        </div>
+
  
 +
                <div class="centerjustify2" style="text-align: center;">
 +
                    <br>
 +
                    <div class="centerjustify2" style="text-align: center;"><p style=" font-size:xx-large;"> <b> How does Sci-Phi 29 work? </b> </p>
 
                     </div>
 
                     </div>
  
  
                 </div>
+
                 </div>  
 
                 <br>
 
                 <br>
 +
            </div>
 +
        </div>
 +
        <div data-aos="fade-up" data-aos-duration="3000">
 +
            <div style="text-align:center; background-color:#fbfbfb;" >
 +
                <br>
 +
                <img class="banneroh40" src = "https://static.igem.org/mediawiki/2019/1/1c/T--TUDelft--Bacteria_home.png" alt="Different Bacteria" >
 +
            </div>
 +
        </div>
 +
 +
        <div data-aos="fade-up" data-aos-duration="3000">
 +
            <div style="text-align:center; background-color:#fbfbfb;" >
 +
                <img class="banneroh10" src = "https://static.igem.org/mediawiki/2019/d/de/T--TUDelft--ArrowPattern.png" alt="Arrow">
 +
            </div>
 +
        </div>
 +
        <div data-aos="fade-up" data-aos-duration="3000">
 +
            <div style="text-align:center; background-color:#fbfbfb;cursor: pointer;" onclick="window.location='https://2019.igem.org/Team:TUDelft/Design';">
 +
                <img class="banneroh18" src = "https://static.igem.org/mediawiki/2019/d/d3/T--TUDelft--Sci-PhiKit.png" alt="Different Bacteria">
 +
                <p><b style="font-size:xx-large;color:#0072b2;">Sci-Phi 29</b></p>
 +
 +
                <p style="width:60%;margin-left:auto; margin-right:auto;font-size:x-large;"> A user-friendly platform that allows engineering your bacteria of choice through:</p><br>
 +
            </div>
 +
        </div>
 +
        <div data-aos="fade-up" data-aos-duration="3000">
 +
            <div style="text-align:center; background-color:#fbfbfb;" >
 +
                <img class="banneroh" src = "https://static.igem.org/mediawiki/2019/9/9e/T--TUDelft--Arrowpatternsplit.png" alt="Arrow split">
 
                 <br>
 
                 <br>
 +
                <br>
 +
            </div>
 +
        </div>
  
  
                 <h2>Supervisors</h2>
+
        <div class="row">
 +
            <div data-aos="fade-up" data-aos-duration="3000">
 +
                 <div class="left3" style="text-align:center;">
 +
                    <div class="centerjustify2">
 +
                        <center><img src = "https://static.igem.org/mediawiki/2019/f/f0/T--TUDelft--logorepli.png" alt="Orthogonality" style="width:46%;"></center>
  
  
                <table class="supervisors" align="center">
+
                        <br>
                    <tr>
+
                        <p style="font-size:large; line-height: 200%;"> To express genetic tools <b style="font-size:x-large;color:#0072b2;">across multiple bacterial species</b>, we were inspired by the replication machinery of the phi29 bacteriophage. Its unique <b style="font-size:x-large;color:#0072b2;">protein-primed</b> based replication greatly simplifies the design of replication systems. This system is able to replicate a linear piece of DNA by using <b style="font-size:x-large;color:#0072b2;">only four proteins</b>.</p>
                         <td>  <div id="boxsupervisors" class="polaroid">
+
                        <br>
                            <img src="https://static.igem.org/mediawiki/2019/9/9f/T--TUDelft--timon.jpg" alt="Timon" style="width:100%; border-radius: 10px;">
+
                        <br>
                            <div class="container">
+
                        <div class="boxx3"><center><img src = "https://static.igem.org/mediawiki/2019/2/2d/T--TUDelft--orthoreplihome.png" alt="Orthogonal Replication System" style="width:79%;"></center></div>
                                <p>Timon Idema </p>
+
                        <br>
                                 <p2>Associate Professor</p2>
+
                        <br>
 +
                        <center style="font-size:large;"><b>Find more about how we applied this unique system in our project!</b></center>
 +
                        <br>
 +
                         <center><a target="_blank" href="https://2019.igem.org/Team:TUDelft/Design" class="buttontu "><b>Read More</b></a></center>                     
 +
                    </div>
 +
                </div>   
 +
            </div>
 +
 
 +
            <div  data-aos="fade-up" data-aos-duration="3000">
 +
 
 +
                <div class="right3">
 +
                    <div class="centerjustify2">
 +
                        <center><img src = "https://static.igem.org/mediawiki/2019/5/56/T--TUDelft--logocontrol.png" alt="Controllability" style="width:49.7%;"></center>
 +
                        <p style="font-size:large; line-height: 200%;"> To tackle the issue of <b style="font-size:x-large;color:#0072b2;">variation in expression</b> across bacterial species, we applied <b style="font-size:x-large;color:#0072b2;">control systems</b> thinking to achieve controllability. </p>
 +
                        <br>
 +
                        <p style="font-size:large; line-height: 200%;">We included the following variables in our <a href="https://2019.igem.org/Team:TUDelft/Model"><u style="font-size:x-large;color:#0072b2;">model</u></a> and <a href="https://2019.igem.org/Team:TUDelft/Results"><u style="font-size:x-large;color:#0072b2;">experiments</u></a>:</p>
 +
                        <br>
 +
                        <br>
 +
                        <div class="rowhm">
 +
 
 +
                            <div class="boxx3 columnhm" >
 +
 
 +
                                 <a href="https://2019.igem.org/Team:TUDelft/Model#PlasmidCopyNumber"> <img src = "https://static.igem.org/mediawiki/2019/3/33/T--TUDelft--logoplasmidcopynumber.png" alt="Logo Plasmid Copy Number" style="width:100%;"></a>
 
                             </div>
 
                             </div>
                             </div></td>
+
 
                        <td><div id="boxsupervisors" class="polaroid">
+
 
                            <img src="https://static.igem.org/mediawiki/2019/5/5e/T--TUDelft--Christophe.jpg" alt="Christophe" style="width:100%;  border-radius: 10px;">
+
                             <div class="boxx3 columnhm" >
                            <div class="container">
+
 
                                <p>Christophe Danelon</p>
+
                                <a href="https://2019.igem.org/Team:TUDelft/Model#TranscriptionalVariations"><img src = "https://static.igem.org/mediawiki/2019/6/6f/T--TUDelft--logo_transcription2.png" alt="Logo Transcriptional Variations" style="width:100%;"></a>
                                <p2>Associate Professor</p2>
+
 
 
                             </div>
 
                             </div>
                             </div></td>
+
 
                        <td><div id="boxsupervisors" class="polaroid">
+
                             <div class="boxx3 columnhm">
                            <img src="https://static.igem.org/mediawiki/2019/a/ac/T--TUDelft--Supervisor_David.jpg" alt="David" style="width:100%; border-radius: 10px;">
+
                                <a href="https://2019.igem.org/Team:TUDelft/Model#TranslationalVariations"><img src = "https://static.igem.org/mediawiki/2019/b/b4/T--TUDelft--logo_transcription.png" alt="Logo Translational Variations" style="width:100%;"></a>
                            <div class="container">
+
                                <p>David Foschepoth</p>
+
                                <p2>Postdoc</p2>
+
 
                             </div>
 
                             </div>
                            </div></td>
+
                        </div>
                    </tr>
+
                        <br><br> <center style="font-size:large;"><b>Do you want to learn more about the details?</b></center>
 +
                        <br>
 +
                        <center><a href="https://2019.igem.org/Team:TUDelft/Design" class="buttontu"><b>Click here</b></a></center>  
  
 +
                    </div>       
 +
                </div>
 +
            </div>
 +
        </div>
  
                    <tr>
+
            <div data-aos="fade-up" data-aos-duration="3000">
                        <td><div id="boxsupervisors" class="polaroid">
+
                <div style="text-align:center; background-color:#fbfbfb;cursor: pointer;" onclick="window.location='https://2019.igem.org/Team:TUDelft/Human_Practices';">
                            <img src="https://static.igem.org/mediawiki/2019/6/65/T--TUDelft--zoe.jpg" alt="Zoe" style="width:100%border-radius: 10px;">
+
<div class="centerjustify2" style="text-align:center;">
                            <div class="container">
+
                    <br>
                                <p>Zoë Robaey</p>
+
                    <br>
                                 <p2>Assistant Professor</p2>
+
                    <img class="banneroh18" src = "https://static.igem.org/mediawiki/2019/2/21/T--TUDelft--sci-phitogether.png" alt="Sci-Phi 29 applications" style="align:center;">
 +
                    <p style="font-size:large;">To envision a future where our Sci-Phi 29 platform can be used to tackle a real world problem, we created a <b style="font-size:x-large;color:#0072b2;">hypothetical use-case scenario</b>. We theoretically applied Sci-Phi 29 to engineer <b style="font-size:x-large;color:#0072b2;"><i>P. putida</i></b> to be able to convert <b style="font-size:x-large;color:#0072b2;">microplastics</b> from waste water streams.</p>
 +
                    <br><br> <center style="font-size:x-large;"><i>Are you curious about the impact of our Sci-Phi 29 platform?</i></center>
 +
                    <br>
 +
                    <center><a target="_blank" href="https://2019.igem.org/Team:TUDelft/Human_Practices" class="buttontu2"><b>Click Here</b></a></center>
 +
                    <br>
 +
</div>
 +
                </div>
 +
            </div>
 +
 
 +
            <div data-aos="fade-up" data-aos-duration="3000">
 +
                <div style="background-color:#e1e1e1;" >
 +
                    <br>
 +
                    <div class="centerjustify2" style="text-align:center;">
 +
<p style=" font-size:xx-large;color:#0072b2;"> <b>Explore the microbial world with us! </b> </p>
 +
                        <br>
 +
                        <p style="font-size:large;"> We as a team are <b style="font-size:x-large;color:#0072b2;">fascinated by this microbial diversity</b> and wanted to share our fascination with the rest of the world. That is why our goal this year was to introduce the general public, from children to your neighbor to your teacher, to the hidden world of microbes. We organized <b style="font-size:x-large;color:#0072b2;">multiple events</b> because we wanted to make sure that everyone has <b style="font-size:x-large;color:#0072b2;">access</b> to the invisible microbial world.</p>
 +
<br>
 +
                        <center><a target="_blank" href="https://2019.igem.org/Team:TUDelft/Public_Engagement" class="buttontu2"><b>Read More</b></a></center>
 +
                    </div>
 +
                    <div class="hmcontainer">
 +
                        <div class="slider center">     
 +
                            <div class="slide">
 +
                                 <div class="cl"><img style="width:100%;" src = "https://static.igem.org/mediawiki/2019/b/b7/T--TUDelft--Joris.png" alt="Fold Scope Event" ></div>
 
                             </div>
 
                             </div>
                             </div></td>
+
                             <div class="slide">
                        <td>  <div id="boxsupervisors" class="polaroid">
+
                                <div class="cl"><img style="width:100%;"  src = "https://static.igem.org/mediawiki/2019/d/d6/T--TUDelft--fold2.png" >
                            <img src="https://static.igem.org/mediawiki/2019/6/60/T--TUDelft--Supervisor_Elisa.png" alt="Elisa" style="width:100%;  border-radius: 10px;">
+
 
                            <div class="container">
+
                                 </div>
                                 <p>Elisa Godino</p>
+
                                <p2>PhD candidate</p2>
+
 
                             </div>
 
                             </div>
                             </div></td>
+
                             <div class="slide">
                        <td>  <div id="boxsupervisors" class="polaroid">
+
                                <div class="cl">
                            <img src="https://static.igem.org/mediawiki/2019/1/1e/T--TUDELFT--britte.jpg" alt="Britte" style="width:100%;  border-radius: 10px;">
+
                                    <img style="width:100%;" src = "https://static.igem.org/mediawiki/2019/b/b2/T--TUDelft--Foldscope6tu.png"></div>
                            <div class="container">
+
                                <p>Britte Bouchaut</p>
+
                                <p2>PhD candidate</p2>
+
 
                             </div>
 
                             </div>
                             </div></td>
+
                             <div class="slide">
 +
                                <div class="cl"><img style="width:100%;" src = " https://static.igem.org/mediawiki/2019/7/78/T--TUDelft--foldscopegeenidee.png"></div>
 +
                            </div>     
 +
                            <div class="slide">
 +
                                <div class="cl"><img style="width:100%;" src = "https://static.igem.org/mediawiki/2019/1/1d/T--TUDelft--fold1.png"></div>
 +
                            </div>
 +
                            <div class="slide">
 +
                                <div class="cl">
 +
                                    <img style="width:100%;" src = "https://static.igem.org/mediawiki/2019/8/8c/T--TUDelft--Foldscopein1.png"></div>
 +
                            </div>
 +
                            <div class="slide">
 +
                                <div class="cl"><img style="width:100%;" src = " https://static.igem.org/mediawiki/2019/1/17/T--TUDelft--Foldscope7tu.png"></div>
 +
                            </div>
 +
                            <div class="slide">
 +
                                <div class="cl"><img style="width:100%;" src = "https://static.igem.org/mediawiki/2019/1/1d/T--TUDelft--fold1.png"></div>
 +
                            </div>
 +
                            <div class="slide">
 +
                                <div class="cl"><img style="width:100%;" src = "https://static.igem.org/mediawiki/2019/d/dc/T--TUDelft--Foldscope8tu.png "></div>
 +
                            </div>
 +
                            <div class="slide">
 +
                                <div class="cl "><img style="width:100%;" src = "https://static.igem.org/mediawiki/2019/c/c9/T--TUDelft--Foldscopein2.png"></div>
 +
                            </div>
 +
                            <div class="slide">
 +
                                <div class="cl "><img style="width:100%;" src = "https://static.igem.org/mediawiki/2019/4/47/T--TUDelft--Foldscope11tu.png "></div>
 +
                            </div>
 +
                            <div class="slide">
 +
                                <div class="cl "><img style="width:100%;" src = "https://static.igem.org/mediawiki/2019/a/ad/T--TUDelft--Foldscopein4.png"></div>
 +
                            </div>
 +
                            <div class="slide">
 +
                                <div class="cl "><img style="width:100%;" src = "https://static.igem.org/mediawiki/2019/3/34/T--TUDelft--Foldscope5tu.png "></div>
 +
                            </div>
 +
                            <div class="slide">
 +
                                <div class="cl "><img style="width:100%;" src = " https://static.igem.org/mediawiki/2019/d/d9/T--TUDelft--Foldscope9tu.png"></div>
 +
                            </div>
 +
                            <div class="slide">
 +
                                <div class="cl "><img style="width:100%;" src = "https://static.igem.org/mediawiki/2019/4/4e/T--TUDelft--Foldscopein7.png"></div>
 +
                            </div>
 +
                        </div>
 +
                    </div>
 +
                    <br>
 +
                    <br>
 +
                    <div style="background-color:#ffffff;">
 +
                        <br>
 +
                        <br>
 +
                        <p style=" font-size:xx-large;text-align:center;"> <b>Find out more about other aspects of our project</b> </p>
 +
                        <div class="centerjustify3">
 +
                            <div class="rowhm">
 +
 
 +
                                <a href="https://2019.igem.org/Team:TUDelft/Demonstrate"><div class="boxx columnhm">
 +
                                    <img src = "https://static.igem.org/mediawiki/2019/d/d3/T--TUDelft--Demonstrate_mini_logo.png" alt="Project logo" style="width:100%;">
 +
                                    </div></a>
 +
 
 +
                                <a href="https://2019.igem.org/Team:TUDelft/Safety"><div class="boxx columnhm">
 +
                                    <img src = "https://static.igem.org/mediawiki/2019/8/8e/T--TUDelft--Safety_mini_logo.png" alt="Results logo" style="width:100%;">
 +
                                    </div></a>
  
                    </tr>
+
                                <a href="https://2019.igem.org/Team:TUDelft/Collaborations"><div class="boxx columnhm">
 +
                                    <img src = "https://static.igem.org/mediawiki/2019/b/bd/T--TUDelft--Collaborations_mini_logo.png" alt="Parts logo" style="width:100%;">
 +
                                    </div></a>
  
                    <tr>
+
                                  
                        <td><div id="boxsupervisors" class="polaroid">
+
                            <img src="https://static.igem.org/mediawiki/2019/c/c7/T--TUDELFT--Charlotte.jpg" alt="Charlotte" style="width:100%;  border-radius: 10px;">
+
                            <div class="container">
+
                                 <p>Charlotte Koster</p>
+
                                <p2>PhD candidate</p2>
+
 
                             </div>
 
                             </div>
                            </div></td>
 
                        <td><div id="boxsupervisors" class="polaroid">
 
                            <img src="https://static.igem.org/mediawiki/2019/0/0c/T--TUDelft--Esengul.jpg" alt="Esengul" style="width:100%;  border-radius: 10px;">
 
                            <div class="container">
 
                                <p>Esengül Yildirim</p>
 
                                <p2>Technician</p2>
 
                            </div>
 
                            </div></td>
 
                        <td></td>
 
                    </tr>
 
  
 +
                        </div>
  
                 </table>
+
                    </div>
 +
                 </div>
 +
               
 +
               
 +
               
 +
                                            <p  style="font-size:xx-large;color:#0072b2;text-align: center;"><a href="https://2019.igem.org/Team:TUDelft/Team" ><b>Click here</b></a> to meet our team!</p>
 +
<br>
 +
                    <div>
 +
                                    <img src = "https://static.igem.org/mediawiki/2019/2/23/T--TUDelft--Team2.png" alt="Team Picture" style="width:100%;">
 +
 
 +
                    </div>
 +
             
 
             </div>
 
             </div>
  
             </body>
+
 
         </html>
+
 
 +
        <br>
 +
        <br>
 +
 
 +
        <script>
 +
 
 +
             AOS.init();
 +
 
 +
 
 +
var slideIndex = 1;
 +
var timer = null;
 +
showSlides(slideIndex);
 +
 
 +
function plusSlides(n) {
 +
  clearTimeout(timer);
 +
  showSlides(slideIndex += n);
 +
}
 +
 
 +
function currentSlide(n) {
 +
  clearTimeout(timer);
 +
  showSlides(slideIndex = n);
 +
}
 +
 
 +
function showSlides(n) {
 +
  var i;
 +
  var slides = document.getElementsByClassName("mySlides");
 +
  var dots = document.getElementsByClassName("dot");
 +
  if (n==undefined){n = ++slideIndex}
 +
  if (n > slides.length) {slideIndex = 1}
 +
  if (n < 1) {slideIndex = slides.length}
 +
  for (i = 0; i < slides.length; i++) {
 +
      slides[i].style.display = "none";
 +
  }
 +
  for (i = 0; i < dots.length; i++) {
 +
      dots[i].className = dots[i].className.replace(" active", "");
 +
  }
 +
  slides[slideIndex-1].style.display = "block";
 +
  dots[slideIndex-1].className += " active";
 +
  timer = setTimeout(showSlides, 4500);
 +
}
 +
 
 +
            var $st = $('.pagination');
 +
            var $slickEl = $('.center');
 +
 
 +
            $slickEl.on('init reInit afterChange', function (event, slick, currentSlide, nextSlide) {
 +
                var i = (currentSlide ? currentSlide : 0) + 1;
 +
                $st.text(i + ' of ' + slick.slideCount);
 +
            });
 +
 
 +
            $slickEl.slick({
 +
                centerMode: true,
 +
 
 +
                slidesToShow: 3,
 +
                focusOnSelect: true,
 +
                dots: false,
 +
                autoplay: true,
 +
                infinite: true,
 +
                prevArrow: false,
 +
                nextArrow: false,
 +
                responsive: [
 +
                    {
 +
                        breakpoint: 768,
 +
                        settings: {
 +
                            arrows: false,
 +
                            centerMode: true,
 +
                            centerPadding: '60px',
 +
                            slidesToShow: 1
 +
                        }
 +
                    },
 +
                    {
 +
                        breakpoint: 480,
 +
                        settings: {
 +
                            arrows: false,
 +
                            centerMode: true,
 +
                            centerPadding: '60px',
 +
                            slidesToShow: 1
 +
                        }
 +
                    }
 +
                ]
 +
            });
 +
        </script>
 +
        <script>
 +
 
 +
            $(document).ready(function() {
 +
 
 +
                setTimeout(() => { $(".cardhome").addClass('flipped')},3000)
 +
 
 +
 
 +
            })
 +
 
 +
         </script>
 +
 
 +
    </body>
 +
</html>
 +
 
 
{{:Team:TUDelft/Footer}}
 
{{:Team:TUDelft/Footer}}

Latest revision as of 06:41, 6 December 2019

Sci-Phi 29



Engineering organism-specific parts and utilizing existing parts across different species is extremely laborious and expensive

which restricts the scope of synthetic biology to a small subset of the bacterial cosmos.


Parts road



hm


Sci-Phi 29

hm

We developed Sci-Phi 29, a platform that expands the scope of synthetic biology by providing essential tools required to engineer a repertoire of bacterial species.



Read More


How does Sci-Phi 29 work?



Different Bacteria
Arrow
Different Bacteria

Sci-Phi 29

A user-friendly platform that allows engineering your bacteria of choice through:


Arrow split

Orthogonality

To express genetic tools across multiple bacterial species, we were inspired by the replication machinery of the phi29 bacteriophage. Its unique protein-primed based replication greatly simplifies the design of replication systems. This system is able to replicate a linear piece of DNA by using only four proteins.



Orthogonal Replication System


Find more about how we applied this unique system in our project!

Read More
Controllability

To tackle the issue of variation in expression across bacterial species, we applied control systems thinking to achieve controllability.


We included the following variables in our model and experiments:





Do you want to learn more about the details?

Click here


Sci-Phi 29 applications

To envision a future where our Sci-Phi 29 platform can be used to tackle a real world problem, we created a hypothetical use-case scenario. We theoretically applied Sci-Phi 29 to engineer P. putida to be able to convert microplastics from waste water streams.



Are you curious about the impact of our Sci-Phi 29 platform?

Click Here


Explore the microbial world with us!


We as a team are fascinated by this microbial diversity and wanted to share our fascination with the rest of the world. That is why our goal this year was to introduce the general public, from children to your neighbor to your teacher, to the hidden world of microbes. We organized multiple events because we wanted to make sure that everyone has access to the invisible microbial world.


Read More
Fold Scope Event




Find out more about other aspects of our project

Click here to meet our team!


Team Picture