Difference between revisions of "Team:AHUT China"

 
(53 intermediate revisions by 3 users not shown)
Line 1: Line 1:
 
{{:Team:AHUT_China/Template/CSS_RESET}}
 
{{:Team:AHUT_China/Template/CSS_RESET}}
 +
{{:Team:AHUT_China/Template/bootstrapcss}}
 +
{{:Team:AHUT_China/Template/stylecss}}
 +
{{:Team:AHUT_China/buchongcss}}
 
<html lang="zh-CN">
 
<html lang="zh-CN">
 
<head>
 
<head>
Line 8: Line 11:
 
     <!-- 上述3个meta标签*必须*放在最前面,任何其他内容都*必须*跟随其后! -->
 
     <!-- 上述3个meta标签*必须*放在最前面,任何其他内容都*必须*跟随其后! -->
 
     <title>AHUT</title>
 
     <title>AHUT</title>
    <!-- 新 Bootstrap 核心 CSS 文件 -->
 
    <link rel="stylesheet" href="//cdn.bootcss.com/bootstrap/3.3.5/css/bootstrap.min.css">
 
    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
 
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
 
    <!--[if lt IE 9]>
 
 
     <script src="//cdn.bootcss.com/html5shiv/3.7.2/html5shiv.min.js"></script>
 
     <script src="//cdn.bootcss.com/html5shiv/3.7.2/html5shiv.min.js"></script>
 
     <script src="//cdn.bootcss.com/respond.js/1.4.2/respond.min.js"></script>
 
     <script src="//cdn.bootcss.com/respond.js/1.4.2/respond.min.js"></script>
 
     <![endif]-->
 
     <![endif]-->
 +
<!--外链 -->
 +
<link href="http://oyla114lp.bkt.clouddn.com/bootstrap.css" rel='stylesheet' type='text/css' />
 +
<!------ commn-js files ----->
 +
<script src="http://oyla114lp.bkt.clouddn.com/jquery.min.js"> </script>
 +
<!------ commn-js files ----->
 +
<!----- theme-style ----->
 +
<link href="http://oyla114lp.bkt.clouddn.com/style.css" rel='stylesheet' type='text/css' />
 +
<!----- theme-style ----->
 +
<meta name="viewport" content="width=device-width, initial-scale=1">
 +
</script>
 +
        <link rel="stylesheet" href="http://oyla114lp.bkt.clouddn.com/menu.css?action=raw&ctype=text/css" type="text/css" />
 +
</head>
  
<!--外链 -->
 
   
 
    <script src="http://oyla114lp.bkt.clouddn.com/move-top.js?action=raw&ctype=text/javascript" type="text/javascript" ></script>
 
    <script src="http://oyla114lp.bkt.clouddn.com/responsiveslides.min.js?action=raw&ctype=text/javascript" type="text/javascript" ></script>
 
    <script src="http://oyla114lp.bkt.clouddn.com/easing.js?action=raw&ctype=text/javascript" type="text/javascript" ></script>
 
    <script src="http://oyla114lp.bkt.clouddn.com/responsive-nav.js?action=raw&ctype=text/javascript" type="text/javascript" ></script>
 
    <script src="http://oyla114lp.bkt.clouddn.com/responsive-nav.js?action=raw&ctype=text/javascript" type="text/javascript" ></script>
 
  
  
  
 
 
    <style type="text/css">
 
#donghua {
 
  position: fixed;
 
  z-index: 9999999;
 
  width: 100%;
 
  height: 100%;
 
}
 
 
<!--外部CSS -->
 
body{
 
font-family: 'Open Sans', sans-serif;
 
background:#FFF;
 
}
 
/*----header---*/
 
.header{
 
background:#000;
 
}
 
.logo{
 
float:left;
 
margin-top:0em;
 
}
 
.menu{
 
float:right;
 
margin-top:10px;
 
}
 
.menu li{
 
list-style:none;
 
display:inline-block;
 
margin: 1em 0 1.7em;
 
padding:0px 5px;
 
}
 
.menu li:first-child{
 
  margin-left:0;
 
}
 
.menu li a{
 
color:#A4AEAD;
 
text-decoration:none;
 
padding:0.3em 0.8em;
 
display:block;
 
text-transform:uppercase;
 
font-size:1.1em;
 
font-weight:600;
 
border-radius:5px;
 
-webkit-border-radius:5px;
 
-moz-border-radius:5px;
 
-o-border-radius:5px;
 
-ms-border-radius:5px;
 
border:2px solid #000;
 
-webkit-transition: all 0.5s ease;
 
-moz-transition: all 0.5s ease;
 
-o-transition: all 0.5s ease;
 
transition: all 0.5s ease;
 
}
 
.menu li a:hover{
 
border:2px solid #A4AEAD;
 
}
 
#nav .current a {
 
    color:#fb326f;
 
  -webkit-transition: all 0.3s ease;
 
-moz-transition: all 0.3s ease;
 
-o-transition: all 0.3s ease;
 
transition: all 0.3s ease;
 
}
 
.menu li.active a{
 
color:#23B7A4;
 
border:2px solid #23B7A4;
 
}
 
.toggleMenu {
 
display:  none;
 
  padding:4px 5px 0px 5px;
 
    border-radius:2em;
 
    -webkit-border-radius:2em;
 
    -moz-border-radius:2em;
 
    -o-border-radius:2em;
 
}
 
.nav:before,
 
.nav:after {
 
    content: " ";
 
    display: table;
 
}
 
.nav:after {
 
    clear: both;
 
}
 
.nav ul {
 
    list-style: none;
 
}
 
@media screen and (max-width:800px) {
 
.menu {
 
margin:10px 0;
 
}
 
    .active {
 
        display: block;
 
    }
 
    .menu li a{
 
    text-align:left;
 
    border-radius:0;
 
    -webkit-border-radius:0;
 
    -moz-border-radius:0;
 
    -o-border-radius:0;
 
    }
 
    .nav {
 
    list-style: none;
 
    *zoom: 1;
 
    width:95%;
 
position: absolute;
 
right:7px;
 
background:#051619;
 
top:60px;
 
z-index: 9999;
 
border:1px solid #eee;
 
    }
 
  .menu li a span.messages{
 
    text-align:center;
 
    top:15px;
 
    }
 
    .nav li ul{
 
    width:100%; 
 
    }
 
    .menu ul{
 
    margin:0;L
 
    }
 
    .nav > li.hover > ul {
 
        width:100%;
 
    }
 
    .nav > li {
 
        float: none;
 
        display:block;
 
    }
 
    .nav ul {
 
        display: block;
 
        width: 100%;
 
    }
 
  .nav > li.hover > ul , .nav li li.hover ul {
 
        position: static;
 
    }
 
    .nav li a{
 
    border-top:1px solid #eee;
 
    background:#fff;
 
    color:#384254;
 
    }
 
    .nav li:first-child a{
 
    border-top:none;
 
    }
 
}
 
 
/*----slider----*/
 
