Line 1: | Line 1: | ||
− | + | @import url('https://fonts.googleapis.com/css?family=Roboto:300,500'); | |
− | + | @import url('https://fonts.googleapis.com/css?family=Product+Sans:400,400i,700,700i'); | |
+ | |||
+ | #top_title,#sideMenu { display: none !important; } | ||
+ | #content { | ||
+ | width: 100%; | ||
+ | margin: 0; | ||
+ | padding: 0; | ||
+ | background: #f3f4f4;https://static.igem.org/mediawiki/2017/7/7d/T--TAS_Taipei--Team_New.JPG | ||
+ | } | ||
+ | |||
+ | #HQ_page p { | ||
+ | display: none; | ||
+ | } | ||
+ | |||
+ | #HQ_page h1, h2, h3, h4, h5 { | ||
+ | font-family: "Product Sans", sans-serif; | ||
+ | border-bottom: none; | ||
+ | font-weight: bold; | ||
+ | } | ||
+ | |||
+ | #sideMenu { | ||
+ | display: none !important; | ||
+ | } | ||
+ | |||
+ | #content{ | ||
+ | background-color: #333333 !important; | ||
+ | } | ||
+ | |||
+ | .firstHeading { | ||
+ | color: #333333 !important; | ||
+ | } | ||
+ | |||
+ | pre { | ||
+ | display: none; | ||
+ | } | ||
+ | |||
+ | html, body { | ||
+ | margin: 0 !important; | ||
+ | padding: 0 !important; | ||
+ | height: 100vh; | ||
+ | overflow-y: hidden; | ||
+ | width: 100%; | ||
+ | overflow-x: hidden; | ||
+ | } | ||
+ | |||
+ | .home_logo{ | ||
+ | display: none; | ||
+ | } | ||
+ | |||
+ | .item{ | ||
+ | margin: 0 !important; | ||
+ | height: 100% !important; | ||
+ | background-color: #3498db; | ||
+ | position: absolute; | ||
+ | left: 0; | ||
+ | padding-left: 30vw; | ||
+ | } | ||
+ | |||
+ | #slideshow{ | ||
+ | display: block; | ||
+ | } | ||
+ | |||
+ | #top_menu_under { | ||
+ | display: none !important; | ||
+ | } | ||
+ | |||
+ | #bodyContent{ | ||
+ | margin-top: 15px !important; | ||
+ | } | ||
+ | |||
+ | .box, | ||
+ | .box2, | ||
+ | .box3 { | ||
+ | width: 100%; | ||
+ | height: 12.5vh; | ||
+ | position: relative; | ||
+ | top: 0; | ||
+ | right: 0; | ||
+ | float: right; | ||
+ | z-index: 1; | ||
+ | } | ||
+ | |||
+ | .box2 { | ||
+ | background: red; | ||
+ | } | ||
+ | |||
+ | #dna { | ||
+ | top: 0; | ||
+ | bottom: 0; | ||
+ | left: 0; | ||
+ | right: 0; | ||
+ | position: absolute; | ||
+ | margin: auto; | ||
+ | height: 6vh; | ||
+ | width: 6vh; | ||
+ | z-index: 9999; | ||
+ | } | ||
+ | |||
+ | .box3 { | ||
+ | text-align: right; | ||
+ | padding-right: 15px; | ||
+ | } | ||
+ | |||
+ | .box3>h1 { | ||
+ | color: white; | ||
+ | margin: auto; | ||
+ | font-size: 5vh; | ||
+ | line-height: 12.5vh; | ||
+ | padding: 0 !important; | ||
+ | padding-right: 25px; | ||
+ | } | ||
+ | |||
+ | .right { | ||
+ | width: 100px; | ||
+ | right: 0; | ||
+ | } | ||
+ | |||
+ | @media screen and (max-width: 1020px) { | ||
+ | .return { | ||
+ | z-index: 999; | ||
+ | width: 12.5vh; | ||
+ | height: 12.5vh; | ||
+ | background: #fe4365; | ||
+ | position: absolute; | ||
+ | top: 0; | ||
+ | left: 0; | ||
+ | margin: 0; | ||
+ | display: none; | ||
+ | } | ||
+ | .return.active { | ||
+ | display: block; | ||
+ | } | ||
+ | .return>h1 { | ||
+ | line-height: 12.5vh; | ||
+ | text-align: center; | ||
+ | margin: 0 !important; | ||
+ | color: white; | ||
+ | font-size: 8vh; | ||
+ | font-weight: 200; | ||
+ | padding: 0 !important; | ||
+ | } | ||
+ | .yellow { | ||
+ | width: 100vw; | ||
+ | height: 100vh; | ||
+ | background: yellow; | ||
+ | position: absolute; | ||
+ | top: 0; | ||
+ | left: -80vw; | ||
+ | transition: all .3s ease; | ||
+ | z-index: 4; | ||
+ | } | ||
+ | .blue { | ||
+ | width: 80vw; | ||
+ | height: 100vh; | ||
+ | background: blue; | ||
+ | position: absolute; | ||
+ | top: 0; | ||
+ | left: 0px; | ||
+ | } | ||
+ | .right { | ||
+ | width: 20vw; | ||
+ | right: 0; | ||
+ | } | ||
+ | main { | ||
+ | width: 100%; | ||
+ | position: absolute; | ||
+ | margin-left: 200px; | ||
+ | padding-left: 15px; | ||
+ | padding-top: 5px; | ||
+ | background: rgba(250, 250, 250, 1); | ||
+ | height: 100vh; | ||
+ | top: 0; | ||
+ | z-index: 3; | ||
+ | } | ||
+ | #abstract1 { | ||
+ | font-family: 'Roboto', sans-serif !important; | ||
+ | color: black; | ||
+ | line-height: 2vh !important; | ||
+ | margin-top: 0; | ||
+ | margin-right: 20px; | ||
+ | padding-top: 1vh; | ||
+ | padding-bottom: 10px; | ||
+ | border-bottom: 1px solid black; | ||
+ | width: 65vw; | ||
+ | font-size: 2vh !important; | ||
+ | font-weight: 500; | ||
+ | text-align: justify !important; | ||
+ | } | ||
+ | .yellow.active { | ||
+ | left: 0; | ||
+ | } | ||
+ | .banner { | ||
+ | display: none; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @media screen and (min-width: 1020px) { | ||
+ | .return { | ||
+ | display: none; | ||
+ | } | ||
+ | .yellow { | ||
+ | width: 450px; | ||
+ | height: 100vh; | ||
+ | background: yellow; | ||
+ | position: absolute; | ||
+ | top: 0; | ||
+ | left: -350px; | ||
+ | transition: all .3s ease; | ||
+ | z-index: 4; | ||
+ | } | ||
+ | .blue { | ||
+ | width: 350px; | ||
+ | height: 100vh; | ||
+ | background: blue; | ||
+ | position: absolute; | ||
+ | top: 0; | ||
+ | left: 0px; | ||
+ | } | ||
+ | main { | ||
+ | width: 30vw; | ||
+ | position: absolute; | ||
+ | margin-left: 100px; | ||
+ | padding-left: 15px; | ||
+ | padding-top: 5px; | ||
+ | background: rgba(250, 250, 250, 0.8); | ||
+ | height: 100vh; | ||
+ | top: 0; | ||
+ | z-index: 3; | ||
+ | } | ||
+ | #abstract1 { | ||
+ | font-family: 'Roboto', sans-serif !important; | ||
+ | color: black; | ||
+ | line-height: 2.5vh; | ||
+ | margin-right: 20px; | ||
+ | padding-bottom: 10px; | ||
+ | border-bottom: 1px solid black; | ||
+ | font-size: 2vh; | ||
+ | text-align: justify !important; | ||
+ | } | ||
+ | .banner { | ||
+ | position: absolute; | ||
+ | width: 100%; | ||
+ | height: 100vh; | ||
+ | top: 0; | ||
+ | background-size: cover; | ||
+ | background-repeat: no-repeat; | ||
+ | display: none; | ||
+ | } | ||
+ | .banner>.guide { | ||
+ | bottom: 50px; | ||
+ | right: 50px; | ||
+ | width: 500px; | ||
+ | background: #FAFAFA; | ||
+ | color: black; | ||
+ | position: absolute; | ||
+ | font-family: 'Product Sans', sans-serif; | ||
+ | z-index: 3; | ||
+ | padding-left: 20px; | ||
+ | margin: 0 !important; | ||
+ | padding-bottom: 0; | ||
+ | } | ||
+ | .banner>.guide>h1 { | ||
+ | padding-top: 0 !important; | ||
+ | padding-bottom: 0 !important; | ||
+ | margin-bottom: 0 !important; | ||
+ | margin-top: 20px !important; | ||
+ | line-height: 3vh; | ||
+ | font-size: 3vh; | ||
+ | } | ||
+ | .project-banner { | ||
+ | background-image: url('https://static.igem.org/mediawiki/2017/a/a9/T--TAS_Taipei--Project-Banner.jpg'); | ||
+ | background-size: cover; | ||
+ | background-repeat: none; | ||
+ | display: none; | ||
+ | z-index: 1; | ||
+ | transition: all 0.5s ease; | ||
+ | } | ||
+ | .project-banner.active { | ||
+ | display: block; | ||
+ | z-index: 2; | ||
+ | } | ||
+ | .project-banner>.guide { | ||
+ | box-shadow: -5px 0 0 0 #fe4365; | ||
+ | } | ||
+ | .exp-banner { | ||
+ | background-image: url('https://static.igem.org/mediawiki/2017/e/ec/T--TAS_Taipei--Exp_banner.jpg'); | ||
+ | background-size: cover; | ||
+ | z-index: 1; | ||
+ | right: 0; | ||
+ | position: absolute; | ||
+ | width: 100% !important; | ||
+ | background-position: center right; | ||
+ | background-color: black; | ||
+ | display: none; | ||
+ | |||
+ | } | ||
+ | .exp-banner.active { | ||
+ | z-index: 2; | ||
+ | display: block; | ||
+ | } | ||
+ | .exp-banner>.guide { | ||
+ | box-shadow: -5px 0 0 0 #FD7080; | ||
+ | } | ||
+ | .model-banner { | ||
+ | background-image: url('https://static.igem.org/mediawiki/2017/2/20/T--TAS_Taipei--Modeling-Banner-new2.jpg'); | ||
+ | background-size: cover; | ||
+ | background-repeat: none; | ||
+ | z-index: 1; | ||
+ | display: none; | ||
+ | } | ||
+ | .model-banner.active { | ||
+ | z-index: 2; | ||
+ | display: block; | ||
+ | } | ||
+ | .model-banner>.guide { | ||
+ | box-shadow: -5px 0 0 0 #fc9d9a; | ||
+ | } | ||
+ | .prototype-banner { | ||
+ | background-image: url('https://static.igem.org/mediawiki/2017/2/2c/T--TAS_Taipei--Prototype_banner.jpg'); | ||
+ | background-size: cover; | ||
+ | background-repeat: none; | ||
+ | z-index: 1; | ||
+ | display: none; | ||
+ | } | ||
+ | .prototype-banner.active { | ||
+ | z-index: 2; | ||
+ | display: block; | ||
+ | } | ||
+ | .prototype-banner>.guide { | ||
+ | box-shadow: -5px 0 0 0 #FBB5A4; | ||
+ | } | ||
+ | .hp-banner { | ||
+ | background-image: url('https://static.igem.org/mediawiki/2017/c/cb/T--TAS_Taipei--HP_banner.jpg'); | ||
+ | background-size: cover; | ||
+ | background-repeat: none; | ||
+ | z-index: 1; | ||
+ | display: none; | ||
+ | } | ||
+ | .hp-banner.active { | ||
+ | z-index: 2; | ||
+ | display: block; | ||
+ | } | ||
+ | .hp-banner>.guide { | ||
+ | box-shadow: -5px 0 0 0 #f9cdad; | ||
+ | } | ||
+ | .biosafety-banner { | ||
+ | background-image: url('https://static.igem.org/mediawiki/2017/d/dd/T--TAS_Taipei--Biosafety_banner.jpg'); | ||
+ | background-size: cover; | ||
+ | background-repeat: none; | ||
+ | z-index: 1; | ||
+ | display: none; | ||
+ | } | ||
+ | .biosafety-banner.active { | ||
+ | z-index: 2; | ||
+ | display: block; | ||
+ | } | ||
+ | .biosafety-banner>.guide { | ||
+ | box-shadow: -5px 0 0 0 #E1CBAB; | ||
+ | } | ||
+ | .team-banner { | ||
+ | background-image: url('https://static.igem.org/mediawiki/2017/1/1b/T--TAS_Taipei--Team_banner.jpg'); | ||
+ | background-size: 70vw; | ||
+ | background-repeat: none; | ||
+ | z-index: 1; | ||
+ | height: 100vh; | ||
+ | width: 100% | ||
+ | right: 0; | ||
+ | background-position: center right; | ||
+ | background-color: #FAFAFA | ||
+ | display: none; | ||
+ | } | ||
+ | .team-banner.active { | ||
+ | z-index: 2; | ||
+ | display: block; | ||
+ | } | ||
+ | .team-banner>.guide { | ||
+ | box-shadow: -5px 0 0 0 #A6BCA2; | ||
+ | } | ||
+ | .attr-banner { | ||
+ | background-image: url('https://static.igem.org/mediawiki/2017/e/eb/T--TAS_Taipei--Attributions-Banner.jpg'); | ||
+ | background-size: cover; | ||
+ | background-repeat: none; | ||
+ | z-index: 1; | ||
+ | display: none; | ||
+ | } | ||
+ | .attr-banner.active { | ||
+ | z-index: 2; | ||
+ | display: block; | ||
+ | } | ||
+ | .attr-banner>.guide { | ||
+ | box-shadow: -5px 0 0 0 #83af9b; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | h6 { | ||
+ | margin-top: 0; | ||
+ | font-size: 2vh; | ||
+ | font-family: 'Roboto', sans-serif !important; | ||
+ | font-weight: 500; | ||
+ | line-height: 5vh; | ||
+ | padding-top: 1vh; | ||
+ | } | ||
+ | |||
+ | .guide>h6{ | ||
+ | font-size: 2vh !important; | ||
+ | line-height: 2vh; | ||
+ | } | ||
+ | |||
+ | #this_title { | ||
+ | margin-top: 0; | ||
+ | font-size: 4vh; | ||
+ | font-weight: 900px; | ||
+ | line-height: 3vh; | ||
+ | padding-top: 1vh; | ||
+ | } | ||
+ | |||
+ | main>h1 { | ||
+ | color: #9e9e9e; | ||
+ | text-align: left; | ||
+ | font-size: 13vh; | ||
+ | line-height: 12vh; | ||
+ | padding: 0 !important; | ||
+ | font-family: 'Product Sans', Arial, sans-serif; | ||
+ | border: 0; | ||
+ | margin: 0 !important; | ||
+ | font-weight: 700; | ||
+ | } | ||
+ | |||
+ | main>h1>span { | ||
+ | color: #424242; | ||
+ | } | ||
+ | |||
+ | #fb { | ||
+ | height: 6vh; | ||
+ | vertical-align: bottom; | ||
+ | margin-top: 1vh; | ||
+ | } | ||
+ | |||
+ | #twit { | ||
+ | height: 6vh; | ||
+ | vertical-align: bottom; | ||
+ | margin-left: 0.7vh; | ||
+ | } | ||
+ | |||
+ | #insta { | ||
+ | height: 6vh; | ||
+ | vertical-align: bottom; | ||
+ | margin-top: 0.7vh; | ||
+ | margin-left: 0.8vh; | ||
+ | } | ||
+ | |||
+ | .item { | ||
+ | background-color: #3498db; | ||
+ | } | ||
+ | |||
+ | .item>img { | ||
+ | width: 100%; | ||
+ | height: 100vh !important; | ||
+ | background-color: #3498db; | ||
+ | } | ||
+ | |||
+ | .item>video { | ||
+ | width: auto !important; | ||
+ | height: 100% !important; | ||
+ | background-color: #3938b2; | ||
+ | } | ||
+ | |||
+ | #pr { | ||
+ | width: 50%; | ||
+ | margin-left: 500px; | ||
+ | } | ||
+ | |||
+ | #project { | ||
+ | background-color: #fe4365; | ||
+ | } | ||
+ | |||
+ | #project.active { | ||
+ | background-color: #424242; | ||
+ | } | ||
+ | |||
+ | #experiment { | ||
+ | background-color: #FD7080; | ||
+ | } | ||
+ | |||
+ | #experiment.active { | ||
+ | background-color: #424242; | ||
+ | } | ||
+ | |||
+ | #modeling { | ||
+ | background-color: #fc9d9a; | ||
+ | } | ||
+ | |||
+ | #modeling.active { | ||
+ | background-color: #424242; | ||
+ | } | ||
+ | |||
+ | #prototype { | ||
+ | background-color: #FBB5A4; | ||
+ | } | ||
+ | |||
+ | #policy { | ||
+ | background-color: #f9cdad; | ||
+ | } | ||
+ | |||
+ | #biosafety { | ||
+ | background-color: #c8c8a9; | ||
+ | } | ||
+ | |||
+ | #about { | ||
+ | background-color: #A6BCA2; | ||
+ | } | ||
+ | |||
+ | #acknowledgments { | ||
+ | background-color: #83af9b; | ||
+ | } | ||
+ | |||
+ | #project:hover, | ||
+ | #experiment:hover, | ||
+ | #modeling:hover, | ||
+ | #prototype:hover, | ||
+ | #biosafety:hover, | ||
+ | #about:hover, | ||
+ | #policy:hover, | ||
+ | #acknowledgments:hover { | ||
+ | background-color: #424242; | ||
+ | } | ||
+ | |||
+ | #animation{ | ||
+ | float: right; | ||
+ | } |
Revision as of 12:14, 9 August 2017
@import url('https://fonts.googleapis.com/css?family=Roboto:300,500'); @import url('https://fonts.googleapis.com/css?family=Product+Sans:400,400i,700,700i');
- top_title,#sideMenu { display: none !important; }
#content { width: 100%; margin: 0; padding: 0; background: #f3f4f4;}
- HQ_page p {
display: none;
}
- HQ_page h1, h2, h3, h4, h5 {
font-family: "Product Sans", sans-serif; border-bottom: none; font-weight: bold;
}
- sideMenu {
display: none !important;
}
- content{
background-color: #333333 !important;
}
.firstHeading {
color: #333333 !important;
}
pre {
display: none;
}
html, body {
margin: 0 !important; padding: 0 !important; height: 100vh; overflow-y: hidden; width: 100%; overflow-x: hidden;
}
.home_logo{
display: none;
}
.item{
margin: 0 !important; height: 100% !important; background-color: #3498db; position: absolute; left: 0; padding-left: 30vw;
}
- slideshow{
display: block;
}
- top_menu_under {
display: none !important;
}
- bodyContent{
margin-top: 15px !important;
}
.box, .box2, .box3 {
width: 100%; height: 12.5vh; position: relative; top: 0; right: 0; float: right; z-index: 1;
}
.box2 {
background: red;
}
- dna {
top: 0; bottom: 0; left: 0; right: 0; position: absolute; margin: auto; height: 6vh; width: 6vh; z-index: 9999;
}
.box3 {
text-align: right; padding-right: 15px;
}
.box3>h1 {
color: white; margin: auto; font-size: 5vh; line-height: 12.5vh; padding: 0 !important; padding-right: 25px;
}
.right {
width: 100px; right: 0;
}
@media screen and (max-width: 1020px) {
.return { z-index: 999; width: 12.5vh; height: 12.5vh; background: #fe4365; position: absolute; top: 0; left: 0; margin: 0; display: none; } .return.active { display: block; } .return>h1 { line-height: 12.5vh; text-align: center; margin: 0 !important; color: white; font-size: 8vh; font-weight: 200; padding: 0 !important; } .yellow { width: 100vw; height: 100vh; background: yellow; position: absolute; top: 0; left: -80vw; transition: all .3s ease; z-index: 4; } .blue { width: 80vw; height: 100vh; background: blue; position: absolute; top: 0; left: 0px; } .right { width: 20vw; right: 0; } main { width: 100%; position: absolute; margin-left: 200px; padding-left: 15px; padding-top: 5px; background: rgba(250, 250, 250, 1); height: 100vh; top: 0; z-index: 3; } #abstract1 { font-family: 'Roboto', sans-serif !important; color: black; line-height: 2vh !important; margin-top: 0; margin-right: 20px; padding-top: 1vh; padding-bottom: 10px; border-bottom: 1px solid black; width: 65vw; font-size: 2vh !important; font-weight: 500; text-align: justify !important; } .yellow.active { left: 0; } .banner { display: none; }
}
@media screen and (min-width: 1020px) {
.return { display: none; } .yellow { width: 450px; height: 100vh; background: yellow; position: absolute; top: 0; left: -350px; transition: all .3s ease; z-index: 4; } .blue { width: 350px; height: 100vh; background: blue; position: absolute; top: 0; left: 0px; } main { width: 30vw; position: absolute; margin-left: 100px; padding-left: 15px; padding-top: 5px; background: rgba(250, 250, 250, 0.8); height: 100vh; top: 0; z-index: 3; } #abstract1 { font-family: 'Roboto', sans-serif !important; color: black; line-height: 2.5vh; margin-right: 20px; padding-bottom: 10px; border-bottom: 1px solid black; font-size: 2vh; text-align: justify !important; } .banner { position: absolute; width: 100%; height: 100vh; top: 0; background-size: cover; background-repeat: no-repeat; display: none; } .banner>.guide { bottom: 50px; right: 50px; width: 500px; background: #FAFAFA; color: black; position: absolute; font-family: 'Product Sans', sans-serif; z-index: 3; padding-left: 20px; margin: 0 !important; padding-bottom: 0; } .banner>.guide>h1 { padding-top: 0 !important; padding-bottom: 0 !important; margin-bottom: 0 !important; margin-top: 20px !important; line-height: 3vh; font-size: 3vh; } .project-banner { background-image: url('https://static.igem.org/mediawiki/2017/a/a9/T--TAS_Taipei--Project-Banner.jpg'); background-size: cover; background-repeat: none; display: none; z-index: 1; transition: all 0.5s ease; } .project-banner.active { display: block; z-index: 2; } .project-banner>.guide { box-shadow: -5px 0 0 0 #fe4365; } .exp-banner { background-image: url('https://static.igem.org/mediawiki/2017/e/ec/T--TAS_Taipei--Exp_banner.jpg'); background-size: cover; z-index: 1; right: 0; position: absolute; width: 100% !important; background-position: center right; background-color: black; display: none;
} .exp-banner.active { z-index: 2; display: block; } .exp-banner>.guide { box-shadow: -5px 0 0 0 #FD7080; } .model-banner { background-image: url('https://static.igem.org/mediawiki/2017/2/20/T--TAS_Taipei--Modeling-Banner-new2.jpg'); background-size: cover; background-repeat: none; z-index: 1; display: none; } .model-banner.active { z-index: 2; display: block; } .model-banner>.guide { box-shadow: -5px 0 0 0 #fc9d9a; } .prototype-banner { background-image: url('https://static.igem.org/mediawiki/2017/2/2c/T--TAS_Taipei--Prototype_banner.jpg'); background-size: cover; background-repeat: none; z-index: 1; display: none; } .prototype-banner.active { z-index: 2; display: block; } .prototype-banner>.guide { box-shadow: -5px 0 0 0 #FBB5A4; } .hp-banner { background-image: url('https://static.igem.org/mediawiki/2017/c/cb/T--TAS_Taipei--HP_banner.jpg'); background-size: cover; background-repeat: none; z-index: 1; display: none; } .hp-banner.active { z-index: 2; display: block; } .hp-banner>.guide { box-shadow: -5px 0 0 0 #f9cdad; } .biosafety-banner { background-image: url('https://static.igem.org/mediawiki/2017/d/dd/T--TAS_Taipei--Biosafety_banner.jpg'); background-size: cover; background-repeat: none; z-index: 1; display: none; } .biosafety-banner.active { z-index: 2; display: block; } .biosafety-banner>.guide { box-shadow: -5px 0 0 0 #E1CBAB; } .team-banner { background-image: url('https://static.igem.org/mediawiki/2017/1/1b/T--TAS_Taipei--Team_banner.jpg'); background-size: 70vw; background-repeat: none; z-index: 1; height: 100vh; width: 100% right: 0; background-position: center right; background-color: #FAFAFA display: none; } .team-banner.active { z-index: 2; display: block; } .team-banner>.guide { box-shadow: -5px 0 0 0 #A6BCA2; } .attr-banner { background-image: url('https://static.igem.org/mediawiki/2017/e/eb/T--TAS_Taipei--Attributions-Banner.jpg'); background-size: cover; background-repeat: none; z-index: 1; display: none; } .attr-banner.active { z-index: 2; display: block; } .attr-banner>.guide { box-shadow: -5px 0 0 0 #83af9b; }
}
h6 {
margin-top: 0; font-size: 2vh; font-family: 'Roboto', sans-serif !important; font-weight: 500; line-height: 5vh; padding-top: 1vh;
}
.guide>h6{
font-size: 2vh !important; line-height: 2vh;
}
- this_title {
margin-top: 0; font-size: 4vh; font-weight: 900px; line-height: 3vh; padding-top: 1vh;
}
main>h1 {
color: #9e9e9e; text-align: left; font-size: 13vh; line-height: 12vh; padding: 0 !important; font-family: 'Product Sans', Arial, sans-serif; border: 0; margin: 0 !important; font-weight: 700;
}
main>h1>span {
color: #424242;
}
- fb {
height: 6vh; vertical-align: bottom; margin-top: 1vh;
}
- twit {
height: 6vh; vertical-align: bottom; margin-left: 0.7vh;
}
- insta {
height: 6vh; vertical-align: bottom; margin-top: 0.7vh; margin-left: 0.8vh;
}
.item {
background-color: #3498db;
}
.item>img {
width: 100%; height: 100vh !important; background-color: #3498db;
}
.item>video {
width: auto !important; height: 100% !important; background-color: #3938b2;
}
- pr {
width: 50%; margin-left: 500px;
}
- project {
background-color: #fe4365;
}
- project.active {
background-color: #424242;
}
- experiment {
background-color: #FD7080;
}
- experiment.active {
background-color: #424242;
}
- modeling {
background-color: #fc9d9a;
}
- modeling.active {
background-color: #424242;
}
- prototype {
background-color: #FBB5A4;
}
- policy {
background-color: #f9cdad;
}
- biosafety {
background-color: #c8c8a9;
}
- about {
background-color: #A6BCA2;
}
- acknowledgments {
background-color: #83af9b;
}
- project:hover,
- experiment:hover,
- modeling:hover,
- prototype:hover,
- biosafety:hover,
- about:hover,
- policy:hover,
- acknowledgments:hover {
background-color: #424242;
}
- animation{
float: right; }