Cyclohexane (Talk | contribs) |
Cyclohexane (Talk | contribs) |
||
Line 1: | Line 1: | ||
− | . | + | .header { |
− | + | -moz-box-shadow: 0px 3px 10px #24366D; | |
− | + | -webkit-box-shadow: 0px 3px 10px #24366D; | |
− | + | box-shadow: 0px 3px 10px #24366D; | |
− | + | ||
− | + | ||
− | -webkit- | + | |
− | + | ||
} | } | ||
− | . | + | |
− | + | .description_banner { | |
− | + | margin: 0 25vw; | |
− | + | ||
− | + | ||
position: relative; | position: relative; | ||
+ | width: 50vw; | ||
+ | margin-top: 6rem; | ||
+ | height: 100%; | ||
+ | background-size: 100%; | ||
+ | background-repeat: no-repeat; | ||
+ | text-align: center; | ||
+ | background-image: url(https://static.igem.org/mediawiki/2018/c/c0/T--XMU-China--description_headline.png); | ||
+ | |||
} | } | ||
− | + | ||
− | + | .description_banner>.word { | |
− | + | font-size: 3vw; | |
+ | padding: 4vw 0vw; | ||
+ | line-height: 3vw; | ||
+ | color: white; | ||
+ | font-weight: bolder; | ||
+ | font-family: "Arial"; | ||
+ | |||
} | } | ||
− | + | ||
− | + | @media screen and (max-width: 768px) { | |
− | + | .description_banner>.word { | |
+ | font-size: 5vw; | ||
+ | |||
+ | } | ||
+ | |||
+ | .description_banner { | ||
+ | width: 90VW; | ||
+ | margin: 5rem 5vw 0; | ||
+ | } | ||
+ | |||
+ | .description_banner>.word { | ||
+ | padding: 8vw 0vw; | ||
+ | } | ||
} | } | ||
− | + | ||
− | + | @media screen and (min-width: 768px) and (max-width: 89.9375rem) { | |
− | + | .description_banner { | |
− | } | + | width: 60vw; |
− | + | margin: 6rem 20vw 0; | |
− | + | } | |
− | + | ||
+ | .description_banner>.word { | ||
+ | padding: 5vw 0vw; | ||
+ | } | ||
} | } | ||
− | + | ||
− | + | @media screen and (min-width: 90rem) {} | |
− | + | ||
− | + | .main { | |
− | + | margin: 0 15vw 5rem; | |
+ | width: 70vw; | ||
text-align: left; | text-align: left; | ||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
} | } | ||
− | + | ||
− | # | + | .headline { |
− | + | font-size: 2vw; | |
− | # | + | color: #1d2087; |
− | + | margin-bottom: 1vw; | |
− | font- | + | padding-top: 5rem; |
+ | } | ||
+ | |||
+ | .main p { | ||
+ | color: #000; | ||
+ | font-size: 1.2rem; | ||
+ | text-indent: 2.4rem; | ||
+ | font-weight: normal; | ||
+ | font-family: Arial, Helvetica, sans-serif; | ||
+ | line-height: 2rem; | ||
+ | margin-bottom: 0.8vw; | ||
+ | } | ||
+ | .main h1, | ||
+ | .main h2, | ||
+ | .main h3{ | ||
+ | font-family:"Microsoft YaHei"; | ||
+ | |||
+ | } | ||
+ | .main h1{ | ||
+ | margin: 0.8vw 0 0.3vw; | ||
} | } | ||
− | . | + | .main h2{ |
+ | font-size: 1.2rem; | ||
font-weight: bolder; | font-weight: bolder; | ||
} | } | ||
− | . | + | .main h3{ |
− | + | font-size: 1.1rem; | |
+ | |||
} | } | ||
− | . | + | .main h4{ |
− | + | font-size: 1.05rem; | |
− | + | ||
} | } | ||
− | . | + | .F1>img { |
− | margin | + | width: 60vw; |
+ | margin: 1vw 5vw 0; | ||
} | } | ||
− | . | + | |
− | + | .F2>img { | |
− | + | width: 50vw; | |
− | + | margin: 1vw 10vw 0; | |
− | + | ||
− | + | ||
} | } | ||
− | . | + | |
− | + | .F3>img { | |
− | + | width: 40vw; | |
− | margin: 0 | + | margin: 1vw 15vw 0; |
− | + | ||
− | + | ||
} | } | ||
+ | |||
+ | .F4>img { | ||
+ | width: 30vw; | ||
+ | margin: 1vw 20vw 0 | ||
+ | } | ||
+ | |||
+ | .F1, | ||
+ | .F2, | ||
+ | .F3, | ||
+ | .F4 { | ||
+ | text-indent: 0 !important; | ||
+ | margin-bottom: 0!important; | ||
+ | } | ||
+ | |||
+ | .Figure_word { | ||
+ | font-size: 1rem !important; | ||
+ | text-align: center !important; | ||
+ | text-indent: 0 !important; | ||
+ | } | ||
+ | |||
+ | .reference+p, | ||
+ | .headline+p, | ||
+ | h2+p, | ||
+ | h3+p { | ||
+ | text-indent: 0 !important; | ||
+ | } | ||
+ | |||
@media screen and (max-width: 769px) { | @media screen and (max-width: 769px) { | ||
− | . | + | .headline { |
− | + | font-size: 1.4rem; | |
+ | margin: 1rem 0 0; | ||
+ | padding: 0; | ||
} | } | ||
− | .main p{ | + | |
+ | .main p { | ||
+ | font-size: 0.9rem; | ||
+ | text-indent: 1.8rem; | ||
+ | line-height: 1.5rem; | ||
word-wrap:break-word;; | word-wrap:break-word;; | ||
+ | } | ||
+ | |||
+ | .F1>img { | ||
+ | width: 85vw; | ||
+ | margin: 1vw 0vw; | ||
+ | } | ||
+ | |||
+ | .F2>img { | ||
+ | width: 95vw; | ||
+ | margin: 1vw -5vw; | ||
+ | } | ||
+ | |||
+ | .F3>img { | ||
+ | width: 85vw; | ||
+ | margin: 1vw 0vw; | ||
+ | } | ||
+ | |||
+ | .F4>img { | ||
+ | width: 50vw; | ||
+ | margin: 1vw 17.5vw; | ||
+ | } | ||
+ | |||
+ | .main { | ||
+ | width: 85vw; | ||
+ | margin: 0 7.5vw 5rem; | ||
+ | } | ||
+ | .main h1{ | ||
+ | font-size: 1.15rem; | ||
+ | margin: 0.8vw 0 0; | ||
+ | font-weight: bold; | ||
+ | white-space: nowrap; | ||
+ | } | ||
+ | .main h2{ | ||
+ | margin: 0; | ||
+ | padding: 0; | ||
+ | font-size: 1.1rem; | ||
+ | font-weight: normal; | ||
} | } | ||
} | } | ||
+ | |||
@media screen and (min-width: 769px) and (max-width: 89.9375rem) { | @media screen and (min-width: 769px) and (max-width: 89.9375rem) { | ||
− | . | + | .headline { |
− | + | font-size: 1.6rem; | |
− | } | + | margin-bottom: 1vw; |
− | + | } | |
− | + | ||
− | + | .main p {} | |
− | + | ||
− | + | ||
− | + | ||
− | } | + | |
} | } | ||
+ | |||
@media screen and (min-width: 90rem) {} | @media screen and (min-width: 90rem) {} |
Revision as of 10:40, 8 October 2018
.header {
-moz-box-shadow: 0px 3px 10px #24366D; -webkit-box-shadow: 0px 3px 10px #24366D; box-shadow: 0px 3px 10px #24366D;
}
.description_banner {
margin: 0 25vw; position: relative; width: 50vw; margin-top: 6rem; height: 100%; background-size: 100%; background-repeat: no-repeat; text-align: center; background-image: url();
}
.description_banner>.word {
font-size: 3vw; padding: 4vw 0vw; line-height: 3vw; color: white; font-weight: bolder; font-family: "Arial";
}
@media screen and (max-width: 768px) {
.description_banner>.word { font-size: 5vw;
}
.description_banner { width: 90VW; margin: 5rem 5vw 0; }
.description_banner>.word { padding: 8vw 0vw; }
}
@media screen and (min-width: 768px) and (max-width: 89.9375rem) {
.description_banner { width: 60vw; margin: 6rem 20vw 0; }
.description_banner>.word { padding: 5vw 0vw; }
}
@media screen and (min-width: 90rem) {}
.main {
margin: 0 15vw 5rem; width: 70vw; text-align: left;
}
.headline {
font-size: 2vw; color: #1d2087; margin-bottom: 1vw; padding-top: 5rem;
}
.main p {
color: #000; font-size: 1.2rem; text-indent: 2.4rem; font-weight: normal; font-family: Arial, Helvetica, sans-serif; line-height: 2rem; margin-bottom: 0.8vw;
} .main h1, .main h2, .main h3{
font-family:"Microsoft YaHei";
} .main h1{
margin: 0.8vw 0 0.3vw;
} .main h2{
font-size: 1.2rem; font-weight: bolder;
} .main h3{
font-size: 1.1rem;
} .main h4{
font-size: 1.05rem;
} .F1>img {
width: 60vw; margin: 1vw 5vw 0;
}
.F2>img {
width: 50vw; margin: 1vw 10vw 0;
}
.F3>img {
width: 40vw; margin: 1vw 15vw 0;
}
.F4>img {
width: 30vw; margin: 1vw 20vw 0
}
.F1, .F2, .F3, .F4 {
text-indent: 0 !important; margin-bottom: 0!important;
}
.Figure_word {
font-size: 1rem !important; text-align: center !important; text-indent: 0 !important;
}
.reference+p, .headline+p, h2+p, h3+p {
text-indent: 0 !important;
}
@media screen and (max-width: 769px) {
.headline { font-size: 1.4rem; margin: 1rem 0 0; padding: 0; }
.main p { font-size: 0.9rem; text-indent: 1.8rem; line-height: 1.5rem; word-wrap:break-word;; }
.F1>img { width: 85vw; margin: 1vw 0vw; }
.F2>img { width: 95vw; margin: 1vw -5vw; }
.F3>img { width: 85vw; margin: 1vw 0vw; }
.F4>img { width: 50vw; margin: 1vw 17.5vw; }
.main { width: 85vw; margin: 0 7.5vw 5rem; } .main h1{ font-size: 1.15rem; margin: 0.8vw 0 0; font-weight: bold; white-space: nowrap; } .main h2{ margin: 0; padding: 0; font-size: 1.1rem; font-weight: normal; }
}
@media screen and (min-width: 769px) and (max-width: 89.9375rem) {
.headline { font-size: 1.6rem; margin-bottom: 1vw; }
.main p {}
}
@media screen and (min-width: 90rem) {}