Team:OUC-China

From 2014.igem.org

(Difference between revisions)
(Prototype team page)
 
(127 intermediate revisions not shown)
Line 1: Line 1:
{{CSS/Main}}
{{CSS/Main}}
-
 
-
 
<html>
<html>
 +
<link href="https://2014.igem.org/Team:OUC-China/css/bootstrap.css?action=raw&amp;ctype=text/css" rel="stylesheet" />
 +
    <link href="https://2014.igem.org/Team:OUC-China/css/topsection.css?action=raw&ctype=text/css" rel="stylesheet" />
 +
    <script src="https://2014.igem.org/Team:OUC-China/js/jquery.js?action=raw&ctype=text/javascript"></script>
 +
    <script src="https://2014.igem.org/Team:OUC-China/js/bootstrap.js?action=raw&ctype=text/javascript"></script>
 +
<script type="text/javascript" src="https://2014.igem.org/Team:OUC-China/js/jquery.devrama.slider.js?action=raw&ctype=text/javascript"></script>
 +
<script src="https://2014.igem.org/Team:OUC-China/js/unslider.js?action=raw&ctype=text/javascript"></script>
 +
<style type="text/css">
 +
a:hover { text-decoration: none !important; }
 +
@charset "utf-8";
 +
/* CSS Document */
 +
body, div, p, ul, li, h1, h2, h3, h4, h5, h6 {
 +
margin: 0px;
 +
padding: 0px;
 +
font-family: "微软雅黑";
 +
}
 +
body{
 +
    min-width:1340px;
 +
}
 +
ul, ol {
 +
list-style: none;
 +
}
 +
img {
 +
display: block;
 +
position: absolute;
 +
}
 +
a {
 +
color: inherit;
 +
text-decoration: none;
 +
}
 +
@charset "utf-8";
 +
/* CSS Document */
 +
@keyframes bubleM {
 +
0% {
 +
margin-top:0px;
 +
margin-left:0px;
 +
}
 +
25% {
 +
margin-top:3px;
 +
margin-left:3px;
 +
}
 +
50% {
 +
margin-top:6px;
 +
margin-left:0px;
 +
}
 +
75% {
 +
margin-top:3px;
 +
margin-left:-3px;
 +
}
 +
100% {
 +
margin-top:0px;
 +
margin-left:0px;
 +
}
 +
}
 +
@-webkit-keyframes bubleM {
 +
0% {
 +
margin-top:0px;
 +
margin-left:0px;
 +
}
 +
25% {
 +
margin-top:3px;
 +
margin-left:3px;
 +
}
 +
50% {
 +
margin-top:6px;
 +
margin-left:0px;
 +
}
 +
75% {
 +
margin-top:3px;
 +
margin-left:-3px;
 +
}
 +
100% {
 +
margin-top:0px;
 +
margin-left:0px;
 +
}
 +
}
 +
.header {
 +
width: 1200px;
 +
height: 50px;
 +
margin: 0 auto;
 +
position: relative;
 +
}
 +
.header .igemLogo {
 +
transition: 0.5s;
 +
-moz-transition: 0.5s;
 +
-o-transition: 0.5s;
 +
-webkit-transition: 0.5s;
 +
}
 +
