Difference between revisions of "Team:FJNU-China/Overview"

 
(31 intermediate revisions by 3 users not shown)
Line 1: Line 1:
 
{{FJNU-China}}
 
{{FJNU-China}}
 
<html>
 
<html>
<style>
 
  
 
+
<link rel="stylesheet" type="text/css" href="https://2018.igem.org/Template:FJNU-China/CSS/default?action=raw&amp;ctype=text/css
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,p,blockquote,th,td { margin:0; padding:0; }
+
">
body { background:#fff; color:#555; font-size:14px; font-family: Verdana, Arial, Helvetica, sans-serif; }
+
td,th,caption { font-size:14px; }
+
h1, h2, h3, h4, h5, h6 { font-weight:normal; font-size:100%; }
+
address, caption, cite, code, dfn, em, strong, th, var { font-style:normal; font-weight:normal;}
+
a { color:#555; text-decoration:none; }
+
a:hover { text-decoration:underline; }
+
img { border:none; }
+
ol,ul,li { list-style:none; }
+
input, textarea, select, button { font:14px Verdana,Helvetica,Arial,sans-serif; }
+
table { border-collapse:collapse; }
+
html {overflow-y: scroll;}
+
 
+
.clearfix:after {content: "."; display: block; height:0; clear:both; visibility: hidden;}
+
.clearfix { *zoom:1; }
+
 
+
 
+
 
+
 
+
 
+
.igem_2018_team_menu.displaying_menu{display:none !important;}
+
body {
+
            height: 100%;
+
            width: 100%;
+
            background-color: transparent !important;
+
        }
+
        #globalWrapper {
+
            margin: 0;
+
            padding: 0;
+
          font-size:100% !important;
+
        }
+
        #content {
+
            width: 100%;
+
            padding: 0;
+
            margin: -12px 0 0;
+
            background-color: transparent !important;
+
        }
+
 
+
        #top_title {
+
            display: none;
+
        }
+
.igem_2018_team_content{
+
  background-color: transparent !important;
+
}
+
#content{
+
color:white !important;
+
}
+
 
+
.igem_2018_team_content
+
.igem_2018_team_column_wrapper
+
{
+
+
font-weight:nomal !important;
+
text-decoration:none !important;
+
height: 0px !important;
+
clear: none!important;
+
}
+
.igem_2018_team_content
+
.igem_2018_team_column_wrapper p{
+
font-size: 100%  !important;
+
color: white !important;
+
padding: 0px !important;
+
}
+
.igem_2018_team_column_wrapper h2
+
.igem_2018_team_content
+
.igem_2018_team_column_wrapper h3
+
.igem_2018_team_content
+
.igem_2018_team_column_wrapper h4
+
.igem_2018_team_content
+
.igem_2018_team_column_wrapper h5 {
+
 
+
color: white !important;
+
padding: 0px  !important;
+
}
+
.clear
+
.extra_space{
+
display: float!important;
+
}
+
 
+
ul{
+
list-style-type:none !important;
+
list-style-image:none !important;
+
}
+
 
+
.igem_2018_team_mobile_bar{
+
display: none !important;
+
}
+
 
+
.clear .extra_space{
+
display: none !important;
+
}
+
#globalWrapper{
+
width: auto !important;
+
}
+
 
+
.igem_2018_team_content .igem_2018_team_column_wrapper a{
+
text-decoration: none!important;
+
text-decoration-color: none !important;
+
}
+
.igem_2018_team_content .igem_2018_team_column_wrapper ul{
+
font-size: 120% !important;
+
padding: 0 0 0 0 !important;
+
}
+
.intro .main-nav ul.main-menu li ul.dropdown-menu{
+
background:rgba(243,243,243,0.6)  none repeat scroll 0 0 !important;
+
}
+
 
+
#bodyContent a{
+
background: normal!important;
+
+
}
+
h3{
+
overflow: visible !important;
+
}
+
.igem_2018_team_content{
+
width: 100% !important;
+
}
+
.container{
+
width: auto !important;
+
}
+
.mw-content-ltr {
+
margin: 0 auto !important;
+
}
+
 
+
#navbar-collapse{
+
padding-right:auto;
+
}
+
.mw-content-ltr ol{
+
margin: auto !important;
+
}
+
.carousel-indicators{
+
width: auto !important;
+
}
+
h1,h2,h3,h4,h5,h6{
+
border-bottom:0px !important;
+
}
+
</style>
+
 
