Difference between revisions of "Team:Nanjing-China/1"

Line 2: Line 2:
 
<head>
 
<head>
 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
+
<title>Nanjing-China2018</title>
 +
<link rel="stylesheet" type="text/css" href="https://2018.igem.org/Team:Nanjing-China/CSS:1?action=raw&ctype=text/css" />
 +
<link rel="stylesheet" type="text/css" href="https://2018.igem.org/Team:Nanjing-China/CSS:loader?action=raw&ctype=text/css" />
 
<style type="text/css">
 
<style type="text/css">
<!--
+
-->
#sideMenu,
+
#loader {
#top_title{
+
                position: fixed;
    display: none;
+
                width: 100%;
 +
                height:100%;
 +
                z-index: 20;
 +
display:block;
 +
background-color:rgba(255,255,255,0.5);
 +
 
 +
            }
 +
.spinner {
 +
  margin: 100px auto;
 +
  width: 100px;
 +
  height: 100px;
 +
position: fixed;
 
}
 
}
#content{
+
.container1 > div, .container2 > div, .container3 > div {
    width: 100%;
+
  width: 30px;
    margin: 0px;
+
  height: 30px;
    padding:0;
+
  background-color: #333;
background-color:block;
+
  border-radius: 100%;
 +
  position: absolute;
 +
  -webkit-animation: bouncedelay 1.2s infinite ease-in-out;
 +
  animation: bouncedelay 1.2s infinite ease-in-out;
 +
  -webkit-animation-fill-mode: both;
 +
  animation-fill-mode: both;
 
}
 
}
#HQ_page{ background-color:#FFF;
+
.spinner .spinner-container {
background-image:url("https://static.igem.org/mediawiki/2018/6/6b/T--Nanjing-China--background-1.png");
+
  position: absolute;
background-attachment:fixed;
+
  width: 100%;
background-size:cover;
+
  height: 100%;
background-repeat:no-repeat
+
background-position:center;}
+
#HQ_page p{ font-size:110%;}
+
#HQ_page h3{ font-size:130%;}
+
#HQ_page h2{ font-size:150%;}
+
#HQ_page h1{ font-size:200%; font-family: "Comic Sans MS", cursive;}
+
#HQ_page table{ border:none;
+
background-color:rgba(0,51,204,0);}
+
#HQ_page td{border:none;}
+
body {
+
font: 100%/1.4 Verdana, Arial, Helvetica, sans-serif;
+
margin: 0;
+
padding: 0;
+
    background-color:#FFF;
+
 
}
 
}
a img {border: none;}
+
.container2 {
table {
+
  -webkit-transform: rotateZ(45deg);
    border-collapse: collapse;
+
  transform: rotateZ(45deg);
    border-spacing: 0;
+
 
}
 
}
.container {
+
.container3 {
width: 100%;
+
  -webkit-transform: rotateZ(90deg);
font-family: Verdana, Geneva, sans-serif;
+
  transform: rotateZ(90deg);
margin: 0 auto;
+
alignment-adjust:central;
+
 
}
 
}
.header {
+
.circle1 { top: 0; left: 0; }
position:relative;
+
.circle2 { top: 0; right: 0; }
width:100%;
+
.circle3 { right: 0; bottom: 0; }
font-family: Verdana, Geneva, sans-serif;
+
.circle4 { left: 0; bottom: 0; }
alignment-adjust:central;
+
.container2 .circle1 {
z-index:2;
+
  -webkit-animation-delay: -1.1s;
 +
  animation-delay: -1.1s;
 
}
 
}
.contain {
+
 
position: relative;
+
.container3 .circle1 {
top:-120px;
+
  -webkit-animation-delay: -1.0s;
width: 76%;
+
  animation-delay: -1.0s;
max-width: 1100px;
+
}
min-width: 700px;
+
.container1 .circle2 {
padding: 10px 0;
+
  -webkit-animation-delay: -0.9s;
alignment-adjust: central;
+
  animation-delay: -0.9s;
background-color:rgba(0,51,204,0);
+
}
 +
.container2 .circle2 {
 +
  -webkit-animation-delay: -0.8s;
 +
  animation-delay: -0.8s;
 
}
 
}
.contain ul, .contain ol {  
+
.container3 .circle2 {
padding: 0 15px 15px 40px;  
+
  -webkit-animation-delay: -0.7s;
 +
  animation-delay: -0.7s;
 
}
 
}
.footer {
+
.container1 .circle3 {
position:relative;
+
  -webkit-animation-delay: -0.6s;
clear: both;
+
  animation-delay: -0.6s;
alignment-adjust:central;
+
}
 +
.container2 .circle3 {
 +
  -webkit-animation-delay: -0.5s;
 +
  animation-delay: -0.5s;
 
}
 
}
#menu{
+
.container3 .circle3 {
position:fixed;
+
  -webkit-animation-delay: -0.4s;
left:50px;
+
  animation-delay: -0.4s;
width: 770px;
+
font-family: "Comic Sans MS", cursive;
+
z-index:3;
+
+
 
}
 
}
#menu ul{ margin: auto; padding:0; list-style:none; width:770px;}
+
.container1 .circle4 {
#menu ul li{ height:42px; line-height:42px; margin-left: 2px; margin-bottom: 2px; border-right:3px solid #666; border-bottom:2.8px solid #666; border-top:1.5px solid #666; border-left:1px solid #666; text-align:center; float:left; width:122px; color:#F90;}
+
  -webkit-animation-delay: -0.3s;
#menu ul li a{ color:#003; text-decoration:none; display:block;
+
  animation-delay: -0.3s;
width:123px; height:42px;}
+
#menu ul li a:hover{
+
background-color: #999;
+
color: #FFF;
+
width: 124px;
+
height: 46px;
+
font-family:Verdana, Geneva, sans-serif;}
+
#menu ul li ul{ display:none; width:124px; z-index:3;}
+
#menu ul li.listshow ul{ display:block;}
+
#menu ul li ul li{
+
float: none;
+
width: 122px;
+
margin: 0;
+
 
}
 
}
#menu ul li ul li a{ background:none; width:124px;}
+
.container2 .circle4 {
#menu ul li ul li a:hover{ background:rgba(102,102,102,0.6); color:#FFFFFF; width:124px; height:45px; font-family:Verdana, Geneva, sans-serif;}
+
  -webkit-animation-delay: -0.2s;
#menu ul li a#on{ background:none;}
+
  animation-delay: -0.2s;
.clear{clear:both;}
+
#d{ left:85%; width:15%; position:fixed; z-index:10;}
+
#HOME {
+
position:relative;
+
    top:auto;
+
width: 115px;
+
text-align:center;
+
background:rgba(255,255,0,0.2);
+
font-size:15px;
+
alignment-adjust:central;
+
font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
+
z-index:3;
+
visibility: hidden;
+
 
}
 
}
#HOME .sub {
+
.container3 .circle4 {
background-color:rgba(102,102,204,0.5); height:50px; line-height:50px; border-bottom:2px solid #999; border-right:2.5px solid #666; text-align:center; float:left; width:115px;}
+
  -webkit-animation-delay: -0.1s;
#HOME .sub ul{ margin: auto; padding:0; list-style:none; width:115px;}
+
  animation-delay: -0.1s;
#HOME .sub ul li{
+
background-color:rgba(0,153,255,0.3); height:50px; line-height:50px; border-bottom:2px solid #999; border-right:2.5px solid #666; text-align:center; float:left; width:115px;}
+
#HOME .sub ul li a:hover{background-color:#930; color:#CCC; height:50px; line-height:50px;}
+
#HOME .sub ul li a{ text-decoration:none; color:#000;}
+
#HOME ul{
+
margin: auto; padding:0; list-style:0;}
+
#HOME ul li{ background:rgba(102,102,153,0.3); height:37px; line-height:37px; border-bottom:2px solid #999; border-right:2.5px solid #666; text-align:center; float:left; width:115px; margin-right:1px; list-style:0;}
+
#HOME ul li a{
+
text-decoration: none;
+
display:block;
+
color:#003;
+
width:115px;
+
height:37px;
+
 
