Difference between revisions of "Team:NUDT CHINA/Practices"

m
m
Line 2: Line 2:
 
<head>
 
<head>
 
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
 
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<!--Javascript-->
+
<!--Javascript-->
<!--jQuery-->
+
<!--jQuery-->
 
         <script type="text/javascript" src="http://code.jquery.com/jquery-1.11.3.js"></script>
 
         <script type="text/javascript" src="http://code.jquery.com/jquery-1.11.3.js"></script>
 
         <script type="text/javascript" src="jquery-1.11.3.js"></script>
 
         <script type="text/javascript" src="jquery-1.11.3.js"></script>
<!--MENU-->
+
<!--MENU-->
 
<script type="text/javascript">
 
<script type="text/javascript">
 
$(document).ready(function() {
 
$(document).ready(function() {
Line 15: Line 15:
 
});
 
});
 
</script>
 
</script>
<!--NAVIGATION-->
+
<!--NAVIGATION-->
 
<script type="text/javascript">
 
<script type="text/javascript">
 
$(document).ready(function() {
 
$(document).ready(function() {
Line 29: Line 29:
 
});
 
});
 
</script>
 
</script>
<!--iGEM_LOGO-->
+
<!--iGEM_LOGO-->
 
<script type="text/javascript">
 
<script type="text/javascript">
 
$(document).ready(function() {
 
$(document).ready(function() {
Line 40: Line 40:
 
});
 
});
 
  </script>
 
  </script>
<!--css-->
+
<!--css-->
<!--RESET-->
+
<!--RESET-->
 
<style type="text/css">
 
<style type="text/css">
 
.clearStyle {
 
.clearStyle {
Line 59: Line 59:
 
}
 
}
 
</style>
 
</style>
<!-- myMainContainer-->
+
<!-- myMainContainer-->
 
<style type="text/css">
 
<style type="text/css">
 
#myMainContainer {   
 
#myMainContainer {   
Line 73: Line 73:
 
}
 
}
 
</style>
 
</style>
<!--BANNER CONTAINER-->
+
<!--BANNER CONTAINER-->
 
<style type="text/css">
 
<style type="text/css">
 
#bannerContainer {
 
#bannerContainer {
Line 81: Line 81:
 
}
 
}
 
</style>
 
</style>
<!--MENU-->
+
<!--MENU-->
 
<style type="text/css">
 
<style type="text/css">
 
#menu
 
#menu
Line 152: Line 152:
 
}
 
}
 
</style>
 
</style>
<!--NAVIGATION-->
+
<!--NAVIGATION-->
 
<style type="text/css">
 
<style type="text/css">
 
#navigation
 
#navigation
Line 243: Line 243:
 
}
 
}
 
</style>
 
</style>
<!--IGEM LOGO-->
+
<!--IGEM LOGO-->
 
<style type="text/css">
 
<style type="text/css">
 
#logoContainer {
 
#logoContainer {
Line 251: Line 251:
 
}
 
}
 
</style>
 
</style>
<!--NUDT_Container-->
+
<!--NUDT_Container-->
 
<style type="text/css">
 
<style type="text/css">
 
#NUDT_Container
 
#NUDT_Container
Line 338: Line 338:
 
font-family: "Trebuchet MS", Helvetica, sans-serif;
 
font-family: "Trebuchet MS", Helvetica, sans-serif;
 
font-size: 16px;
 
font-size: 16px;
 +
}
 +
#NUDT_Container team {
 +
position: relative;
 +
display: inline-block;
 +
width: auto;
 +
height: auto;
 +
margin: 10px 50px;
 +
    padding: 20px 20px;
 +
    text-decoration: none;
 +
color: #000000;
 +
border-radius: 8px 8px;
 +
outline: none;
 +
cursor: pointer;
 +
font-family: "Trebuchet MS", Helvetica, sans-serif;
 +
font-size: 16px;
 +
}
 +
 +
</style>
 +
<!--DIA_Container-->
 +
<style type="text/css">
 +
#NUDT_Dia_Container
 +
{
 +
width: auto;
 +
margin: 0px 100px;
 +
}
 +
</style>
 +
<!--BLANK_Container-->
 +
<style type="text/css">
 +
.BLANK_Container
 +
{
 +
width: auto;
 +
}
 +
</style>
 +
<!--TEAM-->
 +
<style type="text/css">
 +
.team_Container
 +
{
 +
margin: 20px 10px;
 +
padding: 20px 10px;
 +
width: auto;
 
}
 
}
 
</style>
 
</style>
Line 586: Line 626:
 
    }
 
    }
 
  </style>
 
  </style>
  <body>
 
<!--DIA_Container-->
 
<style type="text/css">
 
#NUDT_Dia_Container
 
{
 
width: auto;
 
margin: 0px 100px;
 
}
 
</style>
 
<!--BLANK_Container-->
 
<style type="text/css">
 
.BLANK_Container
 
{
 
width: auto;
 
}
 
</style>
 
 
<!--Common-->
 
<!--Common-->
 
<div id = "myMainContainer">
 
<div id = "myMainContainer">
<div id = "bannerContainer">
 
<img src="https://static.igem.org/mediawiki/2015/0/06/Team_NUDT_CHINA_banner.jpg" style="width: auto"/>
 
</div>
 
 
<div id = "menu">
 
<div id = "menu">
 
<img src="https://static.igem.org/mediawiki/2015/9/99/Menu.png"/>  
 
<img src="https://static.igem.org/mediawiki/2015/9/99/Menu.png"/>  
Line 642: Line 663:
 
<div id = "NUDT_Container" class = "clearStyle">
 
<div id = "NUDT_Container" class = "clearStyle">
 
<div>
 
<div>
<h1>NOTEBOOK</h1>
+
<img src="https://static.igem.org/mediawiki/2015/0/06/Team_NUDT_CHINA_banner.jpg" style = "width: 100%; height: auto"/>
 +
</div>
 +
<!--subCommon-->
 +
<h1>HUMAN PRACTICES</h1>
 
<table>
 
<table>
 
<tr>
 
<tr>
 
<p style = "font-size: 12px; text-align: left; padding: 0px 50px 0px 100px;">TIPS1: The left <B style = "color: #d82545">MENU :)</B> links to other NUDT_CHINA website.</p>
 
<p style = "font-size: 12px; text-align: left; padding: 0px 50px 0px 100px;">TIPS1: The left <B style = "color: #d82545">MENU :)</B> links to other NUDT_CHINA website.</p>
<p style = "font-size: 12px; text-align: left; padding: 0px 50px 0px 100px;">TIPS2: The right <B style = "color: #d82545">NAVIGATE :)</B> posites on content in this page. (Valid when <B style = "color: #d82545">FOLDED/UNFOLDED</B>)</p>
+
<p style = "font-size: 12px; text-align: left; padding: 0px 50px 0px 100px;">TIPS2: The right <B style = "color: #d82545">NAVIGATE :)</B> posites on content in this page. (Valid when <B style = "color: #d82545">UNFOLDED</B>)</p>
<p style = "font-size: 12px; text-align: left; padding: 0px 50px 0px 100px;">TIPS3: Click <B style = "color: #d82545">SUBTITLE/:)</B> to <B style = "color: #d82545">FOLD/UNFOLD</B> related content. </p>
+
<p style = "font-size: 12px; text-align: left; padding: 0px 50px 0px 100px;">TIPS3: Click <B style = "color: #d82545">SUBTITLE</B> to <B style = "color: #d82545">FOLD/UNFOLD</B> related content. </p>
 
</tr>
 
</tr>
 
<tr><button id = "slideAll" style = "margin: 0px 50px 0px 100px;"> CLICK TO FOLD/UNFOLD ALL</button>
 
