Difference between revisions of "Team:CHINA CD UESTC"

Line 1: Line 1:
−
{{CHINA_CD_UESTC}}
 
−
<html>
 
−
<h2> Welcome to iGEM 2015! </h2>
 
−
<p>Your team has been approved and you are ready to start the iGEM season! </p>
 
  
−
<h4>Before you start: </h4>
+
<!DOCTYPE html>
−
<p> Please read the following pages:</p>
+
<!-- saved from url=(0028)http://www.whitefrontier.ch/ -->
−
<ul>
+
<head>
−
<li>  <a href="https://2015.igem.org/Requirements">Requirements page </a> </li>
+
−
<li> <a href="https://2015.igem.org/Wiki_How-To">Wiki Requirements page</a></li>
+
−
</ul>
+
  
−
<div class="highlightBox">
+
</head>
−
<h4> Styling your wiki </h4>
+
<style type="text/css">
−
<p>You may style this page as you like or you can simply leave the style as it is. You can easily keep the styling and edit the content of these default wiki pages with your project information and completely fulfill the requirement to document your project.</p>
+
/* General Slides */
−
<p>While you may not win Best Wiki with this styling, your team is still eligible for all other awards. This default wiki meets the requirements, it improves navigability and ease of use for visitors, and you should not feel it is necessary to style beyond what has been provided.</p>  
+
 
 +
#content{
 +
height:90px;
 +
  padding: 0px 0px 0px 0px;
 +
  border-left: 0px solid #444444;
 +
  border-right: 0px solid #444444;
 +
}
 +
.slide{
 +
background-attachment: fixed;
 +
width:100%;
 +
height:100%;
 +
position: relative;
 +
padding:0 10px 0 10px;
 +
margin: 0 10px 0 10px;
 +
z-index:12;
 +
overflow:hidden;
 +
}
 +
 
 +
 
 +
h2 {
 +
display:block;
 +
margin:0 0 23px;
 +
padding:0;
 +
text-transform:none;
 +
text-align:left;
 +
font-style:normal;
 +
border-bottom:1px solid #e0e0e0;
 +
font-family: Helvetica ;
 +
font-size: 70px;
 +
line-height: 82px;
 +
color:#343434;
 +
font-weight: 300;
 +
}
 +
 
 +
 
 +
h3 {
 +
margin:0;
 +
padding:40px 0 32px 0;
 +
text-transform:uppercase;
 +
text-align:center;
 +
font-family: Helvetica ;
 +
font-weight:800;
 +
font-size:32px;
 +
font-style:normal;
 +
line-height:36px;
 +
color:#3e3e3e;
 +
}
 +
 
 +
h4 {
 +
margin:0;
 +
padding:0 0 15px;
 +
text-transform:none;
 +
text-align:left;
 +
font-family: Helvetica ;
 +
font-weight:300;
 +
font-size:32px;
 +
font-style:normal;
 +
line-height:36px;
 +
color:#222;
 +
}
 +
 
 +
img.icon_img {
 +
float:left;
 +
margin-right:20px;
 +
margin-top:20px;
 +
margin-bottom:25px;
 +
}
 +
 
 +
.effect_2 {
 +
background:url(../images/effect_2.png) repeat left top;
 +
position:relative;
 +
top:0;
 +
bottom:-57px;
 +
height:100%;
 +
z-index:999 !important;
 +
}
 +
 
 +
 
 +
/* ____________________________________ Slide 2 标准文本____________________________________ */
 +
 
 +
#slide2 {
 +
background:url(../images/slide2_bg.jpg) repeat left top;
 +
width:100%;
 +
padding:20px 0 20px;
 +
}
 +
 
 +
.det_inf {margin-bottom:24px;
 +
}
 +
.det_inf li {margin-bottom:10px;
 +
}
 +
.det_inf li a  {
 +
color:#929292;
 +
}
 +
.det_inf li a:hover {
 +
color:#f14833;
 +
}
 +
li.phone {
 +
background:url(../images/inf_icon.png) no-repeat 0 0;
 +
padding-left:44px;
 +
}
 +
li.address {
 +
background:url(../images/inf_icon.png) no-repeat 0 -99px;
 +
padding-left:44px;
 +
}
 +
li.pers_mail {
 +
background:url(../images/inf_icon.png) no-repeat 0 -188px;
 +
padding-left:44px;
 +
}
 +
li.pers_site {
 +
background:url(../images/inf_icon.png) no-repeat 0 -265px;
 +
padding-left:44px;
 +
}
 +
 
 +
 
 +
/* ___________________________________ //Slide 2 ___________________________________ */
 +
 
 +
 
 +
 
 +
 
 +
 
 +
 
 +
 
 +
/*____________________________grid.css________________________________*/
 +
 
 +
/* Computer */
 +
.grid_1 { width: 6.5%; }
 +
.grid_2 { width: 15%; }
 +
.grid_3 { width: 23.5%; }
 +
.grid_4 { width: 32%; }
 +
.grid_5 { width: 40.5%; }
 +
.grid_6 { width: 49%; }
 +
.grid_7 { width: 57.5%; }
 +
.grid_8 { width: 66%; font-family: Verdana,Arial  ;
 +
}
 +
.grid_9 { width: 74.5%; }
 +
.grid_10 { width: 83%; }
 +
.grid_11 { width: 91.5%; }
 +
.grid_12 { width: 100%; }
 +
 
 +
.grid_1,
 +
.grid_2,
 +
.grid_3,
 +
.grid_4,
 +
.grid_5,
 +
.grid_6,
 +
.grid_7,
 +
.grid_8,
 +
.grid_9,
 +
.grid_10,
 +
.grid_11,
 +
.grid_12 {
 +
margin: 0 20px 20px 0;
 +
float: left;
 +
display: block;
 +
}
 +
 
 +
.alpha {margin-left:0;}
 +
.omega {margin-right:0;}
 +
.gallery-list {margin:0;padding:0;}
 +
.little_respond {display:none;}
 +
 
 +
.container{
 +
width: 100%;
 +
max-width: 1000px;
 +
margin: auto;
 +
 +
}
 +
 
 +
 
 +
 
 +
.clear{clear:both;display:block;overflow:hidden;visibility:hidden;width:0;height:0}
 +
.clearfix:after{position:relative;z-index:99;clear:both;content:' ';display:block;font-size:0;line-height:0;visibility:hidden;width:0;height:0}* html .clearfix,*:first-child+html .clearfix{zoom:1}
 +
 
 +
@media (max-width: 1024px) {
 +
.slide{background-attachment: scroll;background-position:0 0 !important;
 +
}
 +
}
 +
 
 +