#slider2,
 
#slider3 {
 
  box-shadow: none;
 
  -moz-box-shadow: none;
 
  -webkit-box-shadow: none;
 
  margin: 0 auto;
 
}
 
.rslides_tabs {
 
  list-style: none;
 
  padding: 0;
 
  background: rgba(0,0,0,.25);
 
  box-shadow: 0 0 1px rgba(255,255,255,.3), inset 0 0 5px rgba(0,0,0,1.0);
 
  -moz-box-shadow: 0 0 1px rgba(255,255,255,.3), inset 0 0 5px rgba(0,0,0,1.0);
 
  -webkit-box-shadow: 0 0 1px rgba(255,255,255,.3), inset 0 0 5px rgba(0,0,0,1.0);
 
  font-size: 18px;
 
  list-style: none;
 
  margin: 0 auto 50px;
 
  max-width: 540px;
 
  padding: 10px 0;
 
  width: 100%;
 
}
 
.rslides_tabs li {
 
  display: inline;
 
  float: none;
 
  margin-right: 1px;
 
}
 
.rslides_tabs a {
 
  width: auto;
 
  line-height: 20px;
 
  padding: 9px 20px;
 
  height: auto;
 
  background: transparent;
 
  display: inline;
 
}
 
.rslides_tabs li:first-child {
 
  margin-left: 0;
 
}
 
.rslides_tabs .rslides_here a {
 
  background: rgba(255,255,255,.1);
 
  color: #fff;
 
  font-weight: bold;
 
}
 
.events {
 
  list-style: none;
 
}
 
.callbacks_container {
 
position: relative;
 
float: left;
 
width: 100%;
 
}
 
.callbacks {
 
  position: relative;
 
  list-style: none;
 
  overflow: hidden;
 
  width: 100%;
 
  padding: 0;
 
  margin: 0;
 
}
 
.callbacks li {
 
  position: absolute;
 
  width: 100%;
 
  left: 0;
 
  top: 0;
 
}
 
.callbacks img {
 
  position: relative;
 
  z-index: 1;
 
  height: auto;
 
  border: 0;
 
  width: 100%;
 
}
 
.callbacks .caption {
 
display: block;
 
position: absolute;
 
z-index: 2;
 
font-size: 20px;
 
text-shadow: none;
 
color: #fff;
 
left: 15%;
 
right: 0%;
 
padding: 10px 20px;
 
margin: 0;
 
max-width: none;
 
top: 28%;
 
}
 
.callbacks_nav {
 
  position: absolute;
 
-webkit-tap-highlight-color: rgba(0,0,0,0);
 
top: 56%;
 
left: 8%;
 
z-index: 3;
 
text-indent: -9999px;
 
overflow: hidden;
 
text-decoration: none;
 
height: 61px;
 
width: 41px;
 
background: transparent url("../images/themes.png") no-repeat left top;
 
margin-top: -65px;
 
}
 
.callbacks_nav:active {
 
  opacity: 1.0;
 
}
 
.callbacks_nav.next {
 
left: auto;
 
background-position: right top;
 
right: 8%;
 
}
 
#slider3-pager a {
 
  display: inline-block;
 
}
 
#slider3-pager span{
 
  float: left;
 
}
 
#slider3-pager span{
 
width:100px;
 
height:15px;
 
background:#fff;
 
display:inline-block;
 
border-radius:30em;
 
opacity:0.6;
 
}
 
#slider3-pager .rslides_here a {
 
  background: #FFF;
 
  border-radius:30em;
 
  opacity:1;
 
}
 
#slider3-pager a {
 
  padding: 0;
 
}
 
#slider3-pager li{
 
display:inline-block;
 
}
 
.rslides {
 
  position: relative;
 
  list-style: none;
 
  overflow: hidden;
 
  width: 100%;
 
  padding: 0;
 
  margin: 0;
 
}
 
.rslides li {
 
  -webkit-backface-visibility: hidden;
 
  position: absolute;
 
  display: none;
 
  width: 100%;
 
  left: 0;
 
  top: 0;
 
}
 
.rslides li:first-child {
 
  position: relative;
 
  display: block;
 
  float: left;
 
}
 
.rslides img {
 
  height: auto;
 
  border: 0;
 
}
 
.callbacks_tabs{
 
list-style: none;
 
position: absolute;
 
top: 84%;
 
z-index: 999;
 
left: 47%;
 
padding: 0;
 
margin: 0;
 
}
 
.callbacks_tabs li{
 
display:inline-block;
 
}
 
@media screen and (max-width: 600px) {
 
  h1 {
 
    font: 24px/50px "Helvetica Neue", Helvetica, Arial, sans-serif;
 
    }
 
  .callbacks_nav {
 
    top: 47%;
 
    }
 
}
 
/*----*/
 
.callbacks_tabs a{
 
visibility: hidden;
 
}
 
.callbacks_tabs a:after {
 
  content: "\f111";
 
  font-size:0;
 
  font-family: FontAwesome;
 
  visibility: visible;
 
  display: block;
 
  height:16px;
 
  width:16px;
 
  display:inline-block;
 
  border:2px solid #FFF;
 
  border-radius: 30px;
 
  -webkit-border-radius: 30px;
 
  -moz-border-radius: 30px;
 
  -o-border-radius: 30px;
 
  -ms-border-radius: 30px;
 
}
 
.callbacks_here a:after{
 
border:2px solid #23B7A4;
 
}
 
.slide-text-info h1{
 
font-weight: 400;
 
text-transform: uppercase;
 
padding: 0.4em 0em;
 
margin: 0.4em 0 0.1em;
 
display: inline-block;
 
}
 
.slide-text-info P{
 
width: 66%;
 
}
 
/*----*/
 
.slide-btns{
 
margin:0;
 
padding:0;
 
}
 
.slide-btns a{
 
display:inline-block;
 
}
 
.slide-btns a{
 
text-decoration:none;
 
color:#fff;
 
border-radius:4px;
 
-webkit-border-radius:4px;
 
-moz-border-radius:4px;
 
-o-border-radius:4px;
 
-ms-border-radius:4px;
 
padding:10px 20px;
 
transition:0.5s all;
 
}
 
.slide-btns a.startnow{
 
background:#23B7A4;
 
border:2px solid #23B7A4;
 
}
 
.slide-btns a.startnow:hover{
 
border:2px solid #fff;
 
background:none;
 
}
 
.slide-btns a.livedemo{
 
margin-left:0.6em;
 
border:2px solid #fff;
 
}
 
.slide-btns a.livedemo:hover{
 
background:#23B7A4;
 
border:2px solid #23B7A4;
 
}
 
/*----//slider----*/
 