<tr><button id = "slideAll" style = "margin: 0px 50px 0px 100px;"> CLICK TO FOLD/UNFOLD ALL</button>
 
</tr>
 
</tr>
 
</table>
 
</table>
</div>
 
 
<script type="text/javascript">
 
<script type="text/javascript">
 
$(document).ready(function(){
 
$(document).ready(function(){
 
$("#slideAll").click(function(){
 
$("#slideAll").click(function(){
$(".Pannal").slideToggle(300);
+
$(".BLANK_Container").slideToggle(300);
 
});
 
});
 
});
 
});
 
</script>
 
</script>
<section id="cd-timeline" class="cd-container">
+
<!--INTERVIEW-->
<!--2015.5.16-->
+
<h2 id = "pos1" >INTERVIEW: Human Laboratory Animal Center <B style = "color: #d82545">(CLICK)</B></h2>
<div class="cd-timeline-block">
+
<div class = "BLANK_Container" id = "slide1" style = "display:none;">
<div class="cd-timeline-img cd-picture" id = "pic1">
+
<h3>I.PREFACE</h3>
<img src="https://static.igem.org/mediawiki/2015/9/98/Smile_NUDT_CHINA.png" alt="Picture">
+
<p>Considering our project may have an impact on the biopharmaceutical field to a certain extent, especially on the efficiency of the production of drug, we interviewed Hunan Laboratory Animal Center (HLAC) for some advice on safety and prospect. </p>
</div>
+
<h3>II.PARTICIPANTS</h3>
<div class="cd-timeline-content" id = "key1">
+
<center>
<h7 style = "color:black"><h7 style = "color: #d82545">CULTURE&amp;SQUENCE:</h7> Related parts in Kit</h7>
+
<table>
<p style = "padding: 10px 5px; display:none;" id = "cont1" class = "Pannal"><img src="test1.png">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut justo nibh, mattis sit amet consequat a, varius vitae metus. Proin pharetra sodales pellentesque.</p>
+
<tr>
<span class="cd-date" style="font-size:24px">2015.5.16</span>
+
<td><img src="https://static.igem.org/mediawiki/2015/4/4b/NUDT_CHIAN_HP1_2.jpg" style="width: 400px; height:300px"/></td>
<script type="text/javascript">
+
</tr>
$(document).ready(function(){
+
<tr>
$("#key1").click(function(){
+
<td style = "font-size: 10px;">Interviewers and Interviewee</td>
$("#cont1").slideToggle(300);
+
</tr>
});
+
</table>
});
+
<p></p>
$(document).ready(function(){
+
<table>
$("#pic1").click(function(){
+
<tr>
$("#cont1").slideToggle(300);
+
<td><img src="https://static.igem.org/mediawiki/2015/1/12/NUDT_CHIAN_HP1_Jiang.png" style="width: 120px; height:120px"/></td>
});
+
<td><img src="https://static.igem.org/mediawiki/2015/e/e0/NUDT_CHIAN_HP1_Zhu1.png" style="width: 120px; height:120px"/></td>
});
+
<td><img src="https://static.igem.org/mediawiki/2015/2/2f/NUDT_CHIAN_HP1_Fan1.png" style="width: 120px; height:120px"/></td>
</script>
+
<td><img src="https://static.igem.org/mediawiki/2015/5/58/NUDT_CHIAN_HP1_Wang1.png" style="width: 120px; height:120px"/></td>
</div>
+
</tr>
 +
<tr>
 +
<td style = "font-size: 10px;"><B>Doctor</B> Jiang</td>
 +
<td style = "font-size: 10px;"><B>Instructor</B> Lingyun Zhu</td>
 +
<td style = "font-size: 10px;"><B>Student</B> Dongyu Fan</td>
 +
<td style = "font-size: 10px;"><B>Student</B> Yizhong Wang</td>
 +
</tr>
 +
</table>
 +
</center>
 +
<h3>III.SPOT</h3>
 +
<center>
 +
<table>
 +
<tr>
 +
<td><img src="https://static.igem.org/mediawiki/2015/3/31/NUDT_CHIAN_HP1_1.jpg" style="width: 400px; height:230px"/></td>
 +
</tr>
 +
<tr>
 +
<td style = "font-size: 10px;">Human Laboratory Animal Center</td>
 +
</tr>
 +
</table>
 +
</center>
 +