+
 
}
 
}
#HOME ul li a:hover{ background:rgba(102,102,153,0.5); color:#FFFFFF; width:115px; height:40px;}
+
@-webkit-keyframes bouncedelay {
#HOME ul li a#on{ background:rgba(102,102,153,0.9);}
+
  0%, 80%, 100% { -webkit-transform: scale(0.0) }
.f{ position:absolute; width:80%; left:10%; alignment-adjust:central; z-index:2;}
+
  40% { -webkit-transform: scale(1.0) }
.f-word{ position:relative; width:30%; left:auto; height:230px; float:left;}
+
}
.f-img{ position:relative; width:20%; height:120px; float:left;}
+
@keyframes bouncedelay {
#HQ_page .f p{ font-size:90%;}
+
  0%, 80%, 100% {
.container .footer div .f .f-word h3 {
+
    transform: scale(0.0);
color: #000;
+
    -webkit-transform: scale(0.0);
font-family: Verdana, Arial, Helvetica, sans-serif;
+
  } 40% {
 +
    transform: scale(1.0);
 +
    -webkit-transform: scale(1.0);
 +
  }
 
}
 
}
.f-b{position:relative;}
+
 
.word-background-block{ width:100%;
+
float:left;}
+
.word-1{ width:100%;
+
float:left;}
+
.word-2{ width:50%;
+
float:left;}
+
.word-3{ width:33%;
+
float:left;}
+
.word{
+
position:relative;
+
width:90%;
+
float:left;
+
background-color:rgba(0,51,204,0.4);
+
padding:5%;}
+
-->
+
 