@media (min-width: 767px) and (max-width: 1023px) {
 +
#firstTitle {font-size: 80px;}
 +
 
 +
 +
.gallery-list .omega {margin-right:10px;}
 +
 +
.filtr_bg {left:50%;}
 +
 
 +
h4 {font-size:27px;}
 +
 +
#slide1 h1 {font-size:50px;line-height:65px;}
 +
#slide1 p {font-size:30px;line-height:36px;}
 +
 +
.padding_slide1 {padding:150px 0 30px;}
 +
 +
.pers_inf li span {width:130px;}
 +
 +
.exhib_cont {width:282px;}
 +
.exhib_block p {width:250px;}
 +
.exhib_date_top {left:49.3%;}
 +
 
 +
 
 +
 +
/* _______________ Gallery ________________ */
 +
 +
/* ______________ //Gallery _______________ */
 +
/* ___________ SERV_BLOCK __________ */
 +
.servc_block p {font-size:28px;}
 +
 +
/* __________ //SERV_BLOCK _________ */
 +
 
 +
.container { width: 100%; }
 +
.container .alpha        { margin-left: 0; margin-right: 5px; }
 +
.container .omega        { margin-right: 0; }
 +
.gallery-list .omega {margin-right:10px;}
 +
.container .respond_pad {padding-right:20px;}
 +
 +
.grid_3 { width: 166px; }
 +
.grid_4 { width: 228px; }
 +
.grid_5      { width: 290px; }
 +
.grid_6      { width: 352px; }
 +
.grid_7  { width: 414px; }
 +
.grid_8  { width: 475px; }
 +
.grid_9 { width: 538px; }
 +
.grid_12 { width: 724px; }
 +
}
 +
 
 +
@media (max-width: 766px) {
 +
        #firstTitle {font-size: 80px;}
 +
 
 +
h2 {padding-bottom:10px;font-size:45px;line-height:58px;}
 +
 +
 +
#slide12 .foto {float:none;}
 +
#slide12 h5 {font-size:26px;}
 +
 
 +
 
 +
.inset_shadow {top:76px;bottom:0;}
 +
 +
.menu {position:fixed;top:0;margin-top:0 !important;}
 +
#undefined-sticky-wrapper {height:0 !important;}
 +
 +
 +
 +
}
 +
 
 +
@media (min-width: 480px) and (max-width: 766px) {
 +
h1 {font-size:46px;line-height:115px;padding-bottom:0;}
 +
#firstTitle {font-size: 60px;}
 +
 
 +
 
 +
.filtr_bg {width:420px;left:50%;}
 +
.slogan_text {font-size:21px;}
 +
.left_bord, .right_bord {margin-bottom:6px;}
 +
#slide1 h1 {font-size:30px;line-height:40px;}
 +
#slide1 p {font-size:21px;line-height:42px;}
 +
 +
#slide1 .button {margin:50px auto 0;}
 +
#slide1 .button:hover {margin:51px auto 0;}
 +
 +
.exhib_line_center {left:4px;height:79%;}
 +
.exhib_date_top {left:0;}
 +
.exhib_p_top {margin-left:120px;}
 +
.exhib_date_left, .exhib_date_right {
 +
top:-30px;
 +
left:-42px;
 +
height:115px;
 +
padding-left:40px;
 +
text-align:left;
 +
}
 +
#slide8 .exhib_date_left, #slide8 .exhib_date_right {
 +
top:-30px;
 +
left:-42px;
 +
height:115px;
 +
padding-left:40px;
 +
text-align:left;
 +
}
 +
 
 +
#slide8 .exhib_block .fleft {margin-left:42px;}
 +
#slide8 .exhib_date_top {width:155px;}
 +
#slide8 .exhib_p_top {margin-left:170px;}
 +
#slide8 .exhib_line_center {height:83%;}
 +
 +
.exhib_cont, .exhib_block .fleft {
 +
margin-left:42px;
 +
margin-top:50px;
 +
width:230px;
 +
}
 +
 +
.gallery-list {margin-right:0 !important;}
 +
 +
/* _____________ menu ______________ */
 +
#nav {margin:0;}
 +
 
 +
/* ____________ //menu _____________ */
 +
 
 +
/* _______________ JCAROUSEL ________________ */
 +
 +
/* ______________ //JCAROUSEL _______________ */
 +
 
 +
.container { width: 100%; }
 +
 +
.grid_1,
 +
.grid_2,
 +
.grid_3,
 +
.grid_4,
 +
.grid_5,
 +
.grid_6,
 +
.grid_7,
 +
.grid_8,
 +
.grid_9,
 +
.grid_10,
 +
.grid_11,
 +
.grid_12 {width:420px;}
 +
 +
.fright{float:none;}
 +
.fleft{float:none;}
 +
 +
}
 +
 
 +
@media (max-width : 479px) {
 +
  #firstTitle {font-size: 60px;}
 +
 
 +
h2 {font-size:40px;line-height:50px;margin:0;}
 +
h4 {font-size:22px;line-height:28px;}
 +
 +
 
 +
 +
.padding_slide1 {padding:188px 0 100px;}
 +
 
 +
.filtr_bg {width:295px;}
 +
.slogan_text {font-size:21px;}
 +
.left_bord, .right_bord {margin-bottom:6px;width:70px;}
 +
#slide1 h1 {font-size:24px;line-height:30px;}
 +
#slide1 p {font-size:21px;line-height:42px;}
 +
#slide1 .button {margin:40px auto 0;}
 +
#slide1 .button:hover {margin:41px auto 0;}
 +
 +
 +
 +
.educ_block p {font-size:16px;}
 +
 +
.pers_inf li {font-size:12px;}
 +
.pers_inf li span {width:110px;}
 +
 +
 +
.exhib_line_center {left:4px;height:79%;}
 +
.exhib_date_top {left:0;}
 +
.exhib_p_top {margin-left:42px;padding-top:30px;}
 +
.exhib_date_left, .exhib_date_right {
 +
top:-30px;
 +
left:-42px;
 +
height:115px;
 +
padding-left:40px;
 +
text-align:left;
 +
}
 +
#slide8 .exhib_date_left, #slide8 .exhib_date_right {
 +
top:-30px;
 +
left:-42px;
 +
height:115px;
 +
padding-left:40px;
 +
text-align:left;
 +
}
 +
 +
#slide8 .exhib_block .fleft {margin-left:42px;}
 +
#slide8 .exhib_date_top {width:155px;}
 +
#slide8 .exhib_p_top {margin-left:42px;padding-top:30px;}
 +
#slide8 .exhib_line_center {height:84%;}
 +
 +
.exhib_cont, .exhib_block .fleft {
 +
margin-left:42px;
 +
margin-top:50px;
 +
width:210px;
 +
}
 +
 +
.gallery-list {margin-right:0 !important;}
 +
 +
.client_foto img {width:300px;}
 +
 +
/* _______________ JCAROUSEL ________________ */
 +
 +
/* ______________ //JCAROUSEL _______________ */
 +
 
 +
/* ___________ SERV_BLOCK __________ */
 +
 +
 +
/* __________ //SERV_BLOCK _________ */
 +
 
 +
.container { width: 100%; }
 +
 
 +
.grid_1,
 +
.grid_2,
 +
.grid_3,
 +
.grid_4,
 +
.grid_5,
 +
.grid_6,
 +
.grid_7,
 +
.grid_8,
 +
.grid_9,
 +
.grid_10,
 +
.grid_11,
 +
.grid_12 {
 +
width:300px;
 +
}
 +
 +
.fright{float:none;}
 +
.fleft{float:none;}
 +
 
 +
}
 +
 
 +