<h3>IV.DIALOGUE</h3>
 +
        <div id = "NUDT_Dia_Container">
 +
    <!--对话-->
 +
        <!--左-->
 +
            <!--头像-->
 +
            <section style="border: 0px; margin: 0.2em 0px; box-sizing: border-box; padding: 0px;">
 +
                <section style="display: inline-block; width: 80px; vertical-align: top; box-sizing: border-box;" >
 +
                    <!--头像png-->
 +
                    <section style="width: 60px; height: 60px; margin-left: 10px; border-top-left-radius: 60px; border-top-right-radius: 60px; border-bottom-right-radius: 60px; border-bottom-left-radius: 60px; background-image: url(https://static.igem.org/mediawiki/2015/2/2f/NUDT_CHIAN_HP1_Fan1.png); background-size: cover; box-sizing: border-box; background-position: 50% 50%; background-repeat: no-repeat no-repeat;" ></section>
 +
                    <!--头像text-->
 +
                    <section  style="font-size: 0.8em; font-family: inherit; text-align: center; text-decoration: inherit; color: inherit; box-sizing: border-box;"><section  style="box-sizing: border-box;">Dongyu Fan
 +
                    </section>
 +
                    </section>
 +
                </section>
 +
            <!--对话-->
 +
                <section style="display: inline-block; width: 75%; font-size: 87.5%; font-family: inherit; text-decoration: inherit; color: inherit; border-color: #ffe4c8; box-sizing: border-box;">
 +
                    <!--对话box-->
 +
                    <section style="display: inline-block; width: 85%; margin-top: 11px; padding: 16px; border-top-left-radius: 16px; border-top-right-radius: 16px; border-bottom-right-radius: 16px; border-bottom-left-radius: 16px; background-color: #ffe4c8; box-sizing: border-box;" >
 +
                        <!--对话text-->
 +
                        <section style="box-sizing: border-box;">Moring Dr. Jiang, thank you for accept our interview. We all know that, in recent years, bio-pharmaceutical security has been subject to the general interest. We've learned that the Experimental Animal Center are already passed the identification of United States AAALAC Certification Center on safety evaluation of drugs. So we hope we can gain an objective and comprehensive assessment of our project and are eager for valuable advice through this interview.</section>
 +
                    </section>
 +
                </section>
 +
            </section>
 +
        <!--左-->
 +
            <!--头像-->
 +
            <section style="border: 0px; margin: 0.2em 0px; box-sizing: border-box; padding: 0px;">
 +
                <section style="display: inline-block; width: 80px; vertical-align: top; box-sizing: border-box;" >
 +
                    <!--头像png-->
 +
                    <section style="width: 60px; height: 60px; margin-left: 10px; border-top-left-radius: 60px; border-top-right-radius: 60px; border-bottom-right-radius: 60px; border-bottom-left-radius: 60px; background-image: url(https://static.igem.org/mediawiki/2015/e/e0/NUDT_CHIAN_HP1_Zhu1.png); background-size: cover; box-sizing: border-box; background-position: 50% 50%; background-repeat: no-repeat no-repeat;" ></section>
 +
                    <!--头像text-->
 +
                    <section  style="font-size: 0.8em; font-family: inherit; text-align: center; text-decoration: inherit; color: inherit; box-sizing: border-box;"><section  style="box-sizing: border-box;">Lingyun Zhu
 +
                    </section>
 +
                    </section>
 +
                </section>
 +
            <!--对话-->
 +
                <section style="display: inline-block; width: 75%; font-size: 87.5%; font-family: inherit; text-decoration: inherit; color: inherit; border-color: #a5a5a5; box-sizing: border-box;">
 +
                    <!--对话box-->
 +
                    <section style="display: inline-block; width: 85%; margin-top: 11px; padding: 16px; border-top-left-radius: 16px; border-top-right-radius: 16px; border-bottom-right-radius: 16px; border-bottom-left-radius: 16px; background-color: #a5a5a5; box-sizing: border-box;" >
 +
                        <!--对话text-->
 +
                        <section style="box-sizing: border-box;">Moring Dr. Jiang! First of all, I would like to introduce our project. What we are actually doing is using synthetic biology to build a DNA support system. This system is in microorganisms so that we can increase efficiency of regionalization reaction through metabolic engineering of multi-enzymatic reaction.</section>
 +
                    </section>
 +
                </section>
 +
            </section>
 +
        <!--右-->
 +
            <section style="border: 0px; text-align: right; margin: 0.2em 0px; box-sizing: border-box; padding: 0px;" >
 +
            <!--对话-->
 +
                <section style="display: inline-block; width: 75%; font-size: 87.5%; font-family: inherit; text-decoration: inherit; color: inherit; border-color: #7be8cd; box-sizing: border-box;" >
 +
                    <section style="display: inline-block; width: 85%; margin-top: 11px; padding: 16px; border-top-left-radius: 16px; border-top-right-radius: 16px; border-bottom-right-radius: 16px; border-bottom-left-radius: 16px; text-align: left; background-color: #7be8cd; box-sizing: border-box;" >
 +
                        <section style="box-sizing: border-box;">As far as I understand, metabolic engineering is similar with biochemical reactions.</section>
 +
                    </section>
 +
                    <img style="vertical-align: top; margin-top: 29px; background-color: #7be8cd; box-sizing: border-box;"/>
 +
                </section>
 +
            <!--头像-->
 +
                <section style="display: inline-block; vertical-align: top; width: 80px; box-sizing: border-box;" >
 +
                    <section style="width: 60px; height: 60px; margin-left: 10px; border-top-left-radius: 60px; border-top-right-radius: 60px; border-bottom-right-radius: 60px; border-bottom-left-radius: 60px; background-image: url(https://static.igem.org/mediawiki/2015/1/12/NUDT_CHIAN_HP1_Jiang.png); background-size: cover; box-sizing: border-box; background-position: 50% 50%; background-repeat: no-repeat no-repeat;" ></section>
 +
                    <section style="font-size: 0.8em; font-family: inherit; text-align: center; text-decoration: inherit; color: inherit; box-sizing: border-box;">
 +
                        <section  style="box-sizing: border-box;">Dr. Jiang</section>
 +
                    </section>
 +
                </section>
 +
            </section>
 +
        <!--左-->
 +
            <!--头像-->
 +
            <section style="border: 0px; margin: 0.2em 0px; box-sizing: border-box; padding: 0px;">
 +
                <section style="display: inline-block; width: 80px; vertical-align: top; box-sizing: border-box;" >
 +
                    <!--头像png-->
 +
                    <section style="width: 60px; height: 60px; margin-left: 10px; border-top-left-radius: 60px; border-top-right-radius: 60px; border-bottom-right-radius: 60px; border-bottom-left-radius: 60px; background-image: url(https://static.igem.org/mediawiki/2015/2/2f/NUDT_CHIAN_HP1_Fan1.png); background-size: cover; box-sizing: border-box; background-position: 50% 50%; background-repeat: no-repeat no-repeat;" ></section>
 +
                    <!--头像text-->
 +
                    <section  style="font-size: 0.8em; font-family: inherit; text-align: center; text-decoration: inherit; color: inherit; box-sizing: border-box;"><section  style="box-sizing: border-box;">Dongyu Fan
 +
                    </section>
 +
                    </section>
 +
                </section>
 +
            <!--对话-->
 +
                <section style="display: inline-block; width: 75%; font-size: 87.5%; font-family: inherit; text-decoration: inherit; color: inherit; border-color: #ffe4c8; box-sizing: border-box;">
 +
                    <!--对话box-->
 +
                    <section style="display: inline-block; width: 85%; margin-top: 11px; padding: 16px; border-top-left-radius: 16px; border-top-right-radius: 16px; border-bottom-right-radius: 16px; border-bottom-left-radius: 16px; background-color: #ffe4c8; box-sizing: border-box;" >
 +
                        <!--对话text-->
 +
                        <section style="box-sizing: border-box;">Could you evaluate the safety of our reconstruction project of the microbial?</section>
 +
                    </section>
 +
                </section>
 +
            </section>
 +
        <!--右-->
 +
            <section style="border: 0px; text-align: right; margin: 0.2em 0px; box-sizing: border-box; padding: 0px;" >
 +
            <!--对话-->
 +
                <section style="display: inline-block; width: 75%; font-size: 87.5%; font-family: inherit; text-decoration: inherit; color: inherit; border-color: #7be8cd; box-sizing: border-box;" >
 +
                    <section style="display: inline-block; width: 85%; margin-top: 11px; padding: 16px; border-top-left-radius: 16px; border-top-right-radius: 16px; border-bottom-right-radius: 16px; border-bottom-left-radius: 16px; text-align: left; background-color: #7be8cd; box-sizing: border-box;" >
 +
                        <section style="box-sizing: border-box;">Our security assessment is mainly for drugs, such as the safety of medicines produced by the bioactive enzymes, which means we need a specific bioactive substance such as enzymes to conduct the safety assessment. Your project is more like a methodology study which does not have direct relation to medicine, so I can only make a safety assessment of potential safety hazard instead of a detailed one.</section>
 +
                    </section>
 +
                    <img style="vertical-align: top; margin-top: 29px; background-color: #7be8cd; box-sizing: border-box;"/>
 +
                </section>
 +
            <!--头像-->
 +
                <section style="display: inline-block; vertical-align: top; width: 80px; box-sizing: border-box;" >
 +
                    <section style="width: 60px; height: 60px; margin-left: 10px; border-top-left-radius: 60px; border-top-right-radius: 60px; border-bottom-right-radius: 60px; border-bottom-left-radius: 60px; background-image: url(https://static.igem.org/mediawiki/2015/1/12/NUDT_CHIAN_HP1_Jiang.png); background-size: cover; box-sizing: border-box; background-position: 50% 50%; background-repeat: no-repeat no-repeat;" ></section>
 +
                    <section style="font-size: 0.8em; font-family: inherit; text-align: center; text-decoration: inherit; color: inherit; box-sizing: border-box;">
 +
                        <section  style="box-sizing: border-box;">Dr. Jiang</section>
 +
                    </section>
 +
                </section>
 +
            </section>
 +
        <!--左-->
 +
            <!--头像-->
 +
            <section style="border: 0px; margin: 0.2em 0px; box-sizing: border-box; padding: 0px;">
 +
                <section style="display: inline-block; width: 80px; vertical-align: top; box-sizing: border-box;" >
 +
                    <!--头像png-->
 +
                    <section style="width: 60px; height: 60px; margin-left: 10px; border-top-left-radius: 60px; border-top-right-radius: 60px; border-bottom-right-radius: 60px; border-bottom-left-radius: 60px; background-image: url(https://static.igem.org/mediawiki/2015/2/2f/NUDT_CHIAN_HP1_Fan1.png); background-size: cover; box-sizing: border-box; background-position: 50% 50%; background-repeat: no-repeat no-repeat;" ></section>
 +
                    <!--头像text-->
 +
                    <section  style="font-size: 0.8em; font-family: inherit; text-align: center; text-decoration: inherit; color: inherit; box-sizing: border-box;"><section  style="box-sizing: border-box;">Dongyu Fan
 +
                    </section>
 +
                    </section>
 +
                </section>
 +
            <!--对话-->
 +
                <section style="display: inline-block; width: 75%; font-size: 87.5%; font-family: inherit; text-decoration: inherit; color: inherit; border-color: #ffe4c8; box-sizing: border-box;">
 +
                    <!--对话box-->
 +
                    <section style="display: inline-block; width: 85%; margin-top: 11px; padding: 16px; border-top-left-radius: 16px; border-top-right-radius: 16px; border-bottom-right-radius: 16px; border-bottom-left-radius: 16px; background-color: #ffe4c8; box-sizing: border-box;" >
 +
                        <!--对话text-->
 +
                        <section style="box-sizing: border-box;">What influence will be make to the cells if we change the signaling pathways of cell?</section>
 +
                    </section>
 +
                </section>
 +
            </section>
 +
        <!--右-->
 +
            <section style="border: 0px; text-align: right; margin: 0.2em 0px; box-sizing: border-box; padding: 0px;" >
 +
            <!--对话-->
 +
                <section style="display: inline-block; width: 75%; font-size: 87.5%; font-family: inherit; text-decoration: inherit; color: inherit; border-color: #7be8cd; box-sizing: border-box;" >
 +
                    <section style="display: inline-block; width: 85%; margin-top: 11px; padding: 16px; border-top-left-radius: 16px; border-top-right-radius: 16px; border-bottom-right-radius: 16px; border-bottom-left-radius: 16px; text-align: left; background-color: #7be8cd; box-sizing: border-box;" >
 +
                        <section style="box-sizing: border-box;">The level of the cell modification plays an important role in drug safety. Generally speaking, lower modification level means less side effects. Modification of subcellular structure may cause the cell activity change. If it leads to an acceleration of cell metabolism, it may eventually make the cell cancerous or autophagy.</section>
 +
                    </section>
 +
                    <img style="vertical-align: top; margin-top: 29px; background-color: #7be8cd; box-sizing: border-box;"/>
 +
                </section>
 +
            <!--头像-->
 +
                <section style="display: inline-block; vertical-align: top; width: 80px; box-sizing: border-box;" >
 +
                    <section style="width: 60px; height: 60px; margin-left: 10px; border-top-left-radius: 60px; border-top-right-radius: 60px; border-bottom-right-radius: 60px; border-bottom-left-radius: 60px; background-image: url(https://static.igem.org/mediawiki/2015/2/2f/NUDT_CHIAN_HP1_Fan1.png); background-size: cover; box-sizing: border-box; background-position: 50% 50%; background-repeat: no-repeat no-repeat;" ></section>
 +
                    <section style="font-size: 0.8em; font-family: inherit; text-align: center; text-decoration: inherit; color: inherit; box-sizing: border-box;">
 +
                        <section  style="box-sizing: border-box;">Dr. Jiang</section>
 +
                    </section>
 +
                </section>
 +
            </section>
 +
        <!--左-->
 +
            <!--头像-->
 +
            <section style="border: 0px; margin: 0.2em 0px; box-sizing: border-box; padding: 0px;">
 +
                <section style="display: inline-block; width: 80px; vertical-align: top; box-sizing: border-box;" >
 +
                    <!--头像png-->
 +
                    <section style="width: 60px; height: 60px; margin-left: 10px; border-top-left-radius: 60px; border-top-right-radius: 60px; border-bottom-right-radius: 60px; border-bottom-left-radius: 60px; background-image: url(https://static.igem.org/mediawiki/2015/2/2f/NUDT_CHIAN_HP1_Fan1.png); background-size: cover; box-sizing: border-box; background-position: 50% 50%; background-repeat: no-repeat no-repeat;" ></section>
 +
                    <!--头像text-->
 +
                    <section  style="font-size: 0.8em; font-family: inherit; text-align: center; text-decoration: inherit; color: inherit; box-sizing: border-box;"><section  style="box-sizing: border-box;">Dongyu Fan
 +
                    </section>
 +
                    </section>
 +
                </section>
 +
            <!--对话-->
 +
                <section style="display: inline-block; width: 75%; font-size: 87.5%; font-family: inherit; text-decoration: inherit; color: inherit; border-color: #ffe4c8; box-sizing: border-box;">
 +
                    <!--对话box-->
 +
                    <section style="display: inline-block; width: 85%; margin-top: 11px; padding: 16px; border-top-left-radius: 16px; border-top-right-radius: 16px; border-bottom-right-radius: 16px; border-bottom-left-radius: 16px; background-color: #ffe4c8; box-sizing: border-box;" >
 +
                        <!--对话text-->
 +
                        <section style="box-sizing: border-box;">What kind of side effects?</section>
 +
                    </section>
 +
                </section>
 +
            </section>
 +
        <!--右-->
 +
            <section style="border: 0px; text-align: right; margin: 0.2em 0px; box-sizing: border-box; padding: 0px;" >
 +
            <!--对话-->
 +
                <section style="display: inline-block; width: 75%; font-size: 87.5%; font-family: inherit; text-decoration: inherit; color: inherit; border-color: #7be8cd; box-sizing: border-box;" >
 +
                    <section style="display: inline-block; width: 85%; margin-top: 11px; padding: 16px; border-top-left-radius: 16px; border-top-right-radius: 16px; border-bottom-right-radius: 16px; border-bottom-left-radius: 16px; text-align: left; background-color: #7be8cd; box-sizing: border-box;" >
 +
                        <section style="box-sizing: border-box;">Increasing reaction rate may result an accumulation of intermediate products which cause side effects. However, your project will not only increase the reaction efficiency but also make the reaction ordered. This modification of reaction chain makes reaction under control. In other word, the type and output of productions can be controlled. Theoretically, the side effects can be minimized.</section>
 +
                    </section>
 +
                    <img style="vertical-align: top; margin-top: 29px; background-color: #7be8cd; box-sizing: border-box;"/>
 +
                </section>
 +
            <!--头像-->
 +
                <section style="display: inline-block; vertical-align: top; width: 80px; box-sizing: border-box;" >
 +
                    <section style="width: 60px; height: 60px; margin-left: 10px; border-top-left-radius: 60px; border-top-right-radius: 60px; border-bottom-right-radius: 60px; border-bottom-left-radius: 60px; background-image: url(https://static.igem.org/mediawiki/2015/1/12/NUDT_CHIAN_HP1_Jiang.png); background-size: cover; box-sizing: border-box; background-position: 50% 50%; background-repeat: no-repeat no-repeat;" ></section>
 +
                    <section style="font-size: 0.8em; font-family: inherit; text-align: center; text-decoration: inherit; color: inherit; box-sizing: border-box;">
 +
                        <section  style="box-sizing: border-box;">Dr. Jiang</section>
 +
                    </section>
 +
                </section>
 +
            </section>
 +
        <!--左-->
 +
            <!--头像-->
 +
            <section style="border: 0px; margin: 0.2em 0px; box-sizing: border-box; padding: 0px;">
 +
                <section style="display: inline-block; width: 80px; vertical-align: top; box-sizing: border-box;" >
 +
                    <!--头像png-->
 +
                    <section style="width: 60px; height: 60px; margin-left: 10px; border-top-left-radius: 60px; border-top-right-radius: 60px; border-bottom-right-radius: 60px; border-bottom-left-radius: 60px; background-image: url(https://static.igem.org/mediawiki/2015/2/2f/NUDT_CHIAN_HP1_Fan1.png); background-size: cover; box-sizing: border-box; background-position: 50% 50%; background-repeat: no-repeat no-repeat;" ></section>
 +
                    <!--头像text-->
 +
                    <section  style="font-size: 0.8em; font-family: inherit; text-align: center; text-decoration: inherit; color: inherit; box-sizing: border-box;"><section  style="box-sizing: border-box;">Dongyu Fan
 +
                    </section>
 +
                    </section>
 +
                </section>
 +
            <!--对话-->
 +
                <section style="display: inline-block; width: 75%; font-size: 87.5%; font-family: inherit; text-decoration: inherit; color: inherit; border-color: #ffe4c8; box-sizing: border-box;">
 +
                    <!--对话box-->
 +
                    <section style="display: inline-block; width: 85%; margin-top: 11px; padding: 16px; border-top-left-radius: 16px; border-top-right-radius: 16px; border-bottom-right-radius: 16px; border-bottom-left-radius: 16px; background-color: #ffe4c8; box-sizing: border-box;" >
 +
                        <!--对话text-->
 +
                        <section style="box-sizing: border-box;">Finally, could you please make a prospection of our project?</section>
 +
                    </section>
 +
                </section>
 +
            </section>
 +
        <!--右-->
 +
            <section style="border: 0px; text-align: right; margin: 0.2em 0px; box-sizing: border-box; padding: 0px;" >
 +
            <!--对话-->
 +
                <section style="display: inline-block; width: 75%; font-size: 87.5%; font-family: inherit; text-decoration: inherit; color: inherit; border-color: #7be8cd; box-sizing: border-box;" >
 +
                    <section style="display: inline-block; width: 85%; margin-top: 11px; padding: 16px; border-top-left-radius: 16px; border-top-right-radius: 16px; border-bottom-right-radius: 16px; border-bottom-left-radius: 16px; text-align: left; background-color: #7be8cd; box-sizing: border-box;" >
 +
                        <section style="box-sizing: border-box;">I have engaged in drug safety assessment many years. I think what restricts the development of the pharmaceutical industry is the disorder of reaction. The disorder makes it difficult to get the identical ingredients in different production batch which cause worse side effects. Your project is supposed to order the reaction chain and decrease the impure component of drug. This can not only increase the reaction rate but also improve the quality of drugs. I believe it will have a positive influence on the development of the pharmaceutical industry. </section>
 +
                    </section>
 +
                    <img style="vertical-align: top; margin-top: 29px; background-color: #7be8cd; box-sizing: border-box;"/>
 +
                </section>
 +
            <!--头像-->
 +
                <section style="display: inline-block; vertical-align: top; width: 80px; box-sizing: border-box;" >
 +
                    <section style="width: 60px; height: 60px; margin-left: 10px; border-top-left-radius: 60px; border-top-right-radius: 60px; border-bottom-right-radius: 60px; border-bottom-left-radius: 60px; background-image: url(https://static.igem.org/mediawiki/2015/1/12/NUDT_CHIAN_HP1_Jiang.png); background-size: cover; box-sizing: border-box; background-position: 50% 50%; background-repeat: no-repeat no-repeat;" ></section>
 +
                    <section style="font-size: 0.8em; font-family: inherit; text-align: center; text-decoration: inherit; color: inherit; box-sizing: border-box;">
 +
                        <section  style="box-sizing: border-box;">Dr. Jiang</section>
 +
                    </section>
 +
                </section>
 +
            </section>
 +
        <!--左-->
 +
            <!--头像-->
 +
            <section style="border: 0px; margin: 0.2em 0px; box-sizing: border-box; padding: 0px;">
 +
                <section style="display: inline-block; width: 80px; vertical-align: top; box-sizing: border-box;" >
 +
                    <!--头像png-->
 +
                    <section style="width: 60px; height: 60px; margin-left: 10px; border-top-left-radius: 60px; border-top-right-radius: 60px; border-bottom-right-radius: 60px; border-bottom-left-radius: 60px; background-image: url(https://static.igem.org/mediawiki/2015/2/2f/NUDT_CHIAN_HP1_Fan1.png); background-size: cover; box-sizing: border-box; background-position: 50% 50%; background-repeat: no-repeat no-repeat;" ></section>
 +
                    <!--头像text-->
 +
                    <section  style="font-size: 0.8em; font-family: inherit; text-align: center; text-decoration: inherit; color: inherit; box-sizing: border-box;"><section  style="box-sizing: border-box;">Dongyu Fan
 +
                    </section>
 +
                    </section>
 +
                </section>
 +
            <!--对话-->
 +
                <section style="display: inline-block; width: 75%; font-size: 87.5%; font-family: inherit; text-decoration: inherit; color: inherit; border-color: #ffe4c8; box-sizing: border-box;">
 +
                    <!--对话box-->
 +
                    <section style="display: inline-block; width: 85%; margin-top: 11px; padding: 16px; border-top-left-radius: 16px; border-top-right-radius: 16px; border-bottom-right-radius: 16px; border-bottom-left-radius: 16px; background-color: #ffe4c8; box-sizing: border-box;" >
 +
                        <!--对话text-->
 +
                        <section style="box-sizing: border-box;">Thanks for your answer.</section>
 +
                    </section>
 +
                </section>
 +
            </section>
 +
 
 +
        </div>
 +