.header .igemLogo:hover {
 +
transform: rotate(360deg);
 +
-webkit-transform: rotate(360deg);
 +
-moz-transform: rotate(360deg);
 +
-o-transform: rotate(360deg);
 +
-ms-transform: rotate(360deg);
 +
}
-
<!--main content -->
+
.header .nav{
-
<table width="70%" align="center">
+
top: 10px;
-
 
+
left: 450px;
-
 
+
}
-
<!--welcome box -->
+
.header .Logo {
-
<tr>
+
width: 70px;
-
<td style="border:1px solid black;" colspan="3" align="center" height="150px" bgColor=#FF404B>
+
height: 70px;
-
<h1 >WELCOME TO iGEM 2014! </h1>
+
background: url(https://static.igem.org/mediawiki/2014/f/fa/OUC-China_14Logo.png);
-
<p>Your team has been approved and you are ready to start the iGEM season!
+
position: absolute;
-
<br>On this page you can document your project, introduce your team members, document your progress <br> and share your iGEM experience with the rest of the world! </p>
+
right: 0;
-
<br>
+
bottom: -10px;
-
<p style="color:#E7E7E7"> <a href="https://2014.igem.org/wiki/index.php?title=Team:OUC-China&action=edit"style="color:#FFFFFF"> Click here  to edit this page!</a> </p>
+
}
-
</td>
+
.header .Logo ul {
-
</tr>
+
position: absolute;
-
 
+
width: 250px;
-
<tr> <td colspan="3" height="5px"> </td></tr>
+
height: 150px;
-
<!-- end welcome box -->
+
display: none;
-
<tr>  
+
right: 0px;
-
 
+
top: 70px;
-
<!--navigation menu -->
+
}
-
<td align="center" colspan="3">
+
.header .Logo li {
-
 
+
height: 50px;
-
<table  width="100%">
+
width: 215px;
-
<tr heigth="15px"></tr>
+
line-height: 50px;
-
<tr heigth="75px">  
+
font-size: 14px;
-
 
+
background: #fff;
-
 
+
margin: 10px 0 20px 0;
-
<td style="border:1px solid black;" align="center" height ="45px" onMouseOver="this.bgColor='#d3d3d3'" onMouseOut="this.bgColor='#e7e7e7'" bgColor=#e7e7e7>
+
position: relative;
-
<a href="https://2014.igem.org/Team:OUC-China"style="color:#000000">Home </a> </td>
+
border-bottom-left-radius: 6px;
-
 
+
border-top-left-radius: 6px;
-
<td style="border:1px solid black;" align="center" height ="45px" onMouseOver="this.bgColor='#d3d3d3'" onMouseOut="this.bgColor='#e7e7e7'" bgColor=#e7e7e7>  
+
}
-
<a href="https://2014.igem.org/Team:OUC-China/Team"style="color:#000000"> Team </a> </td>
+
.header .Logo li a {
-
 
+
margin-left: 5px;
-
<td style="border:1px solid black;" align="center"  height ="45px"  onMouseOver="this.bgColor='#d3d3d3'" onMouseOut="this.bgColor='#e7e7e7'" bgColor=#e7e7e7>  
+
}
-
<a href="https://igem.org/Team.cgi?year=2014&team_name=OUC-China"style="color:#000000"> Official Team Profile </a></td>
+
.header .Logo li img {
-
 
+
position: absolute;
-
<td style="border:1px solid black" align="center" height ="45px" onMouseOver="this.bgColor='#d3d3d3'" onMouseOut="this.bgColor='#e7e7e7'" bgColor=#e7e7e7>
+
right: -35px;
-
<a href="https://2014.igem.org/Team:OUC-China/Project"style="color:#000000"> Project</a></td>
+
top: -10px;
-
 
+
}
-
<td style="border:1px solid black;" align="center"  height ="45px" onMouseOver="this.bgColor='#d3d3d3'" onMouseOut="this.bgColor='#e7e7e7'" bgColor=#e7e7e7>  
+
.neck {
-
<a href="https://2014.igem.org/Team:OUC-China/Parts"style="color:#000000"> Parts</a></td>
+
height: 512px;
-
 
+
width: 100%;
-
<td style="border:1px solid black;" align="center" height ="45px" onMouseOver="this.bgColor='#d3d3d3'" onMouseOut="this.bgColor='#e7e7e7'" bgColor=#e7e7e7>  
+
background: rgb(76,145,190);
-
<a href="https://2014.igem.org/Team:OUC-China/Modeling"style="color:#000000"> Modeling</a></td>
+
}
-
 
+
.main {
-
<td style="border:1px solid black;" align="center" height ="45px" onMouseOver="this.bgColor='#d3d3d3'" onMouseOut="this.bgColor='#e7e7e7'" bgColor=#e7e7e7>
+
}
-
<a href="https://2014.igem.org/Team:OUC-China/Notebook"style="color:#000000"> Notebook</a></td>
+
.main .part1 {
-
 
+
height: 480px;
-
<td style="border:1px solid black;" align="center"  height ="45px" onMouseOver="this.bgColor='#d3d3d3'" onMouseOut="this.bgColor='#e7e7e7'" bgColor=#e7e7e7>  
+
width: 100%;
-
<a href="https://2014.igem.org/Team:OUC-China/Safety"style=" color:#000000"> Safety </a></td>
+
background: rgb(210,233,253);
-
 
+
position: relative;
-
<td style="border:1px solid black;" align="center"  height ="45px" onMouseOver="this.bgColor='#d3d3d3'" onMouseOut="this.bgColor='#e7e7e7'" bgColor=#e7e7e7>  
+
}
-
<a href="https://2014.igem.org/Team:OUC-China/Attributions"style="color:#000000"> Attributions </a></td>
+
.main .part1 .waveUp {
-
 
+
width: 100%;
-
 
+
height: 130px;
-
<td align ="center"> <a href="https://2014.igem.org/Main_Page"> <img src="https://static.igem.org/mediawiki/igem.org/6/60/Igemlogo_300px.png" width="55px"></a> </td>
+
background: url(https://static.igem.org/mediawiki/2014/f/f0/WaveUp.png
-
</tr>
+
);
-
</table>
+
position: absolute;
-
 
+
bottom: 0;
-
<!--end navigation menu -->
+
z-index: 0
-
</tr>
+
}
-
 
+
.main .part1 .waveDown {
-
 
+
width: 100%;
-
</tr>
+
height: 130px;
-
+
background: url(https://static.igem.org/mediawiki/2014/6/63/WaveDown.png);
-
 
+
position: absolute;
-
 
+
bottom: 0;
-
 
+
z-index: 3;
-
 
+
}
-
</td>
+
.main .part1 img {
-
 
+
bottom: 60px;
-
<tr> <td colspan="3" height="15px"> </td></tr>
+
transition: 0.3s;
-
<tr><td bgColor="#e7e7e7" colspan="3" height="1px"> </tr>
+
-moz-transition: 0.3s;
-
<tr> <td colspan="3" height="5px"> </td></tr>
+
-o-transition: 0.3s;
-
 
+
-webkit-transition: 0.3s;
-
 
+
}
-
<!--requirements section -->
+
.main .part1 img:hover {
-
<tr><td colspan="3"> <h3> Requirements </h3></td></tr>
+
bottom: 80px;
-
<tr>
+
}
-
<td width="45%"  valign="top">
+
.main .part1 .objLeft {
-
 
+
left: 200px;
-
<p> Please be sure to keep these links, your audience will want to find your: </p>
+
}
-
 
+
.main .part1 .objRight {
-
<!-- Links to other team pages -->
+
right: 200px;
-
<ul>
+
}
-
<li><a href="https://2014.igem.org/Team:OUC-China">Home</a> </li>
+
.main .part2 {
-
<li><a href="https://2014.igem.org/Team:OUC-China/Team">Team</a> </li>
+
width: 100%;
-
<li><a href="https://igem.org/Team.cgi?year=2013&team_name=OUC-China">Official Team Profile</a> </li>
+
height: 905px;
-
<li><a href="https://2014.igem.org/Team:OUC-China/Project">Project</a> </li>
+
background: rgb(96,159,210);
-
<li><a href="https://2014.igem.org/Team:OUC-China/Parts">Parts</a> </li>
+
position: relative;
-
<li><a href="https://2014.igem.org/Team:OUC-China/Modeling">Modeling</a> </li>
+
}
-
<li><a href="https://2014.igem.org/Team:OUC-China/Notebook">Notebook</a> </li>
+
.main .part2 ul li {
-
<li><a href="https://2014.igem.org/Team:OUC-China/Safety">Safety</a> </li>
+
position: absolute;
-
<li><a href="https://2014.igem.org/Team:OUC-China/Attributions">Attributions</a> </li>
+
display:none;
-
 
+
}
-
</ul>
+
.main .part2 ul li p{
-
 
+
display: block;
-
</td>
+
position: absolute;
-
 
+
width: 184px;
-
<td > </td>
+
color: rgb(49,129,194);
-
<td width="45%">
+
text-align: center;
-
 
+
font-size:24px;
-
<p>There are a few wiki requirements teams must follow:</p>
+
}
-
<ul>
+
.main .part2 .buble {
-
<li>All pages, images and files must be hosted on the <a href ="https://2014.igem.org/Special:Upload"> 2014.igem.org server</a>. </li>
+
animation-name: bubleM;
-
<li>All pages must be created under the team’s name space.</li>
+
animation-duration:1s;
-
<li>As part of your documentation, keep the links from the menu to the left. </li>
+
animation-timing-function: linear;
-
<li>Do not use flash in wiki code. </li>
+
animation-iteration-count: 10;
-
<li>The <a href="https://static.igem.org/mediawiki/igem.org/6/60/Igemlogo_300px.png"> iGEM logo </a> should be placed on the upper part of every page and should link to <a href="https://2014.igem.org/Main_Page">2014.igem.org</a>.</li>
+
animation-direction: alternate;
-
</ul>
+
animation-fill-mode: both;
-
<p>Visit the <a href="https://2014.igem.org/Wiki_How-To"> Wiki How To page </a> for a complete list of requirements, tips and other useful information. </p>
+
animation-play-state: running;
-
 
+
-webkit-animation-name: bubleM;
-
</td>
+
-webkit-animation-duration: 0.3s;
-
</tr>
+
-webkit-animation-timing-function: linear;
-
 
+
-webkit-animation-iteration-count: 7;
-
 
+
-webkit-animation-direction: alternate;
-
<tr> <td colspan="3" height="15px"> </td></tr>
+
-webkit-animation-fill-mode: both;
-
<tr><td bgColor="#e7e7e7" colspan="3" height="1"> </tr>
+
-webkit-animation-play-state: running;
-
 
+
}
-
 
+
.delay1 {
-
<!--tips  -->
+
-moz-animation-delay: 0s;
-
<tr><td colspan="3" > <h3> Tips  </h3></td></tr>
+
}
-
 
+
.delay2 {
-
<tr>
+
-moz-animation-delay: 0.4s;
-
<td width="45%" valign="top">  
+
}
-
<p>We are currently working on providing teams with some easy to use design templates.
+
.delay3 {
-
<br> In the meantime you can also view other team wikis for inspiration! Here are some very good examples</p>
+
-moz-animation-delay: 0.8s;
-
 
+
}
-
<ul>
+
.delay4 {
-
<li> <a href="https://2013.igem.org/Team:SDU-Denmark/"> 2013 SDU Denmark </a> </li>
+
-moz-animation-delay: 1.2s;
-
<li> <a href="https://2013.igem.org/Team:SYSU-China">2013 SYSU China</a> </li>
+
}
-
<li> <a href="https://2013.igem.org/Team:Shenzhen_BGIC_ATCG"> 2013 Shenxhen BGIG ATCG </a></li>
+
.delay5 {
-
<li> <a href="https://2013.igem.org/Team:Colombia_Uniandes">2013 Colombia Unianades </a></li>
+
-moz-animation-delay: 1.6s;
-
<li> <a href="https://2013.igem.org/Team:Lethbridge">2013 Lethbridge</a></li>
+
}
-
</ul>
+
.delay6 {
-
 
+
-moz-animation-delay: 2s;
-
<p>For a full wiki list, you can visit <a href="https://igem.org/Team_Wikis?year=2013">iGEM 2013 web sites </a> and <a href="https://igem.org/Team_Wikis?year=2012">iGEM 2012 web sites</a>  lists. </p>
+
}
-
</td>
+
.main .part2 .lFish {
-
 
+
left: 45px;
-
<td> </td>
+
bottom: -95px;
-
<td width="45%">  
+
}
-
 
+
.main .part2 .rFish {
-
<p>This wiki will be your team’s first interaction with the rest of the world, so here are a few tips to help you get started: </p>
+
right: 45px;
-
 
+
bottom: -100px;
-
<ul>
+
}
-
<li>State your accomplishments! Tell people what you have achieved from the start. </li>
+
.footer {
-
<li>Be clear about what you are doing and what you plan to do.</li>
+
width: 100%;
-
<li>You have a global audience! Consider the different backgrounds that your users come from.</li>
+
height: 220px;
-
<li>Make sure information is easy to find; nothing should be more than 3 clicks away.  </li>
+
background: rgb(45,111,165);
-
<li>Avoid using very small fonts and low contrast colors; information should be easy to read.  </li>
+
}
-
<li>Start documenting your project as early as possible; don’t leave anything to the last minute before the Wiki Freeze. For a complete list of deadlines visit the <a href="">iGEM 2013 calendar</a> </li>
+
@charset "utf-8";
-
<li>Have lots of fun! </li>
+
/* CSS Document */
-
</ul>
+
.nav {
-
</br>
+
position: absolute;
-
</td>
+
}
-
</tr>
+
.nav li {
-
</table>
+
padding: 0 8px;
 +
float: left;
 +
position: relative;
 +
min-width: 80px;
 +
height: 40px;
 +
color: rgb(60,60,60);
 +
font-size: 24px;
 +
line-height: 40px;
 +
text-align: center;
 +
transition: 0.3s;
 +
-moz-transition: 0.3s;
 +
-o-transition: 0.3s;
 +
-webkit-transition: 0.3s;
 +
}
 +
.nav li:hover {
 +
background: rgb(146,205,253);
 +
color: #fff;
 +
}
 +
.nav .pMenu ul {
 +
display: none;
 +
position: absolute;
 +
top: 100%;
 +
left: 0px;
 +
overflow: hidden;
 +
border-bottom-left-radius: 6px;
 +
border-bottom-right-radius: 6px;
 +
}
 +
.nav .pMenu ul li {
 +
min-width: 220px;
 +
background: rgb(146,205,253);
 +
color: #fff;
 +
transition: 0.4s;
 +
-moz-transition: 0.4s;
 +
-o-transition: 0.4s;
 +
-webkit-transition: 0.4s;
 +
}
 +
.nav .pMenu ul li:hover {
 +
background: rgb(98,175,243);
 +
}
 +
.neck{ background-image:url(https://static.igem.org/mediawiki/2014/2/20/OUC-China_Index_Slide1.png)}
 +
.example-animation {
 +
color: #FFF;
 +
font-size: 60px;
 +
}
 +
header {
 +
            position: absolute;
 +
            width: 1020px;
 +
            margin: 0 auto;
 +
            z-index: 999;
 +
        }
 +
        header > ul {
 +
            list-style: none;
 +
            display: inline-block;
 +
            margin-left: 10px;
 +
            margin-right: 10px;float:left;
 +
            -webkit-transition: all ease 0.5s;
 +
        }
 +
        header > ul:hover {
 +
            margin-top: 0 !important;
 +
        }
 +
        header > ul > li {
 +
            width: 150px;
 +
            min-height: 50px;
 +
            padding: 10px;
 +
            background-color: #ffffff;
 +
        }
 +
        header > ul > li > a {
 +
            display: block;
 +
            font-size: 16px;
 +
            text-align: center;
 +
            cursor: pointer;
 +
            color: #1d89f7;
 +
        }
 +
        header > ul > li > a:hover {
 +
            color: #000000;
 +
            text-decoration: none;
 +
        }
 +
        header > ul > li:last-child {
 +
            height: 70px;
 +
            width: 70px;
 +
            border-radius: 50%;
 +
            margin-left: 40px;
 +
            margin-top: -10px;
 +
        }
 +
        header > ul > li:last-child > div {
 +
            width: 50px;
 +
            height: 50px;
 +
            border: 5px solid #1d89f7;
 +
            border-radius: 50%;
 +
        }
 +
        header > ul > li:last-child > div > div {
 +
            width: 0;
 +
            height: 0;
 +
            margin-left: 5px;
 +
            margin-top: 5px;
 +
            border-radius: 50%;
 +
            border: 15px solid #1d89f7;
 +
        }
 +
        .logo {
 +
            position: absolute;
 +
            top: 10px;
 +
            z-index: 10;
 +
        }
 +
#slider {
 +
            background-image: url(https://static.igem.org/mediawiki/2014/2/20/OUC-China_Index_Slide1.png);
 +
            background-repeat: no-repeat;
 +
            background-size: cover;
 +
        }
 +
        #slider,#slider > ul, #slider > ul > li {
 +
            width:100%;
 +
            height:615px;
 +
        }
 +
        #slider > ul {
 +
            margin: 0;
 +
            padding: 0;
 +
        }
 +
        #slider > ul > li {
 +
            list-style: none;
 +
        }
 +
            #slider > .dots {
 +
                position: relative;
 +
                left: 0;
 +
                bottom: 20px;
 +
                text-align: center;
 +
                padding: 0;
 +
                margin: 0 !important;
 +
            }
 +
                #slider > .dots > li {
 +
                    display: inline-block;
 +
                    width: 10px;
 +
                    height: 10px;
 +
                    margin: 0 4px 0 4px;
 +
                    border: 2px solid #5b97fb;
 +
                    border-radius: 50%;
 +
                    cursor: pointer;
 +
                    text-indent: -999em;
 +
                    opacity: .4;
 +
                    -webkit-transition: background .5s, opacity .5s;
 +
                    -moz-transition: background .5s, opacity .5s;
 +
                    transition: background .5s, opacity .5s;
 +
                }
 +
                #slider > .dots > li.active {
 +
                    background: #5b97fb;
 +
                    opacity: 1;
 +
                }
 +
        @-webkit-keyframes CircleLogo {
 +
            0% {
 +
                transform: rotate(0deg);
 +
            }
 +
            50% {
 +
                transform: rotate(180deg);
 +
            }
 +
            100% {
 +
                transform: rotate(360deg);
 +
            }
 +
        }
 +
        @-moz-keyframes CircleLogo {
 +
            0% {
 +
                transform: rotate(0deg);
 +
            }
 +
            50% {
 +
                transform: rotate(180deg);
 +
            }
 +
            100% {
 +
                transform: rotate(360deg);
 +
            }
 +
        }
 +
        @-ms-keyframes CircleLogo {
 +
            0% {
 +
                transform: rotate(0deg);
 +
            }
 +
            50% {
 +
                transform: rotate(180deg);
 +
            }
 +
            100% {
 +
                transform: rotate(360deg);
 +
            }
 +
        }
 +
        @keyframes CircleLogo {
 +
            0% {
 +
                transform: rotate(0deg);
 +
            }
 +
            50% {
 +
                transform: rotate(180deg);
 +
            }
 +
            100% {
 +
                transform: rotate(360deg);
 +
            }
 +
        }
 +
