Difference between revisions of "Team:Stuttgart/Description"

Line 1: Line 1:
 
<html>
 
<html>
  
−
<script>
+
<!--- THIS IS WHERE THE HTML BEGINS --->
  
−
     // This is the jquery part of your template.
+
<head>
−
    // Try not modify any of this code too much since it makes your menu work.
+
     <link href="https://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet"
 +
          id="bootstrap-css">
 +
    <style>
  
−
    $(document).ready(function() {
 
  
−
         $("#HQ_page").attr('id','');
+
         /***************************************************** DEFAULT WIKI SETTINGS  ****************************************************/
  
−
         // call the functions that control the menu
+
         /* Clear the default wiki settings */
−
        menu_functionality();
+
−
        hide_show_menu();
+
  
 +
        #home_logo, #sideMenu {
 +
            display: none;
 +
        }
  
 +
        #sideMenu, #top_title, .patrollink {
 +
            display: none;
 +
        }
  
−
         //this function controls the expand and collapse buttons of the menu and changes the +/- symbols
+
         #content {
−
         function menu_functionality() {
+
            width: 100%;
 +
            padding: 0px;
 +
            margin-top: -7px;
 +
            margin-left: 0px;
 +
         }
  
−
            //when clicking on a "menu_button", it will change the "+/-" accordingly and it will show/hide the corresponding submenu
+
        body {
−
             $(".menu_button").click(function(){
+
             background: white;
 +
        }
  
−
                // add or remove the class "open" , this class holds the "-"
+
        #bodyContent h1, #bodyContent h2, #bodyContent h3, #bodyContent h4, #bodyContent h5 {
−
                $(this).children().toggleClass("open");
+
            margin-bottom: 0;
−
                // show or hide the submenu
+
            color: #F8CE63;
−
                $(this).next('.submenu_wrapper').fadeToggle(400);
+
        }
−
            });
+
  
−
            // when the screen size is smaller than 800px, the display_menu_control button appears and will show/hide the whole menu
+
        table {;
−
            $("#display_menu_control").click(function(){
+
        }
−
                $('#menu_content').fadeToggle(400);
+
−
            });
+
  
−
            // call the current page highlight function
+
        /**************************************************************** MENU ***************************************************************/
−
             highlight_current_page();
+
        /* Wrapper for the menu */
 +
        .igem_2017_menu_wrapper {
 +
            width: 15%;
 +
            height: 100vh;
 +
            position: fixed;
 +
            right: 0;
 +
            padding: 0;
 +
            float: right;
 +
            border-left: 1px solid #F8CE63;
 +
            background-color: white;
 +
            text-align: left;
 +
            font-family: Tahoma, Geneva, sans-serif;
 +
            overflow-y: auto;
 +
             overflow-x: hidden;
 
         }
 
         }
  
 +
        /* this hides the scrollbar to keep view consistency */
 +
        .igem_2017_menu_wrappe::-webkit-scrollbar {
 +
            display: none;
 +
        }
  
−
         // call the highlight current page function to show it on the menu with a different background color
+
         /* styling for links in the menu, removes the line under text */
−
         function highlight_current_page() {
+
         .igem_2017_menu_wrapper a {
 +
            text-decoration: none;
 +
        }
  
−
            // select a page from the menu based on the id assigned to it and the current page name and add the class "current page" to make it change background color
+
        /* styling for the images in the menu */
−
             $("#"+  wgPageName.substring(wgPageName.lastIndexOf("/")+1, wgPageName.length ) + "_page").addClass("current_page");
+
        .igem_2017_menu_wrapper img {
 +
             width: 100%;
 +
        }
  
−
            // now that the current_page class has been added to a menu item, make the submenu fade in
+
        /* styling for the menu buttons */
−
            $(".current_page").parents(".submenu_wrapper").fadeIn(400);
+
        .igem_2017_menu_wrapper .menu_button {
−
             // change the +/- symbol of the corresponding menu button
+
            width: 100%;
−
             $(".current_page").parents(".submenu_wrapper").prev().children().toggleClass("open");
+
             padding: 10px 0px 10px 15px;
 +
            float: left;
 +
            border-bottom: 1px solid #F8CE63;
 +
             font-size: 16px;
 +
            font-weight: bold;
 +
            color: #F8CE63;
 +
            cursor: pointer;
 +
        }
  
 +
        .igem_2017_menu_wrapper .menu_bottom_padding {
 +
            width: 100%;
 +
            height: 30px;
 +
            float: left;
 
         }
 
         }
  
 +
        .menu_button.direct_to_page {
 +
            padding-left: 36px;
 +
        }
  
 +
        .igem_2017_menu_wrapper .menu_button .expand_collapse_icon {
 +
            width: 10%;
 +
            float: left;
 +
        }
  
−
         // allow button on the black menu bar to show/hide the side menu
+
         .igem_2017_menu_wrapper .menu_button .expand_collapse_icon::before {
−
         function hide_show_menu() {
+
            content: "+";
 +
         }
  
−
            // in case you preview mode is selected, the menu is hidden for better visibility
+
        /* styling for the menu buttons on hover */
−
            if (window.location.href.indexOf("submit") >= 0) {
+
        .igem_2017_menu_wrapper .menu_button:hover, .igem_2017_menu_wrapper .submenu_button:hover, .submenu_button.current_page:hover {
−
                $(".igem_2017_menu_wrapper").hide();
+
            background-color: #F8CE63;
−
             }
+
             text-decoration: none;
 +
            color: #190707;
 +
        }
  
−
            // if the black menu bar has been loaded
+
        /* styling for the menu button when it is the current page */
−
            if (document.getElementById('bars_item')) {
+
        .current_page {
 +
            background-color: white !important;
 +
            color: #F8CE63 !important;
 +
        }
  
−
                // when the "bars_item" has been clicked
+
        /* styling for the submenu buttons */
−
                $("#bars_item").click(function() {
+
        .igem_2017_menu_wrapper .submenu_button {
−
                    $("#sideMenu").hide();
+
            width: 100%;
 +
            padding: 10px 0px 10px 34px;
 +
            float: left;
 +
            background-color: white;
 +
            border-bottom: 1px solid #F8CE63;
 +
            font-size: 15px;
 +
            color: #F8CE63;
 +
            cursor: pointer;
 +
        }
  
−
                    // show/hide the menu wrapper
+
        /* wrapper for the submenu items, they are hidden by default*/
−
                    $(".igem_2017_menu_wrapper").fadeToggle("100");
+
        .igem_2017_menu_wrapper .submenu_wrapper {
−
                });
+
            display: none;
−
            }
+
        }
  
−
            // because the black menu bars loads at a different time than the rest of the page, this function is set on a time out so it can run again in case it has not been loaded yet
+
        /* when the page size is bigger than 800px, this show/hide control is hidden by default */
−
            else {
+
        .igem_2017_menu_wrapper #display_menu_control {
−
                setTimeout(hide_show_menu, 15);
+
            display: none;
−
             }
+
             text-align: center;
 
         }
 
         }
  
 +
        /***************************************************** CONTENT OF THE PAGE ****************************************************/
  
−
    });
+
        /* Wrapper for the content */
 +
        .igem_2017_content_wrapper {
 +
            width: 83%;
 +
            margin: 0;
 +
            display: block;
 +
            float: left;
 +
            background-color: white;
 +
            font-family: Tahoma, Geneva, sans-serif;
 +
        }
  
 +
        /********************************* HTML STYLING  *********************************/
  
−
</script>
+
        /* styling for the titles h1 h2 */
 +
        .igem_2017_content_wrapper h1, .igem_2017_content_wrapper h2 {
 +
            color: #F8CE63;
 +
            padding: 15px 0 25px 0;
 +
            border-bottom: 0;
 +
        }
  
−
<style>
+
        /* styling for the titles  h3 h4 h5 h6*/
 +
        .igem_2017_content_wrapper h3, .igem_2017_content_wrapper h4, .igem_2017_content_wrapper h5, .igem_2017_content_wrapper h6 {
 +
            padding: 5px 15px;
 +
            border-bottom: 0;
 +
        }
  
 +
        /* font and text */
 +
        .container p,
 +
        #HQ_page p {
 +
            line-height: 24px;
 +
            font-size: 16px;
 +
            color: #333;
 +
        }
  
 +
        .igem_2017_content_wrapper img {
 +
            padding: 15px 0;
 +
        }
  
−
    /***************************************************** DEFAULT WIKI SETTINGS  ****************************************************/
+
        /* Links */
 +
        .igem_2017_content_wrapper a {
 +
            font-weight: bold;
 +
            text-decoration: underline;
 +
            text-decoration-color: #190707;
 +
            color: #3399ff;
 +
            -webkit-transition: all 0.4s ease;
 +
            -moz-transition: all 0.4s ease;
 +
            -ms-transition: all 0.4s ease;
 +
            -o-transition: all 0.4s ease;
 +
            transition: all 0.4s ease;
 +
        }
  
−
    /* Clear the default wiki settings */
+
        /* hover for the links */
 +
        .igem_2017_content_wrapper a:hover {
 +
            text-decoration: none;
 +
            color: #000000;
 +
        }
  
−
    #home_logo, #sideMenu { display:none; }
+
        /* non numbered lists */
−
    #sideMenu, #top_title, .patrollink  {display:none;}
+
        .igem_2017_content_wrapper ul {
−
    #content { width:100%; padding:0px; margin-top:-7px; margin-left:0px;}
+
            padding: 0px 20px;
−
    body {background-color:white; }
+
            font-size: 15px;
−
    #bodyContent h1, #bodyContent h2, #bodyContent h3, #bodyContent h4, #bodyContent h5 { margin-bottom: 0px; }
+
            font-family: Tahoma, Geneva, sans-serif;
 +
        }
  
 +
        /* numbered lists */
 +
        .igem_2017_content_wrapper ol {
 +
            padding: 0px;
 +
            font-size: 15px;
 +
            font-family: Tahoma, Geneva, sans-serif;
 +
        }
  
 +
        /* Table */
 +
        .igem_2017_content_wrapper table {
 +
            width: 97%;
 +
            margin: 15px 10px;
 +
            border: 2px solid #190707;
 +
            border-collapse: collapse;
 +
        }
  
 +
        /* table cells */
 +
        .igem_2017_content_wrapper td {
 +
            padding: 10px;
 +
            vertical-align: text-top;
 +
            border: 1px solid #190707;
 +
            border-collapse: collapse;
 +
        }
  