<script type="text/javascript">
 +
$(document).ready(function(){
 +
$("#pos1").click(function(){
 +
$("#slide1").slideToggle(300);
 +
});
 +
});
 +
</script>
 +
    </div>
 +
<!--LAB FOR FUN-->
 +
<h2 id = "pos2" >LAB FOR FUN: Extract DNA of Strawberry in Kitchen<B style = "color: #d82545">(CLICK)</B></h2>
 +
<div class = "BLANK_Container" id = "slide2" style = "display:none;">
 +
<p id = "pos21"></p>
 +
<h3>I. Movie</h3>
 +
<center>
 +
<Table>
 +
<tr>
 +
<td>
 +
<video width="602px" height="345px" controls="controls">
 +
<source src="https://static.igem.org/mediawiki/2015/0/0d/Mp4_DNA_IN_KITCHEN_COMPRESSED.mp4" type="video/mp4"></source>
 +
Sorry, your browser does not support the video tag. :)
 +
</video>
 +
</td>
 +
</tr>
 +
<tr>
 +
<td>
 +
<p style = "font-size: 10px;">Extract DNA of Strawberry in Kitchen</p>
 +
</td>
 +
</tr>
 +
</Table>
 +
<p style = "font-size:12px;">This movie is original, please indicate the source when reship it.</p>
 +
