Difference between revisions of "Team:UESTC-China/test11"

(Blanked the page)
 
(66 intermediate revisions by one other user not shown)
Line 1: Line 1:
<html lang="zh">
 
<head>
 
<meta charset="UTF-8">
 
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
 
<meta name="viewport" content="width=device-width, initial-scale=1.0">
 
<title>team</title>
 
<link rel="stylesheet" type="text/css" href="https://2018.igem.org/Template:UESTC-China/CSS/default?action=raw&amp;ctype=text/css" />
 
<link href="https://2018.igem.org/Template:UESTC-China/CSS/bootmin?action=raw&amp;ctype=text/css" rel="stylesheet">
 
<link href="https://2018.igem.org/Template:UESTC-China/CSS/font?action=raw&amp;ctype=text/css" rel="stylesheet">
 
<link rel="stylesheet" type="text/css" href="https://2018.igem.org/Template:UESTC-China/CSS/zzcs?action=raw&amp;ctype=text/css">
 
<link rel="stylesheet" type="text/css" href="https://2018.igem.org/Template:UESTC-China/CSS/bootnav?action=raw&amp;ctype=text/css">
 
<link rel="stylesheet" type="text/css" media="all" href="https://2018.igem.org/Template:UESTC-China/CSS/style?action=raw&amp;ctype=text/css">
 
<link rel="stylesheet" type="text/css" media="all" href="https://2018.igem.org/Template:UESTC-China/CSS/evenflow?action=raw&amp;ctype=text/css">
 
<link href="https://2018.igem.org/Template:UESTC-China/CSS/component?action=raw&amp;ctype=text/css">
 
<style type="text/css">
 
.evenflow li a{
 
background: none;
 
box-shadow: none;
 
}
 
btn-primary:hover{
 
background-color: none;
 
}
 
.md-perspective,
 
.md-perspective body {
 
height: 100%;
 
overflow: hidden;
 
}
 
  
.md-perspective body  {
 
background: #fff;
 
-webkit-perspective: 600px;
 
-moz-perspective: 600px;
 
perspective: 600px;
 
}
 
 
.container {
 
min-height: 100%;
 
}
 
 
.md-modal {
 
position: fixed;
 
top: 50%;
 
left: 50%;
 
width: 50%;
 
max-width: 550px;
 
min-width: 320px;
 
height: auto;
 
z-index: 9999999;
 
visibility: hidden;
 
-webkit-transform: translateX(-50%) translateY(-50%);
 
-moz-transform: translateX(-50%) translateY(-50%);
 
-ms-transform: translateX(-50%) translateY(-50%);
 
transform: translateX(-50%) translateY(-50%);
 
}
 
 
.md-show {
 
visibility: visible;
 
}
 
 
.md-overlay {
 
position: fixed;
 
width: 100%;
 
height: 100%;
 
visibility: hidden;
 
top: 0;
 
left: 0;
 
z-index: 9999995;
 
opacity: 0;
 
background: rgba(1,1,1,0.6);
 
-webkit-transition: all 0.3s;
 
-moz-transition: all 0.3s;
 
transition: all 0.3s;
 
}
 
 
.md-show ~ .md-overlay {
 
opacity: 1;
 
visibility: visible;
 
}
 
 
/* Content styles */
 
.md-content {
 
color: #5b5b5b;
 
background: #fff;
 
position: relative;
 
border-radius: 0px;
 
margin: 0 auto;
 
}
 
.md-content .md-close-btn {
 
position: absolute;
 
top: 10px;
 
right: 5px;
 
z-index: 999999;
 
}
 
.md-content .md-close-btn a{
 
color: #909090;
 
cursor: pointer;
 
}
 
.md-content .md-close-btn a:hover{
 
color: #212121;
 
}
 
