Difference between revisions of "Template:SMMU-China/CSS main"

Line 1: Line 1:
−
/*general*/
+
{{SMMU-China}}
−
@font-face{
+
<html>
−
    font-family: 'SMMUFONT';
+
−
        src:url('https://static.igem.org/mediawiki/2019/8/8f/T--SMMU-China--SMMUFONT.ttf') format('truetype');
+
−
    }
+
−
body,h1,h2,h3,h4,h5,h6,p,th,td{font-family:"SMMUFONT"!important;}
+
−
a{color:#333; text-decoration:none;}
+
−
h1{font-size: 27px; line-height: 50px;}
+
−
h2{font-size: 25px; line-height: 50px;}
+
−
h3{font-size: 23px; line-height: 50px;}
+
−
h4{font-size: 21px; line-height: 50px;}
+
−
h5{font-size: 19px; line-height: 50px;}
+
−
h6{font-size: 17px; line-height: 50px;}
+
  
 +
<link rel="stylesheet" href="https://2019.igem.org/wiki/index.php?title=Template:SMMU-China/CSS_main&action=raw&ctype=text/css" />
 +
<!--<link rel="stylesheet" href="main.css" />-->
  
−
.big_framework {
+
<style type="text/css">
−
background-color: white;
+
−
display: block;
+
−
width: 100%;
+
−
}
+
  
−
.big_framework .page_banner {
+
</style>
−
margin: auto;
+
−
width: 100%;
+
−
text-align: center;
+
−
}
+
  
−
.big_framework .page_big_title_box {
+
<div class="big_framework">
−
margin: 30px auto;
+
<div class="index-nav">
−
width: 1160px;
+
<div class="index-nav-frame clearfix">
−
height: 180px;
+
<div class="nav-line">
−
text-align: right;
+
<div class="index-nav-frame-logo-mobile">
−
border-right: 10px solid #3B3B3B;
+
<img src="https://static.igem.org/mediawiki/2019/a/a5/T--SMMU-China--xiaotian_logo.png" alt="XiaoTian">
−
padding-right: 30px;
+
</div>
−
}
+
</div>
 +
<div class="nav-small" tabindex="-1">
 +
<div class="nav-small-focus" tabindex="-1">
 +
 +
</div>
 +
<img src="https://static.igem.org/mediawiki/2019/7/70/T--SMMU-China--header_icon.png"/>
 +
</div>
 +
<div class="index-nav-frame-logo">
 +
<img src="https://static.igem.org/mediawiki/2019/a/a5/T--SMMU-China--xiaotian_logo.png" alt="XiaoTian">
 +
</div>
 +
<div class="index-nav-frame-line active first-one" tabindex="-1">
 +
<a href="https://2019.igem.org/Team:SMMU-China">Home</a>
 +
<div class="index-nav-frame-line-center need-to-be-hidden">
 +
<div class="index-nav-frame-line-li">
 +
<a href="https://2019.igem.org/Team:SMMU-China">Home</a>
 +
</div>
 +
</div>
 +
<div class="index-nav-frame-line-focus" tabindex="-1"></div>
 +
</div>
 +
<div class="index-nav-frame-line" tabindex="-1">
 +
PROJECT
 +
<div class="index-nav-frame-line-center">
 +
<div class="index-nav-frame-line-li">
 +
<a href="https://2019.igem.org/Team:SMMU-China/Description">Description</a>
 +
</div>
 +
<div class="index-nav-frame-line-li">
 +
<a href="https://2019.igem.org/Team:SMMU-China/Design">Design</a>
 +
</div>
 +
<div class="index-nav-frame-line-li">
 +
<a href="https://2019.igem.org/Team:SMMU-China/Team">Team</a>
 +
</div>
 +
<div class="index-nav-frame-line-li">
 +
<a href="https://2019.igem.org/Team:SMMU-China/Experiments">Experiments</a>
 +
</div>
 +
<div class="index-nav-frame-line-li">
 +
<a href="https://2019.igem.org/Team:SMMU-China/Notebook">Notebook</a>
 +
</div>
 +
<div class="index-nav-frame-line-li">
 +
<a href="https://2019.igem.org/Team:SMMU-China/Contribution">Contribution</a>
 +
</div>
 +
<div class="index-nav-frame-line-li">
 +
<a href="https://2019.igem.org/Team:SMMU-China/Results">Results</a>
 +
</div>
 +
<div class="index-nav-frame-line-li">
 +
<a href="https://2019.igem.org/Team:SMMU-China/Demonstrate">Demonstrate</a>
 +
</div>
 +
<div class="index-nav-frame-line-li">
 +
<a href="https://2019.igem.org/Team:SMMU-China/Improve">Improve</a>
 +
</div>
 +
<div class="index-nav-frame-line-li">
 +
<a href="https://2019.igem.org/Team:SMMU-China/Attributions">Attributions</a>
 +
</div>
 +
</div>
 +
<div class="index-nav-frame-line-focus" tabindex="-1"></div>
 +
</div>
 +
<div class="index-nav-frame-line" tabindex="-1">
 +
PARTS
 +
<div class="index-nav-frame-line-center">
 +
<div class="index-nav-frame-line-li">
 +
<a href="https://2019.igem.org/Team:SMMU-China/Parts">Parts Overview</a>
 +
</div>
 +
<div class="index-nav-frame-line-li">
 +
<a href="https://2019.igem.org/Team:SMMU-China/Basic_Part">Basic Parts</a>
 +
</div>
 +
<div class="index-nav-frame-line-li">
 +
<a href="https://2019.igem.org/Team:SMMU-China/Composite_Part">Composite Parts</a>
 +
</div>
 +
<div class="index-nav-frame-line-li">
 +
<a href="https://2019.igem.org/Team:SMMU-China/Part_Collection">Part Collection</a>
 +
</div>
 +
</div>
 +
<div class="index-nav-frame-line-focus" tabindex="-1"></div>
 +
</div>
 +
<div class="index-nav-frame-line" tabindex="-1">
 +
<a href="https://2019.igem.org/Team:SMMU-China/Safety">Safety</a>
 +
<div class="index-nav-frame-line-center need-to-be-hidden">
 +
<div class="index-nav-frame-line-li">
 +
<a href="https://2019.igem.org/Team:SMMU-China/Safety">Safety</a>
 +
</div>
 +
</div>
 +
<div class="index-nav-frame-line-focus" tabindex="-1"></div>
 +
</div>
 +
<div class="index-nav-frame-line HP-button" tabindex="-1">
 +
HUMAN PRACTICES
 +
<div class="index-nav-frame-line-center">
 +
<div class="index-nav-frame-line-li">
 +
<a href="https://2019.igem.org/Team:SMMU-China/Human_Practices">Human Practices</a>
 +
</div>
 +
<div class="index-nav-frame-line-li">
 +
<a href="https://2019.igem.org/Team:SMMU-China/Public_Engagement">Education & Engagement</a>
 +
</div>
 +
</div>
 +
<div class="index-nav-frame-line-focus" tabindex="-1"></div>
 +
</div>
 +
<div class="index-nav-frame-line" tabindex="-1">
 +
AWARDS
 +
<div class="index-nav-frame-line-center">
 +
<div class="index-nav-frame-line-li">
 +
<a href="https://2019.igem.org/Team:SMMU-China/Model">Model</a>
 +
</div>
 +
<div class="index-nav-frame-line-li">
 +
<a href="https://2019.igem.org/Team:SMMU-China/Software">Software</a>
 +
</div>
 +
</div>
 +
<div class="index-nav-frame-line-focus" tabindex="-1"></div>
 +
</div>
 +
</div>
 +
</div>
 +
 +
<div class="blank_framework"></div>
  
−
.big_framework .page_big_title_box .page_big_title{
+
<div class="home_banner">
−
font-size: 100px;
+
<div class="home_banner_title">
−
color: #EE2C2C;
+
WuKong
−
line-height: 120px;
+
</div>
−
font-weight: 1000;
+
<div class="home_banner_subtitle">
−
}
+
<span class="typeWriter" data-end="2000" data-speed="3" data-text='["This is test sentence ONE!", "This is test sentence TWO!", "This is test sentence THREE!"]'></span>
 +
</div>
 +
</div>
  
−
.big_framework .page_big_title_box .page_big_subtitle{
+
<div class="index_block">
−
font-size: 40px;
+
<img style="width: 100%" src="https://static.igem.org/mediawiki/2019/6/63/T--SMMU-China--index_bg_2.jpg" alt="index_bg_2">
−
color: #3B3B3B;
+
</div>
−
line-height: 60px;
+
−
}
+
  
−
.big_framework .medium_framework {
+
<div class="index_block">
−
margin: auto;
+
<img style="width: 100%" src="https://static.igem.org/mediawiki/2019/b/bf/T--SMMU-China--index_bg_3.jpg" alt="index_bg_3">
−
max-width: 1200px;
+
</div>
−
padding: 20px 0px;
+
−
width: 90%;
+
−
text-align: center;
+
−
}
+
  
−
.big_framework .medium_framework p{
+
<div class="index_block">
−
font-size: 17px!important;
+
<img style="width: 100%" src="https://static.igem.org/mediawiki/2019/6/61/T--SMMU-China--index_bg_4.jpg" alt="index_bg_4">
−
line-height: 30px;
+
</div>
−
}
+
  
−
.home_banner{
+
<div class="index_block">
−
background-image: url(https://static.igem.org/mediawiki/2019/7/70/T--SMMU-China--index_bg_1.jpg);
+
<img style="width: 100%" src="https://static.igem.org/mediawiki/2019/f/fe/T--SMMU-China--index_bg_5.jpg" alt="index_bg_5">
−
background-repeat:no-repeat;
+
</div>
−
background-size: 100% auto;
+
−
background-position: top;
+
−
    background-attachment: fixed;
+
−
    height: 790px;
+
−
}
+
  
−
.home_banner_title{
+
<div class="index_block">
−
padding: 100px 0vh 0vh 0vh;
+
<img style="width: 100%" src="https://static.igem.org/mediawiki/2019/f/f1/T--SMMU-China--index_bg_6.jpg" alt="index_bg_6">
−
text-align: center;
+
</div>
−
line-height: 400px;
+
−
font-size: 250px;
+
−
color: #FFF;
+
−
font-weight: 700;
+
−
text-shadow:5px 2px 6px #000;
+
−
}
+
  
−
.home_banner_subtitle{
+
</div>
−
text-align: center;
+
−
line-height: 50px;
+
−
font-size: 30px;
+
−
color: #FFF;
+
−
font-weight: 500;
+
−
text-shadow:5px 2px 6px #000;
+
−
}
+
  
−
@media only screen and (max-width:1600px) {
+
<div class="footer">
−
.home_banner{
+
<div class="footer_left">
−
height: 675px;
+
<div class="footer_title">Contact Us</div>
−
}
+
<div class="footer_text">
−
}
+
E-Mail: igem-smmu@smmu.edu.cn<br>
 +
Phone: +86 021-81870925
 +
</div>
 +
</div>
 +
<div class="footer_right">
 +
<div class="footer_title"></div>
 +
<div class="footer_text">
 +
© 2019. SMMU. All rights reserved.
 +
</div>
 +
</div>
 +
</div>
  
−
@media only screen and (max-width:1400px) {
+
<script src="https://2019.igem.org/Template:SMMU-China/JS_typelighter?action=raw&ctype=text/javascript"></script>
−
.home_banner{
+
−
height: 593px;
+
−
}
+
  
−
.home_banner_title{
+
</html>
−
padding: 100px 0vh 0vh 0vh;
+
−
text-align: center;
+
−
line-height: 300px;
+
−
font-size: 200px;
+
−
color: #FFF;
+
−
font-weight: 700;
+
−
text-shadow:5px 2px 6px #000;
+
−
}
+
−
 
+
−
.home_banner_subtitle{
+
−
text-align: center;
+
−
line-height: 40px;
+
−
font-size: 25px;
+
−
color: #FFF;
+
−
font-weight: 500;
+
−
text-shadow:5px 2px 6px #000;
+
−
}
+
−
}
+
−
 
+
−
@media only screen and (max-width:1200px) {
+
−
.home_banner{
+
−
height: 480px;
+
−
}
+
−
 
+
−
.home_banner_title{
+
−
padding: 50px 0vh 0vh 0vh;
+
−
text-align: center;
+
−
line-height: 260px;
+
−
font-size: 180px;
+
−
color: #FFF;
+
−
font-weight: 700;
+
−
text-shadow:5px 2px 6px #000;
+
−
}
+
−
 
+
−
.home_banner_subtitle{
+
−
text-align: center;
+
−
line-height: 30px;
+
−
font-size: 20px;
+
−
color: #FFF;
+
−
font-weight: 500;
+
−
text-shadow:5px 2px 6px #000;
+
−
}
+
−
}
+
−
 
+
−
@media only screen and (max-width:1000px) {
+
−
.home_banner{
+
−
background-attachment: unset;
+
−
height: auto;
+
−
background-position: center;
+
−
}
+
−
 
+
−
.home_banner_title{
+
−
padding: 30px 0vh 0vh 0vh;
+
−
text-align: center;
+
−
line-height: 100px;
+
−
font-size: 80px;
+
−
color: #FFF;
+
−
font-weight: 700;
+
−
text-shadow:5px 2px 6px #000;
+
−
}
+
−
 
+
−
.home_banner_subtitle{
+
−
padding: 0vh 0vh 30px 0vh;
+
−
text-align: center;
+
−
line-height: 25px;
+
−
font-size: 18px;
+
−
color: #FFF;
+
−
font-weight: 500;
+
−
text-shadow:5px 2px 6px #000;
+
−
}
+
−
}
+
−
 
+
−
 
+
−
.column50{
+
−
display: inline-block;
+
−
width: 45%;
+
−
padding: 0px 2%;
+
−
margin-bottom: 0px;
+
−
}
+
−
 
+
−
.blank_framework{
+
−
height: 90px;
+
−
}
+
−
 
+
−
.footer{
+
−
margin-top: 50px;
+
−
height: 300px;
+
−
background-color: #282828;
+
−
margin-bottom: -10px;
+
−
}
+
−
 
+
−
.footer_left{
+
−
width: 50%;
+
−
display: inline-block;
+
−
}
+
−
 
+
−
.footer_right{
+
−
width: 50%;
+
−
display: inline-block;
+
−
float: right;
+
−
}
+
−
 
+
−
.footer_title{
+
−
margin: auto;
+
−
padding-top: 30px;
+
−
height: 120px;
+
−
line-height: 120px;
+
−
font-size: 40px;
+
−
color: #FFF;
+
−
text-align: center;
+
−
}
+
−
 
+
−
.footer_text{
+
−
display: inline-block;
+
−
height: 150px;
+
−
width: 100%;
+
−
line-height: 40px;
+
−
font-size: 20px!important;
+
−
color: #FFF;
+
−
text-align: center;
+
−
}
+
−
 
+
−
/*header*/
+
−
.index-nav{
+
−
width: 100%;
+
−
border-bottom: 3px solid #eeeeee;
+
−
height: 83px;
+
−
box-sizing: border-box;
+
−
background:white;
+
−
position: fixed;
+
−
margin-top: 7px;
+
−
z-index: 999;
+
−
}
+
−
 
+
−
.index-nav a{
+
−
color: #333;
+
−
}
+
−
 
+
−
.index-nav-frame{
+
−
margin: 0px 50px;
+
−
}
+
−
 
+
−
.index-nav-frame-line{
+
−
color: #333333;
+
−
background: #ffffff00;
+
−
float: left;
+
−
position: relative;
+
−
display: block;
+
−
outline: none;
+
−
cursor: pointer;
+
−
width: 135px;
+
−
line-height: 80px;
+
−
text-align: center;
+
−
font-weight: 700;
+
−
font-size: 16px;
+
−
}
+
−
 
+
−
.index-nav-frame-line.HP-button{
+
−
width: 210px;
+
−
}
+
−
 
+
−
.index-nav-frame-logo{
+
−
background: #ffffff00;
+
−
float: left;
+
−
position: relative;
+
−
display: block;
+
−
outline: none;
+
−
width: 400px;
+
−
height: 80px;
+
−
}
+
−
 
+
−
.index-nav-frame-logo-mobile{
+
−
display: none;
+
−
}
+
−
 
+
−
.index-nav-frame-logo img{
+
−
width: 400px;
+
−
}
+
−
 
+
−
.index-nav-frame-line.active{
+
−
color:#b63b4d;
+
−
}
+
−
 
+
−
.index-nav-frame-line.first-one{
+
−
margin-left: 3%;
+
−
width: 96px;
+
−
}
+
−
 
+
−
.index-nav-frame-line.active > a{
+
−
color:#b63b4d;
+
−
}
+
−
 
+
−
.index-nav-frame-line-center{
+
−
opacity: 0;
+
−
height: 0;
+
−
position: absolute;
+
−
overflow: hidden;
+
−
width: 100%;
+
−
transition: all 0.5s;
+
−
-webkit-transition: all 0.5s;
+
−
-moz-transition: all 0.5s;
+
−
/* Firefox 4 */
+
−
-o-transition: all 0.5s;
+
−
/* Opera */
+
−
}
+
−
 
+
−
.index-nav-frame-line-center.need-to-be-hidden{
+
−
display: none;
+
−
}
+
−
 
+
−
.index-nav-frame-line-li{
+
−
width: 100%;
+
−
font-weight: 500;
+
−
text-align: center;
+
−
background: white;
+
−
color: #666666;
+
−
line-height: 50px;
+
−
}
+
−
 
+
−
.index-nav-frame-line-li:hover{
+
−
background: #444359;
+
−
color: white;
+
−
}
+
−
 
+
−
.index-nav-frame-line-li:hover a{
+
−
background: #444359;
+
−
color: white;
+
−
}
+
−
 
+
−
.index-nav-frame-line-focus:focus{
+
−
display: none;
+
−
}
+
−
 
+
−
.index-nav-frame-line:hover .index-nav-frame-line-center{
+
−
height:auto;
+
−
opacity: 1;
+
−
}
+
−
 
+
−
.nav-line{
+
−
height: 50px;
+
−
width: 100%;
+
−
position: relative;
+
−
display: none;
+
−
outline: none;
+
−
}
+
−
 
+
−
.nav-small{
+
−
width: 30px;
+
−
height: 30px;
+
−
position: absolute;
+
−
right: 10px;
+
−
top:10px;
+
−
cursor: pointer;
+
−
display: none;
+
−
outline: none;
+
−
}
+
−
 
+
−
.nav-small img{
+
−
width: 100%;
+
−
height: 100%;
+
−
object-fit: cover;
+
−
}
+
−
 
+
−
.nav-small-focus{
+
−
position: absolute;
+
−
width: 100%;
+
−
height: 100%;
+
−
display: none;
+
−
}
+
−
 
+
−
.nav-small-focus:focus{
+
−
display: none;
+
−
}
+
−
 
+
−
 
+
−
/* Timeline */
+
−
 
+
−
.timeline-container *, .timeline-container *:after, .timeline-container *:before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
+
−
 
+
−
/* Clearfix hack by Nicolas Gallagher: http://nicolasgallagher.com/micro-clearfix-hack/ */
+
−
.clearfix:before, .clearfix:after { content: " "; display: table; }
+
−
.clearfix:after { clear: both; }
+
−
 
+
−
 
+
−
 
+
−
.timeline-main,
+
−
.timeline-container > header {
+
−
width: 95%;
+
−
max-width: 1100px;
+
−
margin: 0 auto;
+
−
padding: 0 1.875em 3.125em;
+
−
}
+
−
 
+
−
.timeline-container > header {
+
−
padding: 2.875em 1.875em 1.875em;
+
−
}
+
−
 
+
−
.timeline-container > header h1 {
+
−
font-size: 2.125em;
+
−
line-height: 1.3;
+
−
margin: 0;
+
−
float: left;
+
−
font-weight: 400;
+
−
}
+
−
 
+
−
.timeline-container > header span {
+
−
display: block;
+
−
font-weight: 700;
+
−
text-transform: uppercase;
+
−
letter-spacing: 0.5em;
+
−
padding: 0 0 0.6em 0.1em;
+
−
}
+
−
 
+
−
.timeline-container > header nav {
+
−
float: right;
+
−
}
+
−
 
+
−
.timeline-container > header nav a {
+
−
display: block;
+
−
float: left;
+
−
position: relative;
+
−
width: 2.5em;
+
−
height: 2.5em;
+
−
background: #fff;
+
−
border-radius: 50%;
+
−
color: transparent;
+
−
margin: 0 0.1em;
+
−
border: 4px solid #47a3da;
+
−
text-indent: -8000px;
+
−
}
+
−
 
+
−
.timeline-container > header nav a:after {
+
−
content: attr(data-info);
+
−
color: #47a3da;
+
−
position: absolute;
+
−
width: 600%;
+
−
top: 120%;
+
−
text-align: right;
+
−
right: 0;
+
−
opacity: 0;
+
−
pointer-events: none;
+
−
}
+
−
 
+
−
.timeline-container > header nav a:hover:after {
+
−
opacity: 1;
+
−
}
+
−
 
+
−
.timeline-container > header nav a:hover {
+
−
background: #47a3da;
+
−
}
+
−
 
+
−
.icon-drop:before,
+
−
.icon-arrow-left:before {
+
−
font-family: 'fontawesome';
+
−
position: absolute;
+
−
top: 0;
+
−
width: 100%;
+
−
height: 100%;
+
−
speak: none;
+
−
font-style: normal;
+
−
font-weight: normal;
+
−
line-height: 2;
+
−
text-align: center;
+
−
color: #47a3da;
+
−
-webkit-font-smoothing: antialiased;
+
−
text-indent: 8000px;
+
−
padding-left: 8px;
+
−
}
+
−
 
+
−
.timeline-container > header nav a:hover:before {
+
−
color: #fff;
+
−
}
+
−
 
+
−
.icon-drop:before {
+
−
content: "\e000";
+
−
}
+
−
 
+
−
.icon-arrow-left:before {
+
−
content: "\f060";
+
−
}
+
−
 
+
−
@font-face {
+
−
font-family: 'ecoico';
+
−
src:url('https://static.igem.org/mediawiki/2019/3/36/T--SMMU-China--timelineicons_ecoico.eot');
+
−
src:url('https://static.igem.org/mediawiki/2019/3/36/T--SMMU-China--timelineicons_ecoico.eot?#iefix') format('embedded-opentype'),
+
−
url('https://static.igem.org/mediawiki/2019/8/80/T--SMMU-China--timelineicons_ecoico.woff') format('woff'),
+
−
url('https://static.igem.org/mediawiki/2019/f/f9/T--SMMU-China--timelineicons_ecoico.ttf') format('truetype'),
+
−
url('https://static.igem.org/mediawiki/2019/a/a7/T--SMMU-China--timelineicons_ecoico.svg#ecoico') format('svg');
+
−
font-weight: normal;
+
−
font-style: normal;
+
−
} /* Made with http://icomoon.io/ */
+
−
 
+
−
.cbp_tmtimeline {
+
−
margin: 30px 0 0 0;
+
−
padding: 0;
+
−
list-style: none;
+
−
position: relative;
+
−
}
+
−
 
+
−
/* The line */
+
−
.cbp_tmtimeline:before {
+
−
content: '';
+
−
position: absolute;
+
−
top: 0;
+
−
bottom: 0;
+
−
width: 10px;
+
−
background: #afdcf8;
+
−
left: 20%;
+
−
margin-left: -10px;
+
−
}
+
−
 
+
−
/* The date/time */
+
−
.cbp_tmtimeline > li .cbp_tmtime {
+
−
display: block;
+
−
width: 25%;
+
−
padding-right: 100px;
+
−
position: absolute;
+
−
}
+
−
 
+
−
.cbp_tmtimeline > li .cbp_tmtime span {
+
−
display: block;
+
−
text-align: right;
+
−
}
+
−
 
+
−
.cbp_tmtimeline > li .cbp_tmtime span:first-child {
+
−
font-size: 0.9em;
+
−
color: #bdd0db;
+
−
}
+
−
 
+
−
.cbp_tmtimeline > li .cbp_tmtime span:last-child {
+
−
font-size: 2.9em;
+
−
color: #3594cb;
+
−
}
+
−
 
+
−
.cbp_tmtimeline > li:nth-child(odd) .cbp_tmtime span:last-child {
+
−
color: #6cbfee;
+
−
}
+
−
 
+
−
/* Right content */
+
−
.cbp_tmtimeline > li .cbp_tmlabel {
+
−
margin: 0 0 15px 25%;
+
−
background: #3594cb;
+
−
color: #fff;
+
−
padding: 2em;
+
−
font-size: 1.2em;
+
−
font-weight: 300;
+
−
line-height: 1.4;
+
−
position: relative;
+
−
border-radius: 5px;
+
−
}
+
−
 
+
−
.cbp_tmtimeline > li:nth-child(odd) .cbp_tmlabel {
+
−
background: #6cbfee;
+
−
}
+
−
 
+
−
.cbp_tmtimeline > li .cbp_tmlabel h2 {
+
−
margin-top: 0px;
+
−
padding: 0 0 10px 0;
+
−
border-bottom: 1px solid rgba(255,255,255,0.4);
+
−
color: #FFF;
+
−
font-weight:700;
+
−
}
+
−
 
+
−
/* The triangle */
+
−
.cbp_tmtimeline > li .cbp_tmlabel:after {
+
−
right: 100%;
+
−
border: solid transparent;
+
−
content: " ";
+
−
height: 0;
+
−
width: 0;
+
−
position: absolute;
+
−
pointer-events: none;
+
−
border-right-color: #3594cb;
+
−
border-width: 10px;
+
−
top: 10px;
+
−
}
+
−
 
+
−
.cbp_tmtimeline > li:nth-child(odd) .cbp_tmlabel:after {
+
−
border-right-color: #6cbfee;
+
−
}
+
−
 
+
−
/* The icons */
+
−
.cbp_tmtimeline > li .cbp_tmicon {
+
−
width: 40px;
+
−
height: 40px;
+
−
font-family: 'ecoico';
+
−
speak: none;
+
−
font-style: normal;
+
−
font-weight: normal;
+
−
font-variant: normal;
+
−
text-transform: none;
+
−
font-size: 1.4em;
+
−
line-height: 40px;
+
−
-webkit-font-smoothing: antialiased;
+
−
position: absolute;
+
−
color: #fff;
+
−
background: #46a4da;
+
−
border-radius: 50%;
+
−
box-shadow: 0 0 0 8px #afdcf8;
+
−
text-align: center;
+
−
left: 20%;
+
−
top: 0;
+
−
margin: 0 0 0 -25px;
+
−
}
+
−
 
+
−
.cbp_tmicon-phone:before {
+
−
content: "\e000";
+
−
}
+
−
 
+
−
.cbp_tmicon-screen:before {
+
−
content: "\e001";
+
−
}
+
−
 
+
−
.cbp_tmicon-mail:before {
+
−
content: "\e002";
+
−
}
+
−
 
+
−
.cbp_tmicon-earth:before {
+
−
content: "\e003";
+
−
}
+
−
 
+
−
 
+
−
 
+
−
@media only screen and (max-width:1400px) {
+
−
.blank_framework{
+
−
height: 61px;
+
−
}
+
−
 
+
−
.big_framework .page_big_title_box{
+
−
height: 120px;
+
−
width: 90%;
+
−
margin: 20px auto;
+
−
text-align: left;
+
−
border-left: 10px solid #3B3B3B;
+
−
border-right: none;
+
−
    padding-left: 30px;
+
−
    padding-right: 0px;
+
−
 
+
−
}
+
−
 
+
−
.big_framework .page_big_title_box .page_big_title{
+
−
font-size: 50px;
+
−
color: #EE2C2C;
+
−
line-height: 80px;
+
−
font-weight: 1000;
+
−
}
+
−
 
+
−
.big_framework .page_big_title_box .page_big_subtitle{
+
−
font-size: 20px;
+
−
color: #3B3B3B;
+
−
line-height: 40px;
+
−
}
+
−
 
+
−
.column50{
+
−
display: inline-block;
+
−
width: 100%;
+
−
padding: 0px;
+
−
margin-bottom: 20px;
+
−
}
+
−
 
+
−
.footer{
+
−
height: 600px;
+
−
}
+
−
 
+
−
.footer_left{
+
−
width: 100%;
+
−
}
+
−
 
+
−
.footer_right{
+
−
width: 100%;
+
−
}
+
−
 
+
−
 
+
−
.index-nav{
+
−
height: inherit;
+
−
}
+
−
 
+
−
.index-nav-frame-line-li a{
+
−
display: block;
+
−
color: white;
+
−
}
+
−
 
+
−
.nav-line{
+
−
display: block;
+
−
border-bottom: 1px solid #eeeeee;
+
−
}
+
−
 
+
−
.nav-small{
+
−
display: block;
+
−
}
+
−
 
+
−
.nav-small:focus~.index-nav-frame-line{
+
−
height: auto;
+
−
border-bottom: 1px solid #ccc;
+
−
}
+
−
 
+
−
.nav-small:focus .nav-small-focus{
+
−
display: block;
+
−
}
+
−
 
+
−
.index-nav-frame{
+
−
width: 100%;
+
−
margin: 0px;
+
−
}
+
−
 
+
−
.index-nav-frame-logo{
+
−
display: none;
+
−
}
+
−
 
+
−
.index-nav-frame-logo-mobile{
+
−
background: #ffffff00;
+
−
position: relative;
+
−
display: block;
+
−
outline: none;
+
−
width: inherit;
+
−
height: inherit;
+
−
}
+
−
 
+
−
.index-nav-frame-logo-mobile img{
+
−
height: inherit;
+
−
}
+
−
 
+
−
.index-nav-frame-line{
+
−
width: 100%;
+
−
height: 0;
+
−
overflow: hidden;
+
−
}
+
−
 
+
−
.index-nav-frame-line.first-one{
+
−
margin-left: 0px;
+
−
width: 100%;
+
−
}
+
−
 
+
−
.index-nav-frame-line.HP-button{
+
−
width: 100%;
+
−
}
+
−
 
+
−
.index-nav-frame-line-center{
+
−
position: relative;
+
−
background: #444359;
+
−
}
+
−
 
+
−
.index-nav-frame-line-center.need-to-be-hidden{
+
−
display: block;
+
−
}
+
−
 
+
−
.index-nav-frame-line:hover .index-nav-frame-line-center{
+
−
height:0;
+
−
opacity: 0;
+
−
}
+
−
 
+
−
.index-nav-frame-line-li{
+
−
border-bottom: 1px solid #4b4a5e;
+
−
color: #d9d9d9;
+
−
background: #444359;
+
−
}
+
−
 
+
−
.index-nav-frame-line-li:hover{
+
−
background: #b63b4d;
+
−
}
+
−
 
+
−
.index-nav-frame-line:focus{
+
−
height: auto;
+
−
border-bottom: 1px solid #ccc;
+
−
}
+
−
 
+
−
.index-nav-frame-line:focus>.index-nav-frame-line-center{
+
−
height:auto;
+
−
opacity: 1;
+
−
}
+
−
 
+
−
.index-nav-frame-line:focus .index-nav-frame-line-header{
+
−
color: #B63B4D;
+
−
}
+
−
 
+
−
.index-nav-frame-line-focus{
+
−
display: none;
+
−
width: 100%;
+
−
height: 50px;
+
−
position: absolute;
+
−
left: 0;
+
−
top: 0;
+
−
}
+
−
 
+
−
.index-nav-frame-line:focus .index-nav-frame-line-focus{
+
−
display: block;
+
−
}
+
−
 
+
−
/*Timeline*/
+
−
.cbp_tmtimeline:before {
+
−
display: none;
+
−
}
+
−
 
+
−
.cbp_tmtimeline > li .cbp_tmtime {
+
−
width: 100%;
+
−
position: relative;
+
−
padding: 0 0 20px 0;
+
−
}
+
−
 
+
−
.cbp_tmtimeline > li .cbp_tmtime span {
+
−
text-align: left;
+
−
}
+
−
 
+
−
.cbp_tmtimeline > li .cbp_tmlabel {
+
−
margin: 0 0 30px 0;
+
−
padding: 1em;
+
−
font-weight: 400;
+
−
font-size: 95%;
+
−
}
+
−
 
+
−
.cbp_tmtimeline > li .cbp_tmlabel:after {
+
−
right: auto;
+
−
left: 20px;
+
−
border-right-color: transparent;
+
−
border-bottom-color: #3594cb;
+
−
top: -20px;
+
−
}
+
−
 
+
−
.cbp_tmtimeline > li:nth-child(odd) .cbp_tmlabel:after {
+
−
border-right-color: transparent;
+
−
border-bottom-color: #6cbfee;
+
−
}
+
−
 
+
−
.cbp_tmtimeline > li .cbp_tmicon {
+
−
position: relative;
+
−
float: right;
+
−
left: auto;
+
−
margin: -55px 5px 0 0px;
+
−
}
+
−
}
+

Revision as of 07:14, 15 October 2019

XiaoTian
Home
Home
PROJECT
Description
Design
Team
Experiments
Notebook
Contribution
Results
Demonstrate
Improve
Attributions
PARTS
Parts Overview
Basic Parts
Composite Parts
Part Collection
Safety
Safety
HUMAN PRACTICES
Human Practices
Education & Engagement
AWARDS
Model
Software
WuKong
index_bg_2
index_bg_3
index_bg_4
index_bg_5
index_bg_6
Contact Us
E-Mail: igem-smmu@smmu.edu.cn
Phone: +86 021-81870925
© 2019. SMMU. All rights reserved.