−
    /**************************************************************** MENU ***************************************************************/
+
        /* table headers */
−
    /* Wrapper for the menu */
+
        .igem_2017_content_wrapper th {
−
    .igem_2017_menu_wrapper {
+
            padding: 10px;
−
        width: 15%;
+
            vertical-align: text-top;
−
        height:100vh;
+
            border: 1px solid #190707;
−
        position:fixed;
+
            border-collapse: collapse;
−
        right:0;
+
−
        padding:0;
+
−
        float:right;
+
−
        border-left: 1px solid #F8CE63;
+
−
        background-color:#190707;
+
−
        text-align:left;
+
−
        font-family:Tahoma, Geneva, sans-serif;
+
−
        overflow-y: auto;
+
−
        overflow-x: hidden;
+
−
    }
+
  
−
    /* this hides the scrollbar to keep view consistency */
+
         }
−
    .igem_2017_menu_wrappe::-webkit-scrollbar {
+
−
         display: none;
+
−
    }
+
  
 +
        /**********************************LAYOUT CLASSES **********************************/
  
−
    /* styling for links in the menu, removes the line under text */
+
        /* general class for column divs */
−
    .igem_2017_menu_wrapper a {
+
        .igem_2017_content_wrapper .column {
−
        text-decoration: none;
+
            padding: 10px 0px;
−
    }
+
            float: left;
 +
        }
  
 +
        /* class for a full width column */
 +
        .column .full_size {
 +
            width: 100%;
 +
        }
  
−
    /* styling for the images in the menu */
+
        /* styling for images in a full width column*/
−
    .igem_2017_menu_wrapper img {
+
        .column.full_size img {
−
        width: 100%;
+
            width: 97%;
−
    }
+
            padding: 10px 15px;
 +
        }
  
−
    /* styling for the menu buttons */
+
        /* class for a half width column */
−
    .igem_2017_menu_wrapper .menu_button {
+
        .column.half_size {
−
        width: 100%;
+
            width: 50%;
−
         padding: 10px 0px 10px 15px;
+
         }
−
        float:left;
+
−
        border-bottom: 1px solid #F8CE63;
+
−
        font-size: 20px;
+
−
        font-weight: bold;
+
−
        color: #F8CE63;
+
−
        cursor: pointer;
+
−
    }
+
  
 +
        /* styling for images in a half width column*/
 +
        .column.half_size img {
 +
            width: 94.5%;
 +
            padding: 10px 15px;
 +
        }
  
−
    .igem_2017_menu_wrapper .menu_bottom_padding {
+
         /********************************* SUPPORT CLASSES ********************************/
−
         width: 100%;
+
−
        height: 30px;
+
−
        float:left;
+
−
    }
+
  
−
    .menu_button.direct_to_page {
+
        /* class that clears content below*/
−
        padding-left: 36px;
+
        .igem_2017_content_wrapper .clear {
−
    }
+
            clear: both;
 +
        }
  
 +
        /* adds extra spacing when clearing content */
 +
        .igem_2017_content_wrapper .clear.extra_space {
 +
            height: 30px;
 +
        }
  
−
    .igem_2017_menu_wrapper .menu_button .expand_collapse_icon {
+
        /* highlight class, makes content slightly smaller */
−
        width:10%;
+
        .igem_2017_content_wrapper .highlight {
−
        float:left;
+
            margin: 0px 15px;
−
    }
+
            padding: 15px 0px;
 +
        }
  
−
    .igem_2017_menu_wrapper .menu_button .expand_collapse_icon::before {
+
        /* highlight class, adds a gray background */
−
        content: "+";
+
        .igem_2017_content_wrapper .highlight.gray {
−
    }
+
            background-color: #190707;
 +
        }
  
−
    .open::before {
+
        /* highlight with decoration blue line on top */
−
        content: "-" !important;
+
        .igem_2017_content_wrapper .highlight.blue_top {
−
    }
+
            border-top: 4px solid #190707;
 +
        }
  
 +
        /* highlight with a full blue border decoration */
 +
        .igem_2017_content_wrapper .highlight.blue_border {
 +
            border: 4px solid #190707;
 +
        }
  
 +
        /* button class */
 +
        .igem_2017_content_wrapper .button {
 +
            max-width: 35%;
 +
            margin: 30px auto;
 +
            padding: 12px 10px;
 +
            background-color: #190707;
 +
            text-align: center;
 +
            color: #F8CE63;
 +
            -webkit-transition: all 0.4s ease;
 +
            -moz-transition: all 0.4s ease;
 +
            -ms-transition: all 0.4s ease;
 +
            -o-transition: all 0.4s ease;
 +
            transition: all 0.4s ease;
 +
        }
  
−
    /* styling for the menu buttons on hover */
+
        /* styling for button on hover */
−
    .igem_2017_menu_wrapper .menu_button:hover, .igem_2017_menu_wrapper .submenu_button:hover ,  .submenu_button.current_page:hover {
+
        .igem_2017_content_wrapper .button:hover {
−
        background-color: #F8CE63;
+
            background-color: #190707;
−
        text-decoration: none;
+
            color: #F8CE63;
−
        color:#190707;
+
        }
−
    }
+
  
−
    /* styling for the menu button when it is the current page */
+
        /***************************************************** RESPONSIVE STYLING ****************************************************/
−
    .current_page {
+
−
        background-color:#190707  !important;
+
−
        color:#F8CE63 !important;
+
−
    }
+
  
 +
        *, *:before, *:after {
 +
            -webkit-box-sizing: border-box;
 +
            -moz-box-sizing: border-box;
 +
            box-sizing: border-box;
 +
        }
  
−
    /* styling for the submenu buttons */
+
        body {
−
    .igem_2017_menu_wrapper .submenu_button {
+
            overflow-x: hidden;
−
        width: 100%;
+
            margin-top: 80px;
−
        padding: 10px 0px 10px 34px;
+
            letter-spacing: 0.02em;
−
        float:left;
+
         }
−
        background-color:#190707;
+
−
        border-bottom: 1px solid #F8CE63;
+
−
        font-size: 15px;
+
−
         color: #F8CE63;
+
−
        cursor: pointer;
+
−
    }
+
  
−
    /* wrapper for the submenu items, they are hidden by default*/
+
        /* IF THE SCREEN IS LESS THAN 1200PX */
−
    .igem_2017_menu_wrapper .submenu_wrapper {
+
         @media only screen and (max-width: 1024px) {
−
         display:none;
+
−
    }
+
  
−
    /* when the page size is bigger than 800px, this show/hide control is hidden by default */
+
            #content {
−
    .igem_2017_menu_wrapper #display_menu_control {
+
                width: 100%;
−
        display:none;
+
            }
−
        text-align:center;
+
−
    }
+
  
 +
            .igem_2017_content_wrapper {
 +
                width: 100%;
 +
            }
  
−
    /***************************************************** CONTENT OF THE PAGE ****************************************************/
+
            .igem_2017_menu_wrapper {
 +
                width: 100%;
 +
                height: 15%;
 +
                position: relative;
 +
                left: 0;
 +
            }
  
−
    /* Wrapper for the content */
+
            .highlight {
−
    .igem_2017_content_wrapper {
+
                padding: 10px 0px;
−
        width: 81%;
+
            }
−
        margin: 2%;
+
−
        display:block;
+
−
        float:left;
+
−
        background-color: #190707;
+
−
        font-family:Tahoma, Geneva, sans-serif;
+
−
    }
+
  
 +
            .igem_2017_menu_wrapper #display_menu_control {
 +
                display: none;
 +
            }
  
−
    /********************************* HTML STYLING  *********************************/
+
            #menu_content {
 +
                display: block;
 +
            }
  
−
    /* styling for the titles h1 h2 */
+
            .menu_button.direct_to_page {
−
    .igem_2017_content_wrapper h1, .igem_2017_content_wrapper h2 {
+
                padding-left: 17px;
−
        color:#F8CE63;
+
            }
−
        padding:15px 0 25px 0;
+
         }
−
         border-bottom: 0;
+
−
    }
+
  
−
    /* styling for the titles  h3 h4 h5 h6*/
+
        /* IF THE SCREEN IS LESS THAN 800PX */
−
    .igem_2017_content_wrapper h3, .igem_2017_content_wrapper h4, .igem_2017_content_wrapper h5, .igem_2017_content_wrapper h6 {
+
         @media only screen and (max-width: 800px) {
−
         padding:5px 15px;
+
−
        border-bottom:0;
+
−
    }
+
  
−
    /* font and text */
+
            .igem_2017_content_wrapper {
−
    .igem_2017_content_wrapper p {
+
                width: 100%;
−
        padding: 15px 0;
+
                margin-left: 0;
−
        font-size: 15px;
+
            }
−
    }
+
−
    .igem_2017_content_wrapper img {
+
−
        padding: 15px 0;
+
−
    }
+
  
−
    /* Links */
+
            .column.half_size {
−
    .igem_2017_content_wrapper a {
+
                width: 100%;
−
        font-weight: bold;
+
            }
−
        text-decoration: underline;
+
−
        text-decoration-color: #190707;
+
−
        color:  #3399ff;
+
−
        -webkit-transition: all 0.4s ease;
+
−
        -moz-transition: all 0.4s ease;
+
−
        -ms-transition: all 0.4s ease;
+
−
        -o-transition: all 0.4s ease;
+
−
        transition: all 0.4s ease;
+
−
    }
+
  
−
    /* hover for the links */
+
            .column.full_size img, .column.half_size img {
−
    .igem_2017_content_wrapper a:hover {
+
                width: 100%;
−
        text-decoration:none;
+
                padding: 10px 0;
−
        color:#000000;
+
            }
−
    }
+
  
−
    /* non numbered lists */
+
            .highlight {
−
    .igem_2017_content_wrapper ul {
+
                padding: 15px 5px;
−
        padding:0px 20px;
+
            }
−
        font-size: 15px;
+
−
        font-family:Tahoma, Geneva, sans-serif;
+
−
    }
+
  
−
    /* numbered lists */
+
            .igem_2017_menu_wrapper #display_menu_control {
−
    .igem_2017_content_wrapper ol {
+
                display: block;
−
        padding:0px;
+
            }
−
        font-size: 15px;
+
−
        font-family:Tahoma, Geneva, sans-serif;
+
−
    }