</style>
 +
<script>
 +
        if ($('.firstHeading')) $('.firstHeading').remove();
 +
    </script>
 +
<a href="https://igem.org/Main_Page"><img class="logo" src="https://static.igem.org/mediawiki/2014/c/c6/OUC-China_Content_IGEM.png" style="left:10px" /></a>
 +
<img class="logo" style="right:10px;animation: CircleLogo 20s linear infinite;-webkit-animation: CircleLogo 20s linear infinite;-moz-animation: CircleLogo 20s linear infinite;-ms-animation: CircleLogo 20s linear infinite" src="https://static.igem.org/mediawiki/2014/0/00/OUC_China_Content_Team.png" />
 +
    <header>
 +
        <ul>
 +
            <li style="border-bottom-left-radius:5px;border-bottom-right-radius:5px"><a href="#" style="font-size:22px">HOME</a></li>
 +
            <li><div><div></div></div></li>
 +
        </ul>
 +
        <ul style="margin-top:-260px">
 +
            <li><a href="https://2014.igem.org/Team:OUC-China/Team">Members</a></li>
 +
            <li><a href="https://2014.igem.org/Team:OUC-China/Team_Instructor">Instructor</a></li>
 +
            <li><a href="https://2014.igem.org/Team:OUC-China/Team_Acknowledgment">Acknowledgment</a></li>
 +
            <li><a href="https://2014.igem.org/Team:OUC-China/Team_Lab">Lab</a></li>
 +
            <li><a href="https://igem.org/Team.cgi?year=2014&team_name=OUC-China">Official Team Profile</a></li>
 +
            <li style="border-bottom-left-radius:5px;border-bottom-right-radius:5px"><a style ="font-size:22px">TEAM</a></li>
 +
            <li><div><div></div></div></li>
 +
        </ul>
 +
        <ul style="margin-top:-325px">
 +
            <li><a href="https://2014.igem.org/Team:OUC-China/Project">Overview</a></li>
 +
            <li><a href="https://2014.igem.org/Team:OUC-China/Project_Background">Background</a></li>
 +
            <li><a href="https://2014.igem.org/Team:OUC-China/Project_Design">Design</a></li>
 +
            <li><a href="https://2014.igem.org/Team:OUC-China/Project_Result">Result</a></li>
 +
            <li><a href="https://2014.igem.org/Team:OUC-China/Project_Future">Future</a></li>
 +
            <li><a href="https://2014.igem.org/Team:OUC-China/Project_Modeling">Modeling</a></li>
 +
            <li><a href="https://2014.igem.org/Team:OUC-China/Project_Policy_Practise">Policy&Practice</a></li>
 +
            <li style="border-bottom-left-radius:5px;border-bottom-right-radius:5px"><a style="font-size:22px">PROJECT</a></li>
 +
            <li><div><div></div></div></li>
 +
        </ul>
 +
        <ul style="margin-top:-90px">
 +
            <li><a href="https://2014.igem.org/Team:OUC-China/Judging">Biobrick</a></li>
 +
            <li><a href="https://2014.igem.org/Team:OUC-China/Judging_Achievment">Achievement</a></li>
 +
            <li style="border-bottom-left-radius:5px;border-bottom-right-radius:5px"><a style="font-size:22px">JUDGING</a></li>
 +
            <li><div><div></div></div></li>
 +
        </ul>
 +
        <ul style="margin-top:-100px">
 +
            <li><a href="https://2014.igem.org/Team:OUC-China/Safety">Biosafety</a></li>
 +
            <li><a href="https://2014.igem.org/Team:OUC-China/Safety_Lab_safety">Labsafety</a></li>
 +
            <li style="border-bottom-left-radius:5px;border-bottom-right-radius:5px"><a style="font-size:22px">SAFETY</a></li>
 +
            <li><div><div></div></div></li>
 +
        </ul>
 +
        <ul style="margin-top:-145px">
 +
            <li><a href="https://2014.igem.org/Team:OUC-China/Notebook">Lab Note</a></li>
 +
            <li><a href="https://2014.igem.org/Team:OUC-China/Notebook_Modeling_Note">Modeling Note</a></li>
 +
            <li><a href="https://2014.igem.org/Team:OUC-China/Notebook_Protocols">Protocols</a></li>
 +
            <li style="border-bottom-left-radius:5px;border-bottom-right-radius:5px"><a style="font-size:22px">NOTEBOOK</a></li>
 +
            <li><div><div></div></div></li>
 +
        </ul>
 +
    </header>
 +
    <script>
 +
        var header = $('header');
 +
        function resizeElement() {
 +
            header.css({ marginLeft: (window.innerWidth - 1020) / 2 + 'px' });
 +
        }
 +
        resizeElement();
 +
        window.onresize = resizeElement;
 +
    </script>
 +