/*----content----*/
 
.content-we {
 
padding:4em 0em 3em 0em;
 
}
 
.content-we  h2 span{
 
background:#E1E6EA;
 
padding: 0px 8px;
 
margin-right: 0.5em;
 
}
 
.content-we h2{
 
font-size:2.5em;
 
font-weight:400;
 
text-transform: uppercase;
 
}
 
.content-we h2 a{
 
text-decoration:none;
 
}
 
.content-we h2 a:hover{
 
color:#23B7A4;
 
}
 
.para-matter p{
 
font-size:1.2em;
 
color:#ABADAF;
 
line-height: 28px;
 
}
 
.para-matter p.sit{
 
margin-bottom:2em;
 
}
 
.face  ul{
 
padding:0;
 
margin:0;
 
}
 
.face li{
 
float:left;
 
display:inline-block;
 
}
 
.face li a span{
 
background:url(../images/sprite-1.png)no-repeat 0px 0px;
 
width:62px;
 
height:70px;
 
display:inline-block;
 
}
 
.face li a:hover span{
 
opacity:0.8;
 
}
 
.face li a.twitter span{
 
background-position:-63px 0px;
 
}
 
.face li a.gmail span{
 
background-position:-124px 0px;
 
}
 
.face li a.dribble span{
 
background-position:-186px 0px;
 
}
 
.face li a.been span{
 
background-position:-248px 0px;
 
}
 
 
.face {
 
padding: 2em 0em 6em 0em;
 
}
 
.top-list-left{
 
float:left;
 
}
 
.top-list-right a{
 
text-decoration:none;
 
}
 
.top-list-right a:hover{
 
color:#23B7A4;
 
}
 
.top-list-right{
 
float:right;
 
width: 85%;
 
padding:0;
 
margin:0;
 
}
 
.top-list-left label{
 
background:#23B7A4;
 
padding: 15px 17px;
 
color: #fff;
 
font-size: 1.2em;
 
font-weight:400;
 
margin-top: 5px;
 
}
 
.top-list-right h4{
 
text-transform:uppercase;
 
}
 
.top-list-right p{
 
width: 90%;
 
color:#ABADAF;
 
font-size: 1.13em;
 
line-height: 28px;
 
}
 
.top-list-middle{
 
padding:1em 0px;
 
}
 
.content-top{
 
border-bottom:1px solid #ABADAF;
 
}
 
/*---content-we-are---*/
 
.content-we-are {
 
margin: 0em 0em 7em;
 
}
 
.image-matter{
 
background: #E1E6EA;
 
padding: 0em 0 0.2em;
 
margin: 15px 17px;
 
}
 
.image-matter:hover{
 
background:#3A454D;
 
color:#fff;
 
}
 
.image-bro h4{
 
text-transform:uppercase;
 
}
 
.image-bro {
 
margin: 14px;
 
}
 
.image-bro p{
 
color:#A3A6A9;
 
}
 
.image-matter img:hover{
 
opacity:0.8;
 
}
 
/*----- img-social-stags -----*/
 
ul.img-social-stags{
 
margin:0;
 
padding:0;
 
display:none;
 
position:absolute;
 
top:50%;
 
left:23%;
 
}
 
ul.img-social-stags li{
 
display:inline-block;
 
}
 
ul.img-social-stags li a span{
 
width:52px;
 
height:52px;
 
display:inline-block;
 
background:url(../images/ic.png) no-repeat 0px 0px;
 
}
 
ul.img-social-stags li a.twitter span{
 
background-position:0px 0px;
 
}
 
ul.img-social-stags li a.facebook span{
 
background-position: -53px 0px;
 
}
 
ul.img-social-stags li a.linkedin span{
 
background-position: -106px 0px;
 
}
 
.image-matter:hover ul.img-social-stags{
 
display:block;
 
}
 
ul.img-social-stags li a:hover{
 
opacity:0.8;
 
}
 
/*---work----*/
 
.content-part-work{
 
background:#3A454D;
 
}
 
.content-work {
 
padding:4em 0em 3em 0em;
 
}
 
.content-work  h2 span{
 
background:#4E5A62;
 
padding: 0px 8px;
 
margin-right: 0.5em;
 
}
 
.content-work h2 a{
 
color:#fff;
 
text-decoration:none;
 
}
 
.content-work h2 a:hover{
 
color:#23B7A4;
 
}
 
.content-work h2{
 
color:#fff;
 
font-size:2.5em;
 
font-weight:400;
 
text-transform: uppercase;
 
}
 
.partnership{
 
background:#7898AD;
 
margin: 0px 0px 30px;
 
}
 
.partnership span{
 
width:34px;
 
height:40px;
 
background:url(../images/plus.png) no-repeat 0px 0px;
 
}
 
.partnership span.plus{
 
position: absolute;
 
top: 38%;
 
left: 45%;
 
display: none;
 
}
 
.partnership:hover  span.plus{
 
display:block;
 
}
 
 
 
p.partnership-guid {
 
background:#292F36;
 
position: absolute;
 
width: 92.5%;
 
display: none;
 
font-size: 1.2em;
 
text-transform: uppercase;
 
font-weight: 800;
 
color: #fff;
 
padding: 1em 1em 1em;
 
top: 12.5em;
 
}
 
.partnership:hover p.partnership-guid{
 
display:block;
 
}
 
/*---show--*/
 
.show-me{
 
text-align:center;
 
margin: 2em 0em 4em;
 
}
 
.show-me a{
 
 
color:#fff;
 
border-radius:4px;
 
-webkit-border-radius:4px;
 
-moz-border-radius:4px;
 
-o-border-radius:4px;
 
-ms-border-radius:4px;
 
padding:12px 20px;
 
text-decoration:none;
 
transition:0.5s all;
 
}
 
.show-me a.show-more{
 
border:2px solid #fff;
 
}
 
.show-me a:hover.show-more{
 
border:2px solid #23B7A4;
 
background:#23B7A4;
 
}
 
/*---what---*/
 
.easy-them{
 
text-align:center;
 
margin: 2em 0px;
 
}
 
.easy-them img{
 
padding:0px 6em;
 
}
 
.easy-them h4{
 
text-transform:uppercase;
 
}
 
.easy-them  a{
 
 
text-decoration:none;
 
}
 
.easy-them  a:hover{
 
color:#23B7A4;
 
}
 
.easy-them p{
 
line-height:26px;
 
width: 94%;
 
font-size: 1em;
 
}
 
.content-what {
 
margin: 0px 0px 3em;
 
}
 
/*---features----*/
 
.content-features{
 
background: #3A454D;
 
padding: 0em 0px 6em;
 
}
 
.features-grass{
 
color:#fff;
 
}
 
.features-grass h4{
 
text-transform:uppercase;
 
padding: 2em 0px 0.7em;
 
}
 