+
  
−
    /* Table */
+
            #menu_content {
−
    .igem_2017_content_wrapper table {
+
                display: none;
−
        width: 97%;
+
            }
−
        margin:15px 10px;
+
−
        border: 2px solid #190707;
+
−
        border-collapse: collapse;
+
−
    }
+
  
−
    /* table cells */
+
            .igem_2017_menu_wrapper .menu_button .expand_collapse_icon {
−
    .igem_2017_content_wrapper  td {
+
                width: 5%;
−
        padding: 10px;
+
            }
−
        vertical-align: text-top;
+
−
        border: 1px solid #190707;
+
−
        border-collapse: collapse;
+
−
    }
+
  
−
    /* table headers */
+
            .menu_bottom_padding {
−
    .igem_2017_content_wrapper th {
+
                display: none;
−
        padding: 10px;
+
            }
−
        vertical-align: text-top;
+
−
        border: 1px solid #190707;
+
−
        border-collapse: collapse;
+
−
        background-color:##F8CE63;
+
−
    }
+
  
 +
            .menu_button.direct_to_page {
 +
                padding-left: 36px;
 +
            }
 +
        }
  
−
    /**********************************LAYOUT CLASSES **********************************/
+
        /* special class that the system uses to make sure the team wants a page to be evaluated */
 +
        .judges-will-not-evaluate {
 +
            width: 96.6%;
 +
            margin: 5px 15px;
 +
            display: block;
 +
            border: 4px solid #3399ff;
 +
            font-weight: bold;
 +
        }
  
−
    /* general class for column divs */
+
        /* CUSTOM BS NAVBAR STYLES */
−
    .igem_2017_content_wrapper .column  {
+
        .navbar {
−
        padding: 10px 0px;
+
            border: 0;
−
         float:left;
+
         }
−
    }
+
  
−
    /* class for a full width column */
+
        .navbar-default {
−
    .column .full_size {
+
            margin-top: 15px;
−
        width:100%;
+
            background-color: #333;
−
    }
+
        }
  
−
    /* styling for images in a full width column*/
+
        .navbar-brand {
−
    .column.full_size img {
+
            padding: 0;
−
        width:97%;
+
            padding-left: 25px;
−
        padding: 10px 15px;
+
            padding-right: 25px;
−
    }
+
        }
  
−
    /* class for a half width column */
+
         .navbar-brand img {
−
    .column.half_size {
+
            height: 49px;
−
         width: 50%;
+
         }
−
    }
+
−
    /* styling for images in a half width column*/
+
−
    .column.half_size img {
+
−
        width: 94.5%;
+
−
         padding: 10px 15px;
+
−
    }
+
  
 +
        .navbar-default .navbar-nav > li > a {
 +
            color: white;
 +
        }
  
 +
        .navbar-default .navbar-nav > li > a:focus,
 +
        .navbar-default .navbar-nav > li > a:hover,
 +
        .navbar-default .navbar-nav > .dropdown > a .caret:hover {
 +
            color: #F8CE63;
 +
        }
  
 +
        .navbar-default .navbar-nav > .open > a,
 +
        .navbar-default .navbar-nav > .open > a:hover,
 +
        .navbar-default .navbar-nav > .open > a:focus {
 +
            color: #F8CE63;
 +
            background-color: #444;
 +
        }
  
−
    /********************************* SUPPORT CLASSES ********************************/
+
        .navbar-default .navbar-nav > .dropdown > a .caret {
 +
            border-top-color: #eee;
 +
            border-bottom-color: #eee;
 +
        }
  
−
    /* class that clears content below*/
+
        .dropdown-menu {
−
    .igem_2017_content_wrapper .clear {
+
            border: 0;
−
         clear:both;
+
         }
−
    }
+
        .dropdown-menu > li > a {
 +
            color: white;
 +
        }
  
 +
        .dropdown-menu > li > a:hover,
 +
        .dropdown-menu > li > a:focus {
 +
            color: #111;
 +
            text-decoration: none;
 +
            background-color: #F8CE63;
 +
        }
  
−
    /* adds extra spacing when clearing content */
+
        .navbar-default .navbar-nav > .dropdown > a:hover .caret,
−
    .igem_2017_content_wrapper  .clear.extra_space {
+
        .navbar-default .navbar-nav > .dropdown > a:focus .caret {
−
        height: 30px;
+
            border-top-color: white;
−
    }
+
            border-bottom-color: white;
 +
        }
  
 +
        @media (max-width: 767px) {
 +
            .navbar-default .navbar-nav .open .dropdown-menu>li>a {
 +
                color: #ddd;
 +
            }
 +
            .navbar-default .navbar-nav .open .dropdown-menu>li>a:focus,
 +
            .navbar-default .navbar-nav .open .dropdown-menu>li>a:hover {
 +
                color: #F8CE63;
 +
            }
 +
        }
  
−
    /* highlight class, makes content slightly smaller */
+
        .navbar-nav>li>.dropdown-menu {
−
    .igem_2017_content_wrapper .highlight {
+
            background-color: #444;
−
        margin: 0px 15px;
+
         }
−
         padding: 15px 0px;
+
−
    }
+
  
 +
        .section {
 +
            margin: 25px 0;
 +
        }
  
−
     /* highlight class, adds a gray background */
+
     </style>
−
     .igem_2017_content_wrapper .highlight.gray {
+
     <script src="https://code.jquery.com/jquery-1.10.2.min.js"></script>
−
        background-color: #190707;
+
     <script src="https://netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
−
     }
+
  
−
     /* highlight with decoration blue line on top */
+
     <script>
−
    .igem_2017_content_wrapper .highlight.blue_top {
+
        $(document).ready(function(){
−
        border-top: 4px solid #190707;
+
            $("#mw-content-text").removeClass("mw-content-ltr");
−
    }
+
        });
 +
    </script>
  
−
    /* highlight with a full blue border decoration */
 
−
    .igem_2017_content_wrapper .highlight.blue_border {
 
−
        border: 4px solid  #190707;
 
−
    }
 
−
 
−
 
−
    /* button class */
 
−
    .igem_2017_content_wrapper .button{
 
−
        max-width: 35%;
 
−
        margin: 30px auto;
 
−
        padding: 12px 10px;
 
−
        background-color: #190707;
 
−
        text-align: center;
 
−
        color: #F8CE63;
 
−
        -webkit-transition: all 0.4s ease;
 
−
        -moz-transition: all 0.4s ease;
 
−
        -ms-transition: all 0.4s ease;
 
−
        -o-transition: all 0.4s ease; transition: all 0.4s ease;
 
−
    }
 
−
 
−
    /* styling for button on hover */
 
−
    .igem_2017_content_wrapper .button:hover{
 
−
        background-color: #190707;
 
−
        color: #F8CE63;
 
−
    }
 
−
 
−
 
−
 
−
 
−
    /***************************************************** RESPONSIVE STYLING ****************************************************/
 
−
 
−
    /* IF THE SCREEN IS LESS THAN 1200PX */
 
−
    @media only screen and (max-width: 1200px) {
 
−
 
−
        #content {width:100%; }
 
−
        .igem_2017_menu_wrapper {width:15%; right:0;}
 
−
        .highlight {padding:10px 0px;}
 
−
        .igem_2017_menu_wrapper #display_menu_control { display:none; }
 
−
        #menu_content { display:block;}
 
−
        .menu_button.direct_to_page {padding-left: 17px;}
 
−
 
−
    }
 
−
 
−
    /* IF THE SCREEN IS LESS THAN 800PX */
 
−
    @media only screen and (max-width: 800px) {
 
−
 
−
        .igem_2017_menu_wrapper { width:100%; height: 15%; position:relative; left:0%;}
 
−
        .igem_2017_content_wrapper {width:100%; margin-left:0px;}
 
−
        .column.half_size  {width:100%; }
 
−
        .column.full_size img, .column.half_size img {  width: 100%; padding: 10px 0px;}
 
−
        .highlight {padding:15px 5px;}
 
−
        .igem_2017_menu_wrapper #display_menu_control { display:block; }
 
−
        #menu_content { display:none;}
 
−
        .igem_2017_menu_wrapper .menu_button .expand_collapse_icon { width: 5%; }
 
−
        .menu_bottom_padding {display:none;}
 
−
        .menu_button.direct_to_page { padding-left: 36px; }
 
−
    }
 
−
 
−
 
−
 
−
 
−
    /* special class that the system uses to make sure the team wants a page to be evaluated */
 
−
    .judges-will-not-evaluate {
 
−
        width: 96.6%;
 
−
        margin: 5px 15px;
 
−
        display: block;
 
−
        border: 4px solid #3399ff;
 
−
        font-weight: bold;
 
−
    }
 
−
 
−
</style>
 
−
 
−
 
−
<!--- THIS IS WHERE THE HTML BEGINS --->
 
−
 
−
<head>
 
  
 
     <!-- This tells the browser that your page is responsive -->
 
     <!-- This tells the browser that your page is responsive -->
Line 453: Line 515:
  
 
</head>
 
</head>
−
 
+
<body>
  
 
<!--MENU-->
 