.md-content .md-close {
 
font-size: 13px;
 
}
 
 
.md-content h3 {
 
font-size: 16px;
 
font-weight: 600;
 
margin: 0;
 
padding: 20px;
 
text-align: center;
 
background: #fff;
 
border-radius: 0;
 
color: #797979;
 
}
 
 
.md-content > div {
 
padding: 15px 40px 30px;
 
margin: 0;
 
font-weight: 300;
 
font-size: 14px;
 
}
 
 
.md-content > div p {
 
margin: 0;
 
padding: 10px 0;
 
}
 
 
.md-content > div ul {
 
margin: 0;
 
padding: 0 0 30px 20px;
 
}
 
 
.md-content > div ul li {
 
padding: 5px 0;
 
}
 
 
 
/* Individual modal styles with animations/transitions */
 
 
/* Effect 1: Fade in and scale up */
 
.md-effect-1 .md-content {
 
-webkit-transform: scale(0.7);
 
-moz-transform: scale(0.7);
 
-ms-transform: scale(0.7);
 
transform: scale(0.7);
 
opacity: 0;
 
-webkit-transition: all 0.3s;
 
-moz-transition: all 0.3s;
 
transition: all 0.3s;
 
}
 
.md-show.md-effect-1 .md-content {
 
-webkit-transform: scale(1);
 
-moz-transform: scale(1);
 
-ms-transform: scale(1);
 
transform: scale(1);
 
opacity: 1;
 
}
 
 
 
.hehe{
 
    height: 60px;
 
    color:#fff;
 
    font-size:12px;
 
    position:relative;
 
    z-index:inherite;
 
    background-color:#31b0d5;
 
    margin-top:880px;
 
    margin-bottom:-30px
 
}
 
.team .row{
 
    margin-right:  0px;
 
    margin-left: 0px;
 
}
 
        .mw-content-ltr ul, .mw-content-rtl .mw-content-ltr ul{
 
                margin:0.2em 0 0 0 !important;
 
                z-index=9999;
 
        }
 
        .containe{
 
                width:100%;
 
                margin-right:0px !important;
 
                margin-left:0px !important;
 
                position:fixed;
 
                top:0.5em;
 
                padding:0;
 
                z-index=9999;
 
        }
 
.navbar-brand{
 
padding: 29px 15px;
 
height: auto;
 
}
 
nav.navbar.bootsnav{
 
border: none;
 
margin-bottom: 150px;
 
}
 
.navbar-nav{
 
float: left
 
}
 
nav.navbar.bootsnav ul.nav > li > a{
 
color: #474747;
 
text-transform: uppercase;
 
padding: 20px 24px;
 
}
 
nav.navbar.bootsnav ul.nav > li:hover{
 
background: #f4f4f4;
 
}
 
.nav > li:after{
 
content: "";
 
width: 0;
 
height: 5px;
 
background: #34c9dd;
 
position: absolute;
 
bottom: 0;
 
left: 0;
 
transition: all 0.5s ease 0s;
 
}
 
.nav > li:hover:after{
 
width: 100%;
 
}
 
nav.navbar.bootsnav ul.nav > li.dropdown > a.dropdown-toggle:after{
 
content: "+";
 
font-family: 'FontAwesome';
 
font-size: 16px;
 
font-weight: 500;
 
position: absolute;
 
top: 35%;
 
right: 10%;
 
transition: all 0.4s ease 0s;
 
}
 
nav.navbar.bootsnav ul.nav > li.dropdown.on > a.dropdown-toggle:after{
 
content: "\f105";
 
transform: rotate(90deg);
 
}
 
.dropdown-menu.multi-dropdown{
 
position: absolute;
 
left: -100% !important;
 
}
 
nav.navbar.bootsnav li.dropdown ul.dropdown-menu{
 
box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
 
border: none;
 
}
 
@media only screen and (max-width:990px){
 
nav.navbar.bootsnav ul.nav > li.dropdown > a.dropdown-toggle:after,
 
nav.navbar.bootsnav ul.nav > li.dropdown.on > a.dropdown-toggle:after{ content: " "; }
 
.dropdown-menu.multi-dropdown{ left: 0 !important; }
 
nav.navbar.bootsnav ul.nav > li:hover{ background: transparent; }
 
nav.navbar.bootsnav ul.nav > li > a{ margin: 0; }
 
}
 
 
</style>
 