.features-grass  a{
 
color:#fff;
 
text-decoration:none;
 
}
 
.features-grass  a:hover{
 
color:#23B7A4;
 
}
 
.features-grass p{
 
line-height: 25px;
 
font-size: 1em;
 
}
 
/*--touch--*/
 
.content-we-touch{
 
padding:4em 0em 3em 0em;
 
}
 
.content-we-touch  h2 span{
 
background:#E1E6EA;
 
padding: 0px 8px;
 
margin-right: 0.5em;
 
}
 
.content-we-touch h2 a{
 
text-decoration:none;
 
}
 
.content-we-touch h2 a:hover{
 
color:#23B7A4;
 
}
 
.content-we-touch h2{
 
font-size:2.5em;
 
font-weight:400;
 
text-transform: uppercase;
 
}
 
.map {
 
position:relative;
 
}
 
.map span{
 
background: rgba(0, 0, 0, 0.46);
 
min-height: 300px;
 
width: 100%;
 
position: absolute;
 
top: 0;
 
}
 
.map iframe{
 
width:100%;
 
min-height:300px;
 
border:none;
 
}
 
.contact-info{
 
 
margin:2em 0px;
 
}
 
.content-stay {
 
margin:0px 0px 4em;
 
}
 
.contact-info h3{
 
text-transform:uppercase;
 
}
 
.contact-info  a {
 
text-decoration:none;
 
}
 
.contact-info  a:hover h3{
 
color:#23B7A4;
 
}
 
.contact-info p.info{
 
padding:8px 0px;
 
font-size: 1.2em;
 
color: #ABADAF;
 
line-height: 28px;
 
}
 
.contact-form{
 
background:#fff;
 
padding: 2em;
 
}
 
.your-name{
 
color:#ABADAF;
 
font-size:1.2em;
 
}
 
.your-name:hover{
 
color: #23B7A4;
 
}
 
.your-name input[type="text"] {
 
width: 100%;
 
outline: none;
 
margin: 6px 0px;
 
padding: 15px 8px;
 
background: #E6E9EC;
 
border: none;
 
border-radius: 3px;
 
}
 
.your-name input[type="text"]:hover{
 
background:#AEE5D6;
 
}
 
.your-msg:hover{
 
color: #23B7A4;
 
}
 
.your-msg  textarea {
 
width: 100%;
 
outline: none;
 
margin: 12px 0px;
 
padding: 14px 8px;
 
background: #E6E9EC;
 
border: none;
 
border-radius: 3px;
 
resize: none;
 
}
 
.your-msg  textarea:hover{
 
background:#AEE5D6;
 
}
 
.your-submit  input[type="submit"] {
 
background: #23B7A4;
 
outline: none;
 
font-size: 20px;
 
margin: 16px 0px;
 
border: none;
 
border-radius: 6px;
 
padding: 10px 18px;
 
color: #fff;
 
transition: 0.5s all;
 
}
 
.your-submit  input[type="submit"]:hover{
 
background:#07695C;
 
}
 
.your-msg{
 
color:#ABADAF;
 
font-size:1.2em;
 
}
 
.contact-box {
 
position:relative;
 
}
 
.contact-form{
 
position:absolute;
 
right:0;
 
top:-150px;
 
}
 
/*---footer--*/
 
#toTop {
 
display: none;
 
text-decoration: none;
 
position: fixed;
 
bottom: 10px;
 
right: 10px;
 
overflow: hidden;
 
width: 60px;
 
height: 56px;
 
border: none;
 
text-indent: 100%;
 
background:url(../images/top-move.png) no-repeat 0px 0px;
 
}
 
.footer{
 
background:#3A454D;
 
}
 
.footer-class{
 
float:left;
 
color:#fff;
 
font-size:1.2em;
 
 
}
 
.footer-class p a{
 
color:#fff;
 
text-decoration:none;
 
}
 
.footer-class p a:hover{
 
color:#23B7A4;
 
}
 
.footer-class-right{
 
float:right;
 
}
 
.footer-class-right ul li{
 
display:inline-block;
 
}
 
.footer-class-right ul{
 
padding:0;
 
margin:0;
 
}
 
.footer-class-right  ul li a span{
 
width:32px;
 
height:36px;
 
display:inline-block;
 
background:url(../images/2.png) no-repeat 0px 0px;
 
}
 
.footer-class-right  ul li a.facebook  span{
 
background-position:-32px 0px;
 
}
 
.footer-class-right  ul li a.skype span{
 
background-position:-64px 0px;
 
}
 
.footer-class-right  ul li a.been span{
 
background-position:-102px 0px;
 
}
 
.footer-class-right  ul li a.linkedin span{
 
background-position:-135px 0px;
 
}
 
.footer-top {
 
padding:4em 0px 5em;
 
}
 
/*---responsive media quaries---*/
 
@media only screen and (max-width:1366px){
 
}
 
/*---responsive media quaries---*/
 
@media only screen and (max-width:1280px){
 
}
 
@media only screen and (max-width:1024px){
 
.slide-text-info P {
 
width: 75%;
 
font-size: 0.9em;
 
}
 
.slide-btns {
 
font-size: 0.9em;
 
}
 
.top-list-right {
 
width: 82%;
 
}
 
ul.img-social-stags {
 
top: 48%;
 
left: 19%;
 
}
 
p.partnership-guid {
 
width: 91%;
 
top: 9.5em;
 
}
 
}
 
@media only screen and (max-width:768px){
 
.logo {
 
margin-top: 2px;
 
}
 
.nav {
 
right: 18px;
 
background:#fff;
 
}
 
.menu li a {
 
padding: 0;
 
}
 
.menu li {
 
margin: 1em 0 ;
 
}
 
.menu li.active a {
 
border-bottom:1px solid #ddd;
 
border-top:none;
 
border-left:none;
 
border-right:none;
 
}
 
.menu li a {
 
border-bottom:1px solid #ddd;
 
border-top:none;
 
border-left:none;
 
border-right:none;
 
}
 
.menu li a:hover{
 
border-bottom:1px solid #ddd;
 
border-top:none;
 
border-left:none;
 
border-right:none;
 
}
 
.callbacks .caption {
 
left: 14%;
 
top: 10%;
 
}
 
.slide-text-info h1 {
 
font-size: 32px;
 
}
 
.slide-text-info P {
 
font-size: 16px;
 
}
 
.slide-btns a {
 
padding: 6px 15px;
 
}
 
.content-top {
 
padding: 2em;
 
}
 
.image-matter {
 
 
margin: 15px 210px;
 
}
 
ul.img-social-stags {
 
left: 39%;
 
top: 56%;
 
}
 
.partnership {
 
 
margin: 0px 177px 30px;
 
}
 
p.partnership-guid {
 
width: 48.7%;
 
top: 12.7em;
 
}
 
.partnership span.plus {
 
top: 34%;
 
left: 48%;
 
}
 
.easy-them img {
 
padding: 0px 22em;
 
}
 
.easy-them p {
 
width: 34%;
 
margin: 0px 17em;
 
}
 
.contact-form{
 
top:17em;
 
}
 
.footer-top {
 
padding: 35.5em 0px 1em;
 
}
 
}
 