<!--MENU-->
−
<div class="igem_2017_menu_wrapper" >
+
<nav class="navbar navbar-default navbar-fixed-top">
−
 
+
     <div class="container-fluid">
−
 
+
         <!-- Brand and toggle get grouped for better mobile display -->
−
 
+
        <div class="navbar-header">
−
     <a href="https://2017.igem.org/Team:Stuttgart">
+
            <button type="button" class="navbar-toggle collapsed" data-toggle="collapse"
−
         <img src="https://static.igem.org/mediawiki/2017/4/45/Bildschirmfoto_2017-10-17_um_14.23.20.png">
+
                    data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
−
    </a>
+
                <span class="sr-only">Toggle navigation</span>
−
 
+
                <span class="icon-bar"></span>
−
 
+
                <span class="icon-bar"></span>
−
    <!-- this div is hidden by default and will only be displayed if the screen size is too small -->
+
                <span class="icon-bar"></span>
−
    <div class="menu_button" id="display_menu_control">
+
            </button>
−
        MENU
+
            <a class="navbar-brand" href="https://2017.igem.org/Team:Stuttgart">
−
    </div>
+
                 <img alt="Team:Stuttgart"
−
 
+
                    src="https://static.igem.org/mediawiki/2017/1/18/UNISTUTTGARTLOGO.png">
−
    <div id="menu_content">
+
−
 
+
−
 
+
−
 
+
−
 
+
−
        <a href="https://2017.igem.org/Team:Stuttgart">
+
−
            <div class="menu_button direct_to_page">
+
−
                HOME
+
−
            </div>
+
−
        </a>
+
−
 
+
−
 
+
−
 
+
−
        <div class="menu_button">
+
−
            <div class="expand_collapse_icon"> </div> TEAM
+
−
        </div>
+
−
 
+
−
        <div class="submenu_wrapper" id="team_submenu">
+
−
 
+
−
            <a href="https://2017.igem.org/Team:Stuttgart/Team">
+
−
                 <div class="submenu_button" id="Team_page">
+
−
                    Team
+
−
                </div>
+
 
             </a>
 
             </a>
−
 
−
            <a href="https://2017.igem.org/Team:Stuttgart/Collaborations">
 
−
                <div class="submenu_button"  id="Collaborations_page">
 
−
                    Collaborations
 
−
                </div>
 
−
            </a>
 
−
 
−
 
 
         </div>
 
         </div>
  
 +
        <!-- Collect the nav links, forms, and other content for toggling -->
 +
        <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
 +
            <ul class="nav navbar-nav">
 +
                <li>
 +
                    <a href="https://2017.igem.org/Team:Stuttgart">Home</a>
 +
                </li>
 +
                <li class="dropdown">
 +
                    <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true"
 +
                      aria-expanded="false">Team <span class="caret"></span></a>
 +
                    <ul class="dropdown-menu">
 +
                        <li><a href="https://2017.igem.org/Team:Stuttgart/Team">Team</a></li>
 +
                        <li><a href="https://2017.igem.org/Team:Stuttgart/Attributions">Attributions</a></li>
 +
                        <li><a href="https://2017.igem.org/Team:Stuttgart/Sponsoring">Sponoring</a></li>
 +
                        <!--<li role="separator" class="divider"></li>-->
 +
                    </ul>
 +
                </li>
 +
                <li class="dropdown">
 +
                    <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true"
 +
                      aria-expanded="false">Project <span class="caret"></span></a>
 +
                    <ul class="dropdown-menu">
 +
                        <!--<li class="navbar-text navbar-left">Dry Lab</li>-->
 +
                        <li><a href="https://2017.igem.org/Team:Stuttgart/Description">Description</a></li>
 +
                        <li><a href="https://2017.igem.org/Team:Stuttgart/Background-Information">Background
 +
                            Information</a></li>
 +
                        <li><a href="https://2017.igem.org/Team:Stuttgart/Protocols">Protocols & Experiments</a></li>
 +
                        <li><a href="https://2017.igem.org/Team:Stuttgart/Notebook">Notebook</a></li>
 +
                        <li><a href="https://2017.igem.org/Team:Stuttgart/InterLab">Interlab Study</a></li>
 +
                        <li><a href="https://2017.igem.org/Team:Stuttgart/Model">Modelling</a></li>
 +
                        <li><a href="https://2017.igem.org/Team:Stuttgart/Results">Results</a></li>
 +
                        <li><a href="https://2017.igem.org/Team:Stuttgart/Parts">Parts</a></li>
 +
                        <!--<li role="separator" class="divider"></li>-->
 +
                    </ul>
 +
                </li>
 +
                <li>
 +
                    <a href="https://2017.igem.org/Team:Stuttgart/Safety">Safety</a>
 +
                </li>
 +
                <li class="dropdown">
 +
                    <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true"
 +
                      aria-expanded="false">Human Practices <span class="caret"></span></a>
 +
                    <ul class="dropdown-menu">
 +
                        <li><a href="https://2017.igem.org/Team:Stuttgart/Engagement">Public Engagement</a></li>
 +
                        <li><a href="https://2017.igem.org/Team:Stuttgart/HP/Gold_Integrated">Integrated and Gold</a>
 +
                        </li>
 +
                        <li><a href="https://2017.igem.org/Team:Stuttgart/HP/Silver">Silver HP</a></li>
 +
                        <li><a href="https://2017.igem.org/Team:Stuttgart/Collaborations">Collaborations</a></li>
 +
                    </ul>
 +
                </li>
 +
                <li class="dropdown">
 +
                    <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true"
 +
                      aria-expanded="false">Awards <span class="caret"></span></a>
 +
                    <ul class="dropdown-menu">
 +
                        <li><a href="https://2017.igem.org/Team:Stuttgart/Applied_Design">Applied Design</a></li>
 +
                        <li><a href="https://2017.igem.org/Team:Stuttgart/Measurement">Measurement</a></li>
 +
                    </ul>
 +
                </li>
 +
                <li>
 +
                    <a href="https://igem.org/2017_Judging_Form?team=Stuttgart">Judging Form</a>
 +
                </li>
 +
            </ul>
 +
        </div><!-- /.navbar-collapse -->
 +
    </div><!-- /.container-fluid -->
 +
</nav>
  
  
  
−
 
−
        <div class="menu_button">
 
−
            <div class="expand_collapse_icon">  </div> PROJECT
 
−
        </div>
 
−
 
−
        <!-- project submenu -->
 
−
        <div class="submenu_wrapper">
 
−
 
−
            <a href="https://2017.igem.org/Team:Stuttgart/Description">
 
−
                <div class="submenu_button"  id="Description_page">
 
−
                    Description
 
−
                </div>
 
−
            </a>
 
−
 
−
            <a href="https://2017.igem.org/Team:Stuttgart/Experiments">
 
−
                <div class="submenu_button"  id="Experiments_page">
 
−
                    Experiments
 
−
                </div>
 
−
            </a>
 
−
 
−
 
−
            <a href="https://2017.igem.org/Team:Stuttgart/Notebook">
 
−
                <div class="submenu_button"  id="Notebook_page">
 
−
                    Notebook
 
−
                </div>
 
−
            </a>
 
−
 
−
<a href="https://2017.igem.org/Team:Stuttgart/Protocols">
 
−
                <div class="submenu_button"  id="Protocols_page">
 
−
                    Protocols
 
−
                </div>
 
−
            </a>
 
−
 
−
 
−
            <a href="https://2017.igem.org/Team:Stuttgart/InterLab">
 
−
                <div class="submenu_button"  id="InterLab_page">
 
−
                    InterLab
 
−
                </div>
 
−
            </a>
 
−
 
−
            <a href="https://2017.igem.org/Team:Stuttgart/Contribution">
 
−
                <div class="submenu_button"  id="Contribution_page">
 
−
                    Contribution
 
−
                </div>
 
−
            </a>
 
−
 
−
            <a href="https://2017.igem.org/Team:Stuttgart/Model">
 
−
                <div class="submenu_button"  id="Model_page">
 
−
                    Model
 
−
                </div>
 
−
            </a>
 
−
 
−
            <a href="https://2017.igem.org/Team:Stuttgart/Results">
 
−
                <div class="submenu_button"  id="Results_page">
 
−
                    Results
 
−
                </div>
 
−
            </a>
 
−
 
−
 
−
 
−
            <a href="https://2017.igem.org/Team:Stuttgart/Improve">
 
−
                <div class="submenu_button"  id="Improve_page">
 
−
                    Improve
 
−
                </div>
 
−
            </a>
 
−
 
−
            <a href="https://2017.igem.org/Team:Stuttgart/Attributions">
 
−
                <div class="submenu_button"  id="Attributions_page">
 
−
                    Attributions
 
−
                </div>
 
−
            </a>
 
−
 
−
        </div>
 
−
 
−
 
−
 
−
 
−
 
−
 
−
        <div class="menu_button">
 
−
            <div class="expand_collapse_icon">  </div> PARTS
 
−
        </div>
 
−
 
−
        <!-- parts submenu -->
 
−
        <div class="submenu_wrapper">
 
−
 
−
            <a href="https://2017.igem.org/Team:Stuttgart/Parts">
 
−
                <div class="submenu_button"  id="Parts_page">
 
−
                    Parts
 
−
                </div>
 
−
            </a>
 
−
 
−
            <a href="https://2017.igem.org/Team:Stuttgart/Basic_Part">
 
−
                <div class="submenu_button"  id="Basic_Part_page">
 
−
                    Basic Parts
 
−
                </div>
 
−
            </a>
 
−
 
−
            <a href="https://2017.igem.org/Team:Stuttgart/Composite_Part">
 
−
                <div class="submenu_button"  id="Composite_Part_page">
 
−
                    Composite Parts
 
−
                </div>
 
−
            </a>
 
−
 
−
            <a href="https://2017.igem.org/Team:Stuttgart/Part_Collection">
 
−
                <div class="submenu_button"  id="Part_Collection_page">
 
−
                    Part Collection
 