@media (max-width : 399px) {
 +
.btn_dropdown {margin-right:3px;}
 +
  #firstTitle {font-size: 60px;}
 +
 
 +
 +
.gallery-list {width:270px;margin-left:15px !important;}
 +
 +
 +
#map_block iframe {height:300px !important;}
 +
 +
 +
.contact_form input[type="text"], .contact_form textarea {width:88%;}
 +
 +
 +
.container { width: 100%; }
 +
 
 +
.grid_1,
 +
.grid_2,
 +
.grid_3,
 +
.grid_4,
 +
.grid_5,
 +
.grid_6,
 +
.grid_7,
 +
.grid_8,
 +
.grid_9,
 +
.grid_10,
 +
.grid_11,
 +
.grid_12 {
 +
width:295px;
 +
}
 +
 +
}
 +
 
 +
 
 +
 
 +
 
 +
 
 +
 
 +
 
 +
 
 +
 
 +
 
 +
 
 +
 
 +
 
 +
 
 +
 
 +
/*____________________________//grid.css________________________________*/
 +
</style>
 +
 
 +
 
 +
<style type="text/css">
 +
/****************
 +
menu
 +
*********************/
 +
.unselect {
 +
-moz-user-select: all;
 +
-webkit-user-select: all;
 +
-ms-user-select: all;
 +
-o-user-select: all;
 +
user-select: all;
 +
}
 +
.ir {
 +
font: 0/0 a;
 +
text-shadow: none;
 +
color: transparent;
 +
}
 +
.clearfix:after {
 +
content: ".";
 +
display: block;
 +
clear: both;
 +
visibility: hidden;
 +
line-height: 0;
 +
height: 0;
 +
}
 +
.clearfix {
 +
display: inline-block;
 +
}
 +
html[xmlns] .clearfix {
 +
display: block;
 +
}
 +
* html .clearfix {
 +
height: 1%;
 +
}
 +
.middleHack {
 +
zoom: 1;
 +
}
 +
.ib {
 +
display: -moz-inline-stack !important;
 +
display: inline-block !important;
 +
vertical-align: top;
 +
}
 +
.ibIe {
 +
display: inline !important;
 +
zoom: 1;
 +
}
 +
.lt-ie8 .ib {
 +
display: inline !important;
 +
zoom: 1;
 +
}
 +
.bgCover {
 +
-webkit-background-size: cover;
 +
-moz-background-size: cover;
 +
-o-background-size: cover;
 +
background-size: cover;
 +
}
 +
.clear {
 +
clear: both;
 +
display: block;
 +
}
 +
.translate3d {
 +
-webkit-transform: translate3d(0, 0, 0);
 +
-moz-transform: translate3d(0, 0, 0);
 +
-ms-transform: translate3d(0, 0, 0);
 +
-o-transform: translate3d(0, 0, 0);
 +
transform: translate3d(0, 0, 0);
 +
}
 +
.translate {
 +
-webkit-transform: translate(0, 0);
 +
-moz-transform: translate3d(0, 0);
 +
-ms-transform: translate3d(0, 0);
 +
-o-transform: translate3d(0, 0);
 +
transform: translate3d(0, 0);
 +
}
 +
.noflick {
 +
-webkit-backface-visibility: hidden;
 +
}
 +
a img {
 +
border: none;
 +
}
 +
body {
 +
background: #2d2c41;
 +
font-family: 'Open Sans', Arial, Helvetica, Sans-serif, Verdana, Tahoma;
 +
}
 +
/* ----------------------------
 +
            menu
 +
-----------------------------*/
 +
ul {
 +
list-style-type: none !important;
 +
}
 +
li {
 +
list-style-type: none !important;
 +
}
 +
.accordion {
 +
width: 100%;
 +
max-width: 180px;
 +
background: #303030;
 +
-webkit-border-radius: 4px;
 +
-moz-border-radius: 4px;
 +
border-radius: 4px;
 +
list-style-type: none !important;
 +
margin-left:40px;
 +
}
 +
.accordion li {
 +
list-style-type: none !important;
 +
list-style: none;
 +
}
 +
.accordion .link {
 +
cursor: pointer;
 +
display: block;
 +
padding: 6px 6px 6px 30px;
 +
color: #FFF;
 +
font-size: 17px;
 +
font-weight: 700;
 +
border-bottom: 1px solid #CCC;
 +
position: relative;
 +
}
 +
.accordion li:last-child .link {
 +
border-bottom: 0;
 +
}
 +
.accordion li.open .link {
 +
color: #FFE153;
 +
}
 +
.submenu {
 +
display: none;
 +
background: #444359;
 +
font-size: 5px;
 +
list-style-type: none !important;
 +
}
 +
.submenu li {
 +
border-bottom: 1px solid #4b4a5e;
 +
list-style-type: none !important;
 +
list-style: none;
 +
}
 +
.submenu a {
 +
display: block;
 +
text-decoration: none;
 +
color: #d9d9d9;
 +
}
 +
.submenu a:hover {
 +
background: #b63b4d;
 +
color: #FFF;
 +
}
 +
#menuHome {
 +
color: #FFF;
 +
font-size: 17px;
 +
margin-right: 60px;
 +
}
 +
#menuHome:hover {
 +
color: #FFE153;
 +
}
 +
/*.overflow {  overflow: hidden;}*/
 +
.bgwidth {
 +
width: 100%;
 +
}
 +
.bgheight {
 +
height: 100%;
 +
}
 +
aside {
 +
width: 260px;
 +
height:100%;
 +
background-color:#000;
 +
position: absolute;
 +
top: 0;
 +
left: 0;
 +
bottom: 0;
 +
z-index: 11111111;
 +
-webkit-transition: all 200ms ease-out;
 +
-moz-transition: all 200ms ease-out;
 +
-ms-transition: all 200ms ease-out;
 +
-o-transition: all 200ms ease-out;
 +
transition: all 200ms ease-out;
 +
-webkit-transform: translate3d(0, 0, 0);
 +
-moz-transform: translate3d(0, 0, 0);
 +
-ms-transform: translate3d(0, 0, 0);
 +
-o-transform: translate3d(0, 0, 0);
 +
transform: translate3d(0, 0, 0);
 +
text-decoration:none;
 +
 
 +
}
 +
 
 +
aside #logo {
 +
text-indent: -6000px;
 +
margin: 0px 32px 0px 32px;
 +
display: block;
 +
}
 +
aside #logo img {
 +
display: block;
 +
text-decoration:none;
 +
width: 100%;
 +
}
 +
aside .separator {
 +
background: url("https://static.igem.org/mediawiki/2015/d/df/CD_UESTC_Separator.jpg") no-repeat top left transparent;
 +
display: block;
 +
zoom: 1;
 +
background-position: -23px -296px;
 +
width: 143px;
 +
height: 3px;
 +
text-indent: -6000px;
 +
text-align: left;
 +
margin: 25px auto;
 +
}
 +
aside nav {
 +
font-family: 'Open Sans', Arial, Helvetica, Sans-serif, Verdana, Tahoma;
 +
padding:0 0 0 0 px;
 +
}
 +
aside nav a {
 +
color: #ddd7d7;
 +
line-height: 40px;
 +
text-align: center;
 +
text-decoration: none;
 +
font-size: 23px;
 +
display: block;
 +
letter-spacing: 2px;
 +
}
 +
 
 +
* {
 +
margin: 0;
 +
padding: 0;
 +
-webkit-font-smoothing: antialiased;
 +
-moz-osx-font-smoothing: grayscale;
 +
}
 +
.no-touch * {
 +
-webkit-touch-callout: all;
 +
-webkit-user-select: all;
 +
-khtml-user-select: all;
 +
-moz-user-select: all;
 +
-ms-user-select: all;
 +
user-select: all;
 +
}
 +