</center>
 +
<p id = "pos22"></p>
 +
<h3>II. Pinciples</h3>
 +
<p>1. After pinch the strawberry, the cell will be broken and the contains will get out. It’s not difficult to broke the cell because there are full of big vacuole.</p>
 +
<p>2. In this simplified DNA extract process, the adding of detergent is to crush the cells because there are some phosphatide on the cell membrane. After the detergent has dissolved them, the surface of the cell will be full of little holes.</p>
 +
<p>3. After adding the ethanol, the DNA will precipitate out. This is because DNA is polarity molecule (and also the RNA and nucleotide), but the ethanol is nonpolar molecule, the DNA can’t be dissolved. Salt can make DNA easier to separate out.
 +
</p>
 +
<p>4. So, if you have some strawberry left, only one and you can see the DNA with your own eyes.</p>
 +
<p>5. Only a few kinds of thing which can be found in home, anyone can break the cell wall of strawberry and divide the DNA out. At last, you can twist the DNA with your chopsticks. And now, DNA won’t be an abstract concept, neither the double helix model which is made by the computer. It’s just here, in front you eyes. This is the most important matter among all the creature.<p>
 +
<ca>
 +
By the way, the biological technic is not always so easy, but you can do it yourself in the kitchen, things can get easier. No matter you succeed or not, feel the fun of doing experiment by yourself. syndetic biology is everywhere if only you have the love of science!
 +