−
                </div>
 
−
            </a>
 
−
        </div>
 
−
 
−
 
−
 
−
 
−
 
−
 
−
        <a href="https://2017.igem.org/Team:Stuttgart/Safety">
 
−
            <div class="menu_button direct_to_page">
 
−
                SAFETY
 
−
            </div>
 
−
        </a>
 
−
 
−
 
−
 
−
 
−
 
−
 
−
 
−
        <div class="menu_button" >
 
−
            <div class="expand_collapse_icon">  </div> HUMAN PRACTICES
 
−
        </div>
 
−
 
−
        <!-- human practices submenu -->
 
−
        <div class="submenu_wrapper">
 
−
 
−
            <a href="https://2017.igem.org/Team:Stuttgart/HP/Silver">
 
−
                <div class="submenu_button"  id="Silver_page">
 
−
                    Silver HP
 
−
                </div>
 
−
            </a>
 
−
 
−
            <a href="https://2017.igem.org/Team:Stuttgart/HP/Gold_Integrated">
 
−
                <div class="submenu_button" id="Gold_Integrated_page">
 
−
                    Integrated and Gold
 
−
                </div>
 
−
            </a>
 
−
 
−
 
−
            <a href="https://2017.igem.org/Team:Stuttgart/Engagement">
 
−
                <div class="submenu_button"  id="Engagement_page">
 
−
                    Public Engagement
 
−
                </div>
 
−
            </a>
 
−
 
−
        </div>
 
−
 
−
 
−
        <div class="menu_button">
 
−
            <div class="expand_collapse_icon">  </div> AWARDS
 
−
        </div>
 
−
 
−
        <!-- awards submenu -->
 
−
        <div class="submenu_wrapper">
 
−
 
−
            <a href="https://2017.igem.org/Team:Stuttgart/Applied_Design">
 
−
                <div class="submenu_button"  id="Applied_Design_page">
 
−
                    Applied Design
 
−
                </div>
 
−
            </a>
 
−
 
−
            <a href="https://2017.igem.org/Team:Stuttgart/Entrepreneurship">
 
−
                <div class="submenu_button"  id="Entrepreneurship_page">
 
−
                    Entrepreneurship
 
−
                </div>
 
−
            </a>
 
−
 
−
            <a href="https://2017.igem.org/Team:Stuttgart/Hardware">
 
−
                <div class="submenu_button"  id="Hardware_page">
 
−
                    Hardware
 
−
                </div>
 
−
            </a>
 
−
 
−
            <a href="https://2017.igem.org/Team:Stuttgart/Measurement">
 
−
                <div class="submenu_button"  id="Measurement_page">
 
−
                    Measurement
 
−
                </div>
 
−
            </a>
 
−
 
−
            <a href="https://2017.igem.org/Team:Stuttgart/Model">
 
−
                <div class="submenu_button"  id="Model_page">
 
−
                    Model
 
−
                </div>
 
−
            </a>
 
−
 
−
       
 
−
 
 
−
 
−
        </div>
 
−
 
−
        <a href="https://igem.org/2017_Judging_Form?team=Stuttgart">
 
−
            <div class="menu_button direct_to_page">
 
−
                JUDGING FORM
 
−
            </div>
 
−
        </a>
 
−
 
−
 
−
 
−
        <div class="menu_bottom_padding" >
 
−
        </div>
 
−
 
−
    </div>
 
−
 
−
 
−
 
−
 
−
</div>
 
  
  
 
<!-- start of content -->
 
<!-- start of content -->
−
<div class="igem_2017_content_wrapper">
+
<h1 align=middle> Project description </h1>
−
 
+
<div class="container">
−
<html>
+
    <div class="row section">
−
 
+
        <div class="col-xs-12 col-sm-12 col-md-12">
−
<h1 align=middle>project description</h1>
+
            <h3>What's the problem?</h3>
−
 
+
            <p>Our project deals with an everyday problem described by the following scenario:
−
<table>
+
You want to enjoy a refreshing shower in the morning, but your hairy roommate clogged the drain again?  
−
<td align="left" height=0 bgcolor="#F8CE63">
+
You would like to have a relaxed bubble bath after a long day, but there are bad odors coming out of the pipe system?
−
<br><h3><span style="color:#2E9AFE">WHATS THE PROBLEM?</span style="color:#2E9AFE"></h3>
+
−
<h4>Our project deals with an everyday problem described by the following scenario:
+
−
You want to enjoy a refreshing shower in the morning, but your hairy roommate clogged the drain again? You would like to have a relaxed bubble bath after a long day, but there are bad odors coming out of the pipe system?
+
 
<br>
 
<br>
−
<br>The general practice now:<br>
+
The general practice now:
 
1.You try the ‘hot water method’ to flush the drain…  nothing happens.<br>
 
1.You try the ‘hot water method’ to flush the drain…  nothing happens.<br>
 
2.You remember what your mother taught you, so you put a fancy mix of vinegar, baking soda and some magic into the drain… a mysterious creature arises, but nothing else happens.<br>  
 
2.You remember what your mother taught you, so you put a fancy mix of vinegar, baking soda and some magic into the drain… a mysterious creature arises, but nothing else happens.<br>  
−
3.In the end there is just one thing left – you put the nasty chemical mixture of the stinky cleaning agent down the drain. The corrosive cloud disappears and you can finally take your shower… still trying not to breath in the acrid fumes.</h4>
+
3.In the end there is just one thing left – you put the nasty chemical mixture of the stinky cleaning agent down the drain. The corrosive cloud disappears and you can finally take your shower… still trying not to breath in the acrid fumes.
−
 
+
</p>
−
<img src="https://static.igem.org/mediawiki/2017/0/0b/Comicstuttgart.png"/ width=100% height= 420px >
+
          </div>
−
 
+
        </div>
−
<h4>Pipe clogging and closure occurs in every household as well as in industry. Various components contribute to the pipe closure, such as fat and hair. Commercial chemical pipe cleaners contain aggressive substances, which are harmful to the environment and health and also can lead to pipe breaks. Biological alternatives (purified enzymes) have been researched for years, without reaching the efficiency of chemical cleaners. In addition, the purification of the enzymes is very complex and cost intensive. </h4>
+
        <div class="row section">
−
 
+
<div class="col-xs-12 col-sm-12 col-md-12">
−
+
    <!--<https://static.igem.org/mediawiki/2017/0/0b/Comicstuttgart.png">-->
−
<br><h3><span style="color:#2E9AFE">OUR SOLUTION</span style="color:#2E9AFE"></h3>
+
    <img src="https://static.igem.org/mediawiki/2017/0/0b/Comicstuttgart.png" class="img-responsive"/>
−
<h4>
+
</div>
−
We pursue a system-biological solution which is based on an intact microbial system. Inspired by different interesting projects we decided to develope a keranolytic Escherichia coli. The projects of past iGEM-teams were part of our investigation too and we are already co-working with iGEM-team OLS_Canmore 2015/2016 to exchange information. We would like to use the knowledge of these groundworks to develop a new type of enzymatic cleaning agent by complementing and combining ideas out of different scientific sources. To differ from other projects we are aiming to engineer Escherichia coli to express enzymes like esterases, lipases and keratinases into the medium. Due to the extracellular expression expensive and time-consuming purification steps could be avoided and the enzymes could be secreted directly into the drain.As a special feature we want to use the metabolites of the enzymatic degradation to produce a lovely rose-scent to refresh your whole room. In addition this reaction could also be used to indicate that the enzymes are working efficiently on your drainage problem. </h4>
+
</div>
 +
<div class="row section">
 +
    <div class="col-xs-12 col-sm-12 col-md-12">
 +
      <p>Pipe clogging and closure occurs in every household as well as in industry.  
 +
        Various components contribute to the pipe closure, such as fat and hair.  
 +
        Commercial chemical pipe cleaners contain aggressive substances, which are harmful to the environment and health and also can lead to pipe breaks.  
 +
        Biological alternatives (purified enzymes) have been researched for years, without reaching the efficiency of chemical cleaners.  
 +
        In addition, the purification of the enzymes is very complex and cost intensive. </p>
 +
<h3>Our solution</h3>
 +
      <p>We pursue a system-biological solution which is based on an intact microbial system.  
 +
        Inspired by different interesting projects we decided to develope a keranolytic Escherichia coli.  
 +
        The projects of past iGEM-teams were part of our investigation too and we are already co-working with iGEM-team OLS_Canmore 2015/2016 to exchange information.  
 +
        We would like to use the knowledge of these groundworks to develop a new type of enzymatic cleaning agent by complementing and combining ideas out of different scientific sources.  
 +
        To differ from other projects we are aiming to engineer Escherichia coli to express enzymes like esterases, lipases and keratinases into the medium.  
 +
        Due to the extracellular expression expensive and time-consuming purification steps could be avoided and the enzymes could be secreted directly into the drain.As a special feature we want to use the metabolites of the enzymatic degradation to produce a lovely rose-scent to refresh your whole room.  
 +
        In addition this reaction could also be used to indicate that the enzymes are working efficiently on your drainage problem.  
 +
      </p>
 +
        </div>
 +
    </div>
 
<br>
 
<br>
−
</td>
 
−
</table>
 
 
<br>
 
<br>
 +
    <div class="row section">     
 +
      <h2 align=middle>Light up the pipe - 3 parts for a better flow</h2>
 +
        <div class="col-xs-12 col-sm-6 col-md-4">
 +
          <h3>Part 1 - Esterases and Lipases</h3>
 +
            <!--<https://static.igem.org/mediawiki/2017/4/4f/EsteraseCOMIC.png">-->
 +
            <img src="https://static.igem.org/mediawiki/2017/4/4f/EsteraseCOMIC.png" class="img-responsive"/>
 +
        </div>
 +
        <div class="col-xs-12 col-sm-6 col-md-8">
 +
          <p>Hair is surrounded by a layer of grease and waxes which first need to be removed to make the hair-keratin available for keratinases.
 +
            For the first degradation step we choose a combination of  esterases and lipases.
 +