</div>
 +
<div id="slider">
 +
        <ul>
 +
            <li>
 +
                <img src="https://static.igem.org/mediawiki/2014/4/42/OUC-China_Index_Slide2.png" style="width: 80%;margin:80px auto;display:block;position:inherit">
 +
            </li>
 +
            <li>
 +
<img src="https://static.igem.org/mediawiki/2014/5/5a/OUC-China_Index_Slide3.png" style="width:80%;position:inherit;margin:80px auto;display:block;" />
 +
<div style="width:5px;height:100%;position:relative;background-color:#ffffff;margin-left:49%;transform: rotate(10deg);-webkit-transform: rotate(10deg);-moz-transform: rotate(10deg);-ms-transform: rotate(10deg);margin-top:-600px;"></div>
 +
            </li>
 +
            <li>
 +
<img src="https://static.igem.org/mediawiki/2014/5/58/OUC-China_Index_Slide4.png" style="width:80%;margin:80px auto;display:block;position:inherit" />
 +
            </li>
 +
            <li>
 +
<img src="https://static.igem.org/mediawiki/2014/2/2f/OUC-China_Index_Slide5.png" style="width:80%;margin:80px auto;display:block;position:inherit" />
 +
            </li>
 +
        </ul>
 +
    </div>
 +
    <script>
 +
    $('#slider').unslider({
 +
        speed: 500,
 +
        delay: 3000,
 +
        keys: true,
 +
        dots: true,
 +
        fluid: false
 +
    });
 +
    </script>
 +
