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

(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...")
 
Line 7: Line 7:
  
 
/*Content*/
 
/*Content*/
−
.Content{ width: 100%; background: cornsilk; padding: 0px 5%; padding-bottom: 100px; font-size: 2rem; text-align: justify;}
+
.Content{ width: 100%; background: cornsilk; padding: 50px 5%; padding-bottom: 100px; font-size: 2rem; text-align: justify;}
−
.Overview{ width: 60%; margin: auto; margin-bottom: 70px; font-size: 2.2rem; text-align: center;}
+
.Overview p{ margin: 40px 0; text-align: justify;}
−
.Overview p:nth-of-type(2){ font-family: zwadobef; text-align: justify;}
+
.Overview,.Protocol,.Results,.Conclusions{ width: 80%; margin: auto; margin-bottom: 70px; font-size: 2rem;}
−
.Overview p:nth-of-type(3){ margin: 40px 0; text-align: justify; font-family: garamond;}
+
.Content .title{ font-size: 6rem; font-weight: 600; color: #394c53; letter-spacing: 2px; text-align: center;}
−
.Content .Overview .title{ font-size: 6rem; font-weight: 600; color: #394c53; padding: 50px; letter-spacing: 2px;}
+
.Overview .Explain p{ margin: 0;}
−
.Content .Overview .Explain{ font-family: garamond; text-align: justify;}
+
.Overview .Explain ul li{ list-style: disc; font-style: italic; margin-left: 25px; line-height: 1.5;}
−
.Content .Overview .Explain ul li{ list-style: disc; margin-left: 25px; line-height: 1.5;}
+
 
−
.Content .Title{ font-size: 3rem; font-weight: 600; border-bottom: 1px solid #333333; padding-bottom: 10px;}
+
−
.Content .content{ width: 100%; padding: 20px 40px;}
+
 
.Content .Subtitle{ font-size: 2.2rem; font-weight: 600; margin-top: 40px;}
 
.Content .Subtitle{ font-size: 2.2rem; font-weight: 600; margin-top: 40px;}
−
.Content .subcontent{ margin-top: 10px;}
+
.Content .content{ width: 100%;}
−
.Content .subcontent p{ margin: 10px 0; font-family: "arial narrow"; line-height: 1.4;}
+
.Content .content{ margin-top: 10px;}
−
.Content .subcontent .left{ width: 50%; float: left; min-width: 370px; }
+
.Content .content p{ margin: 10px 0; line-height: 1.4;}
−
.Content .subcontent .right{ width: 40%; float: right;}
+
.Content .img{ width: 80%; margin: 30px auto; }
−
.Content img{ width: 25vw; float: left; border-radius: 10px; min-width: 256px;}
+
.Content .img img{ width: inherit; border-radius: 10px; margin: auto;}
−
.Content .Protocol,.Content .Results,.Content .Conclusion{ width: 80%; margin: auto;}
+
.Content .img p{ text-align: center; margin-top: 5px;}
−
.Content .Protocol .content .Fluorescein{ height: 16vw; min-height: 330px;}
+
.Results p,.Conclusions p{ margin-top: 50px;}
−
.Content .Protocol .content .Cell{ height: 35vw; min-height: 360px;}
+
.Results .img{ margin-top: 60px;}
−
.Content .Protocol .content .Cell img:nth-of-type(2){ width: 20vw; margin: 15px 50px;}
+
.Results .img img{ margin-bottom: 10px !important;}
−
.Content .Results .img{ width: 100%;}
+
.Results .img p{ margin-bottom: 50px !important;}
−
.Content .Results .img .top{ height: 15vw; margin: 10px 0;}
+
−
.Content .Results .img .bottom{ height: 15vw;}
+
−
.Content .Results .img img{ width: 20vw; margin: 10px;}
+
−
.Content .Results .content p,.Content .Conclusion .content p{ margin: 10px 0; font-family: "arial narrow"; line-height: 1.4;}
+
−
 
+
−
.References{ width: 60%; margin: 100px auto; font-size: 3rem; color: saddlebrown;}
+
−
 
+
−
 
+
  
 
/*--1920--*/
 
/*--1920--*/
Line 40: Line 30:
 
.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 .Protocol .content .Fluorescein{ height: 23vw;}
 
−
}
 
−
 
−
/*--1600--*/
 
−
@media only screen and (max-width: 1600px) {
 
−
.Content .Protocol .content .Fluorescein{ height: 29vw;}
 
 
}
 
}
  
Line 54: Line 38:
 
.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 .Results .img .top,.Content .Results .img .bottom{ width: 590px; margin: auto; height: 28vw;}
 
 
}
 
}
  
Line 67: Line 50:
 
.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 .Protocol .content .Fluorescein{ height: 31vw;}
 
−
.Content .Results .img .top,.Content .Results .img .bottom{ height: 31vw; min-height: 335px;}
 
 
}
 
}

Revision as of 02:56, 20 October 2017

body{ min-width: 1024px; min-height: 465px; position: relative;}

.SSTi-SZGD{ background: url(SSTi-SZGD_banner.jpeg) 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(5) a{ color: #FAEE0D;}

/*Content*/ .Content{ width: 100%; background: cornsilk; padding: 50px 5%; padding-bottom: 100px; font-size: 2rem; text-align: justify;} .Overview p{ margin: 40px 0; text-align: justify;} .Overview,.Protocol,.Results,.Conclusions{ width: 80%; margin: auto; margin-bottom: 70px; font-size: 2rem;} .Content .title{ font-size: 6rem; font-weight: 600; color: #394c53; letter-spacing: 2px; text-align: center;} .Overview .Explain p{ margin: 0;} .Overview .Explain ul li{ list-style: disc; font-style: italic; margin-left: 25px; line-height: 1.5;}

.Content .Subtitle{ font-size: 2.2rem; font-weight: 600; margin-top: 40px;} .Content .content{ width: 100%;} .Content .content{ margin-top: 10px;} .Content .content p{ margin: 10px 0; line-height: 1.4;} .Content .img{ width: 80%; margin: 30px auto; } .Content .img img{ width: inherit; border-radius: 10px; margin: auto;} .Content .img p{ text-align: center; margin-top: 5px;} .Results p,.Conclusions p{ margin-top: 50px;} .Results .img{ margin-top: 60px;} .Results .img img{ margin-bottom: 10px !important;} .Results .img p{ margin-bottom: 50px !important;}

/*--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;} }

/*--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;} }

/*--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;} }