<link rel="stylesheet" type="text/css" href="https://2018.igem.org/Template:FJNU-China/CSS/bootstrap-min?action=raw&amp;ctype=text/css
 
<link rel="stylesheet" type="text/css" href="https://2018.igem.org/Template:FJNU-China/CSS/bootstrap-min?action=raw&amp;ctype=text/css
 
">
 
">
Line 154: Line 17:
 
">
 
">
  
 +
<!--gallery-->
 +
<link rel="stylesheet" type="text/css" href="https://2018.igem.org/Template:FJNU-China/CSS/gallery?action=raw&amp;ctype=text/css
 +
">
  
 
<body>
 
<body>
<!-- 导航栏 -->
+
<!-- 导航栏 -->
 
<section class="intro">
 
<section class="intro">
  
 
<div class="main-nav" style="margin-top:-80px; ">
 
<div class="main-nav" style="margin-top:-80px; ">
<nav class="navbar" id="main-navbar">
+
<nav class="navbar" id="main-navbar">
 
<div class="container">
 
<div class="container">
 
<div class="row">
 
<div class="row">
Line 172: Line 38:
 
<span class="icon-bar"></span>
 
<span class="icon-bar"></span>
 
</button>  
 
</button>  
<div style="float:left;">
+
<a class="navbar-brand" href="https://2018.igem.org/Team:FJNU-China""><img src="https://static.igem.org/mediawiki/2018/9/9d/T--FJNU-China--index_logo.png"  width="100px" height="80px" alt="FJNU-China " style="margin-top: -5px !important;"></a>
<a class="navbar-brand" href="https://2018.igem.org/Team:FJNU-China""><img src="https://static.igem.org/mediawiki/2018/9/9d/T--FJNU-China--index_logo.png" alt="FJNU-China" style="margin-top: -5px !important;"></a></div>
+
 
</div>
 
</div>
<div class="collapse navbar-collapse nopadding" id="navbar-collapse "  style="folat:left !important;">
+
<div class="collapse navbar-collapse nopadding" id="navbar-collapse">
 
<ul class="nav navbar-nav main-menu">
 
<ul class="nav navbar-nav main-menu">
 
<li class="clearfix"><a href="https://2018.igem.org/Team:FJNU-China">Home</a></li>
 
<li class="clearfix"><a href="https://2018.igem.org/Team:FJNU-China">Home</a></li>
<li class="clearfix"><a href="https://2018.igem.org/Team:FJNU-China/Team">Team</a>
+
<li class="clearfix"><a href="#">Team</a>
 
<ul class="dropdown-menu">
 
<ul class="dropdown-menu">
<li><a href="https://2018.igem.org/Team:FJNU-China/Team">About us</a></li>
+
<li><a href="https://2018.igem.org/Team:FJNU-China/Team">About us</a></li>
<li><a href="https://2018.igem.org/Team:FJNU-China/Attributions">Attributions</a></li>
+
<li><a href="https://2018.igem.org/Team:FJNU-China/Attributions">Attributions</a></li>
+
<li><a href="https://2018.igem.org/Team:FJNU-China/Gallery">Gallery</a></li>
</ul>
+
</ul>
</li>
+
</li>
<li class="active"><a href="https://2018.igem.org/Team:FJNU-China/Description">Projects</a>
+
<li class="clearfix"><a href="#">Projects</a>
 
<ul class="dropdown-menu">
 
<ul class="dropdown-menu">
<li><a href="https://2018.igem.org/Team:FJNU-China/Description">Description</a></li>
+
<li><a href="https://2018.igem.org/Team:FJNU-China/Description">Description</a></li>
 +
<li ><a href="https://2018.igem.org/Team:FJNU-China/Design">Design</a></li>
 +
<li ><a href="https://2018.igem.org/Team:FJNU-China/Result">Results</a></li>
 +
<li><a href="https://2018.igem.org/Team:FJNU-China/Applied_Design">Application</a></li>
 +
<li><a href="https://2018.igem.org/Team:FJNU-China/Demonstrate">Demonstrate</a></li>
 
 
<li><a href="https://2018.igem.org/Team:FJNU-China/Description">Demonstrate</a></li>
+
</ul>
<li><a href="https://2018.igem.org/Team:FJNU-China/Model">Model</a></li>
+
</li>
 +
