Line 1: | Line 1: | ||
<html> | <html> | ||
+ | <!--- THIS IS WHERE THE HTML BEGINS ---> | ||
+ | |||
+ | <head> | ||
<script> | <script> | ||
− | // This is the jquery part of your template. | + | // This is the jquery part of your template. |
// Try not modify any of this code too much since it makes your menu work. | // Try not modify any of this code too much since it makes your menu work. | ||
− | $(document).ready(function() { | + | $(document).ready(function () { |
− | $("#HQ_page").attr('id',''); | + | $("#HQ_page").attr('id', ''); |
− | // call the functions that control the menu | + | // call the functions that control the menu |
menu_functionality(); | menu_functionality(); | ||
hide_show_menu(); | hide_show_menu(); | ||
− | |||
Line 20: | Line 22: | ||
//when clicking on a "menu_button", it will change the "+/-" accordingly and it will show/hide the corresponding submenu | //when clicking on a "menu_button", it will change the "+/-" accordingly and it will show/hide the corresponding submenu | ||
− | $(".menu_button").click(function(){ | + | $(".menu_button").click(function () { |
− | // add or remove the class "open" , this class holds the "-" | + | // add or remove the class "open" , this class holds the "-" |
$(this).children().toggleClass("open"); | $(this).children().toggleClass("open"); | ||
− | // show or hide the submenu | + | // show or hide the submenu |
$(this).next('.submenu_wrapper').fadeToggle(400); | $(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 | // when the screen size is smaller than 800px, the display_menu_control button appears and will show/hide the whole menu | ||
− | $("#display_menu_control").click(function(){ | + | $("#display_menu_control").click(function () { |
$('#menu_content').fadeToggle(400); | $('#menu_content').fadeToggle(400); | ||
}); | }); | ||
− | // call the current page highlight function | + | // call the current page highlight function |
highlight_current_page(); | highlight_current_page(); | ||
} | } | ||
Line 42: | Line 44: | ||
// 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 | // 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 | ||
− | $("#"+ | + | $("#" + wgPageName.substring(wgPageName.lastIndexOf("/") + 1, wgPageName.length) + "_page").addClass("current_page"); |
// now that the current_page class has been added to a menu item, make the submenu fade in | // now that the current_page class has been added to a menu item, make the submenu fade in | ||
Line 50: | Line 52: | ||
} | } | ||
− | |||
Line 56: | Line 57: | ||
function hide_show_menu() { | function hide_show_menu() { | ||
− | // in case you preview mode is selected, the menu is hidden for better visibility | + | // in case you preview mode is selected, the menu is hidden for better visibility |
if (window.location.href.indexOf("submit") >= 0) { | if (window.location.href.indexOf("submit") >= 0) { | ||
$(".igem_2017_menu_wrapper").hide(); | $(".igem_2017_menu_wrapper").hide(); | ||
Line 65: | Line 66: | ||
// when the "bars_item" has been clicked | // when the "bars_item" has been clicked | ||
− | $("#bars_item").click(function() { | + | $("#bars_item").click(function () { |
$("#sideMenu").hide(); | $("#sideMenu").hide(); | ||
Line 86: | Line 87: | ||
<style> | <style> | ||
− | |||
Line 93: | Line 93: | ||
/* Clear the default wiki settings */ | /* Clear the default wiki settings */ | ||
− | #home_logo, #sideMenu { | + | #home_logo, #sideMenu { |
− | + | display: none; | |
− | + | } | |
− | + | ||
− | + | ||
− | + | ||
+ | #sideMenu, #top_title, .patrollink { | ||
+ | display: none; | ||
+ | } | ||
+ | #content { | ||
+ | width: 100%; | ||
+ | padding: 0px; | ||
+ | margin-top: -7px; | ||
+ | margin-left: 0px; | ||
+ | } | ||
+ | |||
+ | body { | ||
+ | background: #190707 | ||
+ | } | ||
+ | |||
+ | #bodyContent h1, #bodyContent h2, #bodyContent h3, #bodyContent h4, #bodyContent h5 { | ||
+ | margin-bottom: 0px; | ||
+ | } | ||
+ | |||
+ | table {; | ||
+ | } | ||
/**************************************************************** MENU ***************************************************************/ | /**************************************************************** MENU ***************************************************************/ | ||
Line 106: | Line 123: | ||
.igem_2017_menu_wrapper { | .igem_2017_menu_wrapper { | ||
width: 15%; | width: 15%; | ||
− | height:100vh; | + | height: 100vh; |
− | position:fixed; | + | position: fixed; |
− | right:0; | + | right: 0; |
− | padding:0; | + | padding: 0; |
− | float:right; | + | float: right; |
border-left: 1px solid #F8CE63; | border-left: 1px solid #F8CE63; | ||
− | background-color:#190707; | + | background-color: #190707; |
− | text-align:left; | + | text-align: left; |
− | font-family:Tahoma, Geneva, sans-serif; | + | font-family: Tahoma, Geneva, sans-serif; |
overflow-y: auto; | overflow-y: auto; | ||
overflow-x: hidden; | overflow-x: hidden; | ||
Line 123: | Line 140: | ||
display: none; | display: none; | ||
} | } | ||
− | |||
/* styling for links in the menu, removes the line under text */ | /* styling for links in the menu, removes the line under text */ | ||
Line 129: | Line 145: | ||
text-decoration: none; | text-decoration: none; | ||
} | } | ||
− | |||
/* styling for the images in the menu */ | /* styling for the images in the menu */ | ||
Line 140: | Line 155: | ||
width: 100%; | width: 100%; | ||
padding: 10px 0px 10px 15px; | padding: 10px 0px 10px 15px; | ||
− | float:left; | + | float: left; |
border-bottom: 1px solid #F8CE63; | border-bottom: 1px solid #F8CE63; | ||
font-size: 20px; | font-size: 20px; | ||
Line 147: | Line 162: | ||
cursor: pointer; | cursor: pointer; | ||
} | } | ||
− | |||
.igem_2017_menu_wrapper .menu_bottom_padding { | .igem_2017_menu_wrapper .menu_bottom_padding { | ||
width: 100%; | width: 100%; | ||
height: 30px; | height: 30px; | ||
− | float:left; | + | float: left; |
} | } | ||
Line 158: | Line 172: | ||
padding-left: 36px; | padding-left: 36px; | ||
} | } | ||
− | |||
.igem_2017_menu_wrapper .menu_button .expand_collapse_icon { | .igem_2017_menu_wrapper .menu_button .expand_collapse_icon { | ||
− | width:10%; | + | width: 10%; |
− | float:left; | + | float: left; |
} | } | ||
Line 172: | Line 185: | ||
content: "-" !important; | content: "-" !important; | ||
} | } | ||
− | |||
− | |||
/* styling for the menu buttons on hover */ | /* styling for the menu buttons on hover */ | ||
− | .igem_2017_menu_wrapper .menu_button:hover, .igem_2017_menu_wrapper .submenu_button:hover , | + | .igem_2017_menu_wrapper .menu_button:hover, .igem_2017_menu_wrapper .submenu_button:hover, .submenu_button.current_page:hover { |
background-color: #F8CE63; | background-color: #F8CE63; | ||
text-decoration: none; | text-decoration: none; | ||
− | color:#190707; | + | color: #190707; |
} | } | ||
/* styling for the menu button when it is the current page */ | /* styling for the menu button when it is the current page */ | ||
.current_page { | .current_page { | ||
− | background-color:#190707 | + | background-color: #190707 !important; |
− | color:#F8CE63 !important; | + | color: #F8CE63 !important; |
} | } | ||
− | |||
/* styling for the submenu buttons */ | /* styling for the submenu buttons */ | ||
Line 193: | Line 203: | ||
width: 100%; | width: 100%; | ||
padding: 10px 0px 10px 34px; | padding: 10px 0px 10px 34px; | ||
− | float:left; | + | float: left; |
− | background-color:#190707; | + | background-color: #190707; |
border-bottom: 1px solid #F8CE63; | border-bottom: 1px solid #F8CE63; | ||
font-size: 15px; | font-size: 15px; | ||
Line 203: | Line 213: | ||
/* wrapper for the submenu items, they are hidden by default*/ | /* wrapper for the submenu items, they are hidden by default*/ | ||
.igem_2017_menu_wrapper .submenu_wrapper { | .igem_2017_menu_wrapper .submenu_wrapper { | ||
− | display:none; | + | display: none; |
} | } | ||
/* when the page size is bigger than 800px, this show/hide control is hidden by default */ | /* when the page size is bigger than 800px, this show/hide control is hidden by default */ | ||
.igem_2017_menu_wrapper #display_menu_control { | .igem_2017_menu_wrapper #display_menu_control { | ||
− | display:none; | + | display: none; |
− | text-align:center; | + | text-align: center; |
} | } | ||
− | |||
/***************************************************** CONTENT OF THE PAGE ****************************************************/ | /***************************************************** CONTENT OF THE PAGE ****************************************************/ | ||
Line 219: | Line 228: | ||
width: 81%; | width: 81%; | ||
margin: 2%; | margin: 2%; | ||
− | display:block; | + | display: block; |
− | float:left; | + | float: left; |
background-color: #190707; | background-color: #190707; | ||
− | font-family:Tahoma, Geneva, sans-serif; | + | font-family: Tahoma, Geneva, sans-serif; |
} | } | ||
− | |||
/********************************* HTML STYLING *********************************/ | /********************************* HTML STYLING *********************************/ | ||
Line 230: | Line 238: | ||
/* styling for the titles h1 h2 */ | /* styling for the titles h1 h2 */ | ||
.igem_2017_content_wrapper h1, .igem_2017_content_wrapper h2 { | .igem_2017_content_wrapper h1, .igem_2017_content_wrapper h2 { | ||
− | color:#F8CE63; | + | color: #F8CE63; |
− | padding:15px 0 25px 0; | + | padding: 15px 0 25px 0; |
border-bottom: 0; | border-bottom: 0; | ||
} | } | ||
Line 237: | Line 245: | ||
/* styling for the titles h3 h4 h5 h6*/ | /* 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 { | .igem_2017_content_wrapper h3, .igem_2017_content_wrapper h4, .igem_2017_content_wrapper h5, .igem_2017_content_wrapper h6 { | ||
− | padding:5px 15px; | + | padding: 5px 15px; |
− | border-bottom:0; | + | border-bottom: 0; |
} | } | ||
Line 246: | Line 254: | ||
font-size: 16px; | font-size: 16px; | ||
} | } | ||
+ | |||
.igem_2017_content_wrapper img { | .igem_2017_content_wrapper img { | ||
padding: 15px 0; | padding: 15px 0; | ||
Line 255: | Line 264: | ||
text-decoration: underline; | text-decoration: underline; | ||
text-decoration-color: #190707; | text-decoration-color: #190707; | ||
− | color: | + | color: #3399ff; |
-webkit-transition: all 0.4s ease; | -webkit-transition: all 0.4s ease; | ||
-moz-transition: all 0.4s ease; | -moz-transition: all 0.4s ease; | ||
Line 265: | Line 274: | ||
/* hover for the links */ | /* hover for the links */ | ||
.igem_2017_content_wrapper a:hover { | .igem_2017_content_wrapper a:hover { | ||
− | text-decoration:none; | + | text-decoration: none; |
− | color:#000000; | + | color: #000000; |
} | } | ||
/* non numbered lists */ | /* non numbered lists */ | ||
.igem_2017_content_wrapper ul { | .igem_2017_content_wrapper ul { | ||
− | padding:0px 20px; | + | padding: 0px 20px; |
font-size: 15px; | font-size: 15px; | ||
− | font-family:Tahoma, Geneva, sans-serif; | + | font-family: Tahoma, Geneva, sans-serif; |
} | } | ||
/* numbered lists */ | /* numbered lists */ | ||
.igem_2017_content_wrapper ol { | .igem_2017_content_wrapper ol { | ||
− | padding:0px; | + | padding: 0px; |
font-size: 15px; | font-size: 15px; | ||
− | font-family:Tahoma, Geneva, sans-serif; | + | font-family: Tahoma, Geneva, sans-serif; |
} | } | ||
Line 286: | Line 295: | ||
.igem_2017_content_wrapper table { | .igem_2017_content_wrapper table { | ||
width: 97%; | width: 97%; | ||
− | margin:15px 10px; | + | margin: 15px 10px; |
border: 2px solid #190707; | border: 2px solid #190707; | ||
border-collapse: collapse; | border-collapse: collapse; | ||
− | background: ; | + | background:; |
} | } | ||
/* table cells */ | /* table cells */ | ||
− | .igem_2017_content_wrapper | + | .igem_2017_content_wrapper td { |
padding: 10px; | padding: 10px; | ||
vertical-align: text-top; | vertical-align: text-top; | ||
Line 306: | Line 315: | ||
border: 1px solid #190707; | border: 1px solid #190707; | ||
border-collapse: collapse; | border-collapse: collapse; | ||
− | |||
− | |||
+ | } | ||
/**********************************LAYOUT CLASSES **********************************/ | /**********************************LAYOUT CLASSES **********************************/ | ||
/* general class for column divs */ | /* general class for column divs */ | ||
− | .igem_2017_content_wrapper .column | + | .igem_2017_content_wrapper .column { |
padding: 10px 0px; | padding: 10px 0px; | ||
− | float:left; | + | float: left; |
} | } | ||
/* class for a full width column */ | /* class for a full width column */ | ||
.column .full_size { | .column .full_size { | ||
− | width:100%; | + | width: 100%; |
} | } | ||
/* styling for images in a full width column*/ | /* styling for images in a full width column*/ | ||
.column.full_size img { | .column.full_size img { | ||
− | width:97%; | + | width: 97%; |
padding: 10px 15px; | padding: 10px 15px; | ||
} | } | ||
Line 333: | Line 341: | ||
width: 50%; | width: 50%; | ||
} | } | ||
+ | |||
/* styling for images in a half width column*/ | /* styling for images in a half width column*/ | ||
.column.half_size img { | .column.half_size img { | ||
Line 338: | Line 347: | ||
padding: 10px 15px; | padding: 10px 15px; | ||
} | } | ||
− | |||
− | |||
− | |||
/********************************* SUPPORT CLASSES ********************************/ | /********************************* SUPPORT CLASSES ********************************/ | ||
Line 346: | Line 352: | ||
/* class that clears content below*/ | /* class that clears content below*/ | ||
.igem_2017_content_wrapper .clear { | .igem_2017_content_wrapper .clear { | ||
− | clear:both; | + | clear: both; |
} | } | ||
− | |||
/* adds extra spacing when clearing content */ | /* adds extra spacing when clearing content */ | ||
− | .igem_2017_content_wrapper | + | .igem_2017_content_wrapper .clear.extra_space { |
height: 30px; | height: 30px; | ||
} | } | ||
− | |||
/* highlight class, makes content slightly smaller */ | /* highlight class, makes content slightly smaller */ | ||
Line 361: | Line 365: | ||
padding: 15px 0px; | padding: 15px 0px; | ||
} | } | ||
− | |||
/* highlight class, adds a gray background */ | /* highlight class, adds a gray background */ | ||
Line 375: | Line 378: | ||
/* highlight with a full blue border decoration */ | /* highlight with a full blue border decoration */ | ||
.igem_2017_content_wrapper .highlight.blue_border { | .igem_2017_content_wrapper .highlight.blue_border { | ||
− | border: 4px solid | + | border: 4px solid #190707; |
} | } | ||
− | |||
/* button class */ | /* button class */ | ||
− | .igem_2017_content_wrapper .button{ | + | .igem_2017_content_wrapper .button { |
max-width: 35%; | max-width: 35%; | ||
margin: 30px auto; | margin: 30px auto; | ||
Line 390: | Line 392: | ||
-moz-transition: all 0.4s ease; | -moz-transition: all 0.4s ease; | ||
-ms-transition: all 0.4s ease; | -ms-transition: all 0.4s ease; | ||
− | -o-transition: all 0.4s ease; transition: all 0.4s ease; | + | -o-transition: all 0.4s ease; |
+ | transition: all 0.4s ease; | ||
} | } | ||
/* styling for button on hover */ | /* styling for button on hover */ | ||
− | .igem_2017_content_wrapper .button:hover{ | + | .igem_2017_content_wrapper .button:hover { |
background-color: #190707; | background-color: #190707; | ||
color: #F8CE63; | color: #F8CE63; | ||
} | } | ||
− | |||
− | |||
− | |||
/***************************************************** RESPONSIVE STYLING ****************************************************/ | /***************************************************** RESPONSIVE STYLING ****************************************************/ | ||
+ | |||
+ | .igem_2017_content_wrapper td.td-40 { | ||
+ | color: #F8CE63; | ||
+ | width: 40%; | ||
+ | } | ||
+ | .igem_2017_content_wrapper td.td-50 { | ||
+ | color: #F8CE63; | ||
+ | width: 50%; | ||
+ | } | ||
+ | .igem_2017_content_wrapper td.td-60 { | ||
+ | color: #F8CE63; | ||
+ | width: 60%; | ||
+ | } | ||
/* IF THE SCREEN IS LESS THAN 1200PX */ | /* IF THE SCREEN IS LESS THAN 1200PX */ | ||
@media only screen and (max-width: 1200px) { | @media only screen and (max-width: 1200px) { | ||
− | #content {width:100%; } | + | #content { |
− | .igem_2017_menu_wrapper {width:15%; right:0;} | + | width: 100%; |
− | .highlight {padding:10px 0px;} | + | } |
− | .igem_2017_menu_wrapper #display_menu_control { display:none; } | + | |
− | #menu_content { display:block;} | + | .igem_2017_menu_wrapper { |
− | .menu_button.direct_to_page {padding-left: 17px;} | + | width: 15%; |
− | .igem_2017_content_wrapper | + | 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; | ||
+ | } | ||
+ | |||
+ | .igem_2017_content_wrapper td.td-40 { | ||
+ | width: 50%; | ||
+ | } | ||
+ | .igem_2017_content_wrapper td.td-50 { | ||
+ | width: 50%; | ||
+ | } | ||
+ | .igem_2017_content_wrapper td.td-60 { | ||
+ | width: 50%; | ||
} | } | ||
Line 422: | Line 460: | ||
@media only screen and (max-width: 800px) { | @media only screen and (max-width: 800px) { | ||
− | .igem_2017_menu_wrapper { width:100%; height: 15%; position:relative; left:0 | + | .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; | ||
+ | } | ||
+ | |||
+ | /* TABLES */ | ||
+ | .igem_2017_content_wrapper td.td-40 { | ||
+ | width: 100%; | ||
+ | } | ||
+ | .igem_2017_content_wrapper td.td-50 { | ||
+ | width: 100%; | ||
+ | } | ||
+ | .igem_2017_content_wrapper td.td-60 { | ||
+ | width: 100%; | ||
+ | } | ||
+ | } | ||
/* special class that the system uses to make sure the team wants a page to be evaluated */ | /* special class that the system uses to make sure the team wants a page to be evaluated */ | ||
Line 453: | Line 529: | ||
− | |||
− | |||
− | |||
<!-- This tells the browser that your page is responsive --> | <!-- This tells the browser that your page is responsive --> | ||
Line 464: | Line 537: | ||
<!--MENU--> | <!--MENU--> | ||
− | <div class="igem_2017_menu_wrapper" > | + | <div class="igem_2017_menu_wrapper"> |
− | + | ||
Line 479: | Line 551: | ||
<div id="menu_content"> | <div id="menu_content"> | ||
− | |||
− | |||
Line 488: | Line 558: | ||
</div> | </div> | ||
</a> | </a> | ||
− | |||
<div class="menu_button"> | <div class="menu_button"> | ||
− | <div class="expand_collapse_icon"> | + | <div class="expand_collapse_icon"></div> |
+ | TEAM | ||
</div> | </div> | ||
Line 504: | Line 574: | ||
<a href="https://2017.igem.org/Team:Stuttgart/Collaborations"> | <a href="https://2017.igem.org/Team:Stuttgart/Collaborations"> | ||
− | <div class="submenu_button" | + | <div class="submenu_button" id="Collaborations_page"> |
Collaborations | Collaborations | ||
</div> | </div> | ||
Line 511: | Line 581: | ||
</div> | </div> | ||
− | |||
− | |||
− | |||
<div class="menu_button"> | <div class="menu_button"> | ||
− | <div class="expand_collapse_icon"> | + | <div class="expand_collapse_icon"></div> |
+ | PROJECT | ||
</div> | </div> | ||
Line 524: | Line 592: | ||
<a href="https://2017.igem.org/Team:Stuttgart/Description"> | <a href="https://2017.igem.org/Team:Stuttgart/Description"> | ||
− | <div class="submenu_button" | + | <div class="submenu_button" id="Description_page"> |
Description | Description | ||
</div> | </div> | ||
</a> | </a> | ||
− | |||
<a href="https://2017.igem.org/Team:Stuttgart/Experiments"> | <a href="https://2017.igem.org/Team:Stuttgart/Experiments"> | ||
− | <div class="submenu_button" | + | <div class="submenu_button" id="Experiments_page"> |
Experiments | Experiments | ||
</div> | </div> | ||
Line 539: | Line 606: | ||
<a href="https://2017.igem.org/Team:Stuttgart/Notebook"> | <a href="https://2017.igem.org/Team:Stuttgart/Notebook"> | ||
− | <div class="submenu_button" | + | <div class="submenu_button" id="Notebook_page"> |
Notebook | Notebook | ||
</div> | </div> | ||
</a> | </a> | ||
− | + | <a href="https://2017.igem.org/Team:Stuttgart/Protocols"> | |
− | <div class="submenu_button" | + | <div class="submenu_button" id="Protocols_page"> |
Protocols | Protocols | ||
</div> | </div> | ||
Line 552: | Line 619: | ||
<a href="https://2017.igem.org/Team:Stuttgart/InterLab"> | <a href="https://2017.igem.org/Team:Stuttgart/InterLab"> | ||
− | <div class="submenu_button" | + | <div class="submenu_button" id="InterLab_page"> |
InterLab | InterLab | ||
</div> | </div> | ||
Line 558: | Line 625: | ||
<a href="https://2017.igem.org/Team:Stuttgart/Contribution"> | <a href="https://2017.igem.org/Team:Stuttgart/Contribution"> | ||
− | <div class="submenu_button" | + | <div class="submenu_button" id="Contribution_page"> |
Contribution | Contribution | ||
</div> | </div> | ||
Line 564: | Line 631: | ||
<a href="https://2017.igem.org/Team:Stuttgart/Model"> | <a href="https://2017.igem.org/Team:Stuttgart/Model"> | ||
− | <div class="submenu_button" | + | <div class="submenu_button" id="Model_page"> |
Model | Model | ||
</div> | </div> | ||
Line 570: | Line 637: | ||
<a href="https://2017.igem.org/Team:Stuttgart/Results"> | <a href="https://2017.igem.org/Team:Stuttgart/Results"> | ||
− | <div class="submenu_button" | + | <div class="submenu_button" id="Results_page"> |
Results | Results | ||
</div> | </div> | ||
Line 577: | Line 644: | ||
<a href="https://2017.igem.org/Team:Stuttgart/Improve"> | <a href="https://2017.igem.org/Team:Stuttgart/Improve"> | ||
− | <div class="submenu_button" | + | <div class="submenu_button" id="Improve_page"> |
Improve | Improve | ||
</div> | </div> | ||
Line 583: | Line 650: | ||
<a href="https://2017.igem.org/Team:Stuttgart/Attributions"> | <a href="https://2017.igem.org/Team:Stuttgart/Attributions"> | ||
− | <div class="submenu_button" | + | <div class="submenu_button" id="Attributions_page"> |
Attributions | Attributions | ||
</div> | </div> | ||
Line 589: | Line 656: | ||
</div> | </div> | ||
− | |||
− | |||
− | |||
− | |||
<div class="menu_button"> | <div class="menu_button"> | ||
− | <div class="expand_collapse_icon"> | + | <div class="expand_collapse_icon"></div> |
+ | PARTS | ||
</div> | </div> | ||
Line 603: | Line 667: | ||
<a href="https://2017.igem.org/Team:Stuttgart/Parts"> | <a href="https://2017.igem.org/Team:Stuttgart/Parts"> | ||
− | <div class="submenu_button" | + | <div class="submenu_button" id="Parts_page"> |
Parts | Parts | ||
</div> | </div> | ||
Line 609: | Line 673: | ||
<a href="https://2017.igem.org/Team:Stuttgart/Basic_Part"> | <a href="https://2017.igem.org/Team:Stuttgart/Basic_Part"> | ||
− | <div class="submenu_button" | + | <div class="submenu_button" id="Basic_Part_page"> |
Basic Parts | Basic Parts | ||
</div> | </div> | ||
Line 615: | Line 679: | ||
<a href="https://2017.igem.org/Team:Stuttgart/Composite_Part"> | <a href="https://2017.igem.org/Team:Stuttgart/Composite_Part"> | ||
− | <div class="submenu_button" | + | <div class="submenu_button" id="Composite_Part_page"> |
Composite Parts | Composite Parts | ||
</div> | </div> | ||
Line 621: | Line 685: | ||
<a href="https://2017.igem.org/Team:Stuttgart/Part_Collection"> | <a href="https://2017.igem.org/Team:Stuttgart/Part_Collection"> | ||
− | <div class="submenu_button" | + | <div class="submenu_button" id="Part_Collection_page"> |
Part Collection | Part Collection | ||
</div> | </div> | ||
</a> | </a> | ||
</div> | </div> | ||
− | |||
− | |||
− | |||
− | |||
Line 639: | Line 699: | ||
− | + | <div class="menu_button"> | |
− | + | <div class="expand_collapse_icon"></div> | |
− | + | HUMAN PRACTICES | |
− | + | ||
− | + | ||
− | <div class="menu_button" > | + | |
− | <div class="expand_collapse_icon"> | + | |
</div> | </div> | ||
Line 652: | Line 708: | ||
<a href="https://2017.igem.org/Team:Stuttgart/HP/Silver"> | <a href="https://2017.igem.org/Team:Stuttgart/HP/Silver"> | ||
− | <div class="submenu_button" | + | <div class="submenu_button" id="Silver_page"> |
Silver HP | Silver HP | ||
</div> | </div> | ||
Line 665: | Line 721: | ||
<a href="https://2017.igem.org/Team:Stuttgart/Engagement"> | <a href="https://2017.igem.org/Team:Stuttgart/Engagement"> | ||
− | <div class="submenu_button" | + | <div class="submenu_button" id="Engagement_page"> |
Public Engagement | Public Engagement | ||
</div> | </div> | ||
Line 674: | Line 730: | ||
<div class="menu_button"> | <div class="menu_button"> | ||
− | <div class="expand_collapse_icon"> | + | <div class="expand_collapse_icon"></div> |
+ | AWARDS | ||
</div> | </div> | ||
Line 681: | Line 738: | ||
<a href="https://2017.igem.org/Team:Stuttgart/Applied_Design"> | <a href="https://2017.igem.org/Team:Stuttgart/Applied_Design"> | ||
− | <div class="submenu_button" | + | <div class="submenu_button" id="Applied_Design_page"> |
Applied Design | Applied Design | ||
</div> | </div> | ||
Line 687: | Line 744: | ||
<a href="https://2017.igem.org/Team:Stuttgart/Entrepreneurship"> | <a href="https://2017.igem.org/Team:Stuttgart/Entrepreneurship"> | ||
− | <div class="submenu_button" | + | <div class="submenu_button" id="Entrepreneurship_page"> |
Entrepreneurship | Entrepreneurship | ||
</div> | </div> | ||
Line 693: | Line 750: | ||
<a href="https://2017.igem.org/Team:Stuttgart/Hardware"> | <a href="https://2017.igem.org/Team:Stuttgart/Hardware"> | ||
− | <div class="submenu_button" | + | <div class="submenu_button" id="Hardware_page"> |
Hardware | Hardware | ||
</div> | </div> | ||
Line 699: | Line 756: | ||
<a href="https://2017.igem.org/Team:Stuttgart/Measurement"> | <a href="https://2017.igem.org/Team:Stuttgart/Measurement"> | ||
− | <div class="submenu_button" | + | <div class="submenu_button" id="Measurement_page"> |
Measurement | Measurement | ||
</div> | </div> | ||
Line 705: | Line 762: | ||
<a href="https://2017.igem.org/Team:Stuttgart/Model"> | <a href="https://2017.igem.org/Team:Stuttgart/Model"> | ||
− | <div class="submenu_button" | + | <div class="submenu_button" id="Model_page"> |
Model | Model | ||
</div> | </div> | ||
</a> | </a> | ||
− | |||
</div> | </div> | ||
Line 721: | Line 777: | ||
− | + | <div class="menu_bottom_padding"> | |
− | <div class="menu_bottom_padding" > | + | |
</div> | </div> | ||
Line 734: | Line 789: | ||
− | <table> | + | <table> |
− | <tr> | + | <tr> |
− | <td | + | <td class="td-50"> |
− | <img src="https://static.igem.org/mediawiki/2017/e/ef/Tshirt_LIGHTUPTHEPIPE.pdf"/ width="100%" height="auto" align="left" hspace=0 vspace=0><br> | + | <img src="https://static.igem.org/mediawiki/2017/e/ef/Tshirt_LIGHTUPTHEPIPE.pdf"/ width="100%" height="auto" |
− | </td> | + | align="left" hspace=0 vspace=0><br> |
− | <td class="td-50"> | + | </td> |
− | <h3>The clogging of drains and pipe systems by hair and fat is a serious problem in industry and private households. Currently many blockages are dissolved by toxic and reactive chemicals like hydroxide and chlorine compounds, leading to accelerate corrosion in the pipe system and ecological damage. Our aim is to engage this problem in a more sustainable and eco-friendly way by developing a biological cleaner based on a holistic approach using E.coli. Our microbial system is targeted on producing and secreting enzymes, such as keratinases, lipases and esterases to break down hair, fat and other pollutants. By optimizing the secretion of the selected enzymes, we are avoiding enzyme purification which can save valuable money and time. Additionally, we want to produce a scent from the existing waste as an indicator of successful degradation. | + | <td class="td-50"> |
− | Involving mathematical modeling of enzymatic kinetics and degradation processes will support the experimental work. Finally this approach will LIGHT UP THE PIPE again!</h3> | + | <h3>The clogging of drains and pipe systems by hair and fat is a serious problem in industry and private |
− | <br> | + | households. Currently many blockages are dissolved by toxic and reactive chemicals like hydroxide |
− | <br> | + | and chlorine compounds, leading to accelerate corrosion in the pipe system and ecological damage. |
− | You can also find us on facebook - visit, give us a like or follow us on twitter <br> | + | Our aim is to engage this problem in a more sustainable and eco-friendly way by developing a |
− | <a target="_blank" title="find us on Facebook" href="https://www.facebook.com/igemstuttgart/"><img alt="follow me on facebook" src="//login.create.net/images/icons/user/facebook_40x40.png" border=0></a> <a target="_blank" title="follow us on twitter" href="https://twitter.com/igem_stuttgart?lang=de"><img alt="follow me on twitter" src="//login.create.net/images/icons/user/twitter_40x40.png" border=0></a> | + | biological cleaner based on a holistic approach using E.coli. Our microbial system is targeted on |
− | + | producing and secreting enzymes, such as keratinases, lipases and esterases to break down hair, fat | |
− | + | and other pollutants. By optimizing the secretion of the selected enzymes, we are avoiding enzyme | |
− | + | purification which can save valuable money and time. Additionally, we want to produce a scent from | |
− | + | the existing waste as an indicator of successful degradation. | |
− | + | Involving mathematical modeling of enzymatic kinetics and degradation processes will support the | |
− | + | experimental work. Finally this approach will LIGHT UP THE PIPE again!</h3> | |
− | + | <br> | |
− | + | <br> | |
+ | You can also find us on facebook - visit, give us a like or follow us on twitter <br> | ||
+ | <a target="_blank" title="find us on Facebook" href="https://www.facebook.com/igemstuttgart/"><img | ||
+ | alt="follow me on facebook" src="//login.create.net/images/icons/user/facebook_40x40.png" | ||
+ | border=0></a> <a target="_blank" title="follow us on twitter" | ||
+ | href="https://twitter.com/igem_stuttgart?lang=de"><img | ||
+ | alt="follow me on twitter" src="//login.create.net/images/icons/user/twitter_40x40.png" | ||
+ | border=0></a> | ||
+ | </td> | ||
+ | </tr> | ||
+ | </table> | ||
</div> | </div> | ||
</html> | </html> |
Revision as of 12:50, 28 October 2017