#i-menu .i-menu-button{
 
#i-menu .i-menu-button{
 
width:250px;  
 
width:250px;  
height:150px;
+
height:150px;
 
float:left;
 
float:left;
 
border:4px double #999;
 
border:4px double #999;
 
text-align:center;
 
text-align:center;
background-color:rgba(0,0,204,0.4);
+
background-color:rgba(102,204,255,0);
 
padding:5px;
 
padding:5px;
 
font-size:40px;
 
font-size:40px;
 
font-family:"Courier New", Courier, monospace;}
 
font-family:"Courier New", Courier, monospace;}
 
#i-menu .i-menu-button ul{ margin: auto; padding:0; list-style:none; width:250px; height:150px; line-height:150px; text-align:center; float:left;}
 
#i-menu .i-menu-button ul{ margin: auto; padding:0; list-style:none; width:250px; height:150px; line-height:150px; text-align:center; float:left;}
#i-menu .i-menu-button ul a:hover{ backgroundrgba:(204,102,255,0.7);color:#FFFFFF; height:150px; font-size:42px; padding:0px;
+
#i-menu .i-menu-button ul a:hover{ background:rgba(204,0,0,0.2);color:#FFFFFF; height:150px; font-size:42px; padding:0px;
 
}
 
}
 
#i-menu .i-menu-button ul a{ text-decoration:none; color:#000;}
 
#i-menu .i-menu-button ul a{ text-decoration:none; color:#000;}
 
#i-menu ul{
 
#i-menu ul{
margin: auto; padding:0; list-style:0; background:rgba(102,102,153,0.5); text-align:center; float:left; list-style:0;}
+
margin: auto; padding:0; list-style:0; background:rgba(204,153,255,0); text-align:center; float:left; list-style:0;}
 
#i-menu ul a{
 
#i-menu ul a{
 
text-decoration: none;
 
text-decoration: none;
Line 177: Line 130:
 
color:#003;
 
color:#003;
 
}
 
}
#i-menu ul a:hover{ background:rgba(204,102,255,0.7); color:#FFFFFF; width:250px; height:150px; font-family: "Comic Sans MS", cursive; font-size:42px;
+
#i-menu ul a:hover{ background:rgba(255,51,102,0.5); color:#FFFFFF; width:250px; height:150px; font-family: "Comic Sans MS", cursive; font-size:42px;
  
 
}
 
}
#i-menu ul a#on{ background:rgba(204,102,255,0.7); width:250px; height:150px;
+
#i-menu ul a#on{ background:rgba(120,153,255,0.7); width:250px; height:150px;
 
}
 
}
 
</style>
 
</style>
Line 218: Line 171:
  
 
<body>
 
<body>
 +
<div id="loader">
 +
<div class="spinner">
 +
  <div class="spinner-container container1">
 +
    <div class="circle1"></div>
 +
    <div class="circle2"></div>
 +
    <div class="circle3"></div>
 +
    <div class="circle4"></div>
 +
  </div>
 +
  <div class="spinner-container container2">
 +
    <div class="circle1"></div>
 +
    <div class="circle2"></div>
 +
    <div class="circle3"></div>
 +
    <div class="circle4"></div>
 +
  </div>
 +
  <div class="spinner-container container3">
 +
    <div class="circle1"></div>
 +
    <div class="circle2"></div>
 +
    <div class="circle3"></div>
 +
    <div class="circle4"></div>
 +
  </div>
 +
</div>
 +
</div>
 +
<script type="text/javascript">
 +
            $(window).load(function() {
 +
                $("#loader").fadeOut("slow");
 +
            })
 +
</script>
 
<div id="d">
 
<div id="d">
 
<img src="https://static.igem.org/mediawiki/2018/f/fe/T--Nanjing-China--signal-1.jpg" width="100%" onclick="MM_effectBlind('HOME', 1000, '0%', '100%', true)" />
 