</head>
 
<body>
 
 
<div class="demo" style="padding: 0 0; z-index:9999">
 
<div class="containe" style="z-index:9999">
 
<div class="row" style="z-index:9999">
 
<div class="col-md-12" style="z-index:9999">
 
<nav class="navbar navbar-default navbar-mobile bootsnav" style="z-index:9999" >
 
<div class="navbar-header" style="height:60px; z-index:9999; border-bottom-style:solid; border-bottom-width:1px; border-bottom-color:#d9d9d9">
 
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#navbar-menu" style="margin-top:13px;">
 
<i class="fa fa-bars">&nbsp;UESTC-China</i>
 
</button>
 
</div>
 
<div class="collapse navbar-collapse" id="navbar-menu" style="border-bottom-style:solid; border-bottom-width:1px" style="z-index:9999">
 
<ul class="nav navbar-nav" data-in="fadeInDown" data-out="fadeOutUp">
 
                                                        <li><a href="https://2018.igem.org/Team:UESTC-China/">HOME</a></li>
 
<li><a href="https://2018.igem.org/Team:UESTC-China/achievement">ACHIEVEMENT</a></li>
 
<li class="dropdown">
 
<a href="https://2018.igem.org/Team:UESTC-China/project" class="dropdown-toggle" data-toggle="dropdown">PROJECT</a>
 
<ul class="dropdown-menu animated fadeOutUp">
 
<li><a href="https://2018.igem.org/Team:UESTC-China/project_introduction">Introduction</a></li>
 
<li><a href="https://2018.igem.org/Team:UESTC-China/project_design">Design</a></li>
 
<li><a href="https://2018.igem.org/Team:UESTC-China/project_demonstrate">Demonstrate</a></li>
 
<li><a href="https://2018.igem.org/Team:UESTC-China/project_part">Part</a></li>
 
</ul>
 
</li>
 
<li><a href="https://2018.igem.org/Team:UESTC-China/modeling">MODELING</a></li>
 
<li><a href="https://2018.igem.org/Team:UESTC-China/attributions">ATTRIBUTIONS</a></li>
 
<li class="dropdown">
 
<a href="https://2018.igem.org/Team:UESTC-China/hp" class="dropdown-toggle" data-toggle="dropdown">H&nbsp;&nbsp;P</a>
 
<ul class="dropdown-menu animated fadeOutUp">
 
<li><a href="https://2018.igem.org/Team:UESTC-China/hp_ourstory">Our Story</a></li>
 
<li><a href="https://2018.igem.org/Team:UESTC-China/hp_supportingresearch">Supporting Research</a></li>
 
<li><a href="https://2018.igem.org/Team:UESTC-China/hp_engagement">Engagement</a></li>
 
</ul>
 
</li>
 
<li class="dropdown">
 
<a href="https://2018.igem.org/Team:UESTC-China/team" class="dropdown-toggle" data-toggle="dropdown">TEAM</a>
 
<ul class="dropdown-menu animated fadeOutUp">
 
<li><a href="https://2018.igem.org/Team:UESTC-China/team_teamintroduction">Team Introduction</a></li>
 
<li><a href="https://2018.igem.org/Team:UESTC-China/team_collaborations">Collaborations</a></li>
 
</ul>
 
</li>
 
<li class="dropdown">
 
<a href="https://2018.igem.org/Team:UESTC-China/notebook" class="dropdown-toggle" data-toggle="dropdown">NOTEBOOK</a>
 
<ul class="dropdown-menu animated fadeOutUp">
 
<li><a href="#">Day Note</a></li>
 
<li><a href="#">.........</a></li>
 
<li><a href="#">..........</a></li>
 
<li><a href="#">..........</a></li>
 
<li><a href="#">........</a></li>
 
</ul>
 
</li>
 