@media only screen and (max-width:640px){
 
.logo {
 
margin-top: 2px;
 
}
 
.nav {
 
right: 18px;
 
background:#fff;
 
}
 
.menu li a {
 
padding: 0;
 
}
 
.menu li {
 
margin: 1em 0 ;
 
}
 
.menu li.active a {
 
border-bottom:1px solid #ddd;
 
border-top:none;
 
border-left:none;
 
border-right:none;
 
}
 
.menu li a {
 
border-bottom:1px solid #ddd;
 
border-top:none;
 
border-left:none;
 
border-right:none;
 
}
 
.menu li a:hover{
 
border-bottom:1px solid #ddd;
 
border-top:none;
 
border-left:none;
 
border-right:none;
 
}
 
.callbacks .caption {
 
left: 14%;
 
top: 10%;
 
}
 
.slide-text-info h1 {
 
font-size: 26px;
 
}
 
.slide-text-info P {
 
font-size: 14px;
 
}
 
.slide-btns a {
 
padding: 6px 15px;
 
font-size: 16px;
 
}
 
.callbacks_tabs {
 
left: 44%;
 
}
 
.content-top {
 
padding: 2em;
 
}
 
ul.img-social-stags {
 
left: 37%;
 
top: 56%;
 
}
 
.image-matter {
 
 
margin: 15px 147px;
 
}
 
.partnership {
 
 
margin: 0px 115px 30px;
 
}
 
p.partnership-guid {
 
width: 58.5%;
 
top: 12.7em;
 
}
 
.partnership span.plus {
 
top: 34%;
 
left: 48%;
 
}
 
.easy-them img {
 
padding: 0px 18em;
 
}
 
.easy-them p {
 
width: 40%;
 
margin: 0px 12.5em;
 
}
 
.contact-form{
 
top:17em;
 
}
 
.footer-top {
 
padding: 34.5em 0px 1em;
 
}
 
}
 
@media only screen and (max-width:480px){
 
.logo {
 
margin-top: 2px;
 
}
 
.nav {
 
right: 10px;
 
background:#fff;
 
}
 
.menu li a {
 
padding: 0;
 
}
 
.menu li {
 
margin: 1em 0 ;
 
}
 
.menu li.active a {
 
border-bottom:1px solid #ddd;
 
border-top:none;
 
border-left:none;
 
border-right:none;
 
}
 
.menu li a {
 
border-bottom:1px solid #ddd;
 
border-top:none;
 
border-left:none;
 
border-right:none;
 
}
 
.menu li a:hover{
 
border-bottom:1px solid #ddd;
 
border-top:none;
 
border-left:none;
 
border-right:none;
 
}
 
.callbacks .caption {
 
left: 12%;
 
top: -7%;
 
}
 
.slide-text-info h1 {
 
font-size: 21px;
 
padding:0;
 
}
 
.callbacks_nav {
 
top:47%;
 
left:1%;
 
}
 
.slide-text-info P {
 
font-size: 13px;
 
}
 
.slide-btns a {
 
padding: 6px 15px;
 
font-size:14px;
 
}
 
.content-top {
 
padding: 2em;
 
}
 
ul.img-social-stags {
 
left: 39%;
 
top: 56%;
 
}
 
.partnership {
 
 
margin: 0px 34px 30px;
 
}
 
.image-matter {
 
 
margin: 15px 67px;
 
}
 
p.partnership-guid {
 
width: 78.9%;
 
top: 12.7em;
 
}
 
.callbacks_tabs {
 
left: 40%;
 
top:82%;
 
}
 
.partnership span.plus {
 
top: 34%;
 
left: 32%;
 
}
 
.easy-them img {
 
padding: 0px 12em;
 
}
 
.easy-them p {
 
width: 54%;
 
margin: 0px 7em;
 
}
 
.contact-form{
 
top:17em;
 
}
 
.footer-top {
 
padding: 32.5em 0px 1em;
 
}
 
}
 
/*---responsive media quaries---*/
 
@media only screen and (max-width:320px){
 
.logo {
 
margin-top: 2px;
 
}
 
.nav {
 
right: 6px;
 
background:#fff;
 
}
 
.menu li a {
 
padding: 0;
 
}
 
.menu li {
 
margin: 1em 0 ;
 
}
 
.menu li.active a {
 
border-bottom:1px solid #ddd;
 
border-top:none;
 
border-left:none;
 
border-right:none;
 
}
 
.menu li a {
 
border-bottom:1px solid #ddd;
 
border-top:none;
 
border-left:none;
 
border-right:none;
 
}
 
.menu li a:hover{
 
border-bottom:1px solid #ddd;
 
border-top:none;
 
border-left:none;
 
border-right:none;
 
}
 
.callbacks .caption {
 
left: 14%;
 
top: -17%;
 
}
 
.slide-text-info h1 {
 
font-size: 14px;
 
padding: 0;
 
width: 64%;
 
line-height: 1.5em;
 
margin-top: 1.5em;
 
}
 
.slide-btns a.startnow {
 
border: 1px solid #23B7A4;
 
}
 
.callbacks_nav {
 
top:47%;
 
left:1%;
 
}
 
.slide-text-info P {
 
font-size: 12px;
 
width: 100%;
 
height: 30px;
 
overflow: hidden;
 
}
 
.slide-btns a {
 
padding: 3px 12px;
 
font-size: 10px;
 
}
 
.top-list-right p {
 
font-size: 1em;
 
}
 
.content-we h2 {
 
font-size:23px;
 
}
 
.top-list-right {
 
width: 70%;
 
}
 
.content-we {
 
padding: 0em ;
 
}
 
.content-work{
 
padding: 0em ;
 
}
 
.content-top {
 
padding: 0em;
 
}
 
ul.img-social-stags {
 
left: 24%;
 
top: 56%;
 
}
 
.content-we-touch {
 
padding: 0px;
 
}
 
.face {
 
padding: 1em 0em;
 
}
 
.top-list-middle {
 
padding: 0em 0px;
 
}
 
.content-work h2 {
 
font-size:23px;
 
}
 
.partnership {
 
 
margin: 0px 0px 30px;
 
}
 
p.partnership-guid {
 
width: 90%;
 
top: 8.7em;
 
 
}
 
.image-matter {
 
 
margin: 15px 0px;
 
}
 
.para-matter p {
 
font-size: 1em;
 
}
 
.contact-info p.info {
 
font-size: 1em;
 
padding:0;
 
}
 
.callbacks_tabs {
 
left: 37%;
 
top:77%;
 
}
 
.partnership span.plus {
 
top: 34%;
 
left: 45%;
 
}
 
.easy-them img {
 
padding: 0px 7em;
 
}
 
.easy-them p {
 
width: 100%;
 
margin: 0px;
 
}
 
.content-we-touch h2 {
 
font-size:23px;
 
}
 
.contact-info h3 {
 
font-size: 20px;
 
}
 
.content-features {
 
 
padding: 0em 0px 2em;
 
}
 
.contact-form{
 
top:17em;
 
}
 
.easy-them {
 
 
margin: 1em 0px;
 
}
 
.contact-form {
 
 
padding: 1em 15px;
 
}
 
.footer-class-right {
 
float: left;
 
}
 
.features-grass h4 {
 
 
padding: 0px ;
 
}
 
.footer-top {
 
padding: 32.5em 0px 1em;
 
}
 
}
 
 
 
 
 
 
.logo{
 
float:left;
 
margin-top:em;
 
}
 