</ca>
 +
<script type="text/javascript">
 +
$(document).ready(function(){
 +
$("#pos2").click(function(){
 +
$("#slide2").slideToggle(300);
 +
});
 +
});
 +
</script>
 
</div>
 
</div>
<!--2015.5.31-->
+
<!--SONG OF IGEM-->
<div class="cd-timeline-block">
+
<h2 id = "pos3" >SONG OF IGEM: song name<B style = "color: #d82545">(CLICK)</B></h2>
<p id = "pos5"></p>
+
<div class = "BLANK_Container" id = "slide3" style = "display:none;">
<div class="cd-timeline-img cd-picture" id = "pic2">
+
<p id = "pos31"></p>
<img src="https://static.igem.org/mediawiki/2015/9/98/Smile_NUDT_CHINA.png" alt="Picture">
+
<h3>I. Movie</h3>
</div>
+
<center>
<div class="cd-timeline-content" id = "key2">
+
<Table>
<h7 style = "color:black"><h7 style = "color: #d82545"> ACTIVITY: </h7>Move the lab.</h7>
+
<tr>
<p style = "padding: 10px 5px; display:none;" id = "cont2" class = "Pannal"><img src="test1.png">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut justo nibh, mattis sit amet consequat a, varius vitae metus. Proin pharetra sodales pellentesque.</p>
+
<td>
<span class="cd-date" style="font-size:24px">2015.5.31</span>
+
<video width="602px" height="345px" controls="controls">  
<script type="text/javascript">
+
<source src="https://static.igem.org/mediawiki/2015/0/0d/Mp4_DNA_IN_KITCHEN_COMPRESSED.mp4" type="video/mp4"></source>
$(document).ready(function(){
+
Sorry, your browser does not support the video tag. :)
$("#key2").click(function(){
+
</video>
$("#cont2").slideToggle(300);
+
</td>
});
+
</tr>
});
+
<tr>
$(document).ready(function(){
+
<td>
$("#pic2").click(function(){
+
<p style = "font-size: 10px;">Extract DNA of Strawberry in Kitchen</p>
$("#cont2").slideToggle(300);
+
</td>
});
+
</tr>
});
+
</Table>
</script>
+
<p style = "font-size:12px;">This movie is original, please indicate the source when reship it.</p>
</div>
+
</center>
 +
<p id = "pos32"></p>
 +
<h3>II. Lyric</h3>
 +
<center>
 +
<p style = "padding: 0px;150px;">After pinch the strawberry, the cell will be broken and the contains will get out. </p>
 +
<p style = "padding: 0px;150px;">The cell will be broken and the contains will get out. </p>
 +
</center>
 +
<script type="text/javascript">
 +
$(document).ready(function(){
 +
$("#pos3").click(function(){
 +
$("#slide3").slideToggle(300);
 +
});
 +
});
 +
</script>
 
</div>
 
</div>
<!--2015.6.7-->
+
<!--CiCC-->
<div class="cd-timeline-block">
+
<h2 id = "pos4" >MEETUP: CiCC<B style = "color: #d82545">(CLICK)</B></h2>
<p id = "pos6"></p>
+
<div class = "BLANK_Container" id = "slide4" style = "display:none;">
<div class="cd-timeline-img cd-picture" id = "pic3">
+
<center>
<img src="https://static.igem.org/mediawiki/2015/9/98/Smile_NUDT_CHINA.png" alt="Picture">
+
<Table>
</div>
+
<tr>
<div class="cd-timeline-content" id = "key3">
+
<td>
<h7 style = "color:black"><h7 style = "color: #d82545">PCR:</h7> IaaM&amp;IaaH </h7>
+
<img src="https://static.igem.org/mediawiki/2015/6/68/CiCC_AllParticipate.png" style="width: 665px; height:443px">
<p style = "padding: 10px 5px; display:none;" id = "cont3" class = "Pannal"><img src="test1.png">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut justo nibh, mattis sit amet consequat a, varius vitae metus. Proin pharetra sodales pellentesque.</p>
+
</td>
<span class="cd-date" style="font-size:24px">2015.6.7</span>
+
</tr>
<script type="text/javascript">
+
<tr>
$(document).ready(function(){
+
<td>
$("#key3").click(function(){
+
<p style = "font-size: 10px;">Final group photo on CiCC</p>
$("#cont3").slideToggle(300);
+
</td>
});
+
</tr>
});
+
</Table>
$(document).ready(function(){
+
</center>
$("#pic3").click(function(){
+
<p> In order to activate the communication, Peking University held the <B style = "color: #d82545">Conference of China iGEMer Committee (CiCC)</B> on 14 &amp; 15, August. <B style = "color: #d82545">NUDT_CHINA</B> was invited to give a presentation. </p>
$("#cont3").slideToggle(300);
+
<p>Through the communication, we got more ideas and involved in more detailed question about our project.</p>
});
+
<script type="text/javascript">
});
+
$(document).ready(function(){
</script>
+
$("#pos4").click(function(){
</div>
+
$("#slide4").slideToggle(300);
 +
});
 +
});
 +
</script>
 
</div>
 
</div>
<!--2015.6.26-->
 
<div class="cd-timeline-block">
 
<div class="cd-timeline-img cd-picture" id = "pic4">
 
<img src="https://static.igem.org/mediawiki/2015/9/98/Smile_NUDT_CHINA.png" alt="Picture">
 
</div>
 
<div class="cd-timeline-content" id = "key4">
 
<h7 style = "color:black"><h7 style = "color: #d82545">STANDARDIZAE: </h7> IaaM, SCAF1, TALE2</h7>
 
<p style = "padding: 10px 5px; display:none;" id = "cont4" class = "Pannal"><img src="test1.png">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut justo nibh, mattis sit amet consequat a, varius vitae metus. Proin pharetra sodales pellentesque.</p>
 
<span class="cd-date" style="font-size:24px">2015.6.26</span>
 
<script type="text/javascript">
 
$(document).ready(function(){
 
$("#key4").click(function(){
 
$("#cont4").slideToggle(300);
 
});
 
});
 
$(document).ready(function(){
 
$("#pic4").click(function(){
 
$("#cont4").slideToggle(300);
 
});
 
});
 
</script>
 
</div>
 
</div>
 
<!--2015.6.28-->
 
<div class="cd-timeline-block">
 
<div class="cd-timeline-img cd-picture" id = "pic5">
 
<img src="https://static.igem.org/mediawiki/2015/9/98/Smile_NUDT_CHINA.png" alt="Picture">
 
</div>
 
<div class="cd-timeline-content" id = "key5">
 
<h7 style = "color:black"><h7 style = "color: #d82545">STANDARDIZAE: </h7> SCAF2,SCAF3,TALE1,TALE3</h7>
 
<p style = "padding: 10px 5px; display:none;" id = "cont5" class = "Pannal"><img src="test1.png">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut justo nibh, mattis sit amet consequat a, varius vitae metus. Proin pharetra sodales pellentesque.</p>
 
<span class="cd-date" style="font-size:24px">2015.6.28</span>
 
<script type="text/javascript">
 
$(document).ready(function(){
 
$("#key5").click(function(){
 
$("#cont5").slideToggle(300);
 
});
 
});
 