</ul>
 
                                           
 
</div>
 
</nav>
 
</div>
 
                    <div class="logo" style="height:45px; width:112px; position: absolute;right: 20px;z-index: 9999;top: 10px;">
 
                        <a href="#">
 
    <img src="https://static.igem.org/mediawiki/2018/e/ee/T--UESTC-China--biglogo.jpg" width="112" height="45" >
 
</a>
 
                    </div>
 
</div>
 
</div>
 
</div>
 
 
<div class="team" style="margin-top:-30px; position:relative; width:100%; z-index=1; background-color:#000">
 
 
    <div class="team-title" style="width:1500px;margin-top:50px; position:absolute; position: absolute;right: 0;left: 0;margin-right: auto;margin-left:auto">
 
        <img src="https://static.igem.org/mediawiki/2018/f/f4/T--UESTC-China--mondrian.jpg" width="1500px" style=" position:absolute; position: absolute;right: 0;left: 0;margin-right: auto;margin-left: auto;max-width:none;">
 
        <ul class="evenflow sample_1">
 
<li class="evenflow_scale" style="width: 360px; height:400px; position: absolute; top:97px; left:132px;">
 
<a href="javascript:;" class="md-trigger btn btn-sm" data-modal="modal-yjz"><img src="https://static.igem.org/mediawiki/2018/c/cd/T--UESTC-China--yjz.png" style="width: 400px;height: 340px;"></a>
 
</li>
 
<li class="evenflow_scale" style="width: 280px; height:200px; position: absolute; top:466px; left:82px">
 
<a href="javascript:;" class="md-trigger btn btn-sm" data-modal="modal-wq"><img src="https://static.igem.org/mediawiki/2018/4/4f/T--UESTC-China--wq.png" style="width: 160px;height: 145px;"></a>
 
</li>
 
<li class="evenflow_scale" style="width: 280px; height:200px; position: absolute; top:290px; left:465px">
 
<a href="javascript:;" class="md-trigger btn btn-sm" data-modal="modal-zyx"><img src="https://static.igem.org/mediawiki/2018/thumb/1/13/T--UESTC-China--zyx.png/320px-T--UESTC-China--zyx.png"  style="width: 200px;height: 145px;"></a>
 
</li>
 
<li class="evenflow_scale" style="width: 280px; height:200px; position: absolute; top:480px; left:720px;">
 
<a href="javascript:;" class="md-trigger btn btn-sm" data-modal="modal-ths"><img src="https://static.igem.org/mediawiki/2018/b/b7/T--UESTC-China--ths.png" style="width: 200px;"></a>
 
</li>
 
<li class="evenflow_scale" style="width: 250px; height:200px; position: absolute; top:650px; left:110px;">
 
<a href="javascript:;" class="md-trigger btn btn-sm" data-modal="modal-plj"><img src="https://static.igem.org/mediawiki/2018/5/50/T--UESTC-China--plj.png" style="height: 180px;width: 200px;" ></a>
 
</li>
 
        <li class="evenflow_scale" style="width: 250px; height:200px; position: absolute; top:460px; left:275px;">
 
<a href="javascript:;" class="md-trigger btn btn-sm" data-modal="modal-zx"><img src="https://static.igem.org/mediawiki/2018/thumb/b/b3/T--UESTC-China--zx.png/600px-T--UESTC-China--zx.png" style="height: 160px;width: 160px;"></a>
 
</li>
 
        <li class="evenflow_scale" style="width: 250px; height:200px; position: absolute; top:560px; left:490px;">
 
<a href="javascript:;" class="md-trigger btn btn-sm" data-modal="modal-zl"><img src="https://static.igem.org/mediawiki/2018/5/59/T--UESTC-China--zl.png" style="height: 160px;width: 175px;"></a>
 
</li>
 
        <li class="evenflow_scale" style="width: 250px; height:200px; position: absolute; top:640px; left:720px;">
 