We investigated two different esterases for their enzyme activity.
 +
One esterase from the registry (EstCS2 BBa_K1149002) and one esterase (LipB) supplied by Dr. Eggert from Evoxx were compared.
 +
Additionally we choose the lipase TliA to support the esterases at the fat degradation and to accelerate the entire degradation process.
 +
For the extracellular secretion of the enzymes we attached different signal sequences (pelB, OmpA and phoA) that were provided on the iGEM plates.
 +
    </p>
 +
  </div>
 +
</div>
 
<br>
 
<br>
−
<h1 align=middle > LIGHT UP THE PIPE - THREE PARTS FOR A BETTER FLOW </h1>
 
 
<br>
 
<br>
−
<table>
+
<div class="row section">  
−
<tr>
+
<div class="col-xs-12 col-sm-12 col-md-12">
−
<td bgcolor=#F8CE63>
+
    <h4>EstCS2</h4>
−
<img src="https://static.igem.org/mediawiki/2017/4/4f/EsteraseCOMIC.png"/ width=100% height= "auto" align="left" hspace=20 vspace=0>
+
    <p>EstCS2 from the iGEM Imperial College 2013 was proved to be active.  
−
</td>
+
      In their project the cells expressing these construct were grown and lysed by sonication and were utilized in a colourimetric assay with the substrate analog para-Nitrophenyl butyrate.  
−
<td>
+
      In our project we didn’t purify the esterases but used the supernatant for the enzyme activity assay.
−
<br><h3><span style="color:#2E9AFE">PART I - ESTERASES and LIPASES</span style="color:#2E9AFE"></h3><br>
+
    </p>
−
<h4>Hair is surrounded by a layer of grease and waxes which first need to be removed to make the hair-keratin available for keratinases. For the first degradation step we choose a combination of esterases and lipases.
+
    <br>
−
We investigated two different esterases for their enzyme activity. One esterase from the registry (EstCS2 BBa_K1149002) and one esterase (LipB) supplied by Dr. Eggert from Evoxx were compared. Additionally we choose the lipase TliA to support the esterases at the fat degradation and to accelerate the entire degradation process. For the extracellular secretion of the enzymes we attached different signal sequences (pelB, OmpA and phoA) that were provided on the iGEM plates.</h4>
+
    <h4>LipB</h4>
 +
    <p>LipB showed an enzyme activity of 2,8 U/mL in the supernatant. First, we repeated the enzyme activity assay from the iGEM TU Darmstadt 2012 to determine the esterase with the highest enzyme activity.
 +
      urify the esterases but used the supernatant for the enzyme activity assay.
 +
    </p>
 +
    <br>
 +
    <h4>TliA</h4>
 +
    <p>The lipase that is used for this project is the TliA lipase from Pseudomonas fluorescens. TliA is secreted by the ABC (ATP binding cassette) export system (prtDEF gene cluster) from Dickeya dadantii (formerly known as Erwinia chrysanthemi).
 +
      The LARD secretion tag for the ABC export system is added directly to the TliA gene, which hopefully leads to a good export yield and a high extracellular activity.
 +
In order to control gene expression, the TliA gene is expressed by the pBAD promoter, which can be induced by arabinose. The prtDEF gene cluster is expressed by a constitutive promoter of mediocre strength. So, the ABC export system is always expressed at a certain level and can export the LARD-tagged TliA lipase, if expressed.
 +
Eom et al. have already shown extracellular activity of TliA when secreted with the ABC export system.
 +
So, if the TliA lipase is expressed, it is exported out of the cell and degrades the greasy layer surrounding the hair, which makes the keratin accessible for the keratinases.
 +
</p>
 +
  </div>
 +
    </div>
 +
    <br>
 +
    <br>
 +
    <div class="row section">
 +
    <div class="col-xs-12 col-sm-6 col-md-8">
 +
        <p>Keratinases are promising enzymes that find their applicability in agro-industrial, pharmaceutical and biomedicals fields.  
 +
          We want to profit from them by applying them on clugged pipes full of hair that is a common issue in lots of households.
 +
          Keratinases are enzymes that are capable of degrading hair.
 +
          Hair mostly consists of alpha-Keratin. Many different keratinases produced by different Bacilli, Actinobacteria and fungi have been reported.
 +
          All of them vary by having their specific biochemical and biophysical properties e.g. temperature and pH activity range.
 +
          Using their proteolytic capability that destroys hair we want to use them to avoid chemical compounds that are recently mainly applied to cleanse tubes.  
 +
          By hydrolization of disulfide bonds keratin degrades. This is due to confirmation changes which leads to an exposure of more sites for keratinase action (Satyanarayana et al. 2013, Vignardes et al. 1999).
 +
</p>
 +
</div>
 +
<div class="col-xs-12 col-sm-6 col-md-4">
 +
  <h3>Part 2 - Keratinases</h3>
 +
    <!--<https://static.igem.org/mediawiki/2017/c/c3/KeratinaseCOMIC.png">-->
 +
    <img src="https://static.igem.org/mediawiki/2017/c/c3/KeratinaseCOMIC.png" class="img-responsive"/>
 +
</div>
 +
</div>
 
<br>
 
<br>
 
<br>
 
<br>
−
<h3><span style="color:#2E9AFE">EstCS2</span style="color:#2E9AFE"></h3>
+
<div class="row section">  
−
<h4>EstCS2 from the iGEM Imperial College 2013 was proved to be active. In their project the cells expressing these construct were grown and lysed by sonication and were utilized in a colourimetric assay with the substrate analog para-Nitrophenyl butyrate. In our project we didn’t purify the esterases but used the supernatant for the enzyme activity assay.</h4>
+
<div class="col-xs-12 col-sm-12 col-md-12">
 +
<p>Previous projects from iGEM Teams such as Sheffield 2014, Team Canmore 2015 and Team Canmore 2016 helped us to tackle this problem as they were regarding similar problems.
 +
Still there are a lots of things that have to be improved as these Teams were facing different issues.  
 +
The Team of Sheffield stumbled over the problem that the keratinase colonies were either not producing or exporting the protein in a functional form. While Canmore accomplished to succeed to show a certain Keratinase activity, due to time limitation they were not able to show quanititative but qualititative observations of keratine degredation.
 +
Based on these already promising results we want to focus on improving the keratinases using different promotors that regulate a successful protein secretations without being toxic to the host organism.
 +
For efficient hair degradation we chose different keratinases (KerUS, KerA, KerBL and KerP). Moreover we combined this keratinases with different anderson-promotors (BBa_K206000, BBa_J23114 and BBaJ23102) and signal sequences (PelB, OmpA and PhoA) for extracellular transport of the keratinases.
 +
</p>
 
<br>
 
<br>
 +
<h4>KerP</h4>
 +
<p>Keratinase kerP is a 33 kDa monomeric protein. Ker P is a serine protease. Serine proteases are protelytic enzymes, charaterizised by a reactive serine side chain (Kraut 1977). The family contains many diffrent enzymes with wide spread functions. Most of keratinases are serine proteases capable to degrade recalcitrant protein like nails, hair, feathers (Sharma and Gupta 2010b). KS-1 has his optimal activity at pH = 9 and 60 C.
 +
</p>
 +
</div>
 +
</div>
 
<br>
 
<br>
 
<br>
 
<br>
−
<br>
+
<div class="row section">  
−
<h3><span style="color:#2E9AFE">LipB</span style="color:#2E9AFE"></h3>
+
  <h3>Part 3 - a lovely scent of...</h3>
−
<h4>LipB showed an enzyme activity of 2,8 U/mL in the supernatant. First, we repeated the enzyme activity assay from the iGEM TU Darmstadt 2012 to determine the esterase with the highest enzyme activity.</h4>
+
  <p>The microbial synthesis of natural flavor compounds has become a very attractive alternative to the chemical production (1). In recent years microorganisms such as E.coli and Yeast have been metabolically engineered to produce different flavors like limonene, geraniol or rose (1,2,3).
−
<br>
+
    For our project we discussed different approaches and choose two different scents: rose and limonene.
−
<br>
+
  </p>
−
<h3><span style="color:#2E9AFE">TliA</span style="color:#2E9AFE"></h3>
+
  <div class="col-xs-12 col-sm-6 col-md-4">
−
<h4>The lipase that is used for this project is the TliA lipase from Pseudomonas fluorescens. TliA is secreted by the ABC (ATP binding cassette) export system (prtDEF gene cluster) from Dickeya dadantii (formerly known as Erwinia chrysanthemi). The LARD secretion tag for the ABC export system is added directly to the TliA gene, which hopefully leads to a good export yield and a high extracellular activity.  
+
    <h3>... rose fragrance</h3>
−
In order to control gene expression, the TliA gene is expressed by the pBAD promoter, which can be induced by arabinose. The prtDEF gene cluster is expressed by a constitutive promoter of mediocre strength. So, the ABC export system is always expressed at a certain level and can export the LARD-tagged TliA lipase, if expressed.Eom et al. have already shown extracellular activity of TliA when secreted with the ABC export system. So, if the TliA lipase is expressed, it is exported out of the cell and degrades the greasy layer surrounding the hair, which makes the keratin accessible for the keratinases.</h4>
+
      <!--<https://static.igem.org/mediawiki/2017/8/89/RosenduftCOMIC.png">-->
−
<br>
+
      <img src="https://static.igem.org/mediawiki/2017/8/89/RosenduftCOMIC.png" class="img-responsive"/>
−
</td>
+
  </div>
−
</tr>
+
  <div class="col-xs-12 col-sm-6 col-md-8">
−
</table>
+
      <p>As first special fragrance we want to install a lovely scent of rose in our microbial system. Hair are commonly made of Keratin (98%) and small amounts of amino acids, such as L-phenylalanine. This amino acid can be used as substrate for the production of 2-Phenylethylacetate (2-PEAc), which has a rose-like odor (1).
 +