div, h1, h2, h3, h4, span, p, img, a {
 +
-webkit-touch-callout: all;
 +
-webkit-user-select: all;
 +
-khtml-user-select: all;
 +
-moz-user-select: all;
 +
-ms-user-select: all;
 +
user-select: all;
 +
}
 +
h1, h2, h3, h4, h5, h6 {
 +
  color: black;
 +
  background: none;
 +
  font-weight: normal;
 +
  margin: 0;
 +
  padding-top: .5em;
 +
  padding-bottom: .17em;
 +
  border-bottom:none;
 +
}
 +
a {
 +
color: #FFFFFF;
 +
text-decoration: none;
 +
}
 +
.fa {
 +
text-shadow: rgba(0,0,0,0.01) 0 0 1px;
 +
}
 +
img {
 +
user-select: none;
 +
user-drag: none;
 +
}
 +
html, body {
 +
min-height: 100%;
 +
width: 100%;
 +
height: 100%;
 +
background: #000000;
 +
overflow: hidden;
 +
color: #ffffff;
 +
font-family: 'din-condensed-web';
 +
font-size: 14px;
 +
font-weight: 400;
 +
}
 +
.owl-wrapper-outer, .owl-wrapper, .owl-item {
 +
height: 100%;
 +
}
 +
.fullBg {
 +
position: absolute;
 +
top: 0;
 +
left: 0;
 +
display: none;
 +
}
 +
.fullBg.display {
 +
display: block;
 +
}
 +
.layoutHide {
 +
position: absolute;
 +
top: 0;
 +
left: 0;
 +
bottom: 0;
 +
width: 0%;
 +
background: #000000;
 +
z-index: 40;
 +
-webkit-transform: translate3d(0, 0, 0);
 +
-moz-transform: translate3d(0, 0, 0);
 +
-ms-transform: translate3d(0, 0, 0);
 +
-o-transform: translate3d(0, 0, 0);
 +
transform: translate3d(0, 0, 0);
 +
-webkit-backface-visibility: hidden;
 +
background: url("") repeat top left transparent;
 +
}
 +
 
 +
.touch .video .close {
 +
top: 20px;
 +
right: 20px;
 +
}
 +
@media screen and (max-height: 780px) {
 +
html body aside #logo {
 +
margin-top: 0px;
 +
margin-bottom:0px;
 +
}
 +
html body aside nav a {
 +
line-height: 35px;
 +
font-size: 18px;
 +
}
 +
html body aside .separator {
 +
margin: 20px auto;
 +
}
 +
html body aside .contact {
 +
font-size: 18px;
 +
}
 +
}
 +
@media screen and (max-height: 680px) {
 +
html body aside #logo {
 +
margin-top: 0px;
 +
margin-bottom: 0px;
 +
}
 +
html body aside nav a {
 +
line-height: 31px;
 +
font-size: 18px;
 +
}
 +
html body aside .separator {
 +
margin: 10px auto;
 +
}
 +
}
 +
@media screen and (max-width: 1050px) {
 +
 
 +
html aside #logo {
 +
margin-left: 20px;
 +
margin-right: 20px;
 +
}
 +
 
 +
}
 +
 
 +
@media screen and (max-width: 700px) {
 +
 
 +
html aside #mobileMenuButton {
 +
display: block;
 +
}
 +
html #RightContent {
 +
left: 0;
 +
right: auto;
 +
width: 100%;
 +
    height:100%;
 +
}
 +
}
 +
/*float RightContent*/
 +
#content {
 +
width:auto;
 +
height: 2000px;
 +
 
 +
}
 +
 
 +
.firstHeading {
 +
display: none;
 +
}
 +
#top {
 +
display: none;
 +
}
 +
h1 {
 +
text-decoration:none;
 +
font-size:100%;}
 +
</style>
 +
<!--  finished menu-->
 +
 
 +
 
 +
<style type="text/css">
 +
/*************************************************
 +
whole right section
 +
 
 +
***********************************************/
 +
#RightSection {
 +
position: fixed;
 +
left: 260px;
 +
top: 0;
 +
right: 0;
 +
height:100%;
 +
background:#F0F0F0;
 +
background-image:url("https://static.igem.org/mediawiki/2015/8/8e/CHINA_CD_UESTC_PROJECTbg.jpg");
 +
overflow-y: scroll;
 +
background-repeat: repeat;
 +
background-size: 180px;
 +
 
 +
transition: all 200ms ease-out;
 +
transform: translate3d(0, 0, 0);
 +
z-index:1;
 +
 
 +
}
 +
/*************************************************
 +
first title
 +
***********************************************/
 +
#title {
 +
    position: fixed;
 +
font-size: 80px;
 +
left:480px;
 +
z-index: 5;
 +
 
 +
}
 +
#firstTitle {
 +
font-family:  Arial, Helvetica, sans-serif;
 +
    position: fixed;
 +
margin-top:0;
 +
    margin-bottom:0;
 +
top: 60px;
 +
font-size: 80px;
 +
left:40%;
 +
color: #fdf7c1;
 +
overflow: hidden;
 +
 
 +
}
 +
 
 +
 
 +
/*************************************************
 +
right text frame container
 +
***********************************************/
 +
#RightContent {
 +
float: right;
 +
position: fixed;
 +
left: 260px;
 +
top: 0px;
 +
right: 0;
 +
height:100%;
 +
overflow-y: scroll;
 +
transition: all 200ms ease-out;
 +
transform: translate3d(0, 0, 0);
 +
z-index:5;
 +
 
 +
}
 +
.transparent_class  {
 +
border-radius: 0px;
 +
position: absolute;
 +
top: 350px;
 +
left: 50px;
 +
right: 50px;
 +
background-color: #0072E3;
 +
color:#000000;
 +
filter:alpha(opacity=80);
 +
-moz-opacity:0.8;
 +
-khtml-opacity: 0.8;
 +
opacity: 0.8;
 +
}
 +
.blockWords{
 +
font-family:Arial, Helvetica, sans-serif;
 +
font-size: 17px;
 +
padding: 15px;
 +
color: #ffffff;
 +
}
 +
/*************************************************
 +
testtext
 +
***********************************************/
 +
#RightContentText {
 +
position: absolute;
 +
top: 510px;
 +
left:18px;
 +
right:18px;
 +
background:#FFFFFF;
 +
color: #000000;
 +
transition: all 200ms ease-out;
 +
transform: translate3d(0, 0, 0);
 +
}
 +
@media (min-width: 540px) {
 +
  #firstTitle {font-size: 60px;}
 +
}
 +
@media (min-width: 768px) {
 +
 
 +
  #firstTitle {font-size: 60px;}
 +
 
 +
}
 +
 
 +
 
 +
@media (min-width: 992px) {
 +
 
 +
  #firstTitle {font-size: 60px;}
 +
 
 +
}
 +
 
 +
@media (min-width: 1200px) {
 +
  #firstTitle {font-size: 80px;}
 +
 
 +
 
 +
}
 +
#content{
 +
height:90px;
 +
  padding: 0px 0px 0px 0px;
 +
  border-left: 0px solid #444444;
 +
  border-right: 0px solid #444444;
 +
}
 +
</style>
 +
<body id="homeIndexBody">
 +