<a href="javascript:;" class="md-trigger btn btn-sm" data-modal="modal-pqc"><img src="https://static.igem.org/mediawiki/2018/8/83/T--UESTC-China--pqc.png" style="height: 160px;width: 170px;"></a>
 
</li>
 
 
</ul>
 
    </div>
 
   
 
 
    <div class="neirong" style="position:relative; z-index:1 ;padding:0 8%; ">
 
        <div class="container">
 
       
 
 
 
 
 
</div>
 
 
<div class="md-modal md-effect-1" id="modal-yjz">
 
    <div class="md-content">
 
      <h3>yjz</h3>
 
      <div>
 
        <p>This is a modal window. You can do the following things with it:</p>
 
        <ul>
 
          <li><strong>Read:</strong> modal windows will probably tell you something important so don't forget to read what they say.</li>
 
          <li><strong>Look:</strong> a modal window enjoys a certain kind of attention; just look at it and appreciate its presence.</li>
 
          <li><strong>Close:</strong> click on the button below to close the modal.</li>
 
        </ul>
 
        <button class="md-close btn-sm btn-primary">Close me!</button>
 
      </div>
 
    </div>
 
  </div>
 
 
<div class="md-modal md-effect-1" id="modal-wq">
 
    <div class="md-content">
 
      <h3>wq</h3>
 
      <div>
 
        <p>This is a modal window. You can do the following things with it:</p>
 
        <ul>
 
          <li><strong>Read:</strong> modal windows will probably tell you something important so don't forget to read what they say.</li>
 
          <li><strong>Look:</strong> a modal window enjoys a certain kind of attention; just look at it and appreciate its presence.</li>
 
          <li><strong>Close:</strong> click on the button below to close the modal.</li>
 
        </ul>
 
        <button class="md-close btn-sm btn-primary">Close me!</button>
 
      </div>
 
    </div>
 
  </div>
 
 
 
 
<div class="md-modal md-effect-1" id="modal-zyx">
 
    <div class="md-content">
 
      <h3>zyx</h3>
 
      <div>
 
        <p>This is a modal window. You can do the following things with it:</p>
 
        <ul>
 
          <li><strong>Read:</strong> modal windows will probably tell you something important so don't forget to read what they say.</li>
 
          <li><strong>Look:</strong> a modal window enjoys a certain kind of attention; just look at it and appreciate its presence.</li>
 
          <li><strong>Close:</strong> click on the button below to close the modal.</li>
 
        </ul>
 
        <button class="md-close btn-sm btn-primary">Close me!</button>
 
      </div>
 
    </div>
 
  </div>
 
 
<div class="md-modal md-effect-1" id="modal-ths">
 
    <div class="md-content">
 
      <h3>ths</h3>
 
      <div>
 
        <p>This is a modal window. You can do the following things with it:</p>
 
        <ul>
 
          <li><strong>Read:</strong> modal windows will probably tell you something important so don't forget to read what they say.</li>
 
          <li><strong>Look:</strong> a modal window enjoys a certain kind of attention; just look at it and appreciate its presence.</li>
 
          <li><strong>Close:</strong> click on the button below to close the modal.</li>
 
        </ul>
 
        <button class="md-close btn-sm btn-primary">Close me!</button>
 
      </div>
 
    </div>
 
  </div>
 
 
<div class="md-modal md-effect-1" id="modal-plj">
 
    <div class="md-content">
 
      <h3>plj</h3>
 
      <div>
 
        <p>This is a modal window. You can do the following things with it:</p>
 
        <ul>
 
          <li><strong>Read:</strong> modal windows will probably tell you something important so don't forget to read what they say.</li>
 
          <li><strong>Look:</strong> a modal window enjoys a certain kind of attention; just look at it and appreciate its presence.</li>
 
          <li><strong>Close:</strong> click on the button below to close the modal.</li>
 
        </ul>
 
        <button class="md-close btn-sm btn-primary">Close me!</button>
 
      </div>
 
    </div>
 
  </div>
 
 
