Difference between revisions of "Team:SSTi-SZGD/css/Public Engagement"

(final)
 
Line 1: Line 1:
.Banner{ text-align: center; padding: 10% 0;}
+
.Banner{ width: 100%; height: 400px; background: url(https://static.igem.org/mediawiki/2018/thumb/f/ff/T--SSTi-SZGD--banner_Public_Engagement.png/800px-T--SSTi-SZGD--banner_Public_Engagement.png) no-repeat center center; background-size: 40%; margin: 100px 0 0 0;}
.Banner img{ margin: auto; float: none;}
+
 
.Content{ font-size: 1.6rem; margin-bottom: 100px; margin: auto; float: none;}
 
.Content{ font-size: 1.6rem; margin-bottom: 100px; margin: auto; float: none;}
 
.Content .content{ padding: 0 15px;}
 
.Content .content{ padding: 0 15px;}
Line 11: Line 10:
 
.Content .img img{ width: 100%; border-radius: 10px; box-shadow: rgba(0,0,0,0.38) 0px 0px 10px 0;}
 
.Content .img img{ width: 100%; border-radius: 10px; box-shadow: rgba(0,0,0,0.38) 0px 0px 10px 0;}
 
.Content sup{ font-weight: 600;}
 
.Content sup{ font-weight: 600;}
 +
 +
 +
@media only screen and (max-width: 767px) {
 +
.Banner{ background-size: 60%;}
 +
}
 +
 +
@media only screen and (max-width: 992px) {
 +
.Banner{ margin: 100px 0 0 0;}
 +
}

Latest revision as of 17:21, 4 November 2018

.Banner{ width: 100%; height: 400px; background: url(800px-T--SSTi-SZGD--banner_Public_Engagement.png) no-repeat center center; background-size: 40%; margin: 100px 0 0 0;} .Content{ font-size: 1.6rem; margin-bottom: 100px; margin: auto; float: none;} .Content .content{ padding: 0 15px;} .Content .title{ font-size: 3rem; font-weight: 600; margin: 10px 0;} .Content .title span{ background: #d9b8f1; color: #fff; border-radius: 30px; padding: 5px 40px; display: inline-block; text-align: center;} .Content .subtitle{ font-size: 2rem; color: #d9b8f1; margin-top: 15px;} .Content section{ margin: 20px auto; float: none;} .Content .img{ margin: 15px auto; color: #d9b8f1; font-weight: 600; text-align: center;} .Content .Cimg{ float: none; margin: 15px auto;} .Content .img img{ width: 100%; border-radius: 10px; box-shadow: rgba(0,0,0,0.38) 0px 0px 10px 0;} .Content sup{ font-weight: 600;}


@media only screen and (max-width: 767px) { .Banner{ background-size: 60%;} }

@media only screen and (max-width: 992px) { .Banner{ margin: 100px 0 0 0;} }