Therefor this odor can act as an indicator for keratin degradation. In recent studies from Guo et al the 2-PEAc biosynthetic pathway was successfully designed and expressed in E.coli (1). This pathway was used for our project and comprised four steps (Fig.1):
 +
</p>
 +
</div>
 +
</div>
 +
<div class="row section">  
 +
<div class="col-xs-12 col-sm-12 col-md-12">
 +
  <!--<https://static.igem.org/mediawiki/2017/7/7a/Stuttgartpathwayrose.png">-->
 +
  <img src="https://static.igem.org/mediawiki/2017/7/7a/Stuttgartpathwayrose.png" class="img-responsive"/>
 +
</div>
 +
</div>
 +
<div class="row section">
 +
<div class="col-xs-12 col-sm-12 col-md-12">
 +
<p><li> Aminotransferase (ARO 8) for transamination of L-phenylalanine to phenylpyruvate</li>
 +
<li> 2-keto acid decarboxylase KDC for the decarboxylation of the phenylpyruvate to phenylacetaldehyde</li>
 +
<li> Aldehyde reductase YjgB for the reduction of phenylacetaldehyde to 2-Phenylethanol</li>
 +
<li> Alcohol acetyltransferase ATF1 for the esterification of 2-PE to 2-PEAc.</li>
 +
</p>
 +
</div>
 +
</div>
 +
<br> 
 +
<div class="row section">
 +
<div class="col-xs-12 col-sm-12 col-md-12">         
 +
<h3>... limonene fragrance</h3>
 +
<p>Limonene is a well-known cyclic monoterpene which can occur in two optical forms (2).  
 +
  (D)-Limonene is one of the most important and widespread terpenes in the flavor and fragrance industry, for example in citrus-flavored products such as soft drinks and candy (2).  
 +
  The (L)-Limonene form has a more harsh fir-like odor with a lemon-note (2). For our project we choose an enzyme-cascade, beginning with acetyl-coA and leading to the product (L)-limonene.  
 +
  This biosynthetic pathway was designed and inserted in E.coli (Fig.2).
 +
</p>
 +
</div>
 +
</div>
 +
<div class="row section">
 +
<div class="col-xs-12 col-sm-12 col-md-12">
 +
  <!--<https://static.igem.org/mediawiki/2017/8/8a/Limonenepathway.png">-->
 +
  <img src="https://static.igem.org/mediawiki/2017/8/8a/Limonenepathway.png" class="img-responsive"/>
 +
</div>
 +
</div>
  
 +
<div class="row section">
 +
<div class="col-xs-12 col-sm-12 col-md-12">
 +
  <foot>
 +
  <p>REFERENCES
 +
  <li>(1) Metabolic engineering of Escherichia coli for production of 2-Phenylethylacetate from L-phenylalanine (2017), D. Guo and L. Zhang et. al.</li>
 +
  <li>(2) Biotechnological production of limonene in microorganisms (2016), E. Jongedijk and K. Cankar et. al. </li>
 +
  <li>(3) Utilization of alkaline phosphatase PhoA in the bioproduction of geraniol by metabolically engineered Escherichia coli (2015), W. Liu and R. Zhang et. al. </li>
 +
  <li>(4) Rose Scent: Genomics Approach to Discovering Novel Floral Fragrance–Related Genes (2002), I. Guterman and M. Shalit et. al. </li>
 +
</p>
 +
</foot>
  
−
<table>
 
−
<tr>
 
−
<td bgcolor="#F8CE63"> 
 
−
<img src="https://static.igem.org/mediawiki/2017/c/c3/KeratinaseCOMIC.png"/ width=100% height= "auto" align="right" hspace=20 vspace=0 >
 
−
</td>
 
−
<td>
 
−
<br><h3><span style="color:#2E9AFE">PART II - KERATINASES</span style="color:#2E9AFE"></h3>
 
−
<br>
 
−
<h4>Keratinases are  promising enzymes that find their applicability in agro-industrial, pharmaceutical and biomedicals fields. We want to profit from them by applying them on clugged pipes full of hair that is a common issue in lots of households. Keratinases are enzymes that are capable of degrading hair. Hair mostly consists of alpha-Keratin. Many different keratinases produced by different Bacilli, Actinobacteria and fungi have been reported. All of them vary by having their specific biochemical and biophysical properties e.g. temperature and pH activity range. Using their proteolytic capability that destroys hair we want to use them to avoid chemical compounds that are recently mainly applied to cleanse tubes. By hydrolization of disulfide bonds keratin degrades. This is due to confirmation changes which leads to an exposure of more sites for keratinase action (Satyanarayana et al. 2013, Vignardes et al. 1999).
 
  
−
Previous projects from iGEM Teams such as Sheffield 2014, Team Canmore 2015 and Team Canmore 2016 helped us to tackle this problem as they were regarding similar problems. Still there are a lots of things that have to be improved as these Teams were facing different issues. The Team of Sheffield stumbled over the problem that the keratinase colonies were either not producing or exporting the protein in a functional form. While Canmore accomplished to succeed to show a certain Keratinase activity, due to time limitation they were not able to show quanititative but qualititative observations of keratine degredation. Based on these already promising results we want to focus on improving the keratinases using different promotors that regulate a successful protein secretations without being toxic to the host organism. For efficient hair degradation we chose different keratinases (KerUS, KerA, KerBL and KerP). Moreover we combined this keratinases with different anderson-promotors (BBa_K206000, BBa_J23114 and BBaJ23102) and signal sequences (PelB, OmpA and PhoA) for extracellular transport of the keratinases.</h4>
 
  
−
<br><h3><span style="color:#2E9AFE">Inclusion bodies: extracellular transport as limiting step </span style="color:#2E9AFE"></h3>
 
−
 
−
<h4>Besides the fact that Escherichia coli is the most commonly used expression system for recombinant protein production, especially extracellular transport of expressed proteins appears to be one of the most significant barriers to generate necessary levels (Ni and Chen 2009). Often reported, recombinant protein production in Escherichia coli is following by formation of intracellular inclusion bodies, as in the case of recombinant keratinase expression in Escherichia coli as well(Wang, Swaisgood, and Shih 2003).Although the mechanism of extracellular protein secretion in Escherichia coli is still not understood completely, in some cases researchers could achieve high concentrations using different signal peptids like e.g OmpA (Choi and Lee 2004).</h4>
 
−
<br>
 
−
<br><h3><span style="color:#2E9AFE">keratinase kerP</span style="color:#2E9AFE"></h3>
 
−
<h4>Keratinase kerP is a 33 kDa monomeric protein. Ker P is a serine protease. Serine proteases are protelytic enzymes, charaterizised by a reactive serine side chain (Kraut 1977). The family contains many diffrent enzymes with wide spread functions. Most of keratinases are serine proteases capable to degrade recalcitrant protein like nails, hair, feathers (Sharma and Gupta 2010b). KS-1 has his optimal activity at pH = 9 and 60 C.
 
−
</h4>
 
−
 
−
</td>
 
−
</tr>
 
−
</table>
 
−
 
−
 
−
 
−
 
−
<table>
 
−
</tr>
 
−
<td height=0 bgcolor="#F8CE63">
 
−
<img src="https://static.igem.org/mediawiki/2017/8/89/RosenduftCOMIC.png"/ width=100% height= "auto" align="left" hspace=20 vspace=0>
 
−
</td>
 
−
<td>
 
−
 
−
<br><h3><span style="color:#2E9AFE">PART III - A LOVELY SCENT OF ... </span style="color:#2E9AFE"></h3><br>
 
−
<h4>The microbial synthesis of natural flavor compounds has become a very attractive alternative to the chemical production (1). In recent years microorganisms such as E.coli and Yeast have been metabolically engineered to produce different flavors like limonene, geraniol or rose (1,2,3). For our project we discussed different approaches and choose two different scents: rose and limonene.</h4>
 
−
<br>
 
−
<br>
 
−
<br>
 
−
<h3><span style="color:#2E9AFE">... ROSE FRAGRANCE</span style="color:#2E9AFE"></h3>
 
−
<br>
 
−
<h4>As first special fragrance we want to install a lovely scent of rose in our microbial system. Hair are commonly made of Keratin (98%) and small amounts of amino acids, such as L-phenylalanine. This amino acid can be used as substrate for the production of 2-Phenylethylacetate (2-PEAc), which has a rose-like odor (1).
 
−
Therefor this odor can act as an indicator for keratin degradation. In recent studies from Guo et al the 2-PEAc biosynthetic pathway was successfully designed and expressed in E.coli (1). This pathway was used for our project and comprised four steps (Fig.1): </h4>
 
−
<img src="https://static.igem.org/mediawiki/2017/7/7a/Stuttgartpathwayrose.png"/ align="right" valign= width=560 height=180 hspace=20 vspace=0>
 
−
<br>
 
−
<br>
 
−
<h4><li> Aminotransferase (ARO 8) for transamination of L-phenylalanine to phenylpyruvate</li>
 
−
<li> 2-keto acid decarboxylase KDC for the decarboxylation of the phenylpyruvate to phenylacetaldehyde</li>
 
−
<li> Aldehyde reductase YjgB for the reduction of phenylacetaldehyde to 2-Phenylethanol</li>
 
−
<li> Alcohol acetyltransferase ATF1 for the esterification of 2-PE to 2-PEAc.</li></h4>
 
−
<br>             
 
−
<br>
 
−
<br>
 
−
<h3> <span style="color:#2E9AFE">.. LIMONENE FRAGRANCE</span style="color:#2E9AFE"></h3>
 
−
<br>
 
−
<h4>Limonene is a well-known cyclic monoterpene which can occur in two optical forms (2). (D)-Limonene is one of the most important and widespread terpenes in the flavor and fragrance industry, for example in citrus-flavored products such as soft drinks and candy (2). The (L)-Limonene form has a more harsh fir-like odor with a lemon-note (2). For our project we choose an enzyme-cascade, beginning with acetyl-coA and leading to the product (L)-limonene. This biosynthetic pathway was designed and inserted in E.coli (Fig.2).</h4>
 