<div class = "main">
 +
  <div class = "part1">
 +
<h2 class="text-primary" style="width: 960px;margin:0 auto;padding-top:10px;">Introduction</h2>
 +
<p style="width: 960px;margin:0 auto;font-size: 19px;padding-top:12px;">Current researches usually transfer exogenous DNA into prokaryotic cells and eukaryotic cells, while OUC-China iGEM team has designed an innovative method to carry exogenous DNA from prokaryote to eukaryota more efficiently. Eventually we have applied the method to studies of the model organism, zebrafish. <br />
 +
We have constructed the fusion protein that can bind and protect plasmids, with the ability of helping plasmids transfect into eukaryotic cells in high efficiency.</p>
 +
<a href="https://2014.igem.org/Team:OUC-China/Project" class="btn btn-primary btn-lg" style="display:block;margin:40px auto;width:200px;position:relative;color: #ffffff;">Learn More</a>
 +
    <div class = "waveUp"></div>
 +
    <div class = "waveDown"></div>
 +
    <img class = "objLeft" src="https://static.igem.org/mediawiki/2014/4/41/OUC-China_Index_Plasmid1.png"/> <img class = "objRight" src="https://static.igem.org/mediawiki/2014/e/e6/OUC-China_Index_Plasmid2.png"/> </div>
 +
  <div class = "part2"> <img class = "lFish" src="https://static.igem.org/mediawiki/2014/a/a0/OUC-China_FishLeft.png"/> <img class = "rFish" src="https://static.igem.org/mediawiki/2014/d/de/OUC-China_FishRight.png"/>
 +
    <ul style="width:1350px; margin:auto; position:relative;">
 +
      <li style = "top:85px;left:145px;-webkit-animation-duration: 0.3s;"> <img src="https://static.igem.org/mediawiki/2014/4/45/OUC-China_1.png"/> <img id = "lGear" src="https://static.igem.org/mediawiki/2014/d/d0/LGear.png" style="top:59px;left:131px;display:none;"/> <img src="https://static.igem.org/mediawiki/2014/f/f5/OUC-China_BGear.png" style="top:75px;left:25px;"/>
 +
        <p style="top: 200px; left: 70px;"><a href="https://2014.igem.org/Team:OUC-China/Project_Design#Double_Plamisd">The Double Plasmid System</a></p>
 +
      </li>
 +
      <li style = "top:30px;left:520px;-webkit-animation-duration: 0.33s;"><img src="https://static.igem.org/mediawiki/2014/6/61/OUC-China2.png"/> <img src="https://static.igem.org/mediawiki/2014/9/91/OUC-China_Circle.png" style="top: 69px; left: 38px;"> <img id = "lGear2" src="https://static.igem.org/mediawiki/2014/d/d0/LGear.png" style="top: 34px; left: 179px;">
 +
        <p style="top: 275px; left: 86px;"><a href="https://2014.igem.org/Team:OUC-China/Project_Design#Transfection">Transfection</a></p>
 +
      </li>
 +
      <li style = "top:80px;left:930px;-webkit-animation-duration: 0.35s;"><img src="https://static.igem.org/mediawiki/2014/9/93/OUC-China_3.png"/> <img id = "express" src="https://static.igem.org/mediawiki/2014/b/b6/OUC-China_Expression.png" style="top: 201px; left: 88px;display:none;"> <img src="https://static.igem.org/mediawiki/2014/5/52/OUC-China_Model.png" style="top: 42px; left: 79px;">
 +
        <p style="top: 246px; left: 67px;"><a href="https://2014.igem.org/Team:OUC-China/Project_Modeling">Modeling</a></p>
 +
      </li>
 +
      <li style = "top:450px;left:190px; -webkit-animation-duration: 0.18s;-webkit-animation-iteration-count: 10;"><img src="https://static.igem.org/mediawiki/2014/5/50/OUC-China_4.png"/> <img id = "peiYang" src="https://static.igem.org/mediawiki/2014/c/c5/PeiYang.png" style="top: 55px; left:80px;">
 +
        <p style="top: 232px; left: 59px;"><a href="https://2014.igem.org/Team:OUC-China/Judging">Judging</a></p>
 +
      </li>
 +
      <li style = "top:414px;left:530px;-webkit-animation-duration: 0.37s;"><img src="https://static.igem.org/mediawiki/2014/e/e2/OUC-China_5.png"/> <img id = "safety" src="https://static.igem.org/mediawiki/2014/3/3b/OUC-China_Blue.png" style="top: 97px; left: 92px;">
 +
        <p style="top: 267px; left: 74px;"><a href="https://2014.igem.org/Team:OUC-China/Safety">Safety</a></p>
 +
      </li>
 +
      <li style = "top:450px;left:920px; -webkit-animation-duration: 0.18s;-webkit-animation-iteration-count: 10;"><img src="https://static.igem.org/mediawiki/2014/8/8a/OUC-China_6.png"/> <img id = "lamp" src="https://static.igem.org/mediawiki/2014/8/80/OUC-China_lamp.png" style="top: 53px; left: 85px;">
 +
        <p style="top: 231px; left: 69px;"><a href="https://2014.igem.org/Team:OUC-China/Project_Policy_Practise">Policy&Practise </a></p>
 +
      </li>
 +
    </ul>
 +
  </div>
 +
  <script>
 +
    var  list = $(".part2 ul>li");
 +
