Difference between revisions of "Team:OUC-China/Engagement"

 
(22 intermediate revisions by 4 users not shown)
Line 9: Line 9:
  
 
<style type="text/css">
 
<style type="text/css">
body{padding-top: 50px;}
+
.ouc-right{position: relative;}
.ouc-navbar{background-color:#008EA1;top: 15px;}
+
.ouc-rightnav{position:absolute;right: -200%;top: 0; display: none;background-color: white;width: 200%; z-index: 2001}
.ouc-nav-a{color: white;}
+
.ouc-right:visited{background-color:#D2D2D2; color: white;text-decoration: none;}
#ouc-logo{padding-top:5px;}
+
.ouc-right:hover .ouc-rightnav{display: inherit;}
#ouc-logo:hover{background-color:#008EA1;}
+
.ouc-rightnav a{background-color: white; color: #008EA1; width: 100%;height: 40px; line-height: 40px;}
 +
.ouc-rightnav a:visited {color: #008EA1;text-decoration: none; }
 +
.ouc-rightnav a:hover {background-color:#D2D2D2; color: white;text-decoration: none; }
 +
.ouc-vicedown{position: absolute; top:50px; }
 +
.ouc-vicedown a{display: block;height: 40px; width: 100%;text-decoration: none;color: #008EA1; line-height: 40px;text-align: center;}
 +
.ouc-vicedown a:visited{color:#008EA1;text-decoration: none }
 +
.ouc-vicedown a:hover{color:  #EDEC8Cl}
 +
 
 +
 +
.ouc-nav{color:white; background-color: #008EA1;display:block; width: 100%; color: white;padding: 0}
 +
.ouc-nav:visited{text-decoration: none; color: white}
 +
.ouc-nav:hover{text-decoration: none; background-color: white; color:#008EA1; }
 +
.ouc-navbar{position: relative;padding: 0;margin: 0;}
 +
.ouc-navbar:hover .ouc-down{display: inherit;}
 +
.ouc-down{position: absolute; top:50px;display: none;background-color: white; z-index: 1001}
 +
.ouc-navdown{color: #008EA1;display: block; width: 100%;height: 40px;}
 +
.ouc-navdown:visited{text-decoration: none;color:#008EA1; }
 +
.ouc-navdown:hover{background-color:#D2D2D2;color: white;text-decoration: none; z-index: 1501}
 +
.ouc-guide{position: fixed; width: 100%;top: 15px;z-index:1000}
 
.ouc-page-header{border-bottom-color: #EDEC8C;border-bottom-width: thick;color: #008F75;}
 
.ouc-page-header{border-bottom-color: #EDEC8C;border-bottom-width: thick;color: #008F75;}
 
.top{position: fixed;bottom:0;right: 0;}
 
.top{position: fixed;bottom:0;right: 0;}
 
.top:hover{animation: upp 0.6s ;}
 
.top:hover{animation: upp 0.6s ;}
 +
 
@keyframes upp {
 
@keyframes upp {
 
0% {margin-bottom: 0;}
 
0% {margin-bottom: 0;}
Line 23: Line 42:
 
}
 
}
 
.ouc-reserve{background-color: #008EA1;color: white;}
 
.ouc-reserve{background-color: #008EA1;color: white;}
.ouc-heading {color: #008EA1;}
+
    .ouc-heading {margin: 0;color: #008EA1;}
.ouc-a{color:#E3D434; }
+
.ouc-a:hover{color: #008F75;}
+
.ouc-ul{border-left:thin dashed #008F75}
+
+
 
</style>
 
</style>
 
</head>
 
</head>
 
  
 
<body>
 
<body>
 
<!--此处是导航-->
 
<!--此处是导航-->
<div class="navbar navbar-fixed-top ouc-navbar" role="navigation">
+
<div class="ouc-guide" style="height: 50px;background-color:#008EA1 ;">
    <ul class="nav navbar-nav">
+
<div class="row">
        <li><a href="https://2017.igem.org/Team:OUC-China" 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" /></a></li>
+
 
        <li class="dropdown">
+
<div class="col-md-2 navbar-header" style="text-align: center; padding: 0">
            <a data-toggle="dropdown" class="dropdown-toggle ouc-nav-a">Team<span class="caret"></span></a>
+
            <ul class="dropdown-menu">
+
<button class="navbar-toggle" type="button" data-toggle="collapse" data-target=".navbar-responsive-collapse">
                <li><a href="https://2017.igem.org/Team:OUC-China/Team">Members</a></li>
+
        <span class="sr-only">Toggle Navigation</span>
                <li><a href="#">Collaborations</a></li>
+
        <span class="caret" style="color: white"></span>
                <li><a href="#">Attributions</a></li>
+
 
            </ul>
+
      </button>
        </li>
+
<a href="https://2017.igem.org/Team:OUC-China"><img src="https://static.igem.org/mediawiki/2017/8/89/T--OUC-China--logo.jpg" height="50px"/></a></div>
        <li class="dropdown">
+
            <a href="#" data-toggle="dropdown" class="dropdown-toggle ouc-nav-a">Project<spam class="caret"></span></a>
+
            <ul class="dropdown-menu">
+
<div class="collapse navbar-collapse navbar-responsive-collapse" style="padding: 0">
                <li><a href="#">Description</a></li>
+
                <li><a href="#">Design</a></li>
+
                 <li><a href="#">Experiments</a></li>
+
                <li><a href="#">Results</a></li>
+
<div class="col-md-1" style="padding: 0"></div>
                <li><a href="https://2017.igem.org/Team:OUC-China/InterLab">Interlab</a></li>
+
<div class="col-md-1 ouc-navbar" style="padding: 0">
                <li><a href="https://2017.igem.org/Team:OUC-China/Notebook" >Notebook</a></li>
+
    <a href="##" style="line-height: 50px;text-align: center" class="ouc-nav">Team<span class="caret"></span></a>
            </ul>
+
    <div class="ouc-down" style=" width: 100%; text-align: center">
        </li>
+
    <div><a href="https://2017.igem.org/Team:OUC-China/Team" style="line-height: 40px; " class="ouc-navdown">Members</a></div>
        <li><a href="#" class="ouc-nav-a">Model</a></li>
+
    <div><a href="https://2017.igem.org/Team:OUC-China/Collaborations" style="line-height: 40px; " class="ouc-navdown">Collaborations</a></div>
        <li><a href="#" class="ouc-nav-a">Parts</a></li>
+
    <div><a href="https://2017.igem.org/Team:OUC-China/Attributions" style="line-height: 40px; " class="ouc-navdown">Attributions</a></div>
        <li><a href="#" class="ouc-nav-a">Safety</a></li>
+
    </div>
        <li><a href="#" class="ouc-nav-a">Human Practice</a></li>
+
</div>
    </ul>
+
<div class="col-md-1 ouc-navbar" style="padding: 0">
 +
    <a href="##" style="line-height: 50px;text-align: center" class="ouc-nav">Project<span class="caret"></span></a>
 +
    <div class="ouc-down" style=" width: 100%; text-align: center">
 +
    <div><a href="https://2017.igem.org/Team:OUC-China/Description" style="line-height: 40px; " class="ouc-navdown">Description</a></div>
 +
    <div><a href="https://2017.igem.org/Team:OUC-China/Design" style="line-height: 40px; " class="ouc-navdown">Design</a></div>
 +
                 <div class="ouc-right">
 +
        <a style="line-height: 40px; font-size: 15px;" class="ouc-navdown" href="https://2017.igem.org/Team:OUC-China/proof1">Proof of concept</a>
 +
        <div class="ouc-rightnav">
 +
        <a href="https://2017.igem.org/Team:OUC-China/proof1" style="display: block">Basic fermentation</a>
 +
        <a href="https://2017.igem.org/Team:OUC-China/proof2" style="display: block">Adhesion platform</a>
 +
        <a href="https://2017.igem.org/Team:OUC-China/proof3" style="display: block">MINI-GRE</a>
 +
        </div>
 +
    </div>
 +
    <div><a href="https://2017.igem.org/Team:OUC-China/Demonstrate" style="line-height: 40px; " class="ouc-navdown">Demonstration</a></div>
 +
    <div><a href="https://2017.igem.org/Team:OUC-China/InterLab" style="line-height: 40px; " class="ouc-navdown">InterLab</a></div>
 +
    <div><a href="https://2017.igem.org/Team:OUC-China/Improve" style="line-height: 40px; " class="ouc-navdown">Improvement</a></div>
 +
    <div><a href="https://2017.igem.org/Team:OUC-China/Notebook" style="line-height: 40px; " class="ouc-navdown">Notebook</a></div>
 +
    </div>
 +
</div>
 +
<div class="col-md-1" style="padding: 0"><a href="https://2017.igem.org/Team:OUC-China/Model" style="line-height: 50px;text-align: center" class="ouc-nav">Model</a></div>
 +
<div class="col-md-1" style="padding: 0"><a href="https://2017.igem.org/Team:OUC-China/Parts" style="line-height: 50px;text-align: center" class="ouc-nav">Parts</a></div>
 +
<div class="col-md-1" style="padding: 0"><a href="https://2017.igem.org/Team:OUC-China/Safety" style="line-height: 50px;text-align: center" class="ouc-nav">Safety</a></div>
 +
<div class="col-md-2 ouc-navbar" style="padding: 0">
 +
    <a href="https://2017.igem.org/Team:OUC-China/Engagement" style="line-height: 50px;text-align: center" class="ouc-nav">Human Practice<span class="caret"></span></a>
 +
    <div class="ouc-down" style=" width: 100%; text-align: center">
 +
    <div><a href="https://2017.igem.org/Team:OUC-China/HumanPractice" style="line-height: 40px; " class="ouc-navdown">Overview</a></div>
 +
    <div><a href="https://2017.igem.org/Team:OUC-China/HP/Silver" style="line-height: 40px; " class="ouc-navdown">Silver</a></div>
 +
    <div><a href="https://2017.igem.org/Team:OUC-China/HP/Gold_Integrated" style="line-height: 40px; " class="ouc-navdown">Gold and integrated</a></div>
 +
    <div><a href="https://2017.igem.org/Team:OUC-China/Engagement" style="line-height: 40px; " class="ouc-navdown">Engagement</a></div>
 +
    </div>
 +
</div>
 +
<div class="col-md-2" style="padding: 0"></div>
 +
 +
 +
</div>
 +
 +
 +
 +
 +
</div>
 
</div>
 
</div>
 
<!--此处是导航-->
 
<!--此处是导航-->
Line 69: Line 122:
 
         <h1><strong>Education and public engagement</strong></h1>
 
         <h1><strong>Education and public engagement</strong></h1>
 
     </div>
 
     </div>
     <h3 class="ouc-heading"><strong>Comic book of synthetic biology</strong></h3>
+
     <h2 class="ouc-heading"><strong>Comic book of synthetic biology</strong></h2>
 
     <p style="font-size: 20px">
 
     <p style="font-size: 20px">
 
     This year we use a novel method to teach people synthetic biology and spread scientific thinking so that we spent half a year designing a comic book of Synthetic Biology, which illustrate it in a vivid way in order to propagandize to the public and show our love for the Synthetic Biology.  
 
     This year we use a novel method to teach people synthetic biology and spread scientific thinking so that we spent half a year designing a comic book of Synthetic Biology, which illustrate it in a vivid way in order to propagandize to the public and show our love for the Synthetic Biology.  
 +
    </p>
 +
    <p style="text-align: center">
 +
    <img src="https://static.igem.org/mediawiki/2017/a/a7/T--OUC-China--hp6-1.jpg"/>
 
     </p>
 
     </p>
 
     <p style="font-size: 20px">
 
     <p style="font-size: 20px">
Line 79: Line 135:
 
     Maybe other team could work with such form too.
 
     Maybe other team could work with such form too.
 
     </p>
 
     </p>
     <p style="text-align: center">
+
<div class="container">
    <img src="https://static.igem.org/mediawiki/2017/a/a7/T--OUC-China--hp6-1.jpg"/>
+
<h1 style="text-align:center;color: #EDEC8C">Click And See Our Comic Online !</h1>
    </p>
+
     <div class="row">
    <a href="##">Click here to see part of our comic</a>
+
<div class="col-md-4" style="text-align:center; color:gray;font-size:20px">
 +
<a href="https://static.igem.org/mediawiki/2017/9/95/T--OUC-China--chapter1.pdf"><img src="https://static.igem.org/mediawiki/2017/b/bc/T--OUC-China--edu1.jpg" class="ouc-chapter"/></a>
 +
<br/>Chapter 1
 +
</div>
 +
 
 +
<div class="col-md-4" style="text-align:center; color:gray;font-size:20px">
 +
<a href="https://static.igem.org/mediawiki/2017/5/5d/T--OUC-China--chapter2.pdf"><img src="https://static.igem.org/mediawiki/2017/9/97/T--OUC-China--edu2.png" class="ouc-chapter"/></a>
 +
<br/>Chapter 2
 +
</div>
 +
 
 +
<div class="col-md-4" style="text-align:center; color:gray;font-size:20px">
 +
<a href="https://static.igem.org/mediawiki/2017/1/1e/T--OUC-China--chapter3.pdf"><img src="https://static.igem.org/mediawiki/2017/5/54/T--OUC-China--edu3.jpg" class="ouc-chapter"/></a>
 +
<br/>Chapter 3
 +
</div>
 +
 
 +
</div>
 +
 
 +
<br/>
 +
<div class="row">
 +
<div class="col-md-4" style="text-align:center; color:gray;font-size:20px">
 +
<a href="https://static.igem.org/mediawiki/2017/e/e4/T--OUC-China--chapter4.pdf"><img src="https://static.igem.org/mediawiki/2017/7/78/T--OUC-China--edu4.jpg" class="ouc-chapter"/></a>
 +
<br/>Chapter 4
 +
</div>
 +
 
 +
<div class="col-md-4" style="text-align:center; color:gray;font-size:20px">
 +
<a href="https://static.igem.org/mediawiki/2017/7/76/T--OUC-China--chapter5.pdf"><img src="https://static.igem.org/mediawiki/2017/b/b9/T--OUC-China--edu5.png" class="ouc-chapter"/></a>
 +
<br/>Chapter 5
 +
</div>
 +
 
 +
<div class="col-md-4" style="text-align:center; color:gray;font-size:20px">
 +
<a href="https://static.igem.org/mediawiki/2017/8/8f/T--OUC-China--chapter_6.pdf"><img src="https://static.igem.org/mediawiki/2017/b/b6/T--OUC-China--edu6.png" class="ouc-chapter"/></a>
 +
<br/>Chapter 6
 +
</div>
 +
</div>
 +
 
 +
</div>
 +
 
 +
 
 
      
 
      
     <h3 class="ouc-heading"><strong>Life science and technology camp</strong></h3>
+
     <h2 class="ouc-heading"><strong>Life science and technology camp</strong></h2>
 
     <p style="font-size: 20px">
 
     <p style="font-size: 20px">
 
     We cooperated with other colleges to organize a summer camp, spreading our ideas to freshmen and sophomores.
 
     We cooperated with other colleges to organize a summer camp, spreading our ideas to freshmen and sophomores.
Line 102: Line 195:
 
     <p style="font-size: 20px; ">
 
     <p style="font-size: 20px; ">
 
         <br/><br/>
 
         <br/><br/>
     Our summer camp, a week of life science experience, is mainly for the freshman from four colleges who will communicate with each other in some interesting activities including classifying marine organisms in in the intertidal zone of the sea, salvaging Enteromorpha and other algae, extracting marine luminous bacteria.
+
     Our summer camp, a week of life science experience, is mainly for the freshman from four colleges who will communicate with each other in some interesting activities including classifying marine organisms in the intertidal zone of the sea, salvaging <i>Enteromorpha</i> and other algae, extracting marine luminous bacteria.
 
     </p>
 
     </p>
 
    
 
    
Line 110: Line 203:
 
      
 
      
 
     <p style="font-size: 20px">
 
     <p style="font-size: 20px">
     They also did several scientific research with independent design by themselves. The main purpose of the summer camp is to inspire college students to develop their own ability to find their own interests and to improve their learning methods, moreover, to know the spirit of independent thinking.
+
     They also did several scientific researches with independent design by themselves. The main purpose of the summer camp is to inspire college students to develop their own ability to find their own interests and to improve their learning methods, moreover, to know the spirit of independent thinking.
 
     </p>
 
     </p>
 
     <div class="row">
 
     <div class="row">
     <div class="col-md-6" style="text-align: center;">
+
     <div class="col-md-6" style="text-align: center;">
     <img src="https://static.igem.org/mediawiki/2017/8/8f/T--OUC-China--hp6-3.jpg" width="300"/>
+
     <img src="https://static.igem.org/mediawiki/2017/a/a3/T--OUC-China--hp6-5.jpg" height="300px"/>
 
     </div>
 
     </div>
    <div class="col-md-6" style="text-align: center;">
+
        <div class="col-md-6" style="text-align:center">
    <img src="https://static.igem.org/mediawiki/2017/a/a3/T--OUC-China--hp6-5.jpg" width="300"/>
+
<img src="https://static.igem.org/mediawiki/2017/7/7e/T--OUC-China--hplast.png" height="300px"/>
    </div>
+
</div>
    </div>
+
</div>  
 
     <p style="font-size: 20px">
 
     <p style="font-size: 20px">
 
This year is the first year for SDU-China to participate in iGEM, they came to the summer camp to communicate with us, and we also get some interdispline knowledge from them.   
 
This year is the first year for SDU-China to participate in iGEM, they came to the summer camp to communicate with us, and we also get some interdispline knowledge from them.   
Line 133: Line 226:
 
      
 
      
 
      
 
      
     <h3 class="ouc-heading"><strong>Lectures on popular science among primary and middle school students</strong></h3>
+
     <h2 class="ouc-heading"><strong>Lectures on popular science among primary and middle school students</strong></h2>
 
     <p style="font-size: 20px">
 
     <p style="font-size: 20px">
 
     Furthermore, in order to introduce iGEM and Synthetic Biology, we held a series of lectures in local colleges and middle schools, bringing related knowledge to the middle school students, consisting of development of biotechnology and synthetic biology in the fields of medicine, agriculture and environment protection.
 
     Furthermore, in order to introduce iGEM and Synthetic Biology, we held a series of lectures in local colleges and middle schools, bringing related knowledge to the middle school students, consisting of development of biotechnology and synthetic biology in the fields of medicine, agriculture and environment protection.
Line 162: Line 255:
 
     </div>
 
     </div>
 
     </div>
 
     </div>
     <h3 class="ouc-heading"><strong>Social media</strong></h3>
+
     <h2 class="ouc-heading"><strong>Social media</strong></h2>
 
     <p style="font-size: 20px">
 
     <p style="font-size: 20px">
 
     We spread iGEM spirits and the development of synthetic biology in China through social media.
 
     We spread iGEM spirits and the development of synthetic biology in China through social media.

Latest revision as of 14:06, 18 November 2017

education

Comic book of synthetic biology

This year we use a novel method to teach people synthetic biology and spread scientific thinking so that we spent half a year designing a comic book of Synthetic Biology, which illustrate it in a vivid way in order to propagandize to the public and show our love for the Synthetic Biology.

In addition, we believed that letting more people such as teens in school know about Synthetic Biology in the form of a story, which exhibits the complex biology model and principle with funny comics, will make public more interested in Biology.

Maybe other team could work with such form too.

Click And See Our Comic Online !


Chapter 1

Chapter 2

Chapter 3


Chapter 4

Chapter 5

Chapter 6

Life science and technology camp

We cooperated with other colleges to organize a summer camp, spreading our ideas to freshmen and sophomores.



Our summer camp, a week of life science experience, is mainly for the freshman from four colleges who will communicate with each other in some interesting activities including classifying marine organisms in the intertidal zone of the sea, salvaging Enteromorpha and other algae, extracting marine luminous bacteria.

They also did several scientific researches with independent design by themselves. The main purpose of the summer camp is to inspire college students to develop their own ability to find their own interests and to improve their learning methods, moreover, to know the spirit of independent thinking.

This year is the first year for SDU-China to participate in iGEM, they came to the summer camp to communicate with us, and we also get some interdispline knowledge from them.

In the future, we look forward to attracting more colleges and their students to join in,providing them more resources and experience.

Lectures on popular science among primary and middle school students

Furthermore, in order to introduce iGEM and Synthetic Biology, we held a series of lectures in local colleges and middle schools, bringing related knowledge to the middle school students, consisting of development of biotechnology and synthetic biology in the fields of medicine, agriculture and environment protection.

We exhibit iGEM competitions, synthetic biology, and our projects at the university's Science and Technology exhibition to make students of different majors know about synthetic biology. Luckily, we also introduced our team and iGEM to our national Vice Premier Liu Yandong and she gave us great encouragement and affirmation.

Social media

We spread iGEM spirits and the development of synthetic biology in China through social media.





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