<aside>
 +
      <div id="mobileMenuButton"> <span></span> <span></span> <span></span> </div>
 +
      <h1 id="logo"> <img alt="White Frontier Brewery" src="https://static.igem.org/mediawiki/2015/b/bb/CD_UESTC_whitefrontier.png"> </h1>
 +
      <div class="separator"></div>
 +
      <nav >
 +
    <!-- Contenedor -->
 +
    <ul id="accordion" class="accordion">
 +
          <li>
 +
        <div class="link"><a id="menuHome" href="https://2015.igem.org/Team:CHINA_CD_UESTC/homeDemo">HOME</a></div>
 +
      </li>
 +
          <li>
 +
        <div class="link">PROJECT</div>
 +
        <ul class="submenu">
 +
              <li><a href="https://2015.igem.org/Team:CHINA_CD_UESTC/Background">Background</a></li>
 +
              <li><a href="https://2015.igem.org/Team:CHINA_CD_UESTC/SystemDesign">System Design</a></li>
 +
              <li><a href="https://2015.igem.org/Team:CHINA_CD_UESTC/Method">Method</a></li>
 +
              <li><a href="https://2015.igem.org/Team:CHINA_CD_UESTC/Modeling">Modeling</a></li>
 +
            </ul>
 +
      </li>
 +
          <li>
 +
        <div class="link">RESULTS</div>
 +
        <ul class="submenu">
 +
              <li><a href="https://2015.igem.org/Team:CHINA_CD_UESTC/Results">Results</a></li>
 +
              <li><a href="https://2015.igem.org/Team:CHINA_CD_UESTC/Discussion">Discussion</a></li>
 +
              <li><a href="https://2015.igem.org/Team:CHINA_CD_UESTC/Future">Future</a></li>
 +
              <li><a href="https://2015.igem.org/Team:CHINA_CD_UESTC/Parts">Parts</a></li>
 +
              <li><a href="https://2015.igem.org/Team:CHINA_CD_UESTC/References">References</a></li>
 +
              <li><a href="https://2015.igem.org/Team:CHINA_CD_UESTC/Judging">Judging</a></li>
 +
 
 +
            </ul>
 +
      </li>
 +
          <li>
 +
        <div class="link">TEAM</div>
 +
        <ul class="submenu">
 +
              <li><a href="https://2015.igem.org/Team:CHINA_CD_UESTC/Members">Members</a></li>
 +
              <li><a href="https://2015.igem.org/Team:CHINA_CD_UESTC/Instructors">Instructors</a></li>
 +
              <li><a href="https://2015.igem.org/Team:CHINA_CD_UESTC/Attributions">Attributions</a></li>
 +
              <li><a href="https://2015.igem.org/Team:CHINA_CD_UESTC/Gallery">Gallery</a></li>
 +
            </ul>
 +
      </li>
 +
          <li>
 +
        <div class="link">HUMAN PRACTICES</div>
 +
        <ul class="submenu">
 +
              <li><a href="https://2015.igem.org/Team:CHINA_CD_UESTC/Overview">Overview</a></li>
 +
              <li><a href="#">....</a></li>
 +
            </ul>
 +
      </li>
 +
          <li>
 +
        <div class="link">NOTEBOOK</div>
 +
        <ul class="submenu">
 +
              <li><a href="https://2015.igem.org/Team:CHINA_CD_UESTC/Journal">Journal</a></li>
 +
              <li><a href="https://2015.igem.org/Team:CHINA_CD_UESTC/Safety">Safety</a></li>
 +
              <li><a href="https://2015.igem.org/Team:CHINA_CD_UESTC/Protocol">Protocol</a></li>
 +
            </ul>
 +
      </li>
 +
        </ul>
 +
  </nav>
 +
      <div class="separator"></div>
 +
    </aside>
 +
 
 +
 
 +
 
 +
 
 +
<div id="RightSection"></div>
 +
 
 +
<div id="title">
 +
 
 +
<div id="firstTitle"><p><B>PROJECT</B></p></div>
 
</div>
 
</div>
  
−
<h4> Editing your wiki </h4>
+
<div id="RightContent">
−
<p>On this page you can document your project, introduce your team members, document your progress and share your iGEM experience with the rest of the world! </p>  
+
<div class="transparent_class ">
−
<p> <a href="https://2015.igem.org/wiki/index.php?title=Team:CHINA_CD_UESTC&action=edit"> Click here to edit this page! </a></p>
+
<p class="blockWords">&nbsp;&nbsp;We are a skillful and persistent group of nine Finns. We started as a group of students who didn't really know each other, assuming that we were going to spend our summer studying synthetic biology with strange colleagues. In the end we got a bunch of new friends and (in addition to studying synthetic biology) we just might have spent one of the best summers of our lives.</p>
−
<p>See tips on how to edit your wiki on the <a href="https://2015.igem.org/TemplatesforTeams_Code_Documentation">Template Documentation</a> page.</p>  
+
</div>
  
 +
<div id="RightContentText">
 +
<div class="slide" id="slide2" data-slide="2" data-stellar-background-ratio="0.5" style="background-position: 0px 669px;">
 +
<div class="container clearfix">
 +
 +
<div id="content" class="grid_12">
 +
<h2>The new Magical Bacteria: Magnetotactic E.Coli</h2>
 +
</div>
 +
<div class="clear"></div>
 +
 +
<div id="content">
 +
<div class="grid_8">
 +
<h4>2015-UESTC TEAM</h4>
 +
<p>There is a special microbe in nature which can be attracted by magnet ---Magnetotactic bacterium(MTB). Scientists are very interested in it because its Magnetotaxis. Magnetosome, some Fe3O4 nanocrystals covered by membrane with unprecedented magnetic properties, is the reason why MTB has the ability to be attracted by magnet. The process of magnetosome formation which is controled by many related gene cluster is very complex , including----- membrane invaginate forming vesicle---absorbing Iron ions -----Iron ions being oxidized into Fe3O4 ------magnetosome connect to each other and form nanopaticle chain.</p>
  
−
<h4>Templates </h4>
+
<P>A lot of great value about magnetotaxis application can be excavated . But MTB is anaerobic, and hard to be raised , also hard to transform. Obviously it is hard to modify and research MTB at molecular level . the large size and the complexity of related gene cluster is also a reason restricted the use of magnetotaxis.</P>
−
<p> This year we have created templates for teams to use freely. More information on how to use and edit the templates can be found on the  
+
−
<a href="https://2015.igem.org/TemplatesforTeams_Code_Documentation">Template Documentation </a> page.</p>  
+
  
 +
<p>In our project, we are aiming to transfer mamAB、mamGFDC、mms6、mamXYZ four main gene clusters which are related to the formation of magnetosome into E. Coli through recombinant plasmid. The E.Coli will produce magnetosome and abtain the magnetotactic ability. The Magnetotactic E.Coli will be applied in a variety of areas. We will explore the potential in the applaction of Microbial Fuel Cell. </p>
  