$(window).scroll(function(){
 +
  if($(document).scrollTop() >= 900){
 +
for(var i = 0;i < list.length;i++){
 +
  list.eq(i).delay(i * 8).fadeIn(800).addClass("buble delay"+(i + 1));
 +
}
 +
  };
 +
});
 +
$("#lGear").parent().hover(function(){
 +
  $("#lGear").fadeIn(1000);
 +
},function(){
 +
  $("#lGear").fadeOut(1000,function(){
 +
    $("#lGear").clearQueue();
 +
  });
 +
});
 +
$("#lGear2").parent().hover(function(){
 +
  $("#lGear2").animate({left:'83px',top:'115px'},1000);
 +
},function(){
 +
  $("#lGear2").animate({left:'179px',top:'34px'},800,function(){
 +
    $(this).clearQueue();
 +
  });
 +
});
 +
$("#express").parent().hover(function(){
 +
      $("#express").fadeIn(1000);
 +
},function(){
 +
  $("#express").fadeOut(1000,function(){
 +
    $("#express").clearQueue();
 +
  });
 +
});
 +
$("#peiYang").parent().hover(function(){
 +
  document.getElementById("peiYang").src = "https://static.igem.org/mediawiki/2014/1/13/OUC-China_Medal.png";
 +
  },function(){
 +
document.getElementById("peiYang").src = "https://static.igem.org/mediawiki/2014/c/c5/PeiYang.png";
 +
});
 +
