Difference between revisions of "Team:HUST-China"

Line 146: Line 146:
 
         list-style: none;
 
         list-style: none;
 
     }
 
     }
</style>
+
 
 
/*#################################main.css#############################################*/
 
/*#################################main.css#############################################*/
<style>
 
 
#tab_header{width:100%;height:120px;background-color:#600808;}
 
#tab_header{width:100%;height:120px;background-color:#600808;}
 
#header_image1{width:auto;height:100px;float:left;margin-left:100px;margin-top:20px;}
 
#header_image1{width:auto;height:100px;float:left;margin-left:100px;margin-top:20px;}
 
#header_image2{width:auto;height:100px;float:left;margin-left:10px;margin-top:20px;}
 
#header_image2{width:auto;height:100px;float:left;margin-left:10px;margin-top:20px;}
#header_image3{width:auto;height:100px;float:right;margin-right:100px;margin-top:20px;background-color:#600808;}
+
#header_image3{width:auto;height:100px;float:right;margin-right:100px;margin-top:20px;}
  
 
#tab_menu{width:100%;height:40px;background-color:#600808; margin-top:-440px;}
 
#tab_menu{width:100%;height:40px;background-color:#600808; margin-top:-440px;}
Line 176: Line 175:
 
.tab-item a{color:#FFF;text-decoration:none}
 
.tab-item a{color:#FFF;text-decoration:none}
 
 
#tab_body{width:900px;min-height:500px;background-color:#f9f9f9;margin:0 auto; margin-top:400px;}
+
#tab_body{width:aoto;min-height:500px;background-color:#f9f9f9;margin:0 auto; margin-top:400px;}
 
.body_header1{width:100%;height:60px;font-size:36px;line-height:60px;background-color:#006;text-align:center;color:#FFF}
 
.body_header1{width:100%;height:60px;font-size:36px;line-height:60px;background-color:#006;text-align:center;color:#FFF}
 
.body_word1{width:880px;height:60px;margin:0 auto;background-color:#f9f9f9;padding:10px;font-size:18px;color:#000; font-family:Verdana, Geneva, sans-serif;}
 
.body_word1{width:880px;height:60px;margin:0 auto;background-color:#f9f9f9;padding:10px;font-size:18px;color:#000; font-family:Verdana, Geneva, sans-serif;}
Line 185: Line 184:
  
 
#tab_foot{width:100%;height:200px;background-color:#600808; text-align:center;line-height:50px;color:#FFF; font-size:24p; padding-top:40px;}
 
#tab_foot{width:100%;height:200px;background-color:#600808; text-align:center;line-height:50px;color:#FFF; font-size:24p; padding-top:40px;}
</style>
+
/*#########################################banner.css#######################################################*/
<!--#############################################banner#####################################################-->
+
<style>
+
 
#divSmallBox{overflow:hidden;*display:inline;*zoom:1;width:10px;height:10px;margin:0 5px;border-radius:10px;background:#ffffff;}
 
#divSmallBox{overflow:hidden;*display:inline;*zoom:1;width:10px;height:10px;margin:0 5px;border-radius:10px;background:#ffffff;}
 
#playBox{ width:100%; height:400px; margin:0px auto; background:#333; position:relative; overflow:hidden;}
 
#playBox{ width:100%; height:400px; margin:0px auto; background:#333; position:relative; overflow:hidden;}
 
#playBox .oUlplay { width:99999px; position:absolute; left:0px; top:0;}
 
#playBox .oUlplay { width:99999px; position:absolute; left:0px; top:0;}
 
#playBox .oUlplay li{ float:left;}
 
#playBox .oUlplay li{ float:left;}
#playBox .pre{ cursor:pointer; width:45px; height:45px; background:url(https://static.igem.org/mediawiki/2017/5/54/Hust_banner_left.png) no-repeat; position:absolute; top:190px; left:10px; z-index:10;}
+
#playBox .pre{ cursor:pointer; width:45px; height:45px; background:url(../images/l.png) no-repeat; position:absolute; top:190px; left:10px; z-index:10;}
#playBox .next{ cursor:pointer; width:45px; height:45px; background:url(https://static.igem.org/mediawiki/2017/4/49/Hust_banner_right.png) no-repeat; position:absolute; top:190px; right:10px; z-index:10;}
+
#playBox .next{ cursor:pointer; width:45px; height:45px; background:url(../images/r.png) no-repeat; position:absolute; top:190px; right:10px; z-index:10;}
 
#playBox .smalltitle {width:100%; height:10px; position:absolute; bottom:15px; z-index:10;}
 
#playBox .smalltitle {width:100%; height:10px; position:absolute; bottom:15px; z-index:10;}
 
#playBox .smalltitle ul{ width:120px; margin:0 auto;}
 
#playBox .smalltitle ul{ width:120px; margin:0 auto;}
 
#playBox .smalltitle ul li{ width:10px; height:10px; margin:0 5px; border-radius:10px; background:#ffffff; float:left; overflow:hidden;*display:inline;*zoom:1;}
 
#playBox .smalltitle ul li{ width:10px; height:10px; margin:0 5px; border-radius:10px; background:#ffffff; float:left; overflow:hidden;*display:inline;*zoom:1;}
 
#playBox .smalltitle .thistitle{ background:#69aaec;}
 
#playBox .smalltitle .thistitle{ background:#69aaec;}
</style>
+
/*###########################################vedio_style.css#########################################################*/
<script>
+
function getStyle(obj,name)
+
{
+
if(obj.currentStyle)
+
{
+
return obj.currentStyle[name]
+
}
+
else
+
{
+
return getComputedStyle(obj,false)[name]
+
}
+
}
+
 
+
function getByClass(oParent,nClass)
+
{
+
var eLe = oParent.getElementsByTagName('*');
+
var aRrent  = [];
+
for(var i=0; i<eLe.length; i++)
+
{
+
if(eLe[i].className == nClass)
+
{
+
aRrent.push(eLe[i]);
+
}
+
}
+
return aRrent;
+
}
+
 
+
function startMove(obj,att,add)
+
{
+
clearInterval(obj.timer)
+
obj.timer = setInterval(function(){
+
  var cutt = 0 ;
+
  if(att=='opacity')
+
  {
+
  cutt = Math.round(parseFloat(getStyle(obj,att)));
+
  }
+
  else
+
  {
+
  cutt = Math.round(parseInt(getStyle(obj,att)));
+
  }
+
  var speed = (add-cutt)/4;
+
  speed = speed>0?Math.ceil(speed):Math.floor(speed);
+
  if(cutt==add)
+
  {
+
  clearInterval(obj.timer)
+
  }
+
  else
+
  {
+
  if(att=='opacity')
+
  {
+
  obj.style.opacity = (cutt+speed)/100;
+
  obj.style.filter = 'alpha(opacity:'+(cutt+speed)+')';
+
  }
+
  else
+
  {
+
  obj.style[att] = cutt+speed+'px';
+
  }
+
  }
+
 
+
},30)
+
}
+
 
+
  window.onload = function()
+
  {
+
  var oDiv = document.getElementById('playBox');
+
  var oPre = getByClass(oDiv,'pre')[0];
+
  var oNext = getByClass(oDiv,'next')[0];
+
  var oUlBig = getByClass(oDiv,'oUlplay')[0];
+
  var aBigLi = oUlBig.getElementsByTagName('li');
+
  var oDivSmall = getByClass(oDiv,'smalltitle')[0]
+
  var aLiSmall = oDivSmall.getElementsByTagName('li');
+
 
+
  function tab()
+
  {
+
    for(var i=0; i<aLiSmall.length; i++)
+
    {
+
    aLiSmall[i].className = '';
+
    }
+
    aLiSmall[now].className = 'thistitle'
+
    startMove(oUlBig,'left',-(now*aBigLi[0].offsetWidth))
+
  }
+
  var now = 0;
+
  for(var i=0; i<aLiSmall.length; i++)
+
  {
+
  aLiSmall[i].index = i;
+
  aLiSmall[i].onclick = function()
+
  {
+
  now = this.index;
+
  tab();
+
  }
+
}
+
  oPre.onclick = function()
+
  {
+
  now--
+
  if(now ==-1)
+
  {
+
  now = aBigLi.length;
+
  }
+
  tab();
+
  }
+
  oNext.onclick = function()
+
  {
+
  now++
+
  if(now ==aBigLi.length)
+
  {
+
  now = 0;
+
  }
+
  tab();
+
  }
+
  var timer = setInterval(oNext.onclick,3000) //滚动间隔时间设置
+
  oDiv.onmouseover = function()
+
  {
+
  clearInterval(timer)
+
  }
+
  oDiv.onmouseout = function()
+
  {
+
  timer = setInterval(oNext.onclick,3000) //滚动间隔时间设置
+
  }
+
  }
+
</script>
+
<!--###########################################vedio#########################################################-->
+
<style>
+
 
.jp-video {
 
.jp-video {
 
font-family:"Helvetica Neue", Helvetica, Arial, sans-serif;
 
font-family:"Helvetica Neue", Helvetica, Arial, sans-serif;
Line 605: Line 480:
 
}
 
}
 
     </style>
 
     </style>
<!--##########################################banner_js##################################-->
 
 
 
</head>
 
</head>
  
Line 615: Line 488:
 
         <div id="tab_header" style>
 
         <div id="tab_header" style>
 
             <div id="header_image1"><img src="https://static.igem.org/mediawiki/2017/b/bd/HUST_2017_logo.png" alt="" /></div>
 
             <div id="header_image1"><img src="https://static.igem.org/mediawiki/2017/b/bd/HUST_2017_logo.png" alt="" /></div>
                 <div id="header_image2"><img src="https://static.igem.org/mediawiki/2017/2/2e/T_HUST_China_logo.gif"alt="" /></div>
+
                 <div id="header_image2"><img src="https://static.igem.org/mediawiki/2017/2/2e/T_HUST_China_logo.gif"/></div>
                 <div id="header_image3"><img src="https://static.igem.org/mediawiki/2017/f/f6/IGEM_2017_logo.png" height="100"alt="" /></div>     
+
                 <div id="header_image3"><img src="https://static.igem.org/mediawiki/2017/f/f6/IGEM_2017_logo.png" height="100"></div>     
 
         </div>
 
         </div>
  
Line 699: Line 572:
  
 
<!--##################################################################################################-->
 
<!--##################################################################################################-->
 +
<div id="tab_body">
 
         <div class="container">
 
         <div class="container">
 
             <div class="work-header">
 
             <div class="work-header">
Line 728: Line 602:
 
     </div>
 
     </div>
 
     </div>
 
     </div>
 
+
</div>
 
<p style="width:70%;margin-left:15%;font-size:13px;text-align:left;text-indent:34px;">
 
<p style="width:70%;margin-left:15%;font-size:13px;text-align:left;text-indent:34px;">
 
1.Binnemans K, Jones P T, Blanpain B, et al. Recycling of rare earths: a critical review[J]. Journal of Cleaner Production, 2013, 51(14):1–22.
 
1.Binnemans K, Jones P T, Blanpain B, et al. Recycling of rare earths: a critical review[J]. Journal of Cleaner Production, 2013, 51(14):1–22.

Revision as of 12:44, 1 September 2017

Team:HUST-China

WHAT WE ARE WORKING ON ?

This year iGEM HUST-China focus on the enrichment of rare earth elements. Through the engineering bacteria we enrich rare earth element and recover wastewater. Our final goal is to build a highly intelligent & efficient engineering bacteria with logical combination of artificial peptides.

WHY WE FOCUS ON THIS ?

The rare-earth elements (REEs) are becoming increasingly important due to their essential role in permanent magnets, catalysts, rechargeable batteries and other high tech product[1]. However, mining, refining, and recycling of rare earths have serious environmental consequences if not properly managed. For example, toxic acids are required during the refining process and they are particularly prone to be released into the general water supply[2]. So, we need an effective way to improve the existing production methods, that’s why we turn to synthetic biology.

HOW WE ACHIEVE OUR GOAL ?

Our system consists the sensing part and the capture part which base on artificial peptides.We combine lanthanide binding peptide and surface display system to capture rare earth ions. The sensing part is a transformation of membrane protein which can sense the ferric ion. We also use the design from 2015 iGEM HUST-China to help us regain our bacterial.

1.Binnemans K, Jones P T, Blanpain B, et al. Recycling of rare earths: a critical review[J]. Journal of Cleaner Production, 2013, 51(14):1–22.

2.Bradsher, Keith (October 29, 2010). "After China's Rare Earth Embargo, a New Calculus". The New York Times. Retrieved October 30, 2010.