−
<img src="https://static.igem.org/mediawiki/2017/8/8a/Limonenepathway.png"/ align="middle" width=650 height=260 hspace=20 vspace=0>
 
−
</td>
 
−
</tr>
 
−
</table>
 
−
 
−
 
−
<table>
 
−
<td align="left" height=0 bgcolor="#F8CE63">  <foot>
 
−
<h3>REFERENCES</h3>
 
−
<li>(1) Metabolic engineering of Escherichia coli for production of 2-Phenylethylacetate from L-phenylalanine (2017), D. Guo and L. Zhang et. al.</li>
 
−
<li>(2) Biotechnological production of limonene in microorganisms (2016), E. Jongedijk and K. Cankar et. al. </li>
 
−
<li>(3) Utilization of alkaline phosphatase PhoA in the bioproduction of geraniol by metabolically engineered Escherichia coli (2015), W. Liu and R. Zhang et. al. </li>
 
−
<li>(4) Rose Scent: Genomics Approach to Discovering Novel Floral Fragrance–Related Genes (2002), I. Guterman and M. Shalit et. al. </li>
 
−
</foot>
 
−
</td>
 
−
</table>
 
−
</div>
 
  
  
 +
</body>
 
</html>
 
</html>

Revision as of 22:53, 28 October 2017

Project description

What's the problem?

Our project deals with an everyday problem described by the following scenario: You want to enjoy a refreshing shower in the morning, but your hairy roommate clogged the drain again? You would like to have a relaxed bubble bath after a long day, but there are bad odors coming out of the pipe system?
The general practice now: 1.You try the ‘hot water method’ to flush the drain… nothing happens.
2.You remember what your mother taught you, so you put a fancy mix of vinegar, baking soda and some magic into the drain… a mysterious creature arises, but nothing else happens.
3.In the end there is just one thing left – you put the nasty chemical mixture of the stinky cleaning agent down the drain. The corrosive cloud disappears and you can finally take your shower… still trying not to breath in the acrid fumes.

Pipe clogging and closure occurs in every household as well as in industry. Various components contribute to the pipe closure, such as fat and hair. Commercial chemical pipe cleaners contain aggressive substances, which are harmful to the environment and health and also can lead to pipe breaks. Biological alternatives (purified enzymes) have been researched for years, without reaching the efficiency of chemical cleaners. In addition, the purification of the enzymes is very complex and cost intensive.

Our solution

We pursue a system-biological solution which is based on an intact microbial system. Inspired by different interesting projects we decided to develope a keranolytic Escherichia coli. The projects of past iGEM-teams were part of our investigation too and we are already co-working with iGEM-team OLS_Canmore 2015/2016 to exchange information. We would like to use the knowledge of these groundworks to develop a new type of enzymatic cleaning agent by complementing and combining ideas out of different scientific sources. To differ from other projects we are aiming to engineer Escherichia coli to express enzymes like esterases, lipases and keratinases into the medium. Due to the extracellular expression expensive and time-consuming purification steps could be avoided and the enzymes could be secreted directly into the drain.As a special feature we want to use the metabolites of the enzymatic degradation to produce a lovely rose-scent to refresh your whole room. In addition this reaction could also be used to indicate that the enzymes are working efficiently on your drainage problem.



Light up the pipe - 3 parts for a better flow

Part 1 - Esterases and Lipases

Hair is surrounded by a layer of grease and waxes which first need to be removed to make the hair-keratin available for keratinases. For the first degradation step we choose a combination of esterases and lipases. We investigated two different esterases for their enzyme activity. One esterase from the registry (EstCS2 BBa_K1149002) and one esterase (LipB) supplied by Dr. Eggert from Evoxx were compared. Additionally we choose the lipase TliA to support the esterases at the fat degradation and to accelerate the entire degradation process. For the extracellular secretion of the enzymes we attached different signal sequences (pelB, OmpA and phoA) that were provided on the iGEM plates.



EstCS2

EstCS2 from the iGEM Imperial College 2013 was proved to be active. In their project the cells expressing these construct were grown and lysed by sonication and were utilized in a colourimetric assay with the substrate analog para-Nitrophenyl butyrate. In our project we didn’t purify the esterases but used the supernatant for the enzyme activity assay.


LipB

LipB showed an enzyme activity of 2,8 U/mL in the supernatant. First, we repeated the enzyme activity assay from the iGEM TU Darmstadt 2012 to determine the esterase with the highest enzyme activity. urify the esterases but used the supernatant for the enzyme activity assay.


TliA

The lipase that is used for this project is the TliA lipase from Pseudomonas fluorescens. TliA is secreted by the ABC (ATP binding cassette) export system (prtDEF gene cluster) from Dickeya dadantii (formerly known as Erwinia chrysanthemi). The LARD secretion tag for the ABC export system is added directly to the TliA gene, which hopefully leads to a good export yield and a high extracellular activity. In order to control gene expression, the TliA gene is expressed by the pBAD promoter, which can be induced by arabinose. The prtDEF gene cluster is expressed by a constitutive promoter of mediocre strength. So, the ABC export system is always expressed at a certain level and can export the LARD-tagged TliA lipase, if expressed. Eom et al. have already shown extracellular activity of TliA when secreted with the ABC export system. So, if the TliA lipase is expressed, it is exported out of the cell and degrades the greasy layer surrounding the hair, which makes the keratin accessible for the keratinases.



Keratinases are promising enzymes that find their applicability in agro-industrial, pharmaceutical and biomedicals fields. We want to profit from them by applying them on clugged pipes full of hair that is a common issue in lots of households. Keratinases are enzymes that are capable of degrading hair. Hair mostly consists of alpha-Keratin. Many different keratinases produced by different Bacilli, Actinobacteria and fungi have been reported. All of them vary by having their specific biochemical and biophysical properties e.g. temperature and pH activity range. Using their proteolytic capability that destroys hair we want to use them to avoid chemical compounds that are recently mainly applied to cleanse tubes. By hydrolization of disulfide bonds keratin degrades. This is due to confirmation changes which leads to an exposure of more sites for keratinase action (Satyanarayana et al. 2013, Vignardes et al. 1999).

Part 2 - Keratinases



Previous projects from iGEM Teams such as Sheffield 2014, Team Canmore 2015 and Team Canmore 2016 helped us to tackle this problem as they were regarding similar problems. Still there are a lots of things that have to be improved as these Teams were facing different issues. The Team of Sheffield stumbled over the problem that the keratinase colonies were either not producing or exporting the protein in a functional form. While Canmore accomplished to succeed to show a certain Keratinase activity, due to time limitation they were not able to show quanititative but qualititative observations of keratine degredation. Based on these already promising results we want to focus on improving the keratinases using different promotors that regulate a successful protein secretations without being toxic to the host organism. For efficient hair degradation we chose different keratinases (KerUS, KerA, KerBL and KerP). Moreover we combined this keratinases with different anderson-promotors (BBa_K206000, BBa_J23114 and BBaJ23102) and signal sequences (PelB, OmpA and PhoA) for extracellular transport of the keratinases.


KerP

Keratinase kerP is a 33 kDa monomeric protein. Ker P is a serine protease. Serine proteases are protelytic enzymes, charaterizised by a reactive serine side chain (Kraut 1977). The family contains many diffrent enzymes with wide spread functions. Most of keratinases are serine proteases capable to degrade recalcitrant protein like nails, hair, feathers (Sharma and Gupta 2010b). KS-1 has his optimal activity at pH = 9 and 60 C.



Part 3 - a lovely scent of...

The microbial synthesis of natural flavor compounds has become a very attractive alternative to the chemical production (1). In recent years microorganisms such as E.coli and Yeast have been metabolically engineered to produce different flavors like limonene, geraniol or rose (1,2,3). For our project we discussed different approaches and choose two different scents: rose and limonene.

... rose fragrance

As first special fragrance we want to install a lovely scent of rose in our microbial system. Hair are commonly made of Keratin (98%) and small amounts of amino acids, such as L-phenylalanine. This amino acid can be used as substrate for the production of 2-Phenylethylacetate (2-PEAc), which has a rose-like odor (1). Therefor this odor can act as an indicator for keratin degradation. In recent studies from Guo et al the 2-PEAc biosynthetic pathway was successfully designed and expressed in E.coli (1). This pathway was used for our project and comprised four steps (Fig.1):

  • Aminotransferase (ARO 8) for transamination of L-phenylalanine to phenylpyruvate
  • 2-keto acid decarboxylase KDC for the decarboxylation of the phenylpyruvate to phenylacetaldehyde
  • Aldehyde reductase YjgB for the reduction of phenylacetaldehyde to 2-Phenylethanol
  • Alcohol acetyltransferase ATF1 for the esterification of 2-PE to 2-PEAc.


    • ... limonene fragrance

    Limonene is a well-known cyclic monoterpene which can occur in two optical forms (2). (D)-Limonene is one of the most important and widespread terpenes in the flavor and fragrance industry, for example in citrus-flavored products such as soft drinks and candy (2). The (L)-Limonene form has a more harsh fir-like odor with a lemon-note (2). For our project we choose an enzyme-cascade, beginning with acetyl-coA and leading to the product (L)-limonene. This biosynthetic pathway was designed and inserted in E.coli (Fig.2).

    REFERENCES

  • (1) Metabolic engineering of Escherichia coli for production of 2-Phenylethylacetate from L-phenylalanine (2017), D. Guo and L. Zhang et. al.
  • (2) Biotechnological production of limonene in microorganisms (2016), E. Jongedijk and K. Cankar et. al.
  • (3) Utilization of alkaline phosphatase PhoA in the bioproduction of geraniol by metabolically engineered Escherichia coli (2015), W. Liu and R. Zhang et. al.
  • (4) Rose Scent: Genomics Approach to Discovering Novel Floral Fragrance–Related Genes (2002), I. Guterman and M. Shalit et. al.