<div class="md-modal md-effect-1" id="modal-zx">
 
    <div class="md-content">
 
      <h3>zx</h3>
 
      <div>
 
        <p>This is a modal window. You can do the following things with it:</p>
 
        <ul>
 
          <li><strong>Read:</strong> modal windows will probably tell you something important so don't forget to read what they say.</li>
 
          <li><strong>Look:</strong> a modal window enjoys a certain kind of attention; just look at it and appreciate its presence.</li>
 
          <li><strong>Close:</strong> click on the button below to close the modal.</li>
 
        </ul>
 
        <button class="md-close btn-sm btn-primary">Close me!</button>
 
      </div>
 
    </div>
 
  </div>
 
 
<div class="md-modal md-effect-1" id="modal-zl">
 
    <div class="md-content">
 
      <h3>zl</h3>
 
      <div>
 
        <p>This is a modal window. You can do the following things with it:</p>
 
        <ul>
 
          <li><strong>Read:</strong> modal windows will probably tell you something important so don't forget to read what they say.</li>
 
          <li><strong>Look:</strong> a modal window enjoys a certain kind of attention; just look at it and appreciate its presence.</li>
 
          <li><strong>Close:</strong> click on the button below to close the modal.</li>
 
        </ul>
 
        <button class="md-close btn-sm btn-primary">Close me!</button>
 
      </div>
 
    </div>
 
  </div>
 
 
<div class="md-modal md-effect-1" id="modal-pqc">
 
    <div class="md-content">
 
      <h3>pqc</h3>
 
      <div>
 
        <p>This is a modal window. You can do the following things with it:</p>
 
        <ul>
 
          <li><strong>Read:</strong> modal windows will probably tell you something important so don't forget to read what they say.</li>
 
          <li><strong>Look:</strong> a modal window enjoys a certain kind of attention; just look at it and appreciate its presence.</li>
 
          <li><strong>Close:</strong> click on the button below to close the modal.</li>
 
        </ul>
 
        <button class="md-close btn-sm btn-primary">Close me!</button>
 
      </div>
 
    </div>
 
  </div>
 
 
 
 
<div class="md-overlay"></div>
 
 
    </div>
 
<div class="hehe" style="background-color:balck">
 
        <div class="container" style="padding-top:0px;">
 
            <div class="row">
 
                <div class="col-md-12 " style="text-alien: center; vertical-alien: middle; font-size: 127%; text-align: center;">Copyright © 2018 iGEM UESTC_China </div>
 
                <div class="col-md-12" style="text-alien: center; vertical-alien: middle; font-size: 127%; text-align: center;">
 
                    <div class="social-icons style="float:right; line-height:60px">
 
                     
 
                            <i><a href="http://www.facebook.com/uestcchinaigem" class="fa fa-facebook"></a></i>&nbsp;
 
                            <i><a href="http://twitter.com/UESTC_China" class="fa fa-twitter"></a></i>&nbsp;
 
                            <i><a href="https://weibo.com/u/5983731394" class="fa fa-weibo"></a></i>&nbsp;
 
                       
 
                    </div>
 
                   
 
                </div>
 
            </div>
 
        </div>
 
</div>
 
</div>
 
 
 
 
<script src="https://2018.igem.org/Template:UESTC-China/Javascript/jquery?action=raw&amp;ctype=text/javascript" type="text/javascript"></script>
 
<script src="https://2018.igem.org/Template:UESTC-China/Javascript/bootjs?action=raw&amp;ctype=text/javascript"></script>
 
<script type="text/javascript" src="https://2018.igem.org/Template:UESTC-China/Javascript/bootnav?action=raw&amp;ctype=text/javascript"></script>
 
<script src="https://2018.igem.org/Template:UESTC-China/Javascript/classie?action=raw&amp;ctype=text/javascript"></script>
 
<script src="https://2018.igem.org/Template:UESTC-China/Javascript/model?action=raw&amp;ctype=text/javascript"></script>
 
 
 
</body>
 
</html>
 

Latest revision as of 14:09, 17 October 2018