</style>
 
<script>
 
 
 
 
 
var donghua=document.getElementById('donghua');
 
            donghua.style.display='block';
 
            setTimeout(function(){
 
                donghua.style.display='none';
 
            },7000)
 
</script>
 
 
</head>
 
 
<body>
 
<body>
 
 
<!-- 导航 -->
 
<!-- 导航 -->
 
<nav class="navbar  navbar-default" style="margin-bottom:0px;background-color: #16181b;border-color: #16181b;border-radius: 0px;">
 
<nav class="navbar  navbar-default" style="margin-bottom:0px;background-color: #16181b;border-color: #16181b;border-radius: 0px;">
Line 1,394: Line 58:
 
                     <a href="http : //2017.igem.org/Team : AHUT_China/Project" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Project</span></a>
 
                     <a href="http : //2017.igem.org/Team : AHUT_China/Project" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Project</span></a>
 
                     <ul class="dropdown-menu">
 
                     <ul class="dropdown-menu">
                         <li><a href="https://2017.igem.org/Http_:_//2017.igem.org/Team_:_AHUT_China/Pathway&Design">Pathway&Design</a></li>
+
                         <li><a href="https://2017.igem.org/Team:AHUT_China/Design">Pathway&Design</a></li>
                         <li><a href="Http_:_//2017.igem.org/Team_:_AHUT_China/Biobrick">Biobrick</a></li>
+
                         <li><a href="https://2017.igem.org/Http_:_//2017.igem.org/Team_:_AHUT_China/Biobrick">Biobrick</a></li>
                         <li><a href="Http_:_//2017.igem.org/Team_:_AHUT_China/protocds">protocds</a></li>
+
                         <li><a href="https://2017.igem.org/Team:AHUT_China/Http_:_//2017.igem.org/Team_:_AHUT_China/Http_:_//2017.igem.org/Team_:_AHUT_China/protocols">protocols</a></li>
 
                          
 
                          
 
                         <li><a href="Http_:_//2017.igem.org/Team_:_AHUT_China/Notebook">Notebook</a></li>
 
                         <li><a href="Http_:_//2017.igem.org/Team_:_AHUT_China/Notebook">Notebook</a></li>
 
                        
 
                        
                         <li><a href="Http_:_//2017.igem.org/Team_:_AHUT_China/Lab Pictures">Lab Pictures</a></li>
+
                         <li><a href="https://2017.igem.org/Team:AHUT_China/Http_:_//2017.igem.org/Team_:_AHUT_China/Lab_Pictures">Lab Pictures</a></li>
                         <li><a href="Http_:_//2017.igem.org/Team_:_AHUT_China/future work">future work</a></li>
+
                         <li><a href="https://2017.igem.org/Http_:_//2017.igem.org/Team_:_AHUT_China/future_work">future work</a></li>
 
                     </ul>
 
                     </ul>
 
                 </li>
 
                 </li>
Line 1,412: Line 76:
 
                     <ul class="dropdown-menu">
 
                     <ul class="dropdown-menu">
 
                         <li><a href="https://2017.igem.org/Team:AHUT_China/HP/Silver">Silver</a></li>
 
                         <li><a href="https://2017.igem.org/Team:AHUT_China/HP/Silver">Silver</a></li>
                         <li><a href="https://2017.igem.org/Team:AHUT_China/HP/Gold_Integrated">Gold</a></li>
+
                         <li><a href="https://2017.igem.org/Team:AHUT_China/HP/Gold_Integrated">Gold_Integrated</a></li>
 
                         <li><a href="https://2017.igem.org/Team:AHUT_China/Engagement">Engagement</a></li>
 
                         <li><a href="https://2017.igem.org/Team:AHUT_China/Engagement">Engagement</a></li>
                         <li><a href="Http_:_//2017.igem.org/Team_:_AHUT_China/integrated_practices">integrated practices</a></li>
+
                          
 
                     </ul>
 
                     </ul>
 
                 </li>
 
                 </li>
 
                 <li class="dropdown">
 
                 <li class="dropdown">
                     <a href="Http_:_//2017.igem.org/Team_:_AHUT_China/Description" >Description</span></a>
+
                     <a href="https://2017.igem.org/Http_:_//2017.igem.org/Team_:_AHUT_China/Description" >Description</span></a>
 
                      
 
                      
 
                 </li>
 
                 </li>
 
                 <li class="dropdown">
 
                 <li class="dropdown">
                     <a href="Http_:_//2017.igem.org/Team_:_AHUT_China/Proof" >Proof</span></a>
+
                     <a href="https://2017.igem.org/Http_:_//2017.igem.org/Team_:_AHUT_China/Proof" >Proof</span></a>
 
                  
 
                  
 
                 </li>
 
                 </li>
<li class="dropdown">
+
 
                    <a href="https://2017.igem.org/Team:AHUT_China/InterLab" >InterLab</span></a>
+
 
                  
 
                  
                </li>
+
 
 
                 <li class="dropdown">
 
                 <li class="dropdown">
 
                     <a href="https://2017.igem.org/Team:AHUT_China/Demonstrate" >Demonstrate</span></a>
 
                     <a href="https://2017.igem.org/Team:AHUT_China/Demonstrate" >Demonstrate</span></a>
Line 1,442: Line 105:
  
  
<div id="carousel-example" class="carousel slide" data-ride="carousel" style="height: auto">
+
<!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
<!--Indicators-->
+
<script src="//cdn.bootcss.com/jquery/1.11.3/jquery.min.js"></script>
    <ol class="carousel-indicators">
+
 
        <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
+
 
        <li data-target="#carousel-example-generic" data-slide-to="1"></li>
+
<!----- 导航结束---->
        <li data-target="#carousel-example-generic" data-slide-to="2"></li>
+
<!---滚动图片--->
    </ol>
