Difference between revisions of "Team:SSTi-SZGD/css/Collaborations"
YuhangYang (Talk | contribs) (Created page with ".Banner{ width: 100%; height: 500px; background: url(https://static.igem.org/mediawiki/2018/2/23/T--SSTi-SZGD--banner_Collaborations.png) no-repeat center center; background-size: 5...") |
YuhangYang (Talk | contribs) |
||
| Line 10: | Line 10: | ||
.Content section .Cimg img{ width: 100%;} | .Content section .Cimg img{ width: 100%;} | ||
.Content section .content{ position: relative; padding: 5%;} | .Content section .content{ position: relative; padding: 5%;} | ||
| − | .Content section .content .img{ | + | .Content section .content .img{ float: none; margin: auto;} |
| − | .Content section .content .img img{ width: | + | .Content section .content .img img{ width: 100%;} |
.Content section .content span{ position: absolute; width: 50px; height: 50px;} | .Content section .content span{ position: absolute; width: 50px; height: 50px;} | ||
.Content section.SZU .content span.before,.Content section.TJC .content span.before{ top: 0; left: 0; border-top: 10px solid #89c9ff; border-left: 10px solid #89c9ff;} | .Content section.SZU .content span.before,.Content section.TJC .content span.before{ top: 0; left: 0; border-top: 10px solid #89c9ff; border-left: 10px solid #89c9ff;} | ||
Revision as of 14:20, 13 October 2018
.Banner{ width: 100%; height: 500px; background: url(
) no-repeat center center; background-size: 50%; margin: 100px 0 80px 0;}
.Content{ font-size: 1.6rem; margin-bottom: 100px;}
.Content .title{ text-align: center; font-size: 3rem; font-weight: 600; color: #fff;}
.Content section .title span{ padding: 5px 20px; border-radius: 30px;}
.Content section.SZU .title span,.Content section.TJC .title span{ background: #89c9ff;}
.Content section.JNC .title span,.Content section.FJC .title span{ background: #ff9bfe;}
.Content .subtitle{ text-align: center; font-size: 2.5rem;}
.Content section{ margin: 0 auto 100px auto; float: none;}
.Content section .Cimg{ padding: 5% 10%;}
.Content section .Cimg img{ width: 100%;}
.Content section .content{ position: relative; padding: 5%;}
.Content section .content .img{ float: none; margin: auto;}
.Content section .content .img img{ width: 100%;}
.Content section .content span{ position: absolute; width: 50px; height: 50px;}
.Content section.SZU .content span.before,.Content section.TJC .content span.before{ top: 0; left: 0; border-top: 10px solid #89c9ff; border-left: 10px solid #89c9ff;}
.Content section.SZU .content span.after,.Content section.TJC .content span.after{ bottom: 0; right: 0; border-bottom: 10px solid #89c9ff; border-right: 10px solid #89c9ff;}
.Content section.JNC .content span.before,.Content section.FJC .content span.before{ top: 0; right: 0; border-top: 10px solid #ff9bfe; border-right: 10px solid #ff9bfe;}
.Content section.JNC .content span.after,.Content section.FJC .content span.after{ bottom: 0; left: 0; border-bottom: 10px solid #ff9bfe; border-left: 10px solid #ff9bfe;}
.Content section.Project_Feedback .title,.Content section.Mentorship .title{ padding: 5px; border-radius: 30px; background: #89c9ff;} .Content section.Project_Feedback .content,.Content section.Mentorship .content{ padding: 30px; border-radius: 15px; background: #fff3f4;} .Content section.Project_Feedback .content img,.Content section.Mentorship .content img{ width: 100%;} .Content section.Mentorship .title{ background: #ff9bfe;}
@media only screen and (max-width: 767px) { .Banner{ height: 300px; background-size: 80%; margin: 100px 0 0 0;} .Content{ width: 100%; padding: 5%; font-size: 1.8rem;} .Content .title{ font-size: 2.4rem;} }
@media (min-width: 467px) and (max-width: 567px) {
}
@media (min-width: 567px) and (max-width: 767px) {
}
@media only screen and (min-width: 768px) { .Banner{ height: 400px;} }