−
<h4>Tips</h4>
+
<p>In addition to this ,we will research several genes related to the producing of magnetosome, find out the Specific function in this processing.</p>
−
<p>This wiki will be your team’s first interaction with the rest of the world, so here are a few tips to help you get started: </p>
+
−
<ul>
+
−
<li>State your accomplishments! Tell people what you have achieved from the start. </li>
+
−
<li>Be clear about what you are doing and how you plan to do this.</li>
+
−
<li>You have a global audience! Consider the different backgrounds that your users come from.</li>
+
−
<li>Make sure information is easy to find; nothing should be more than 3 clicks away.  </li>
+
−
<li>Avoid using very small fonts and low contrast colors; information should be easy to read.  </li>
+
−
<li>Start documenting your project as early as possible; don’t leave anything to the last minute before the Wiki Freeze. For a complete list of deadlines visit the <a href="https://2015.igem.org/Calendar_of_Events">iGEM 2015 calendar</a> </li>
+
−
<li>Have lots of fun! </li>
+
−
</ul>  
+
  
  
−
<h4>Inspiration</h4>
+
</div>
−
<p> You can also view other team wikis for inspiration! Here are some examples:</p>
+
−
<ul>
+
−
<li> <a href="https://2014.igem.org/Team:SDU-Denmark/"> 2014 SDU Denmark </a> </li>
+
−
<li> <a href="https://2014.igem.org/Team:Aalto-Helsinki">2014 Aalto-Helsinki</a> </li>
+
−
<li> <a href="https://2014.igem.org/Team:LMU-Munich">2014 LMU-Munich</a> </li>
+
−
<li> <a href="https://2014.igem.org/Team:Michigan"> 2014 Michigan</a></li>
+
−
<li> <a href="https://2014.igem.org/Team:ITESM-Guadalajara">2014 ITESM-Guadalajara </a></li>
+
−
<li> <a href="https://2014.igem.org/Team:SCU-China"> 2014 SCU-China </a></li>
+
−
</ul>
+
  
−
<h4> Uploading pictures and files </h4>
+
<div class="clear"></div>
−
<p> You can upload your pictures and files to the iGEM 2015 server. Remember to keep all your pictures and files within your team's namespace or at least include your team's name in the file name. <br />
+
−
When you upload, set the "Destination Filename" to <code>Team:YourOfficialTeamName/NameOfFile.jpg</code>. (If you don't do this, someone else might upload a different file with the same "Destination Filename", and your file would be erased!)</p>
+
</div>
 +
 +
</div>
 +
</div>
  
−
<a href="https://2015.igem.org/Special:Upload">CLICK HERE TO UPLOAD FILES</a>
 
  
  
  
−
</div></div> <!--These are the closing tags for div id="mainContainer" and div id="contentContainer". The corresponding opening tags appear in the template that is {{included}} at the top of this page.-->
+
 
 +
 
 +
</div>
 +
</div>
 +
</div>
 +
 
 +
</body>
 +
 
  
 
</html>
 
</html>

Revision as of 05:10, 14 July 2015

<!DOCTYPE html> <head>

</head> <style type="text/css"> /* General Slides */ 

#content{
height:90px;
 padding: 0px 0px 0px 0px;
 border-left: 0px solid #444444; 
 border-right: 0px solid #444444; 
}

.slide{ background-attachment: fixed; width:100%; height:100%; position: relative; padding:0 10px 0 10px; margin: 0 10px 0 10px; z-index:12; overflow:hidden; }