<li class="clearfix"><a href="https://2018.igem.org/Team:FJNU-China/Model">Model</a></li>
 +
<li class="clearfix"><a href="#">Laboratory</a>
 +
<ul class="dropdown-menu">
 
<li><a href="https://2018.igem.org/Team:FJNU-China/Notebook">Notebook</a></li>
 
<li><a href="https://2018.igem.org/Team:FJNU-China/Notebook">Notebook</a></li>
<li><a href="https://2018.igem.org/Team:FJNU-China/InterLab">InterLab</a></li>
+
<li><a href="https://2018.igem.org/Team:FJNU-China/InterLab">InterLab</a></li>
 
+
<li><a href="https://2018.igem.org/Team:FJNU-China/Safety">Safety</a></li>
<li><a href="https://2018.igem.org/Team:FJNU-China/Safety">Safety</a></li> </ul>
+
</ul>
 
</li>
 
</li>
<li class=""><a href="https://2018.igem.org/Team:FJNU-China/Result">Results</a></li>
+
<li class="clearfix"><a href="https://2018.igem.org/Team:FJNU-China/Parts">Parts</a>
+
<li class="clearfix"><a href="#">Parts</a>
 
<ul class="dropdown-menu">
 
<ul class="dropdown-menu">
<li><a href="https://2018.igem.org/Team:FJNU-China/Basic_Part">Basic_Part</a></li>
+
<li><a href="https://2018.igem.org/Team:FJNU-China/Basic_Part">Basic Part</a></li>
<li><a href="https://2018.igem.org/Team:FJNU-China/Improve ">Improve </a></li>
+
<li><a href="https://2018.igem.org/Team:FJNU-China/Composite_Part">Composite Part</a></li>
 +
<li><a href="https://2018.igem.org/Team:FJNU-China/Improve">Improve</a></li>
 +
<li><a href="https://2018.igem.org/Team:FJNU-China/Parts">Part List</a></li>
 
</ul>
 
</ul>
</li>
+
</li>
<li class="clearfix"><a href="https://2018.igem.org/Team:FJNU-China/Human_Practices">HP</a>
+
<ul class="dropdown-menu">
+
<li><a href="https://2018.igem.org/Team:FJNU-China/Overview">Overview</a></li>
+
<li><a href="https://2018.igem.org/Team:FJNU-China/Intergrated-Sliver ">Engagement&amp;<br>Public Education</a></li>
+
<li><a href="https://2018.igem.org/Team:FJNU-China/Intergrated-Gold">Intergrated HP</a></li>
+
 
 
 +
<li class="active"><a href="#">HP</a>
 +
<ul class="dropdown-menu">
 +
<li><a href="https://2018.igem.org/Team:FJNU-China/Overview">Overview</a></li>
 +
                                <li><a href="https://2018.igem.org/Team:FJNU-China/Human_Practices">Intergrated HP</a></li>
 +
<li><a href="https://2018.igem.org/Team:FJNU-China/Public_Engagement">Engagement&amp;<br>Public Education</a></li>
 
<li><a href="https://2018.igem.org/Team:FJNU-China/Collaborations">Collaborations</a></li>
 
<li><a href="https://2018.igem.org/Team:FJNU-China/Collaborations">Collaborations</a></li>
 
 
</ul>
 
</ul>
 
</li>
 
</li>
 +
 +
 +
 
<li class=""><a href="https://2018.igem.org/Team:FJNU-China/Medals">Medals</a></li>
 
<li class=""><a href="https://2018.igem.org/Team:FJNU-China/Medals">Medals</a></li>
  
Line 230: Line 106:
 
</section>
 
</section>
  
 +
<!-- Human practices -->
 +
<!-- click-->
  
 
+
<link rel="stylesheet" href="https://2018.igem.org/Template:FJNU-China/CSS/click?action=raw&ctype=text/css
<!--Overview -->
+
">
<style type="text/css">
+
 
+
 
+
/*click*/
+
.content {
+
  display: flex;
+
  margin: 0 auto;
+
  justify-content: center;
+
  align-items: center;
+
  flex-wrap: wrap;
+
  max-width: 1000px;
+
}
+
 