$(document).ready(function(){
 
$("#pic5").click(function(){
 
$("#cont5").slideToggle(300);
 
});
 
});
 
</script>
 
</div>
 
</div>
 
<!--2015.6.29-->
 
<div class="cd-timeline-block">
 
<div class="cd-timeline-img cd-picture" id = "pic6">
 
<img src="https://static.igem.org/mediawiki/2015/9/98/Smile_NUDT_CHINA.png" alt="Picture">
 
</div>
 
<div class="cd-timeline-content" id = "key6">
 
<h7 style = "color:black"><h7 style = "color: #d82545">STANDARDIZAE: </h7> Plac+RBS30</h7>
 
<p style = "padding: 10px 5px; display:none;" id = "cont6" class = "Pannal"><img src="test1.png">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut justo nibh, mattis sit amet consequat a, varius vitae metus. Proin pharetra sodales pellentesque.</p>
 
<span class="cd-date" style="font-size:24px">2015.6.29</span>
 
<script type="text/javascript">
 
$(document).ready(function(){
 
$("#key6").click(function(){
 
$("#cont6").slideToggle(300);
 
});
 
});
 
$(document).ready(function(){
 
$("#pic6").click(function(){
 
$("#cont6").slideToggle(300);
 
});
 
});
 
</script>
 
</div>
 
</div>
 
<!--2015.6.29-->
 
<div class="cd-timeline-block">
 
<div class="cd-timeline-img cd-picture" id = "pic7">
 
<img src="https://static.igem.org/mediawiki/2015/9/98/Smile_NUDT_CHINA.png" alt="Picture">
 
</div>
 
<div class="cd-timeline-content" id = "key7">
 
<h7 style = "color:black"><h7 style = "color: #d82545">BUILD:</h7> Plac+RBS30+TALE1</h7>
 
<p style = "padding: 10px 5px; display:none;" id = "cont7" class = "Pannal"><img src="test1.png">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut justo nibh, mattis sit amet consequat a, varius vitae metus. Proin pharetra sodales pellentesque.</p>
 
<span class="cd-date" style="font-size:24px">2015.6.29</span>
 
<script type="text/javascript">
 
$(document).ready(function(){
 
$("#key7").click(function(){
 
$("#cont7").slideToggle(300);
 
});
 
});
 
$(document).ready(function(){
 
$("#pic7").click(function(){
 
$("#cont7").slideToggle(300);
 
});
 
});
 
</script>
 
</div>
 
</div>
 
<!--2015.7.5-->
 
<div class="cd-timeline-block">
 
<p id = "pos7"></p>
 
<div class="cd-timeline-img cd-picture" id = "pic8">
 
<img src="https://static.igem.org/mediawiki/2015/9/98/Smile_NUDT_CHINA.png" alt="Picture">
 
</div>
 
<div class="cd-timeline-content" id = "key8">
 
<h7 style = "color:black"><h7 style = "color: #d82545">BUILD:</h7> Adding terminator&amp;RBS to GFP1 by PCR</h7>
 
<p style = "padding: 10px 5px; display:none;" id = "cont8" class = "Pannal"><img src="test1.png">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut justo nibh, mattis sit amet consequat a, varius vitae metus. Proin pharetra sodales pellentesque.</p>
 
<span class="cd-date" style="font-size:24px">2015.7.5</span>
 
<script type="text/javascript">
 
$(document).ready(function(){
 
$("#key8").click(function(){
 
$("#cont8").slideToggle(300);
 
});
 
});
 
$(document).ready(function(){
 
$("#pic8").click(function(){
 
$("#cont8").slideToggle(300);
 
});
 
});
 
</script>
 
</div>
 
</div>
 
<!--2015.7.24-->
 
<div class="cd-timeline-block">
 
<div class="cd-timeline-img cd-picture" id = "pic9">
 
<img src="https://static.igem.org/mediawiki/2015/9/98/Smile_NUDT_CHINA.png" alt="Picture">
 
</div>
 
<div class="cd-timeline-content" id = "key9">
 
<h7 style = "color:black"><h7 style = "color: #d82545">STANDARDIZAE: </h7> Iaa H</h7>
 
<p style = "padding: 10px 5px; display:none;" id = "cont9" class = "Pannal"><img src="test1.png">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut justo nibh, mattis sit amet consequat a, varius vitae metus. Proin pharetra sodales pellentesque.</p>
 
<span class="cd-date" style="font-size:24px">2015.7.24</span>
 
<script type="text/javascript">
 
$(document).ready(function(){
 
$("#key9").click(function(){
 
$("#cont9").slideToggle(300);
 
});
 
});
 
$(document).ready(function(){
 
$("#pic9").click(function(){
 
$("#cont9").slideToggle(300);
 
});
 
});
 
</script>
 
</div>
 
</div>
 
<!--2015.7.25-->
 
<div class="cd-timeline-block">
 
<div class="cd-timeline-img cd-picture" id = "pic10">
 
<img src="https://static.igem.org/mediawiki/2015/9/98/Smile_NUDT_CHINA.png" alt="Picture">
 
</div>
 
<div class="cd-timeline-content" id = "key10">
 
<h7 style = "color:black"><h7 style = "color: #d82545">Device(No.1): </h7> GFP(+/-)N</h7>
 
<p style = "padding: 10px 5px; display:none;" id = "cont10" class = "Pannal"><img src="test1.png">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut justo nibh, mattis sit amet consequat a, varius vitae metus. Proin pharetra sodales pellentesque.</p>
 
<span class="cd-date" style="font-size:24px">2015.7.25</span>
 
<script type="text/javascript">
 
$(document).ready(function(){
 
$("#key10").click(function(){
 
$("#cont10").slideToggle(300);
 
});
 
});
 
$(document).ready(function(){
 
$("#pic10").click(function(){
 
$("#cont10").slideToggle(300);
 
});
 
});
 
</script>
 
</div>
 
</div>
 
<!--2015.7.27-->
 
<div class="cd-timeline-block">
 
<div class="cd-timeline-img cd-picture" id = "pic11">
 
<img src="https://static.igem.org/mediawiki/2015/9/98/Smile_NUDT_CHINA.png" alt="Picture">
 
</div>
 
<div class="cd-timeline-content" id = "key11">
 
<h7 style = "color:black"><h7 style = "color: #d82545">SYSTEM(No.1): </h7> GFP(+/-)S1</h7>
 
<p style = "padding: 10px 5px; display:none;" id = "cont11" class = "Pannal"><img src="test1.png">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut justo nibh, mattis sit amet consequat a, varius vitae metus. Proin pharetra sodales pellentesque.</p>
 
<span class="cd-date" style="font-size:24px">2015.7.27</span>
 
<script type="text/javascript">
 
$(document).ready(function(){
 
$("#key11").click(function(){
 
$("#cont11").slideToggle(300);
 
});
 
});
 
$(document).ready(function(){
 
$("#pic11").click(function(){
 
$("#cont11").slideToggle(300);
 
});
 
});
 
</script>
 
</div>
 
</div>
 
<!--2015.7.31-->
 
<div class="cd-timeline-block">
 
<div class="cd-timeline-img cd-picture" id = "pic14">
 
<img src="https://static.igem.org/mediawiki/2015/9/98/Smile_NUDT_CHINA.png" alt="Picture">
 
</div>
 
<div class="cd-timeline-content" id = "key14">
 
<h7 style = "color:black"><h7 style = "color: #d82545">BUILD: </h7>GFP(+/+)N</h7>
 
