Difference between revisions of "Team:OUC-China"

Line 1: Line 1:
 
{{OUC-China}}
 
{{OUC-China}}
 
{{OUC-China/CSS}}
 
{{OUC-China/CSS}}
<html>
+
<html lang="en">
 
<head>
 
<head>
<meta charset="utf-8 ">
+
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
+
<title>页面切换</title>
<title>Home</title>
+
<link rel="stylesheet" href="bootstrap.min.css">
 
+
<style type="text/css">
<style type="text/css">
+
body{margin-top:0}
+
html,body{
.ouc-navbar{background-color:#008EA1;padding: 0;margin: 0;border-radius: 0;}
+
height: 100%;
.ouc-nav-a{color: white;}
+
overflow: hidden;
#ouc-logo{padding-top:5px;}
+
}
#ouc-logo:hover{background-color:#008EA1;}
+
#container1,.sections,.section{
.container-fluid{padding: 0;}
+
height: 100%;
.ouc-container{width: 780px;}
+
position: relative;
.carousel-control{line-height: 640px;text-align: center;font-size: 80px;}
+
}
.ouc-abstruct{text-align: center;}
+
#section0,
 +
#section1,
 +
#section2,
 +
#section3,
 +
#section4,
 +
#section5{
 +
 +
background-size: cover;
 +
background-position: 50% 50%;
 +
}
 +
#section0{
 +
color: #fdb933;
 +
background-image: url(https://static.igem.org/mediawiki/2017/a/a6/T--OUC-China--home0.jpg) ;
 +
text-shadow:3px 2px #fff;
 +
}
 +
#section1{
 +
color: #fff;
 +
font-size: 20px;
 +
text-shadow:1px 1px 1px black;
 +
background-image:url(https://static.igem.org/mediawiki/2017/9/91/T--OUC-China--home1.jpg);
 +
}
 +
#section2{
 +
background-image: url(https://static.igem.org/mediawiki/2017/c/c7/T--OUC-China--home2.jpg);
 +
color: #fff;
 +
font-size: 20px;
 +
text-shadow:1px 1px 1px black;
 +
}
 +
#section3{
 +
color: #FFFFFF;
 +
font-size: 20px;
 +
background-image: url(https://static.igem.org/mediawiki/2017/d/da/T--OUC-China--home3.jpg);
 +
text-shadow:1px 1px 1px black;
 +
}
 +
#section4{
 +
color: #FFFFFF;
 +
font-size: 20px;
 +
background-image: url(https://static.igem.org/mediawiki/2017/c/c4/T--OUC-China--home4.jpg);
 +
}
 +
#section5{
 +
color: #FFFFFF;
 +
background-image: url(https://static.igem.org/mediawiki/2017/9/9d/T--OUC-China--home5.jpg);
 +
}
 +
 +
 +
.intro{
 +
position: absolute;
 +
top: 50%;
 +
width: 100%;
 +
-webkit-transform: translateY(-50%);
 +
transform: translateY(-50%);
 +
text-align: center;
 +
}
 +
 +
.pages{
 +
position:fixed;
 +
list-style: none;
 +
}
 +
.vertical.pages{
 +
right: 10px;
 +
top: 50%;
 +
}
 +
.horizontal.pages{
 +
left: 50%;
 +
bottom: 10px;
 +
}
 +
.pages li{
 +
width: 8px;
 +
height: 8px;
 +
border-radius: 50%;
 +
background: #fff;
 +
margin: 10px 5px;
 +
cursor: pointer;
 +
}
 +
.horizontal.pages li{
 +
display: inline-block;
 +
vertical-align: middle;
 +
}
 +
.pages li.active{
 +
width: 14px;
 +
height: 14px;
 +
border: 2px solid #FFFE00;
 +
background: none;
 +
margin-left: 0;
 +
}
 +
.animation{opacity: 0;}
 +
.section:hover .animation{transition: all 1s; opacity: 1;}
 +
.ouc-abstruct{text-align: center;}
 
.ouc-abstruct p{text-align: left;}
 
.ouc-abstruct p{text-align: left;}
 