$("#safety").parent().hover(function(){
 +
  document.getElementById("safety").src = "https://static.igem.org/mediawiki/2014/c/cc/OUC-China_Red.png";
 +
},function(){
 +
  document.getElementById("safety").src = "https://static.igem.org/mediawiki/2014/3/3b/OUC-China_Blue.png";
 +
});
 +
$("#lamp").parent().hover(function(){
 +
document.getElementById("lamp").src = "https://static.igem.org/mediawiki/2014/4/40/OUC-China_deng.png";
 +
},function(){
 +
document.getElementById("lamp").src = "https://static.igem.org/mediawiki/2014/8/80/OUC-China_lamp.png";
 +
});
 +
  </script>  
 +
</div>
 +
<div class = "footer">
 +
  <style>
 +
    .footer > div { width: 418px; margin: 0 auto; padding-top: 50px; }
 +
    .footer > div > img { float: left; height: 100px; display: inline-block; position: relative; margin-left: 6px; margin-right: 6px; }
 +
    .footer > p { text-align: center; color: #ffffff }
 +
    .footer > p > a { color: #ffffff; }
 +
  </style>  
 +
  <div>
 +
    <img src="https://static.igem.org/mediawiki/2014/a/ad/OUC-China_Index_OrgLogo.png" />
 +
    <img src="https://static.igem.org/mediawiki/2014/e/ec/OUC-China_Index_OrgTitle.jpg" />
 +
    <img src="https://static.igem.org/mediawiki/2014/9/96/OUC-China_Foot_ouclogo.png" />
 +
    <div style="clear:both"></div>
 +
  </div>
 +
  <p>contact us: <a href="mailto:oucigem@163.com">oucigem@163.com</a></p>
 +
</div>
 +
<img class="anchor" onclick="document.documentElement.scrollTop = document.body.scrollTop = 0;" src="https://static.igem.org/mediawiki/2014/b/b6/ToTop.png"/>  
 +
</html>

Latest revision as of 03:59, 18 October 2014

Introduction

Current researches usually transfer exogenous DNA into prokaryotic cells and eukaryotic cells, while OUC-China iGEM team has designed an innovative method to carry exogenous DNA from prokaryote to eukaryota more efficiently. Eventually we have applied the method to studies of the model organism, zebrafish.
We have constructed the fusion protein that can bind and protect plasmids, with the ability of helping plasmids transfect into eukaryotic cells in high efficiency.

Learn More