<p style = "padding: 10px 5px; display:none;" id = "cont14" class = "Pannal"><img src="test1.png">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut justo nibh, mattis sit amet consequat a, varius vitae metus. Proin pharetra sodales pellentesque.</p>
 
<span class="cd-date" style="font-size:24px">2015.7.31</span>
 
<script type="text/javascript">
 
$(document).ready(function(){
 
$("#key14").click(function(){
 
$("#cont14").slideToggle(300);
 
});
 
});
 
$(document).ready(function(){
 
$("#pic14").click(function(){
 
$("#cont14").slideToggle(300);
 
});
 
});
 
</script>
 
</div>
 
</div>
 
<!--2015.8.12-->
 
<div class="cd-timeline-block">
 
<p id = "pos8"></p>
 
<div class="cd-timeline-img cd-picture" id = "pic12">
 
<img src="https://static.igem.org/mediawiki/2015/9/98/Smile_NUDT_CHINA.png" alt="Picture">
 
</div>
 
<div class="cd-timeline-content" id = "key12">
 
<h7 style = "color:black"><h7 style = "color: #d82545">STANDARDIZAE: </h7> RBS30</h7>
 
<p style = "padding: 10px 5px; display:none;" id = "cont12" class = "Pannal"><img src="test1.png">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut justo nibh, mattis sit amet consequat a, varius vitae metus. Proin pharetra sodales pellentesque.</p>
 
<span class="cd-date" style="font-size:24px">2015.8.12</span>
 
<script type="text/javascript">
 
$(document).ready(function(){
 
$("#key12").click(function(){
 
$("#cont12").slideToggle(300);
 
});
 
});
 
$(document).ready(function(){
 
$("#pic12").click(function(){
 
$("#cont12").slideToggle(300);
 
});
 
});
 
</script>
 
</div>
 
</div>
 
<!--2015.8.17-->
 
<div class="cd-timeline-block">
 
<div class="cd-timeline-img cd-picture" id = "pic13">
 
<img src="https://static.igem.org/mediawiki/2015/9/98/Smile_NUDT_CHINA.png" alt="Picture">
 
</div>
 
<div class="cd-timeline-content" id = "key13">
 
<h7 style = "color:black"><h7 style = "color: #d82545">BUILD: </h7>IAA(+/+)N</h7>
 
<p style = "padding: 10px 5px; display:none;" id = "cont13" class = "Pannal"><img src="test1.png">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut justo nibh, mattis sit amet consequat a, varius vitae metus. Proin pharetra sodales pellentesque.</p>
 
<span class="cd-date" style="font-size:24px">2015.8.17</span>
 
<script type="text/javascript">
 
$(document).ready(function(){
 
$("#key13").click(function(){
 
$("#cont13").slideToggle(300);
 
});
 
});
 
$(document).ready(function(){
 
$("#pic13").click(function(){
 
$("#cont13").slideToggle(300);
 
});
 
});
 
</script>
 
</div>
 
</div>
 
<!--2015.8.19-->
 
<div class="cd-timeline-block">
 
<div class="cd-timeline-img cd-picture" id = "pic15">
 
<img src="https://static.igem.org/mediawiki/2015/9/98/Smile_NUDT_CHINA.png" alt="Picture">
 
</div>
 
<div class="cd-timeline-content" id = "key15">
 
<h7 style = "color:black"><h7 style = "color: #d82545">BUILD: </h7> IAA(+/+)S2/S3, GFP P</h7>
 
<p style = "padding: 10px 5px; display:none;" id = "cont15" class = "Pannal"><img src="test1.png">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut justo nibh, mattis sit amet consequat a, varius vitae metus. Proin pharetra sodales pellentesque.</p>
 
<span class="cd-date" style="font-size:24px">2015.8.19</span>
 
<script type="text/javascript">
 
$(document).ready(function(){
 
$("#key15").click(function(){
 
$("#cont15").slideToggle(300);
 
});
 
});
 
$(document).ready(function(){
 
$("#pic15").click(function(){
 
$("#cont15").slideToggle(300);
 
});
 
});
 
</script>
 
</div>
 
</div>
 
<!--2015.8.20-->
 
<div class="cd-timeline-block">
 
<div class="cd-timeline-img cd-picture" id = "pic16">
 
<img src="https://static.igem.org/mediawiki/2015/9/98/Smile_NUDT_CHINA.png" alt="Picture">
 
</div>
 
<div class="cd-timeline-content" id = "key16">
 
<h7 style = "color:black"><h7 style = "color: #d82545">BUILD: </h7>GFP(+/+)S2/S3</h7>
 
<p style = "padding: 10px 5px; display:none;" id = "cont16" class = "Pannal"><img src="test1.png">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut justo nibh, mattis sit amet consequat a, varius vitae metus. Proin pharetra sodales pellentesque.</p>
 
<span class="cd-date" style="font-size:24px">2015.8.20</span>
 
<script type="text/javascript">
 
$(document).ready(function(){
 
$("#key16").click(function(){
 
$("#cont16").slideToggle(300);
 
});
 
});
 
$(document).ready(function(){
 
$("#pic16").click(function(){
 
$("#cont16").slideToggle(300);
 
});
 
});
 
</script>
 
</div>
 
</div>
 
 
 
</div>
 
</div>
 
<!--Navigation-->
 
<!--Navigation-->
 
<div id = "navigation">
 
<div id = "navigation">
 
<img src="https://static.igem.org/mediawiki/2015/5/58/TEAM_NUDT_CHINA_iGEM.png"/>
 
<img src="https://static.igem.org/mediawiki/2015/5/58/TEAM_NUDT_CHINA_iGEM.png"/>
<li><a href="#myMainContainer" class = "t"><span>TOP</span></a></li>
+
<li><a href="#myMainContainer" class = "t"><span>TOP/TIP</span></a></li>
<li><a href = "#pos5"><span>2015.5</span></a></li>
+
<li><a href="#pos1"><span>INTERVIEW</span></a></li>
<li><a href = "#pos6"><span>2015.6</span></a></li>
+
 
<li><a href = "#pos7"><span>2015.7</span></a></li>
+
<li><a href = "#pos2"><span>LAB FOR FUN</span></a></li>
<li><a href = "#pos8"><span>2015.8</span></a></li>
+
<li><a href = "#pos21" class = "b"><span>Movie</span></a></li>
<li><a href = "#pos9"><span>2015.9</span></a></li>
+
<li><a href = "#pos22" class = "b"><span>Principles</span></a></li>
 +
 
 +
<li><a href = "#pos3"><span>SONG OF IGEM</span></a></li>
 +
<li><a href = "#pos31" class = "b"><span>Movie</span></a></li>
 +
<li><a href = "#pos32" class = "b"><span>Lyric</span></a></li>
 +
 
 +
<li><a href = "#pos4"><span>MEETUP</span></a></li>
 
<img src="https://static.igem.org/mediawiki/2015/9/93/Team_NUDT_CHINA_Navigate.png"/>
 
<img src="https://static.igem.org/mediawiki/2015/9/93/Team_NUDT_CHINA_Navigate.png"/>
 
    </div>
 
    </div>
 
</body>
 
</body>
 
</html>
 
</html>

Revision as of 01:32, 10 September 2015

HUMAN PRACTICES

TIPS1: The left MENU :) links to other NUDT_CHINA website.

TIPS2: The right NAVIGATE :) posites on content in this page. (Valid when UNFOLDED)

TIPS3: Click SUBTITLE to FOLD/UNFOLD related content.

INTERVIEW: Human Laboratory Animal Center (CLICK)

LAB FOR FUN: Extract DNA of Strawberry in Kitchen(CLICK)

SONG OF IGEM: song name(CLICK)

MEETUP: CiCC(CLICK)