+
<!----start-slider-script---->
 +
<script src="http://oyla114lp.bkt.clouddn.com/responsiveslides.min.js?action=raw&ctype=text/javascript" type="text/javascript" ></script>
 +
<script>
 +
    // You can also use "$(window).load(function() {"
 +
    $(function () {
 +
      // Slideshow 4
 +
      $("#slider4").responsiveSlides({
 +
        auto: true,
 +
        pager: true,
 +
        nav: true,
 +
        speed: 500,
 +
        namespace: "callbacks",
 +
        before: function () {
 +
          $('.events').append("<li>before event fired.</li>");
 +
        },
 +
        after: function () {
 +
          $('.events').append("<li>after event fired.</li>");
 +
        }
 +
      });
 +
 +
    });
 +
  </script>
  
<!-- Slideshow 4 -->
+
<!----//End-slider-script---->
 +
<!-- Slideshow 4 -->
 
    <div  id="top" class="callbacks_container">
 
    <div  id="top" class="callbacks_container">
 
      <ul class="rslides" id="slider4">
 
      <ul class="rslides" id="slider4">
 
        <li>
 
        <li>
          <img src="http://oyeu0gk8v.bkt.clouddn.com/%E8%BF%B7%E5%AE%AB2.png" alt="">
+
          <img src="http://oyla114lp.bkt.clouddn.com/paper1.jpg" alt="">
 
<div class="caption bounceInDown" data-wow-delay="0.4s">
 
<div class="caption bounceInDown" data-wow-delay="0.4s">
 
          <div class="slide-text-info">
 
          <div class="slide-text-info">
          <h1>welcome to our marketplace</h1>
+
          <h1>Biocompass 3.0: The Maze Runner</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit.Sed nisi metus,tristique ndolor non,ornare sagittis dolor.Nulla vestibulu lacus...</p>
+
<p>&nbsp;&nbsp;&nbsp;&nbsp;Hello! Welcome to get to know the project designed by one of the iGEM representatives from AHUT_China of 2017. This year we conceive a small plan in which synthetic biology will be applied to help Thomas and his friends to escape from the imprisoned mobile maze.<br>&nbsp;&nbsp;&nbsp;&nbsp;We have designed a black box. There lies single-strand DNA showing the joint points and roads of the maze. Both of them will change as time files. We implemented a set of integrated experiment to help Thomas and his group to find the exit successfully in spite of facing the already changed maze.<br>&nbsp;&nbsp;&nbsp;&nbsp;As a method for mathematical problems, Not only will our project help Thomas and his friends in the future but also it will possibly work as the server of the Internet cloud. It will then be used to provide people with the remote computing service of the navigation software. </p>
 
          <div class="slide-btns">
 
          <div class="slide-btns">
          <a class="startnow" href="#">VIWE MORE</a>
+
          <div class="slide-btns">
          <a class="livedemo" href="#">VIDEO TOUR</a>
+
          <a class="startnow" href="#">ABOUT</a>
 +
          <a class="livedemo" href="http://oyla114lp.bkt.clouddn.com/%E5%BA%8F%E5%88%97%2001.mp4">VIDEO</a>
 
          </div>
 
          </div>
 
          </div>
 
          </div>
Line 1,467: Line 153:
 
        </li>
 
        </li>
 
        <li>
 
        <li>
          <img src="http://seopic.699pic.com/photo/50005/7674.jpg_wh1200.jpg" alt="">
+
          <img src="http://oyla114lp.bkt.clouddn.com/paper2.jpg" alt="">
 
        <div class="caption">
 
        <div class="caption">
 
          <div class="slide-text-info bounceInDown" data-wow-delay="0.4s">
 
          <div class="slide-text-info bounceInDown" data-wow-delay="0.4s">
          <h1>welcome to our marketplace</h1>
+
          <h1>Biocompass 3.0: The Maze Runner</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit.Sed nisi metus,tristique ndolor non,ornare sagittis dolor.Nulla vestibulu lacus...</p>
+
<p>&nbsp;&nbsp;&nbsp;&nbsp;Hello! Welcome to get to know the project designed by one of the iGEM representatives from AHUT_China of 2017. This year we conceive a small plan in which synthetic biology will be applied to help Thomas and his friends to escape from the imprisoned mobile maze.<br>&nbsp;&nbsp;&nbsp;&nbsp;We have designed a black box. There lies single-strand DNA showing the joint points and roads of the maze. Both of them will change as time files. We implemented a set of integrated experiment to help Thomas and his group to find the exit successfully in spite of facing the already changed maze.<br>&nbsp;&nbsp;&nbsp;&nbsp; As a method for mathematical problems, Not only will our project help Thomas and his friends in the future but also it will possibly work as the server of the Internet cloud. It will then be used to provide people with the remote computing service of the navigation software. </p>
 
          <div class="slide-btns">
 
          <div class="slide-btns">
          <a class="startnow" href="#">VIWE MORE</a>
+
          <a class="startnow" href="#">ABOUT</a>
          <a class="livedemo" href="#">VIDEO TOUR</a>
+
          <a class="livedemo" href="http://oyla114lp.bkt.clouddn.com/%E5%BA%8F%E5%88%97%2001.mp4">VIDEO</a>
 
          </div>
 
          </div>
 
          </div>
 
          </div>
Line 1,480: Line 166:
 
        </li>
 
        </li>
 
        <li>
 
        <li>
          <img src="http://oyeu0gk8v.bkt.clouddn.com/3.jpg" alt="">
+
          <img src="http://oyla114lp.bkt.clouddn.com/paper3.jpg" alt="">
 
          <div class="caption">
 
          <div class="caption">
 
          <div class="slide-text-info bounceInDown" data-wow-delay="0.4s">
 
          <div class="slide-text-info bounceInDown" data-wow-delay="0.4s">
          <h1>welcome to our marketplace</h1>
+
          <h1>Biocompass 3.0: The Maze Runner</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit.Sed nisi metus,tristique ndolor non,ornare sagittis dolor.Nulla vestibulu lacus...</p>
+
<p>&nbsp;&nbsp;&nbsp;&nbsp;Hello! Welcome to get to know the project designed by one of the iGEM representatives from AHUT_China of 2017. This year we conceive a small plan in which synthetic biology will be applied to help Thomas and his friends to escape from the imprisoned mobile maze.<br>&nbsp;&nbsp;&nbsp;&nbsp;We have designed a black box. There lies single-strand DNA showing the joint points and roads of the maze. Both of them will change as time files. We implemented a set of integrated experiment to help Thomas and his group to find the exit successfully in spite of facing the already changed maze.<br>&nbsp;&nbsp;&nbsp;&nbsp;As a method for mathematical problems, Not only will our project help Thomas and his friends in the future but also it will possibly work as the server of the Internet cloud. It will then be used to provide people with the remote computing service of the navigation software. </p>
 
          <div class="slide-btns">
 
          <div class="slide-btns">
          <a class="startnow" href="#">VIWE MORE</a>