h2 { display:block; margin:0 0 23px; padding:0; text-transform:none; text-align:left; font-style:normal; border-bottom:1px solid #e0e0e0; font-family: Helvetica ; font-size: 70px; line-height: 82px; color:#343434; font-weight: 300; }


h3 { margin:0; padding:40px 0 32px 0; text-transform:uppercase; text-align:center; font-family: Helvetica ; font-weight:800; font-size:32px; font-style:normal; line-height:36px; color:#3e3e3e; }

h4 { margin:0; padding:0 0 15px; text-transform:none; text-align:left; font-family: Helvetica ; font-weight:300; font-size:32px; font-style:normal; line-height:36px; color:#222; }

img.icon_img { float:left; margin-right:20px; margin-top:20px; margin-bottom:25px; }

.effect_2 { background:url(../images/effect_2.png) repeat left top; position:relative; top:0; bottom:-57px; height:100%; z-index:999 !important; }


/* ____________________________________ Slide 2 标准文本____________________________________ */

  1. slide2 {

background:url(../images/slide2_bg.jpg) repeat left top; width:100%; padding:20px 0 20px; }

.det_inf {margin-bottom:24px; } .det_inf li {margin-bottom:10px; } .det_inf li a { color:#929292; } .det_inf li a:hover { color:#f14833; } li.phone { background:url(../images/inf_icon.png) no-repeat 0 0; padding-left:44px; } li.address { background:url(../images/inf_icon.png) no-repeat 0 -99px; padding-left:44px; } li.pers_mail { background:url(../images/inf_icon.png) no-repeat 0 -188px; padding-left:44px; } li.pers_site { background:url(../images/inf_icon.png) no-repeat 0 -265px; padding-left:44px; }


/* ___________________________________ //Slide 2 ___________________________________ */




/*____________________________grid.css________________________________*/

/* Computer */ .grid_1 { width: 6.5%; } .grid_2 { width: 15%; } .grid_3 { width: 23.5%; } .grid_4 { width: 32%; } .grid_5 { width: 40.5%; } .grid_6 { width: 49%; } .grid_7 { width: 57.5%; } .grid_8 { width: 66%; font-family: Verdana,Arial  ; } .grid_9 { width: 74.5%; } .grid_10 { width: 83%; } .grid_11 { width: 91.5%; } .grid_12 { width: 100%; }

.grid_1, .grid_2, .grid_3, .grid_4, .grid_5, .grid_6, .grid_7, .grid_8, .grid_9, .grid_10, .grid_11, .grid_12 { margin: 0 20px 20px 0; float: left; display: block; }

.alpha {margin-left:0;} .omega {margin-right:0;} .gallery-list {margin:0;padding:0;} .little_respond {display:none;}

.container{ width: 100%; max-width: 1000px; margin: auto;

}


.clear{clear:both;display:block;overflow:hidden;visibility:hidden;width:0;height:0} .clearfix:after{position:relative;z-index:99;clear:both;content:' ';display:block;font-size:0;line-height:0;visibility:hidden;width:0;height:0}* html .clearfix,*:first-child+html .clearfix{zoom:1}

@media (max-width: 1024px) { .slide{background-attachment: scroll;background-position:0 0 !important; } }

@media (min-width: 767px) and (max-width: 1023px) { #firstTitle {font-size: 80px;}


.gallery-list .omega {margin-right:10px;}

.filtr_bg {left:50%;}

h4 {font-size:27px;}

#slide1 h1 {font-size:50px;line-height:65px;} #slide1 p {font-size:30px;line-height:36px;}

.padding_slide1 {padding:150px 0 30px;}

.pers_inf li span {width:130px;}

.exhib_cont {width:282px;} .exhib_block p {width:250px;} .exhib_date_top {left:49.3%;}


/* _______________ Gallery ________________ */

/* ______________ //Gallery _______________ */ /* ___________ SERV_BLOCK __________ */ .servc_block p {font-size:28px;}

/* __________ //SERV_BLOCK _________ */

.container { width: 100%; } .container .alpha { margin-left: 0; margin-right: 5px; } .container .omega { margin-right: 0; } .gallery-list .omega {margin-right:10px;} .container .respond_pad {padding-right:20px;}

.grid_3 { width: 166px; } .grid_4 { width: 228px; } .grid_5 { width: 290px; } .grid_6 { width: 352px; } .grid_7 { width: 414px; } .grid_8 { width: 475px; } .grid_9 { width: 538px; } .grid_12 { width: 724px; } }

@media (max-width: 766px) { 

       #firstTitle {font-size: 80px;}

h2 {padding-bottom:10px;font-size:45px;line-height:58px;}


#slide12 .foto {float:none;} #slide12 h5 {font-size:26px;}


.inset_shadow {top:76px;bottom:0;}

.menu {position:fixed;top:0;margin-top:0 !important;} #undefined-sticky-wrapper {height:0 !important;}


}

@media (min-width: 480px) and (max-width: 766px) { h1 {font-size:46px;line-height:115px;padding-bottom:0;} #firstTitle {font-size: 60px;}


.filtr_bg {width:420px;left:50%;} .slogan_text {font-size:21px;} .left_bord, .right_bord {margin-bottom:6px;} #slide1 h1 {font-size:30px;line-height:40px;} #slide1 p {font-size:21px;line-height:42px;}

#slide1 .button {margin:50px auto 0;} #slide1 .button:hover {margin:51px auto 0;}

.exhib_line_center {left:4px;height:79%;} .exhib_date_top {left:0;} .exhib_p_top {margin-left:120px;} .exhib_date_left, .exhib_date_right { top:-30px; left:-42px; height:115px; padding-left:40px; text-align:left; } #slide8 .exhib_date_left, #slide8 .exhib_date_right { top:-30px; left:-42px; height:115px; padding-left:40px; text-align:left; }

#slide8 .exhib_block .fleft {margin-left:42px;} #slide8 .exhib_date_top {width:155px;} #slide8 .exhib_p_top {margin-left:170px;} #slide8 .exhib_line_center {height:83%;}

.exhib_cont, .exhib_block .fleft { margin-left:42px; margin-top:50px; width:230px; }

.gallery-list {margin-right:0 !important;}

/* _____________ menu ______________ */ #nav {margin:0;}

/* ____________ //menu _____________ */

/* _______________ JCAROUSEL ________________ */

/* ______________ //JCAROUSEL _______________ */

.container { width: 100%; }

.grid_1, .grid_2, .grid_3, .grid_4, .grid_5, .grid_6, .grid_7, .grid_8, .grid_9, .grid_10, .grid_11, .grid_12 {width:420px;}

.fright{float:none;} .fleft{float:none;}

}

@media (max-width : 479px) { #firstTitle {font-size: 60px;}

h2 {font-size:40px;line-height:50px;margin:0;} h4 {font-size:22px;line-height:28px;}


.padding_slide1 {padding:188px 0 100px;}

.filtr_bg {width:295px;} .slogan_text {font-size:21px;} .left_bord, .right_bord {margin-bottom:6px;width:70px;} #slide1 h1 {font-size:24px;line-height:30px;} #slide1 p {font-size:21px;line-height:42px;} #slide1 .button {margin:40px auto 0;} #slide1 .button:hover {margin:41px auto 0;}


.educ_block p {font-size:16px;}

.pers_inf li {font-size:12px;} .pers_inf li span {width:110px;}


.exhib_line_center {left:4px;height:79%;} .exhib_date_top {left:0;} .exhib_p_top {margin-left:42px;padding-top:30px;} .exhib_date_left, .exhib_date_right { top:-30px; left:-42px; height:115px; padding-left:40px; text-align:left; } #slide8 .exhib_date_left, #slide8 .exhib_date_right { top:-30px; left:-42px; height:115px; padding-left:40px; text-align:left; }

#slide8 .exhib_block .fleft {margin-left:42px;} #slide8 .exhib_date_top {width:155px;} #slide8 .exhib_p_top {margin-left:42px;padding-top:30px;} #slide8 .exhib_line_center {height:84%;}

.exhib_cont, .exhib_block .fleft { margin-left:42px; margin-top:50px; width:210px; }

.gallery-list {margin-right:0 !important;}

.client_foto img {width:300px;}

/* _______________ JCAROUSEL ________________ */

/* ______________ //JCAROUSEL _______________ */

/* ___________ SERV_BLOCK __________ */


/* __________ //SERV_BLOCK _________ */

.container { width: 100%; }

.grid_1, .grid_2, .grid_3, .grid_4, .grid_5, .grid_6, .grid_7, .grid_8, .grid_9, .grid_10, .grid_11, .grid_12 { width:300px; }

.fright{float:none;} .fleft{float:none;}

}

@media (max-width : 399px) { .btn_dropdown {margin-right:3px;} #firstTitle {font-size: 60px;}


.gallery-list {width:270px;margin-left:15px !important;}


#map_block iframe {height:300px !important;}


.contact_form input[type="text"], .contact_form textarea {width:88%;}


.container { width: 100%; }

.grid_1, .grid_2, .grid_3, .grid_4, .grid_5, .grid_6, .grid_7, .grid_8, .grid_9, .grid_10, .grid_11, .grid_12 { width:295px; }

}








/*____________________________//grid.css________________________________*/ </style>


<style type="text/css"> /**************** menu

                                          • /

.unselect { -moz-user-select: all; -webkit-user-select: all; -ms-user-select: all; -o-user-select: all; user-select: all; } .ir { font: 0/0 a; text-shadow: none; color: transparent; } .clearfix:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; } .clearfix { display: inline-block; } html[xmlns] .clearfix { display: block; }

  • html .clearfix {

height: 1%; } .middleHack { zoom: 1; } .ib { display: -moz-inline-stack !important; display: inline-block !important; vertical-align: top; } .ibIe { display: inline !important; zoom: 1; } .lt-ie8 .ib { display: inline !important; zoom: 1; } .bgCover { -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } .clear { clear: both; display: block; } .translate3d { -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .translate { -webkit-transform: translate(0, 0); -moz-transform: translate3d(0, 0); -ms-transform: translate3d(0, 0); -o-transform: translate3d(0, 0); transform: translate3d(0, 0); } .noflick { -webkit-backface-visibility: hidden; } a img { border: none; } body { background: #2d2c41; font-family: 'Open Sans', Arial, Helvetica, Sans-serif, Verdana, Tahoma; } /* ---------------------------- 

            menu
-----------------------------*/

ul { list-style-type: none !important; } li { list-style-type: none !important; } .accordion { width: 100%; max-width: 180px; background: #303030; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; list-style-type: none !important; margin-left:40px; } .accordion li { list-style-type: none !important; list-style: none; } .accordion .link { cursor: pointer; display: block; padding: 6px 6px 6px 30px; color: #FFF; font-size: 17px; font-weight: 700; border-bottom: 1px solid #CCC; position: relative; } .accordion li:last-child .link { border-bottom: 0; } .accordion li.open .link { color: #FFE153; } .submenu { display: none; background: #444359; font-size: 5px; list-style-type: none !important; } .submenu li { border-bottom: 1px solid #4b4a5e; list-style-type: none !important; list-style: none; } .submenu a { display: block; text-decoration: none; color: #d9d9d9; } .submenu a:hover { background: #b63b4d; color: #FFF; }

  1. menuHome {

color: #FFF; font-size: 17px; margin-right: 60px; }

  1. menuHome:hover {

color: #FFE153; } /*.overflow { overflow: hidden;}*/ .bgwidth { width: 100%; } .bgheight { height: 100%; } aside { width: 260px; height:100%; background-color:#000; position: absolute; top: 0; left: 0; bottom: 0; z-index: 11111111; -webkit-transition: all 200ms ease-out; -moz-transition: all 200ms ease-out; -ms-transition: all 200ms ease-out; -o-transition: all 200ms ease-out; transition: all 200ms ease-out; -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); text-decoration:none;

}

aside #logo { text-indent: -6000px; margin: 0px 32px 0px 32px; display: block; } aside #logo img { display: block; text-decoration:none; width: 100%; } aside .separator { background: url("CD_UESTC_Separator.jpg") no-repeat top left transparent; display: block; zoom: 1; background-position: -23px -296px; width: 143px; height: 3px; text-indent: -6000px; text-align: left; margin: 25px auto; } aside nav { font-family: 'Open Sans', Arial, Helvetica, Sans-serif, Verdana, Tahoma; padding:0 0 0 0 px; } aside nav a { color: #ddd7d7; line-height: 40px; text-align: center; text-decoration: none; font-size: 23px; display: block; letter-spacing: 2px; }

  • {

margin: 0; padding: 0; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .no-touch * { -webkit-touch-callout: all; -webkit-user-select: all; -khtml-user-select: all; -moz-user-select: all; -ms-user-select: all; user-select: all; } div, h1, h2, h3, h4, span, p, img, a { -webkit-touch-callout: all; -webkit-user-select: all; -khtml-user-select: all; -moz-user-select: all; -ms-user-select: all; user-select: all; } h1, h2, h3, h4, h5, h6 { 

 color: black;
 background: none;
 font-weight: normal;
 margin: 0;
 padding-top: .5em;
 padding-bottom: .17em;
 border-bottom:none;

} a { color: #FFFFFF; text-decoration: none; } .fa { text-shadow: rgba(0,0,0,0.01) 0 0 1px; } img { user-select: none; user-drag: none; } html, body { min-height: 100%; width: 100%; height: 100%; background: #000000; overflow: hidden; color: #ffffff; font-family: 'din-condensed-web'; font-size: 14px; font-weight: 400; } .owl-wrapper-outer, .owl-wrapper, .owl-item { height: 100%; } .fullBg { position: absolute; top: 0; left: 0; display: none; } .fullBg.display { display: block; } .layoutHide { position: absolute; top: 0; left: 0; bottom: 0; width: 0%; background: #000000; z-index: 40; -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); -webkit-backface-visibility: hidden; background: url("") repeat top left transparent; }

.touch .video .close { top: 20px; right: 20px; } 

@media screen and (max-height: 780px) {

html body aside #logo { margin-top: 0px; margin-bottom:0px; } html body aside nav a { line-height: 35px; font-size: 18px; } html body aside .separator { margin: 20px auto; } html body aside .contact { font-size: 18px; } } @media screen and (max-height: 680px) { html body aside #logo { margin-top: 0px; margin-bottom: 0px; } html body aside nav a { line-height: 31px; font-size: 18px; } html body aside .separator { margin: 10px auto; } } @media screen and (max-width: 1050px) {

html aside #logo { margin-left: 20px; margin-right: 20px; }

}

@media screen and (max-width: 700px) {

html aside #mobileMenuButton { display: block; } html #RightContent { left: 0; right: auto; width: 100%; 

   height:100%;

} } /*float RightContent*/

  1. content {

width:auto; height: 2000px;

}

.firstHeading { display: none; }

  1. top {

display: none; } h1 { text-decoration:none; font-size:100%;} </style>


<style type="text/css"> /************************************************* whole right section

                                                                                              • /
  1. RightSection {

position: fixed; left: 260px; top: 0; right: 0; height:100%; background:#F0F0F0; background-image:url("CHINA_CD_UESTC_PROJECTbg.jpg"); overflow-y: scroll; background-repeat: repeat; background-size: 180px;

transition: all 200ms ease-out; transform: translate3d(0, 0, 0); z-index:1;

} /************************************************* first title

                                                                                              • /
  1. title {
   position: fixed;

font-size: 80px; left:480px; z-index: 5;

}

  1. firstTitle {

font-family: Arial, Helvetica, sans-serif; 

   position: fixed;

margin-top:0; 

   margin-bottom:0;

top: 60px; font-size: 80px; left:40%; color: #fdf7c1; overflow: hidden;

}


/************************************************* right text frame container

                                                                                              • /
  1. RightContent {

float: right; position: fixed; left: 260px; top: 0px; right: 0; height:100%; overflow-y: scroll; transition: all 200ms ease-out; transform: translate3d(0, 0, 0); z-index:5;

} .transparent_class { border-radius: 0px; position: absolute; top: 350px; left: 50px; right: 50px; background-color: #0072E3; color:#000000; filter:alpha(opacity=80); -moz-opacity:0.8; -khtml-opacity: 0.8; opacity: 0.8; } .blockWords{ font-family:Arial, Helvetica, sans-serif; font-size: 17px; padding: 15px; color: #ffffff; } /************************************************* testtext

                                                                                              • /
  1. RightContentText {

position: absolute; top: 510px; left:18px; right:18px; background:#FFFFFF; color: #000000; transition: all 200ms ease-out; transform: translate3d(0, 0, 0); } @media (min-width: 540px) { 

  #firstTitle {font-size: 60px;}

} @media (min-width: 768px) { 

  #firstTitle {font-size: 60px;}

}


@media (min-width: 992px) { 

  #firstTitle {font-size: 60px;}

}

@media (min-width: 1200px) { 

  #firstTitle {font-size: 80px;}


} 

#content{
height:90px;
 padding: 0px 0px 0px 0px;
 border-left: 0px solid #444444; 
 border-right: 0px solid #444444; 
}

</style> <body id="homeIndexBody"> <aside>

<img alt="White Frontier Brewery" src="CD_UESTC_whitefrontier.png">

     <nav > 

 </nav>

   </aside>



PROJECT

  We are a skillful and persistent group of nine Finns. We started as a group of students who didn't really know each other, assuming that we were going to spend our summer studying synthetic biology with strange colleagues. In the end we got a bunch of new friends and (in addition to studying synthetic biology) we just might have spent one of the best summers of our lives.

The new Magical Bacteria: Magnetotactic E.Coli

2015-UESTC TEAM

There is a special microbe in nature which can be attracted by magnet ---Magnetotactic bacterium(MTB). Scientists are very interested in it because its Magnetotaxis. Magnetosome, some Fe3O4 nanocrystals covered by membrane with unprecedented magnetic properties, is the reason why MTB has the ability to be attracted by magnet. The process of magnetosome formation which is controled by many related gene cluster is very complex , including----- membrane invaginate forming vesicle---absorbing Iron ions -----Iron ions being oxidized into Fe3O4 ------magnetosome connect to each other and form nanopaticle chain.

A lot of great value about magnetotaxis application can be excavated . But MTB is anaerobic, and hard to be raised , also hard to transform. Obviously it is hard to modify and research MTB at molecular level . the large size and the complexity of related gene cluster is also a reason restricted the use of magnetotaxis.

In our project, we are aiming to transfer mamAB、mamGFDC、mms6、mamXYZ four main gene clusters which are related to the formation of magnetosome into E. Coli through recombinant plasmid. The E.Coli will produce magnetosome and abtain the magnetotactic ability. The Magnetotactic E.Coli will be applied in a variety of areas. We will explore the potential in the applaction of Microbial Fuel Cell.

In addition to this ,we will research several genes related to the producing of magnetosome, find out the Specific function in this processing.





</div>

</body>


</html>