Difference between revisions of "Team:SSTi-SZGD/css/Safety"
YuhangYang (Talk | contribs) (Created page with "body{ min-width: 1024px; min-height: 465px; position: relative;} .SSTi-SZGD{ background: url(https://static.igem.org/mediawiki/2017/3/3d/SSTi-SZGD_banner.jpeg) no-repeat 0px 0px...") |
YuhangYang (Talk | contribs) |
||
| Line 13: | Line 13: | ||
.Content .Title{ font-size: 3rem; font-weight: 600; border-bottom: 1px solid #333333; padding-bottom: 10px;} | .Content .Title{ font-size: 3rem; font-weight: 600; border-bottom: 1px solid #333333; padding-bottom: 10px;} | ||
.Content .Subtitle{ font-size: 2.2rem; font-weight: 600; margin-top: 50px; margin-left: 50px;} | .Content .Subtitle{ font-size: 2.2rem; font-weight: 600; margin-top: 50px; margin-left: 50px;} | ||
| − | .Content .content{ margin-top: 10px; width: 100%; height: | + | .Content .content{ margin-top: 10px; width: 100%; height: 25vw;} |
| − | .Content .content p{ margin: 10px 0;} | + | .Content .content p{ margin: 10px 0; font-family: "arial narrow";} |
.Content .content .left{ width: 50%; float: left; padding: 10px 50px; min-width: 370px;} | .Content .content .left{ width: 50%; float: left; padding: 10px 50px; min-width: 370px;} | ||
.Content .content .right{ width: 40%; float: right; padding: 50px 0; } | .Content .content .right{ width: 40%; float: right; padding: 50px 0; } | ||
| Line 20: | Line 20: | ||
.Content .Laboratory,.Content .Environment{ width: 80%; margin: auto;} | .Content .Laboratory,.Content .Environment{ width: 80%; margin: auto;} | ||
.Content .Laboratory .Daily .right,.Content .Environment .right{ padding: 25px 0;} | .Content .Laboratory .Daily .right,.Content .Environment .right{ padding: 25px 0;} | ||
| − | .Content .Laboratory .project{ height: | + | .Content .Laboratory .project{ height: 20vw;} |
| − | .Content .Laboratory .Daily{ height: | + | .Content .Laboratory .Daily{ height: 30vw;} |
.Content .Laboratory .Daily img{ width: 20vw; margin: 10px;} | .Content .Laboratory .Daily img{ width: 20vw; margin: 10px;} | ||
.Content .Laboratory .Daily img:nth-of-type(2){ margin-left: 20%;} | .Content .Laboratory .Daily img:nth-of-type(2){ margin-left: 20%;} | ||
| − | .Content .Environment{ height: | + | .Content .Environment{ height: 20vw;} |
.References{ width: 60%; margin: 100px auto; font-size: 3rem; color: saddlebrown;} | .References{ width: 60%; margin: 100px auto; font-size: 3rem; color: saddlebrown;} | ||
| Line 33: | Line 33: | ||
.header .nav .mainnav span{ padding-top: 6px; margin-bottom: 18.5px;} | .header .nav .mainnav span{ padding-top: 6px; margin-bottom: 18.5px;} | ||
.topic p{ font-size: 5.5rem;} | .topic p{ font-size: 5.5rem;} | ||
| + | .Content .content{ height: 30vw;} | ||
| + | .Content .Laboratory .Daily{ height: 35vw;} | ||
| + | .Content .Environment{ height: 25vw;} | ||
} | } | ||
/*--1600--*/ | /*--1600--*/ | ||
@media only screen and (max-width: 1600px) { | @media only screen and (max-width: 1600px) { | ||
| − | .Content .content{ height: | + | .Content .content{ height: 35vw;} |
| − | .Content .Laboratory .Daily{ height: | + | .Content .Laboratory .Daily{ height: 45vw;} |
.Content .Environment{ height: 35vw;} | .Content .Environment{ height: 35vw;} | ||
} | } | ||
| Line 48: | Line 51: | ||
.header .nav .mainnav span{ margin-bottom: 21.5px;} | .header .nav .mainnav span{ margin-bottom: 21.5px;} | ||
.topic p{ font-size: 5rem;} | .topic p{ font-size: 5rem;} | ||
| − | .Content .content{ height: | + | .Content .content{ height: 40vw;} |
| − | .Content .Laboratory .Daily{ height: | + | .Content .Laboratory .Daily{ height: 45vw;} |
| − | .Content .Environment{ height: | + | .Content .Environment{ height: 35vw;} |
} | } | ||
| Line 63: | Line 66: | ||
.header .nav .mainnav span{ padding-top: 6.5px; margin-bottom: 22px;} | .header .nav .mainnav span{ padding-top: 6.5px; margin-bottom: 22px;} | ||
.topic p{ font-size: 4.5rem;} | .topic p{ font-size: 4.5rem;} | ||
| − | .Content .content{ height: | + | .Content .content{ height: 50vw;} |
| − | .Content .Laboratory .Daily{ height: | + | .Content .Laboratory .Daily{ height: 55vw;} |
| − | .Content .Environment{ height: | + | .Content .Environment{ height: 42vw;} |
} | } | ||
Revision as of 05:54, 29 September 2017
body{ min-width: 1024px; min-height: 465px; position: relative;}
.SSTi-SZGD{ background: url(
) no-repeat 0px 0px; height: 465px; background-size: cover; padding-top: 15px;}
/*custom header*/ .header .nav .Project span,.header .nav .Project li:nth-of-type(6) a{ color: #FAEE0D;}
/*Content*/ .Content{ width: 100%; background: cornsilk; padding: 0px 5%; padding-bottom: 100px; font-size: 2rem; text-align: justify;} .Safety{ width: 60%; margin: auto; margin-bottom: 60px; font-size: 2.2rem; text-align: center;} .Safety p:nth-of-type(2){ font-family: zwadobef; text-align: justify;} .Content .Safety .title{ font-size: 6rem; font-weight: 600; color: #394c53; padding: 50px; letter-spacing: 2px;} .Content .Title{ font-size: 3rem; font-weight: 600; border-bottom: 1px solid #333333; padding-bottom: 10px;} .Content .Subtitle{ font-size: 2.2rem; font-weight: 600; margin-top: 50px; margin-left: 50px;} .Content .content{ margin-top: 10px; width: 100%; height: 25vw;} .Content .content p{ margin: 10px 0; font-family: "arial narrow";} .Content .content .left{ width: 50%; float: left; padding: 10px 50px; min-width: 370px;} .Content .content .right{ width: 40%; float: right; padding: 50px 0; } .Content img{ width: 25vw; float: left; border-radius: 10px; min-width: 256px;} .Content .Laboratory,.Content .Environment{ width: 80%; margin: auto;} .Content .Laboratory .Daily .right,.Content .Environment .right{ padding: 25px 0;} .Content .Laboratory .project{ height: 20vw;} .Content .Laboratory .Daily{ height: 30vw;} .Content .Laboratory .Daily img{ width: 20vw; margin: 10px;} .Content .Laboratory .Daily img:nth-of-type(2){ margin-left: 20%;} .Content .Environment{ height: 20vw;} .References{ width: 60%; margin: 100px auto; font-size: 3rem; color: saddlebrown;}
/*--1920--*/ @media only screen and (max-width: 1920px) { .header .nav .mainnav span{ padding-top: 6px; margin-bottom: 18.5px;} .topic p{ font-size: 5.5rem;} .Content .content{ height: 30vw;} .Content .Laboratory .Daily{ height: 35vw;} .Content .Environment{ height: 25vw;} }
/*--1600--*/ @media only screen and (max-width: 1600px) { .Content .content{ height: 35vw;} .Content .Laboratory .Daily{ height: 45vw;} .Content .Environment{ height: 35vw;} }
/*--1366--*/ @media only screen and (max-width: 1366px) { html{ font-size: 55%;} .header .logo span{ margin-top: 16px;} .header .nav .mainnav span{ margin-bottom: 21.5px;} .topic p{ font-size: 5rem;} .Content .content{ height: 40vw;} .Content .Laboratory .Daily{ height: 45vw;} .Content .Environment{ height: 35vw;} }
/*--1190--*/ @media only screen and (max-width: 1190px) { html{ font-size: 52%;} .header .nav .Team{ width: 90px;} .header .nav .Project{ width: 100px;} .header .nav .Application{ width: 115px;} .header .nav .Human_Practices{ width: 135px;} .header .nav .Achievement{ width: 120px;} .header .nav .mainnav span{ padding-top: 6.5px; margin-bottom: 22px;} .topic p{ font-size: 4.5rem;} .Content .content{ height: 50vw;} .Content .Laboratory .Daily{ height: 55vw;} .Content .Environment{ height: 42vw;} }
