(127 intermediate revisions by the same user not shown) | |||
Line 2: | Line 2: | ||
<head> | <head> | ||
+ | <meta charset="UTF-8" /> | ||
+ | <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> | ||
+ | <meta name="viewport" content="width=device-width, initial-scale=1.0"> | ||
+ | <link rel="stylesheet" type="text/css" | ||
+ | href="https://2016.igem.org/Template:NAU-CHINA/texiao?action=raw&ctype=text/css" /> | ||
+ | <link rel="stylesheet" type="text/css" | ||
+ | href="https://2016.igem.org/Template:NAU-CHINA/component?action=raw&ctype=text/css" /> | ||
<style type="text/css"> | <style type="text/css"> | ||
− | + | /* Hide top title */ | |
− | + | #top_title, #sideMenu { | |
− | + | ||
display: none; | display: none; | ||
} | } | ||
+ | /* Hide first heading */ | ||
+ | .firstHeading { | ||
+ | display: none; | ||
+ | } | ||
+ | |||
+ | |||
/*-- Remove borders, float content left and remove padding/margin */ | /*-- Remove borders, float content left and remove padding/margin */ | ||
#globalWrapper, #content{ | #globalWrapper, #content{ | ||
background-color: transparent; | background-color: transparent; | ||
− | border: | + | border: none; |
− | float: | + | float: center; |
− | margin:0px; | + | width: auto; |
− | padding: | + | margin-left: 0px; |
+ | margin-top: -8px; | ||
+ | padding: auto; | ||
} | } | ||
/*left align Black Menu Bar */ | /*left align Black Menu Bar */ | ||
#top_menu_inside { | #top_menu_inside { | ||
− | margin-left: | + | margin-left: 0px; |
} | } | ||
− | + | .centerImage | |
− | + | { | |
− | + | text-align:center; | |
+ | display:block; | ||
} | } | ||
− | + | .wraptocenter { | |
− | . | + | display: table-cell; |
− | + | text-align: center; | |
+ | vertical-align: middle; | ||
+ | width: 200px; | ||
+ | height: 200px; | ||
+ | background-color: #999; | ||
} | } | ||
− | + | .wraptocenter * { | |
− | # | + | vertical-align: middle; |
+ | } | ||
+ | #top_menu_inside .submenu{min-height:250px;} | ||
+ | |||
+ | |||
+ | #abstract{ | ||
+ | background-color: rgba(147,251,152,0.9); | ||
+ | position: fixed; | ||
+ | margin: 1.25em 20em 0 20em; | ||
+ | height: 90%; | ||
+ | z-index:-1; | ||
+ | font-family:'Comic Sans MS','Arial Black'; | ||
+ | display: none; | ||
+ | border:solid 1px white; | ||
+ | |||
+ | } | ||
+ | #scroll_to_bottom{ | ||
+ | position: fixed; | ||
+ | text-align: center; | ||
color: #ffffff; | color: #ffffff; | ||
font-weight: bold; | font-weight: bold; | ||
+ | bottom: 10%; | ||
+ | left: 40%; | ||
} | } | ||
− | + | ||
− | + | @media screen and (max-width: 1170px) { | |
− | + | ||
− | + | .menu{ | |
− | + | display: none; | |
− | + | } | |
− | + | ||
+ | .container { | ||
+ | display: block; | ||
+ | } | ||
+ | |||
} | } | ||
− | + | @media screen and (max-width: 980px){ | |
− | + | #ClickBack{ | |
− | + | display: none; | |
} | } | ||
− | + | #abstract{ | |
− | position: | + | background-color: rgba(147,251,152,0.9); |
− | margin: | + | position: fixed; |
− | font- | + | margin: 45% auto 0 auto; |
+ | min-height: 40em; | ||
+ | height:auto; | ||
+ | z-index:-1; | ||
+ | font-family:'Comic Sans MS','Arial Black'; | ||
+ | border:solid 1px white; | ||
+ | display: block; | ||
+ | overflow:hidden; | ||
} | } | ||
− | # | + | #scroll_to_bottom{ |
− | + | display: none; | |
− | + | ||
} | } | ||
− | + | body{ | |
− | + | background-color: white; | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
} | } | ||
+ | .menu{ | ||
+ | display: none; | ||
+ | } | ||
+ | .container { | ||
+ | display: block; | ||
+ | } | ||
+ | } | ||
+ | @media screen and (min-width: 1170px) { | ||
+ | .menu{ | ||
+ | display: block; | ||
+ | } | ||
− | -- | + | .container { |
+ | display: none; | ||
+ | } | ||
+ | |||
+ | } | ||
+ | |||
+ | #abstract #guanjian {margin-left:7em;font-family:'Comic Sans MS','Arial Black';font-size:16px;} | ||
+ | p{ | ||
+ | margin-left: 5em; | ||
+ | margin-right: 5em; | ||
+ | font-family:'Comic Sans MS','Arial Black'; | ||
+ | } | ||
+ | h1{ | ||
+ | margin-left: 4.5em; | ||
+ | margin-right: 5em; | ||
+ | margin-top: 3.5em; | ||
+ | font-family:'Comic Sans MS','Arial Black'; | ||
+ | } | ||
+ | #ClickBack{ | ||
+ | text-align: center; | ||
+ | position: fixed; | ||
+ | bottom: 3em; | ||
+ | right: 18em; | ||
+ | display:none; | ||
+ | font-family:'Comic Sans MS','Arial Black'; | ||
+ | } | ||
+ | |||
+ | #ClickBack img{ | ||
+ | width: 6em; | ||
+ | } | ||
</style> | </style> | ||
Line 74: | Line 157: | ||
<script type="text/javascript"> | <script type="text/javascript"> | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
function ChangeImg(ThisPic) | function ChangeImg(ThisPic) | ||
{ | { | ||
Line 92: | Line 168: | ||
ThisPic.height=TrueHeight/Multiple; | ThisPic.height=TrueHeight/Multiple; | ||
} | } | ||
− | |||
+ | $(document).ready(function(){ | ||
− | + | $("#scroll_to_bottom").click(function(){ | |
+ | $("#abstract").slideToggle(); | ||
+ | $("#ClickBack").slideToggle(); | ||
+ | $("#scroll_to_bottom").slideToggle(); | ||
+ | }); | ||
− | + | $("#ClickBack").click(function(){ | |
− | + | $("#abstract").fadeOut("slow"); | |
− | + | $("#ClickBack").fadeOut("slow"); | |
− | + | $("#scroll_to_bottom").fadeIn("slow"); | |
− | + | }); | |
− | + | }); | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
+ | </script> | ||
+ | </head> | ||
+ | |||
+ | <body> | ||
+ | <!-- small screen menu --> | ||
+ | |||
+ | <div class="container" > | ||
+ | <ul id="gn-menu" class="gn-menu-main" > | ||
+ | <li class="gn-trigger"> | ||
+ | <a class="gn-icon gn-icon-menu"> | ||
+ | </a> | ||
+ | <nav class="gn-menu-wrapper"> | ||
+ | <div class="gn-scroller"> | ||
+ | <ul class="gn-menu"> | ||
+ | <li> | ||
+ | <a href="https://2016.igem.org/Team:NAU-CHINA"><span> HOME</span></a> | ||
+ | </li> | ||
+ | <li> | ||
+ | <a href="https://2016.igem.org/Team:NAU-CHINA/Participator"> TEAM</a> | ||
+ | </li> | ||
+ | <li> | ||
+ | <a href="https://2016.igem.org/Team:NAU-CHINA/Description"> PROJECT</a> | ||
+ | </li> | ||
+ | <li> | ||
+ | <a href="https://2016.igem.org/Team:NAU-CHINA/Part_Collection"> PARTS</a> | ||
+ | </li> | ||
+ | |||
+ | <li><a href="https://2016.igem.org/Team:NAU-CHINA/Safety"> SAFETY</a></li> | ||
+ | <li><a href="https://2016.igem.org/Team:NAU-CHINA/Attributions"> ATTRIBUTION</a></li> | ||
+ | <li> | ||
+ | <a href="https://2016.igem.org/Team:NAU-CHINA/Human_Practices"> HP</a> | ||
+ | </li> | ||
+ | <li><a href="https://2016.igem.org/Team:NAU-CHINA/Conclusion">CONCLUSION</a></li> | ||
+ | </ul> | ||
+ | </div><!-- /gn-scroller --> | ||
+ | </nav> | ||
+ | </li> | ||
+ | </ul> | ||
− | + | </div><!-- /container --> | |
− | + | ||
− | + | ||
− | </ | + | |
− | + | ||
− | + | ||
+ | <nav> | ||
+ | <!-- big screen menu--> | ||
+ | <div class="nav" id="main" role="main"> | ||
+ | <ul class="menu"> | ||
+ | <li><a href="https://2016.igem.org/Team:NAU-CHINA">HOME</a></li> | ||
+ | <li><a>TEAM</a> | ||
+ | <ul class="submenu"> | ||
+ | <li><a href="https://2016.igem.org/Team:NAU-CHINA/Participator">Participator</a></li> | ||
+ | <li><a href="https://2016.igem.org/Team:NAU-CHINA/Collaborations">Collaboration</a></li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | <li><a>PROJECT</a> | ||
+ | <ul class="submenu"> | ||
+ | <li><a href="https://2016.igem.org/Team:NAU-CHINA/Description">Description</a></li> | ||
+ | <li><a href="https://2016.igem.org/Team:NAU-CHINA/Design">Applied Design</a></li> | ||
+ | <li><a href="https://2016.igem.org/Team:NAU-CHINA/Experiment">Experiment</a></li> | ||
+ | <li><a href="https://2016.igem.org/Team:NAU-CHINA/Proof">Proof of Concept</a></li> | ||
+ | <li><a href="https://2016.igem.org/Team:NAU-CHINA/Demonstrate">Demonstrate </a></li> | ||
+ | <li><a href="https://2016.igem.org/Team:NAU-CHINA/Model">Model </a></li> | ||
+ | <li><a href="https://2016.igem.org/Team:NAU-CHINA/Notebook">Notebook </a></li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | <li><a>PARTS</a> | ||
+ | <ul class="submenu"> | ||
+ | <li><a href="https://2016.igem.org/Team:NAU-CHINA/Part_List">Part List</a></li> | ||
+ | <li><a href="https://2016.igem.org/Team:NAU-CHINA/Basic_Part">Basic Part</a></li> | ||
+ | <li><a href="https://2016.igem.org/Team:NAU-CHINA/Composite_Part">Composite Part</a></li> | ||
+ | <li><a href="https://2016.igem.org/Team:NAU-CHINA/Part_Collection">Collection</a></li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | <li><a href="https://2016.igem.org/Team:NAU-CHINA/Safety">SAFETY</a></li> | ||
+ | <li><a href="https://2016.igem.org/Team:NAU-CHINA/Attributions">ATTRIBUTION</a></li> | ||
+ | <li><a>HUMAN PRACTICE</a> | ||
+ | <ul class="submenu"> | ||
+ | <li><a href="https://2016.igem.org/Team:NAU-CHINA/Human_Practices">Human Practices</a></li> | ||
+ | <li><a href="https://2016.igem.org/Team:NAU-CHINA/HP/Silver">Silver</a></li> | ||
+ | <li><a href="https://2016.igem.org/Team:NAU-CHINA/HP/Gold">Gold</a></li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | <li><a href="https://2016.igem.org/Team:NAU-CHINA/Conclusion">CONCLUSION</a></li> | ||
+ | </ul> | ||
+ | </div> | ||
+ | </nav> | ||
+ | <img src="https://static.igem.org/mediawiki/2016/e/e8/NAU_CHINA_2016WIKI_HOME.jpeg" onload="ChangeImg(this)" style="z-index:-60;position:absolute;left:0;top:0px"><!--backgroundimg--> | ||
+ | <div> | ||
+ | <div name="abstract" id="abstract"> | ||
+ | <br><br> | ||
+ | <h1 style="font-family:'Comic Sans MS','Arial Black';font-size:20px;">The Birth of Healer & A Story of Us</h1> | ||
+ | <p style="font-family:'Comic Sans MS','Arial Black';font-size:17px;">Several ideas were created and several ideas were denied. Our eyes were blocked by <b style="font-weight: bold;color:blue;">3-phenoxybenzoate acid(3-PBA)</b>, the main intermediate product of pyrethroids. But what is 3-PBA and what are pyrethroids? Why we need to degrade 3-PBA thoroughly and how to degrade it through employing microbial biodegradation techniques? Once our Healer (the engineered bacteria) were born, how to put it into practice? From knowing to deep knowing, our efforts made it real.</p><br> | ||
+ | <ul id="guanjian">Key words: | ||
+ | <li>Cause <span>(what is 3-PBA and what are pyrethroids? Why we need to degrade 3-PBA thoroughly?)</span></li> | ||
+ | <li>Method <span>(How to degrade it through employing microbial biodegradation techniques?)</span></li> | ||
+ | <li>Extention <span>(How to put it into practice?)</span></li> | ||
+ | </ul> | ||
+ | <br><br> | ||
+ | </div> | ||
+ | <br style="clear:both;"></div> | ||
+ | <div id="ClickBack"> | ||
+ | <img src="https://static.igem.org/mediawiki/2016/e/e9/NAU_CHINA_2016_ClickToBack.gif"> | ||
+ | <p>Click Me Back</p> | ||
+ | </div> | ||
+ | |||
+ | <div id="scroll_to_bottom"> | ||
+ | <p>Click here to see more</p> | ||
+ | <img src="https://static.igem.org/mediawiki/2016/6/60/NAU_CHINA_2016_scrollBottom.gif"> | ||
+ | </div> | ||
+ | <script type="text/javascript" src="https://2016.igem.org/Template:NAU-CHINA/modernizr_custom? | ||
+ | action=raw&ctype=text/javascript"></script> | ||
+ | <script type="text/javascript" src="https://2016.igem.org/Template:NAU-CHINA/gnmenu? | ||
+ | action=raw&ctype=text/javascript"></script> | ||
+ | <script type="text/javascript" src="https://2016.igem.org/Template:NAU-CHINA/classie? | ||
+ | action=raw&ctype=text/javascript"></script> | ||
+ | <script> | ||
+ | new gnMenu( document.getElementById( 'gn-menu' ) ); | ||
+ | </script> | ||
</body> | </body> | ||
Latest revision as of 18:17, 19 October 2016
The Birth of Healer & A Story of Us
Several ideas were created and several ideas were denied. Our eyes were blocked by 3-phenoxybenzoate acid(3-PBA), the main intermediate product of pyrethroids. But what is 3-PBA and what are pyrethroids? Why we need to degrade 3-PBA thoroughly and how to degrade it through employing microbial biodegradation techniques? Once our Healer (the engineered bacteria) were born, how to put it into practice? From knowing to deep knowing, our efforts made it real.
- Key words:
- Cause (what is 3-PBA and what are pyrethroids? Why we need to degrade 3-PBA thoroughly?)
- Method (How to degrade it through employing microbial biodegradation techniques?)
- Extention (How to put it into practice?)
Click Me Back
Click here to see more