+
.heading {
+
  width: 100%;
+
  margin-left: 1rem;
+
  font-weight: 900;
+
  font-size: 1.618rem;
+
  text-transform: uppercase;
+
  letter-spacing: .1ch;
+
  line-height: 1;
+
  padding-bottom: .5em;
+
  margin-bottom: 1rem;
+
  position: relative;
+
}
+
.heading:after {
+
  display: block;
+
  content: '';
+
  position: absolute;
+
  width: 60px;
+
  height: 4px;
+
  background: linear-gradient(135deg, #1a9be6, #1a57e6);
+
  bottom: 0;
+
}
+
 
+
.description {
+
  width: 100%;
+
  margin-top: 0;
+
  margin-left: 1rem;
+
  margin-bottom: 3rem;
+
}
+
 
+
.card {
+
  color: inherit;
+
  cursor: pointer;
+
  width: calc(33% - 2rem);
+
  min-width: calc(33% - 2rem);
+
  height: 400px;
+
  min-height: 400px;
+
  perspective: 1000px;
+
  margin: 1rem;
+
  position: relative;
+
}
+
@media screen and (max-width: 800px) {
+
  .card {
+
    width: calc(50% - 2rem);
+
  }
+
}
+
@media screen and (max-width: 500px) {
+
  .card {
+
    width: 100%;
+
  }
+
}
+
 
+
.front,
+
.back {
+
  display: flex;
+
  border-radius: 6px;
+
  background-position: center;
+
  background-size: cover;
+
  text-align: center;
+
  justify-content: center;
+
  align-items: center;
+
  position: absolute;
+
  height: 100%;
+
  width: 100%;
+
  -webkit-backface-visibility: hidden;
+
  backface-visibility: hidden;
+
  transform-style: preserve-3d;
+
  transition: ease-in-out 600ms;
+
}
+
 
+
.front {
+
  background-size: cover;
+
  padding: 2rem;
+
  font-size: 1.618rem;
+
  font-weight: 600;
+
  color: #fff;
+
  overflow: hidden;
+
  font-family: Poppins, sans-serif;
+
}
+
.front:before {
+
  position: absolute;
+
  display: block;
+
  content: '';
+
  top: 0;
+
  left: 0;
+
  right: 0;
+
  bottom: 0;
+
  background: linear-gradient(135deg, #1a9be6, #1a57e6);
+
  opacity: .25;
+
  z-index: -1;
+
}
+
.card:hover .front {
+
  transform: rotateY(180deg);
+
}
+
.card:nth-child(even):hover .front {
+
  transform: rotateY(-180deg);
+
}
+
 
+
.back {
+
  background: #fff;
+
  transform: rotateY(-180deg);
+
  padding: 0 2em;
+
}
+
.card:hover .back {
+
  transform: rotateY(0deg);
+
}
+
.card:nth-child(even) .back {
+
  transform: rotateY(180deg);
+
}
+
.card:nth-child(even):hover .back {
+
  transform: rotateY(0deg);
+
}
+
 
+
.button {
+
  transform: translateZ(40px);
+
  cursor: pointer;
+
  -webkit-backface-visibility: hidden;
+
  backface-visibility: hidden;
+
  font-weight: bold;
+
  color: #fff;
+
  padding: .5em 1em;
+
  border-radius: 100px;
+
  font: inherit;
+
  background: linear-gradient(135deg, #1a9be6, #1a57e6);
+
  border: none;
+
  position: relative;
+
  transform-style: preserve-3d;
+
  transition: 300ms ease;
+
}
+
.button:before {
+
  transition: 300ms ease;
+
  position: absolute;
+
  display: block;
+
  content: '';
+
  transform: translateZ(-40px);
+
  -webkit-backface-visibility: hidden;
+
  backface-visibility: hidden;
+
  height: calc(100% - 20px);
+
  width: calc(100% - 20px);
+
  border-radius: 100px;
+
  left: 10px;
+
  top: 16px;
+
  box-shadow: 0 0 10px 10px rgba(26, 87, 230, 0.25);
+
  background-color: rgba(26, 87, 230, 0.25);
+
}
+
.button:hover {
+
  transform: translateZ(55px);
+
}
+
.button:hover:before {
+
  transform: translateZ(-55px);
+
}
+
.button:active {
+
  transform: translateZ(20px);
+
}
+
.button:active:before {
+
  transform: translateZ(-20px);
+
  top: 12px;
+
}
+
 
+
 
+
      </style>
+
 
+
 
<div class="container">
 
<div class="container">
 
  <h1 style="text-align: center;margin-top: 100px;">Human practices</h1>
 
  <h1 style="text-align: center;margin-top: 100px;">Human practices</h1>
     <div class="row"  style="background-color:rgba(243,243,243,0.4); font-size: 20px; padding: 0 20 0 20;width:85% !important; margin:0 auto !important;-moz-box-shadow: 2px 2px 10px #909090;
+
     <div class="row"  style="background-color:rgba(243,243,243,0.4); font-size: 20px; padding: 0 20 0 20;width:75% !important; margin:0 auto !important;-moz-box-shadow: 2px 2px 10px #909090;
 
-webkit-box-shadow: 2px 2px 10px #909090;
 
-webkit-box-shadow: 2px 2px 10px #909090;
 
box-shadow:2px 2px 10px #909090;border-radius:10px;">
 
box-shadow:2px 2px 10px #909090;border-radius:10px;">
Line 415: Line 119:
 
         <div class="col-xs-12 col-xs-12 col-sm-12"  style="width: 95%; margin-left: 40px;">
 
         <div class="col-xs-12 col-xs-12 col-sm-12"  style="width: 95%; margin-left: 40px;">
 
             <h2 >Overview</h2>
 
             <h2 >Overview</h2>
             <p style="margin-left: 20px;">As we know, the purpose of modeling is mainly to provide guidance and solve problems for the team experiment. So, before we designed the model, we sorted out some of the problems the team was facing. Based on these three problems,.Because The effect of PLA concentration on the quantity Staphylococcus epidermidis.Vestibulum quis quam ut magna consequat faucibus. Pellentesque eget nisi a mi suscipit tincidunt. Ut tempus dictum risus. Pellentesque viverra sagittis quam at mattis. Suspendisse potenti. Aliquam sit amet gravida nibh, facilisis gravida odio. Phasellus auctor velit at lacus blandit, commodo iaculis justo viverra. Etiam vitae est arcu.
+
             <p>
 +
&nbsp;&nbsp;&nbsp;&nbsp;As Peter Carr says,"Human Practices is the study of how your work affects the world, and how the world affects your work". We think,the iGEM is colorful, and we should combine science with the society, towards our vision of a healthier, greener and sustainable world. This year, we mainly focus on infectious microbes and unpleasant smell in external environment waste beaker, and internal environment armpit. Throughout our project, we interviewed some related stakeholders, consulted with experts of different aspects and communicated with common people to evaluate our project and get some feedback to improve it. What’s more, it’s an public engagement and education that we aim to show the magic and applications of synthetic biology.
 
</p>
 
</p>
 
             <hr>
 
             <hr>
 
 
<div class="content">
 
<div class="content">
  
        <a class="card" href="https://2018.igem.org/Team:FJNU-China/Intergrated-Sliver">
+
<a class="card" href="https://2018.igem.org/Team:FJNU-China/Human_Practices">
     <div class="front" style="background-image: url(../img/560.jpg);">
+
     <div class="front" style="background-image: url(https://static.igem.org/mediawiki/2018/7/77/T--FJNU-China--overview-2.png);">
       <p style="font-size: 40px;">Engagement<br>&amp;<br>Public Education</p>
+
       <p style="font-size: 40px;text-align:center;">Intergrated </br>Human Practices</p>
 
     </div>
 
     </div>
 
     <div class="back">
 
     <div class="back">
 
       <div>
 
       <div>
         <p>Consectetur adipisicing elit. Possimus, praesentium?</p>
+
     
        <p>Provident consectetur natus voluptatem quis tenetur sed beatae eius sint.</p>
+
         <p style="line-height:1.2em !important; text-align:left !important; margin-left:15px; ">&nbsp;&nbsp;&nbsp;&nbsp;It is very important to societal considerations throughout the design and execution in our project. So we set up good dialogues with stakeholders and continuously sought input from experts in different fileds. Also we put safety into consideration.</p>
         <button class="button">Click Here</button>
+
         <button class="button" >Click Here</button>
 
       </div>
 
       </div>
     </div>
+
     </div></a>
  </a>
+
  
  <a class="card" href="https://2018.igem.org/Team:FJNU-China/Intergrated-Gold">
+
        <a class="card" href="https://2018.igem.org/Team:FJNU-China/Public_Engagement">
     <div class="front" style="background-image: url(../img/559.jpg);">
+
     <div class="front" style="background-image: url(https://static.igem.org/mediawiki/2018/1/18/T--FJNU-China--overview-1.png);">
       <p style="font-size: 40px;">Intergrated HP</p>
+
       <p style="font-size: 40px;text-align:center;">Engagement<br>&amp;<br>Public Education</p>
 
     </div>
 
     </div>
 
     <div class="back">
 
     <div class="back">
 
       <div>
 
       <div>
         <p>Consectetur adipisicing elit. Possimus, praesentium?</p>
+
   
        <p>Provident consectetur natus voluptatem quis tenetur sed beatae eius sint.</p>
+
         <p style="line-height:1.2em !important; text-align:left !important;  margin-left:15px;">&nbsp;&nbsp;&nbsp;&nbsp;We held a summer camp about synthetic biology and public activities to show our motivation and the magic of the applications of synthetic biology. Based on our project, we made a handbook to popularize the bacteriostatic knowledge and have more people to know about us.</p>
         <button class="button" >Click Here</button>
+
         <button class="button">Click Here</button>
 
       </div>
 
       </div>
     </div></a>
+
     </div>
 +
  </a>
 +
 
 +
 
 
   <a class="card" href="https://2018.igem.org/Team:FJNU-China/Collaborations">
 
   <a class="card" href="https://2018.igem.org/Team:FJNU-China/Collaborations">
     <div class="front" style="background-image: url(../img/567.jpg);">
+
     <div class="front" style="background-image: url(https://static.igem.org/mediawiki/2018/c/ce/T--FJNU-China--overview-3.png);">
       <p style="font-size: 40px;">Collaboration</p>
+
       <p style="font-size: 40px;text-align:center;">Collaboration</p>
 
     </div>
 
     </div>
 
     <div class="back">
 
     <div class="back">
 
       <div>
 
       <div>
         <p>Consectetur adipisicing elit. Possimus, praesentium?</p>
+
   
        <p>Provident consectetur natus voluptatem quis tenetur sed beatae eius sint.</p>
+
         <p style="line-height:1.2em !important; text-align:left !important;  margin-left:15px;">&nbsp;&nbsp;&nbsp;&nbsp; During the course of our project,we have built up good friendships and keep communica-tion with many teams. In addition, we helped each other to analyze data, develop models and so on. We are always willing to show our sincerity in collaborations to many other teams.</p>
 
         <button class="button">Click Here</button>
 
         <button class="button">Click Here</button>
 
       </div>
 
       </div>
 
     </div></a>
 
     </div></a>
 +
 
 +
 +
           
 +
        </div>
 +
 +
 +
 +
  
 +
</br>
 
              
 
              
 
         </div>
 
         </div>
 
     </div>
 
     </div>
 
</div>
 
</div>
  <h1 style="text-align: center;margin-top: 15px;">&nbsp;</h1>
+
</br>
 +
  <h1 style="text-align: center;margin-top: 15px;padding-top: 15px !important;padding-bottom: 10px !important;margin-bottom: -30px !important;">&nbsp;</h1>
  
 
<!-- 底部 -->
 
<!-- 底部 -->
Line 536: Line 252:
 
<script src="https://2018.igem.org/Template:FJNU-China/Javascript/nav?action=raw&amp;ctype=text/javascript"></script>
 
<script src="https://2018.igem.org/Template:FJNU-China/Javascript/nav?action=raw&amp;ctype=text/javascript"></script>
  
 
+
<!--box-->
 +
<script type="text/javascript" src="https://2018.igem.org/Template:FJNU-China/Javascript/box?action=raw&amp;ctype=text/javascript"></script>
 +
<script type="text/javascript">
 +
baguetteBox.run('.tz-gallery');
 +
</script>
  
 
</body>
 
</body>
 
</html>
 
</html>

Latest revision as of 05:51, 17 October 2018

Human practices

Overview

    As Peter Carr says,"Human Practices is the study of how your work affects the world, and how the world affects your work". We think,the iGEM is colorful, and we should combine science with the society, towards our vision of a healthier, greener and sustainable world. This year, we mainly focus on infectious microbes and unpleasant smell in external environment waste beaker, and internal environment armpit. Throughout our project, we interviewed some related stakeholders, consulted with experts of different aspects and communicated with common people to evaluate our project and get some feedback to improve it. What’s more, it’s an public engagement and education that we aim to show the magic and applications of synthetic biology.