<img src="https://static.igem.org/mediawiki/2018/f/fe/T--Nanjing-China--signal-1.jpg" width="100%" onclick="MM_effectBlind('HOME', 1000, '0%', '100%', true)" />
Line 241: Line 221:
 
</ul>
 
</ul>
 
     </li>
 
     </li>
     <li><a href="https://2017.igem.org/Team:Nanjing-China/Parts">PARTS</a>
+
     <li><a href="https://2018.igem.org/Team:Nanjing-China/Parts">PARTS</a>
 
         <ul>
 
         <ul>
 
         <li><a href="https://2018.igem.org/Team:Nanjing-China/Basic_Part">Basic_Part</a></li>
 
         <li><a href="https://2018.igem.org/Team:Nanjing-China/Basic_Part">Basic_Part</a></li>
Line 247: Line 227:
 
</ul>
 
</ul>
 
             </li>
 
             </li>
     <li><a href="https://2018.igem.org/Team:Nanjing-China/Sliver">JUDGE</a>
+
     <li><a href="https://2018.igem.org/Team:Nanjing-China/Bronze">JUDGE</a>
 
     <ul>
 
     <ul>
 
             <li><a href="https://2018.igem.org/Team:Nanjing-China/Bronze">Bronze</a></li>
 
             <li><a href="https://2018.igem.org/Team:Nanjing-China/Bronze">Bronze</a></li>
Line 276: Line 256:
 
                 <li><a href="https://2018.igem.org/Team:Nanjing-China/Safety">Safety</a></li>
 
                 <li><a href="https://2018.igem.org/Team:Nanjing-China/Safety">Safety</a></li>
 
             <li><a href="https://2018.igem.org/Team:Nanjing-China/Model">Model</a></li>
 
             <li><a href="https://2018.igem.org/Team:Nanjing-China/Model">Model</a></li>
 +
                <li><a href="https://2018.igem.org/Team:Nanjing-China/InterLab">InterLab</a></li>
 +
 
</ul>
 
</ul>
 
     </li>
 
     </li>
Line 289: Line 271:
 
     </div>
 
     </div>
 
   <div class="word" id="i-menu" align="center">
 
   <div class="word" id="i-menu" align="center">
   <div class="i-menu-button"><ul><a href="https://2017.igem.org/Team:Nanjing-China/Parts">PARTS</a></ul></div>
+
  <div class="i-menu-button"><img src="https://static.igem.org/mediawiki/2018/f/fe/T--Nanjing-China--signal-1.jpg"  height="150px" /></div>
   <div class="i-menu-button"><ul><a href="https://2018.igem.org/Team:Nanjing-China/Sliver">JUDGE</a></ul></div>
+
   <div class="i-menu-button"><ul><a href="https://2018.igem.org/Team:Nanjing-China/Parts">PARTS</a></ul></div>
 +
   <div class="i-menu-button"><ul><a href="https://2018.igem.org/Team:Nanjing-China/Bronze">JUDGE</a></ul></div>
 
   <div class="i-menu-button"><ul><a href="https://2018.igem.org/Team:Nanjing-China/Design">PROJECT</a></ul></div>
 
   <div class="i-menu-button"><ul><a href="https://2018.igem.org/Team:Nanjing-China/Design">PROJECT</a></ul></div>
 
   <div class="i-menu-button"><ul><a href="https://2018.igem.org/Team:Nanjing-China/Team">TEAM</a></ul></div>
 
   <div class="i-menu-button"><ul><a href="https://2018.igem.org/Team:Nanjing-China/Team">TEAM</a></ul></div>
Line 332: Line 315:
 
   </div>
 
   </div>
 
</div>
 
</div>
 +
 
 
</body>
 
</body>
 
</html>
 
</html>

Revision as of 04:57, 23 August 2018

Nanjing-China2018

Introduction

Light-driven nitrogen fixation system by whole-cell Our team Nanjing-China 2018 intends to establish a sound and ideal whole-cell photocatalytic nitrogen fixation system using E. coli cells engineered with certain proteins and inorganic materials. Thus, the engineered microorganisms that express nitrogenase as well as have the capability of in situ biosynthesis of CdS nanocrystals for the existence of the surface-displayed heavy lead-specific binding proteins is developed. Such system is able to reduce N2 to NH3 driven by light instead of ATP-hydrolysis with considerably high efficiency. The accomplishment of this shall ease the heavy burden of the environment and contribute to the further and better utilization of clean solar energy.