.ouc-abstruct h1{color:#008EA1; }
 
.ouc-abstruct h1{color:#008EA1; }
 +
.ouc-abstruct{
 +
background-color: white;
 +
color: grey;
 +
padding-bottom: 20px;
 +
}
 +
.top{position: absolute;bottom:0;right: 0;}
 +
.top:hover{animation: upp 0.6s ;}
 +
@keyframes upp {
 +
0% {margin-bottom: 0;}
 +
50% {margin-bottom: 80px;}
 +
100% {margin-bottom: 0;}
 +
}
 
.ouc-reserve{background-color: #008EA1;color: white;}
 
.ouc-reserve{background-color: #008EA1;color: white;}
        #bodyContent h1,h2{margin-bottom:0;border-bottom:none;}
+
        #ouc-indicators{margin:0,auto;}
+
</style>
</style>
+
 
</head>
 
</head>
 
 
<body>
 
<body>
 
+
   
<div class="container-fluid">
+
<div id="container1" data-PageSwitch>
 
+
<div class="sections">
 
+
<div class="section active" id="section0">
  <!--轮播图-->
+
<div class="intro animation">
    <div id="slidershow" class="carousel slide" data-ride="carousel">
+
<h1 id="title" style="font-size: 100px;"><strong>A Bottle of Algae "Wine"</strong><br/><small style="color:darkgray">Producing ethanol from algae</small></h1>
<!-- 设置图片轮播的顺序 -->
+
</div>
    <ol class="carousel-indicators" id="ouc-indicators">
+
        <li class="active" data-target="#slidershow" data-slide-to="0"></li>
+
        <li data-target="#slidershow" data-slide-to="1"></li>
+
</div>
        <li data-target="#slidershow" data-slide-to="2"></li>
+
<div class="section" id="section1">
        <li data-target="#slidershow" data-slide-to="3"></li>
+
<div class="intro animation">
        <li data-target="#slidershow" data-slide-to="4"></li>
+
 
+
<p>Qingdao is a beautiful tourist city. <br/>However, every summer a monster--<i>Enteromorpha</i>--will come to the seaside,<br/>scaring away all tourists.<br/> And the beautiful sea becomes empty and lonely.</p>
    </ol>
+
    <!-- 设置轮播图片 -->
+
</div>
    <div class="carousel-inner">
+
        <div class="item active">
+
</div>
            <img src="https://static.igem.org/mediawiki/2017/a/a6/T--OUC-China--home0.jpg" width="100%">
+
<div class="section" id="section2">
        </div>
+
<div class="intro animation">
        <div class="item">
+
            <img src="https://static.igem.org/mediawiki/2017/9/91/T--OUC-China--home1.jpg" width="100%">
+
<p>After hearing the event, <i>S.cerevisiae</i> and <i>E.coli</i>decide to come and defeat <i>Enteromorpha</i>.<br/><i>E.coli</i> uses cellulase and hemicellulase as his sword to smash <i>Enteromorpha</i>.<br/>The fragment of <i>Enteromorpha</i> becomes cellodextrin and xylose.<br/>At the same time, <i>S.cerevisiae</i> collects the fragment and make it into glucose and then, ethanol.<br/>Finally, mixing with resveratrol, <i>S.cerevisiae</i> transforms the monster into Enteromorpha wine.  </p>
        </div>
+
        <div class="item">
+
</div>
            <img src="https://static.igem.org/mediawiki/2017/c/c7/T--OUC-China--home2.jpg" width="100%">
+
</div>
        </div>
+
<div class="section" id="section3">
        <div class="item">
+
<div class="intro animation">
            <img src="https://static.igem.org/mediawiki/2017/d/da/T--OUC-China--home3.jpg" width="100%">
+
<p><i>Enteromorpha</i> disappeared!<br/>Now every summer, people enjoy themselves on the beautiful beach in Qingdao!</p>
        </div>
+
        <div class="item">
+
</div>
            <img src="https://static.igem.org/mediawiki/2017/c/c4/T--OUC-China--home4.jpg" width="100%">
+
</div>
        </div>
+
<div class="section" id="section4">
 
+
</div>
    </div>
+
<div class="section" id="section5">
    <!-- 设置轮播图片控制器 -->
+
    <div class="intro">
  <a class="left carousel-control" href="#slidershow" data-slide="prev">&lsaquo;</a>
+
    <div class="container ouc-abstruct">
        <a class="right carousel-control" href="#slidershow" data-slide="next">&rsaquo;</a>
+
                    <h1 style="font-size: 60px;"><strong>A Bottle Of Algae "Wine"</strong><br/><small>Producing ethanol from algae</small></h1>
</div>
+
                    <br/>
<!--轮播图-->
+
                    <p>This year OUC-iGEM focuses on the efficient use of cellulose. We are concerned about the utili-zation of Enteromorpha as a hot local issue. Every year a large quantity of Enteromorpha are sal-vaged ashore. The utilization, however, remainds still in the initial stage . Compared to the traditional strategy of using terrestrial plant cellulose, the ingredient of lignin in large seaweed is rather low, which can lead to a better degradation.So it will be a great idea to produce new energy from Enteromorpha.<br/>
 
+
                        Our project can be devided into 3 parts:</p><br/>
 
+
                        <div class="row">
<!--导航 -->
+
                            <div class="col-md-4">
<div class="navbar  ouc-navbar" role="navigation">
+
                            <img src="https://static.igem.org/mediawiki/2017/a/ac/T--OUC-China--yeast2.png"/>
  <div class="container ouc-container">
+
                            <h4><strong>Adhesion platform</strong></h4>
    <ul class="nav navbar-nav">
+
                    <p><i>E. coli</i> and yeast is to adhere to each other and form a multi-cell unit, expanding the biological function of engineered cells.</p>
        <li><a href="#" class="navbar-brand" id="ouc-logo"><img src="https://static.igem.org/mediawiki/2017/8/89/T--OUC-China--logo.jpg" width="66" height="40" alt=""/></a></li>
+
                        </div>
        <li class="dropdown">
+
                        <div class="col-md-4">
            <a href="#" data-toggle="dropdown" class="dropdown-toggle ouc-nav-a">Team<span class="caret"></span></a>
+
                            <img src="https://static.igem.org/mediawiki/2017/a/a3/T--OUC-China--yeast1.png"/>
            <ul class="dropdown-menu">
+
                            <h4><strong>Fermentation</strong></h4>
                <li><a href="#">Member</a></li>
+
                            <p>We aim to make use of cellobiose and xylose produced from algae residue and turn them into ethanol---our Enteromorpha wine! Resveratrol is added to our wine to make it better for health. </p>
                <li><a href="#">Collaborations</a></li>
+
                        </div>
                <li><a href="#">Attributions</a></li>
+
                   
            </ul>
+
                        <div class="col-md-4">
        </li>
+
                            <img src="https://static.igem.org/mediawiki/2017/a/a2/T--OUC-China--yeast3.png"/>
        <li class="dropdown">
+
                            <h4><strong>Mini system</strong></h4>
            <a href="#" data-toggle="dropdown" class="dropdown-toggle ouc-nav-a">Project<spam class="caret"></span></a>
+
                            <p>We synthesize mini promoters in yeast, which have very concise sequences. In this way, we look forward to making our own contribution to the standardization of yeast!</p>
            <ul class="dropdown-menu">
+
                        </div>
                <li><a href="#">Description</a></li>
+
                        </div>
                <li><a href="#">Design</a></li>
+
                        <div class="container-fluid">
                <li><a href="#">Experiments</a></li>
+
                  <div class="row">
                <li><a href="#">Results</a></li>
+
                      <div class="col-md-2">
                <li><a href="#">Interlab</a></li>
+
                              <a href=""><img src="https://static.igem.org/mediawiki/2017/3/3f/T--OUC-China--Team.png" width="150"/></a>
                <li><a href="#" >Notebook</a></li>
+
                          </div>
            </ul>
+
                          <div class="col-md-2">
        </li>
+
                              <a href=""><img src="https://static.igem.org/mediawiki/2017/0/03/T--OUC-China--Project.png" width="150"/></a>  
        <li><a href="#" class="ouc-nav-a">Model</a></li>
+
                          </div>
        <li><a href="#" class="ouc-nav-a">Parts</a></li>
+
                          <div class="col-md-2">
        <li><a href="#" class="ouc-nav-a">Safety</a></li>
+
                              <a href=""><img src="https://static.igem.org/mediawiki/2017/3/3c/T--OUC-China--model.png" width="150"/></a>  
        <li><a href="#" class="ouc-nav-a">Human Practice</a></li>
+
                          </div>
    </ul>
+
                          <div class="col-md-2">
    </div>
+
                              <a href=""><img src="https://static.igem.org/mediawiki/2017/3/3b/T--OUC-China--parts.png" width="150"/></a>
</div>
+
                          </div>
<!--导航 -->
+
                          <div class="col-md-2">
</div>
+
                              <a href=""><img src="https://static.igem.org/mediawiki/2017/0/07/T--OUC-China--sefety.png" width="150"/></a>
 
+
                          </div>
 
+
                          <div class="col-md-2">
 
+
                              <a href=""><img src="https://static.igem.org/mediawiki/2017/d/d1/T--OUC-China--hp.png" width="150"/></a>
<!--Abstruct -->
+
                          </div>
<div class="container ouc-abstruct">
+
                  </div>
<h1 ><strong>A Bottle Of Algae Wine</strong><br/><small>Producing ethanol from alage</small></h1>
+
                </div>
<p>This year OUC-iGEM focuses on the efficient use of cellulose. We are concerned about the utili-zation of Enteromorpha as a hot local issue. Every year a large quantity of Enteromorpha are sal-vaged ashore. The utilization, however, remainds still in the initial stage . Compared to the traditional strategy of using terrestrial plant cellulose, the ingredient of lignin in large seaweed is rather low, which can lead to a better degradation.So it will be a great idea to produce new energy from Enteromorpha.<br/>
+
                    </div>
    Our project can be devided into 3 parts:</p><br/>
+
    </div>
    <div class="row">
+
</div>
        <div class="col-md-4">
+
<div class="section" id="section6">
        <img src="https://static.igem.org/mediawiki/2017/a/ac/T--OUC-China--yeast2.png"/>
+
      <div class="intro">
        <h4><strong>Adhesion platform</strong></h4>
+
             
<p><i>E. coli</i> and yeast is to adhere to each other and form a multi-cell unit, expanding the biological function of engineered cells.</p>
+
          <img src="https://static.igem.org/mediawiki/2017/3/35/T--OUC-China--home6.jpg" width=92%/>
    </div>
+
                 
    <div class="col-md-4">
+
                      <div class="container-fluid ouc-reserve" style="padding-top: 10px;">
        <img src="https://static.igem.org/mediawiki/2017/a/a3/T--OUC-China--yeast1.png"/>
+
                                <p class="text-center">
        <h4><strong>Fermentation</strong></h4>
+
                                                 
        <p>We aim to make use of cellobiose and xylose produced from algae residue and turn them into ethanol---our Enteromorpha wine! Resveratrol is added to our wine to make it better for health. </p>
+
                                    Contact Us : oucigem@163.com&nbsp;&nbsp;|&nbsp;&nbsp;©2017 OUC IGEM.All Rights Reserved.&nbsp;&nbsp;|&nbsp;&nbsp;Based On Bootstrap<br/>
    </div>
+
                                      <img src="https://static.igem.org/mediawiki/2017/b/b4/T--OUC-China--foot1.jpeg" width="80" height="80"/>  
 
+
                                      <img src="https://static.igem.org/mediawiki/2017/6/62/T--OUC-China--foot2.jpeg" width="80" height="80"/>
    <div class="col-md-4">
+
                                      <img src="https://static.igem.org/mediawiki/2017/e/eb/T--OUC-China--QNS.jpg" height="50"/>  
        <img src="https://static.igem.org/mediawiki/2017/a/a2/T--OUC-China--yeast3.png"/>
+
                                      <img src="https://static.igem.org/mediawiki/2017/5/51/T--OUC-China--NSG.png" width="174" height="50"/>
        <h4><strong>Mini system</strong></h4>
+
                                      <img src="https://static.igem.org/mediawiki/2017/2/2a/T--OUC-China--ML.png" width="252" height="50"/><br/>
        <p>We synthesize mini promoters in yeast, which have very concise sequences. In this way, we look forward to making our own contribution to the standardization of yeast!</p>
+
                                </p>
    </div>
+
                       
    </div>
+
                      </div>
</div>
+
                    </div>
<!--Abstruct -->
+
                   
 
+
 
 
+
</div>
<!--赞助-->
+
</div>
<div class="container-fluid ouc-reserve">
+
</div>
    <p class="text-center">
+
<script type="text/javascript" src="https://2017.igem.org/Team:OUC-China/JsHomepage?action=raw&amp;ctype=text/javascript"></script>
        <br/><br/>
+
        Contact Us : oucigem@163.com&nbsp;&nbsp;|&nbsp;&nbsp;©2017 OUC IGEM.All Rights Reserved.&nbsp;&nbsp;|&nbsp;&nbsp;Based On Bootstrap<br/><br/>
+
        <img src="https://static.igem.org/mediawiki/2017/b/b4/T--OUC-China--foot1.jpeg" width="80" height="80"/>  
+
        <img src="https://static.igem.org/mediawiki/2017/6/62/T--OUC-China--foot2.jpeg" width="80" height="80"/>
+
        <img src="https://static.igem.org/mediawiki/2017/e/eb/T--OUC-China--QNS.jpg" width="353" height="50"/>  
+
        <img src="https://static.igem.org/mediawiki/2017/5/51/T--OUC-China--NSG.png" width="174" height="50"/>
+
        <img src="https://static.igem.org/mediawiki/2017/2/2a/T--OUC-China--ML.png" width="252" height="50"/><br/>
+
    </p>
+
 
+
</div>
+
<!--赞助-->
+
<script type="text/javascript" src="https://2017.igem.org/Team:OUC-China/JS?action=raw&amp;ctype=text/javascript"></script>
+
 
</body>
 
</body>
 
</html>
 
</html>

Revision as of 10:10, 19 October 2017

页面切换

A Bottle of Algae "Wine"
Producing ethanol from algae

Qingdao is a beautiful tourist city.
However, every summer a monster--Enteromorpha--will come to the seaside,
scaring away all tourists.
And the beautiful sea becomes empty and lonely.

After hearing the event, S.cerevisiae and E.colidecide to come and defeat Enteromorpha.
E.coli uses cellulase and hemicellulase as his sword to smash Enteromorpha.
The fragment of Enteromorpha becomes cellodextrin and xylose.
At the same time, S.cerevisiae collects the fragment and make it into glucose and then, ethanol.
Finally, mixing with resveratrol, S.cerevisiae transforms the monster into Enteromorpha wine.

Enteromorpha disappeared!
Now every summer, people enjoy themselves on the beautiful beach in Qingdao!

A Bottle Of Algae "Wine"
Producing ethanol from algae


This year OUC-iGEM focuses on the efficient use of cellulose. We are concerned about the utili-zation of Enteromorpha as a hot local issue. Every year a large quantity of Enteromorpha are sal-vaged ashore. The utilization, however, remainds still in the initial stage . Compared to the traditional strategy of using terrestrial plant cellulose, the ingredient of lignin in large seaweed is rather low, which can lead to a better degradation.So it will be a great idea to produce new energy from Enteromorpha.
Our project can be devided into 3 parts:


Adhesion platform

E. coli and yeast is to adhere to each other and form a multi-cell unit, expanding the biological function of engineered cells.

Fermentation

We aim to make use of cellobiose and xylose produced from algae residue and turn them into ethanol---our Enteromorpha wine! Resveratrol is added to our wine to make it better for health.

Mini system

We synthesize mini promoters in yeast, which have very concise sequences. In this way, we look forward to making our own contribution to the standardization of yeast!

Contact Us : oucigem@163.com  |  ©2017 OUC IGEM.All Rights Reserved.  |  Based On Bootstrap