+
          <div class="slide-btns">
          <a class="livedemo" href="#">VIDEO TOUR</a>
+
          <a class="startnow" href="#">ABOUT</a>
 +
          <a class="livedemo" href="http://oyla114lp.bkt.clouddn.com/%E5%BA%8F%E5%88%97%2001.mp4">VIDEO</a>
 
          </div>
 
          </div>
 
          </div>
 
          </div>
Line 1,495: Line 182:
 
    </div>          
 
    </div>          
 
    <div class="clearfix"> </div>
 
    <div class="clearfix"> </div>
<!----- //End-slider---->
+
<!----- //滚动图片结束---->
 
+
 
+
 
+
 
+
 
+
    <!-- Wrapper for slides -->
+
    <div class="carousel-inner" style="text-align:center">
+
        <div class="item active">
+
            <img style=" width:100%" alt="First slide" src="http://oyeu0gk8v.bkt.clouddn.com/%E8%BF%B7%E5%AE%AB2.png " slide></img>
+
        </div>
+
        <div class="item">
+
            <img style="width:100%" alt="Second slide" src="http://seopic.699pic.com/photo/50005/7674.jpg_wh1200.jpg" ></img>
+
        </div>
+
        <div class="item">
+
            <img style="width:100%" alt="Third slide" src="http://oyeu0gk8v.bkt.clouddn.com/3.jpg"  ></img>
+
        </div>
+
    </div>
+
 
+
    <!-- Controls -->
+
    <!--a class="left carousel-control" href="#carousel-example-generic" data-slide="prev">
+
        <span class="glyphicon glyphicon-chevron-left"></span>
+
    </a>
+
    <a class="right carousel-control" href="#carousel-example-generic" data-slide="next">
+
        <span class="glyphicon glyphicon-chevron-right"></span>
+
    </a-->
+
 
+
 
+
 
+
</div>
+
 
+
 
+
 
+
 
+
<h1>Biocompass: The Maze Runner</h1>
+
<h4> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Hello! Welcome to get to know the project designed by one of the iGEM representatives from AHUT_China of 2017. This year we conceive a small plan in which synthetic biology will be applied to help Thomas and his friends to escape from the imprisoned mobile maze.</h4>
+
<h4>&nbsp;&nbsp;&nbsp;&nbsp;We have designed a black box. There lies single-strand DNA showing the joint points and roads of the maze. Both of them will change as time files. We implemented a set of integrated experiment to help Thomas and his group to find the exit successfully in spite of facing the already changed maze.</h4>
+
<h4>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Not only will our project help Thomas and his friends in the future but also it will work as the server of the Internet cloud. It is used to provide people with the remote computing service of the navigation software.
+
 
+
 
+
</h4>
+
 
+
<!--页脚-->
+
<footer>
+
    <div class="container">
+
        <div class="row">
+
            <div class="col-sm-2">
+
                <h6>Copyright &copy;AHUT_China</h6>
+
            </div>
+
 
+
            <div class="col-sm-4">
+
                <h6>关于我们</h6>
+
                <p>
+
                    we are AHUT_China!
+
                </p>
+
            </div>
+
 
+
            <div class="col-sm-2">
+
                <h6>导航</h6>
+
                <ul class="unstyled">
+
                    <li><a href="">主页</a></li>
+
                    <li><a href="">服务</a></li>
+
                    <li><a href="">链接</a></li>
+
                    <li><a href="">联系我们</a></li>
+
                </ul>
+
            </div>
+
 
+
            <div class="col-sm-2">
+
                <h6>Follow us</h6>
+
                <ul class="unstyled">
+
                    <li><a href="">weibo</a></li>
+
                    <li><a href="">wechat</a></li>
+
                    <li><a href="">facebook</a></li>
+
                </ul>
+
            </div>
+
 
+
 
+
        </div>
+
    </div>
+
</footer><!--页脚结束-->
+
 
+
 
+
 
+
<!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
+
<script src="//cdn.bootcss.com/jquery/1.11.3/jquery.min.js"></script>
+
 
<!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
 
<!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
 
<script src="//cdn.bootcss.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
 
<script src="//cdn.bootcss.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
 
 
<script type="text/javascript" src="js/bootsnav.js"></script>
 
 
<script type="text/javascript">
 
    $('.carousel').carousel('cycle');
 
$(function() {
 
  $('#spinner').fadeOut();
 
})
 
</script>
 
 
</body>
 
</body>
 
</html>
 
</html>
 +
{{:Team:AHUT_China/buchongcss}}
 +
{{:Team:AHUT_China/footcss}}
 +
{{:Team:AHUT_China/foot}}

Latest revision as of 03:18, 2 November 2017

AHUT

  • Biocompass 3.0: The Maze Runner

        Hello! Welcome to get to know the project designed by one of the iGEM representatives from AHUT_China of 2017. This year we conceive a small plan in which synthetic biology will be applied to help Thomas and his friends to escape from the imprisoned mobile maze.
        We have designed a black box. There lies single-strand DNA showing the joint points and roads of the maze. Both of them will change as time files. We implemented a set of integrated experiment to help Thomas and his group to find the exit successfully in spite of facing the already changed maze.
        As a method for mathematical problems, Not only will our project help Thomas and his friends in the future but also it will possibly work as the server of the Internet cloud. It will then be used to provide people with the remote computing service of the navigation software.

  • Biocompass 3.0: The Maze Runner

        Hello! Welcome to get to know the project designed by one of the iGEM representatives from AHUT_China of 2017. This year we conceive a small plan in which synthetic biology will be applied to help Thomas and his friends to escape from the imprisoned mobile maze.
        We have designed a black box. There lies single-strand DNA showing the joint points and roads of the maze. Both of them will change as time files. We implemented a set of integrated experiment to help Thomas and his group to find the exit successfully in spite of facing the already changed maze.
         As a method for mathematical problems, Not only will our project help Thomas and his friends in the future but also it will possibly work as the server of the Internet cloud. It will then be used to provide people with the remote computing service of the navigation software.

  • Biocompass 3.0: The Maze Runner

        Hello! Welcome to get to know the project designed by one of the iGEM representatives from AHUT_China of 2017. This year we conceive a small plan in which synthetic biology will be applied to help Thomas and his friends to escape from the imprisoned mobile maze.
        We have designed a black box. There lies single-strand DNA showing the joint points and roads of the maze. Both of them will change as time files. We implemented a set of integrated experiment to help Thomas and his group to find the exit successfully in spite of facing the already changed maze.
        As a method for mathematical problems, Not only will our project help Thomas and his friends in the future but also it will possibly work as the server of the Internet cloud. It will then be used to provide people with the remote computing service of the navigation software.