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

Line 1: Line 1:
 
body{ min-width: 1024px; min-height: 465px; position: relative;}
 
body{ min-width: 1024px; min-height: 465px; position: relative;}
  
−
.SSTi-SZGD{ background: url(https://static.igem.org/mediawiki/2017/9/95/SSTi-SZGD_HP_Summary_banner.jpeg) no-repeat center center; min-height: 465px; background-size: cover; padding-top: 15px;}
+
.SSTi-SZGD{ background: url(https://static.igem.org/mediawiki/2017/4/4f/HP_Summary_banner.jpeg) no-repeat center center; min-height: 465px; background-size: cover; padding-top: 15px;}
 
.SSTi-SZGD .SubNav{ width: 800px; margin: 22% auto;}
 
.SSTi-SZGD .SubNav{ width: 800px; margin: 22% auto;}
 
.SSTi-SZGD .SubNav div{ width: 220px; margin: 0 15px; background: rgba(0,0,0,0.431373); float: left; height: 100px; border-radius: 10px; border: 2px dashed #FAEE0D;}
 
.SSTi-SZGD .SubNav div{ width: 220px; margin: 0 15px; background: rgba(0,0,0,0.431373); float: left; height: 100px; border-radius: 10px; border: 2px dashed #FAEE0D;}
Line 10: Line 10:
  
 
/*Content*/
 
/*Content*/
−
.Content{ width: 100%; height: 800px; background: cornsilk; display: block; padding: 60px 0; text-align: justify; font-size: 1.8rem; font-family: garamond;}
+
.clear{clear: both;}
−
.Content .content{ width: 1320px; margin: auto;}
+
.Content{ width: 1000px; height: 1300px; margin:auto; display: block; font-size: 13px; font-family: "Arial Regular";font-weight: bold;}
−
.Content .left,.Content .right{ width: 250px; float: left; margin-top: 40px;}
+
.Content .Title{font-size: 29px; color: white;padding: 0 25px;}
−
.Content .left img{ width: 100%; transform: rotate(-10deg);}
+
.Content .left{float:left;}
−
.Content .right img{ width: 100%; transform: rotate(10deg);}
+
.Content .right{float:right;}
−
.Content .middle{ width: 760px; float: left; margin: 0 30px;}
+
.Ques1 p,.Ques2 p{line-height: 28px;padding-left:10px;}
−
.Content .middle p{ margin: 15px auto;}
+
  
 +
.Ques1{height:370px;}
 +
.Ques1 .Title{background:#151515;margin-bottom:20px;height: 60px;line-height: 58px;}
 +
.Ques1 .left,.Ques1 .right{}
 +
.Ques1 .left .Title{width:478px;}
 +
.Ques1 .right .Title{width: 478px;}
 +
.Ques1 p{width:478px;}
  
 +
.Ques2 .Title{background: url(https://static.igem.org/mediawiki/2017/4/40/HP_Summary_img7.png) no-repeat;background-size: contain;height: 90px;line-height: 75px;}
 +
.Ques2,.Ques3,.Ques4,.Ques5{padding:20px 0;}
 +
 +
.Ques3 .Title{background: url(https://static.igem.org/mediawiki/2017/b/b0/HP_Summary_img8.png) no-repeat;background-size: contain;height: 90px;line-height: 75px;}
 +
.Ques4 .Title{background: url(https://static.igem.org/mediawiki/2017/6/6e/HP_Summary_img9.png) no-repeat;background-size: contain;height: 90px;line-height: 75px;}
 +
.Ques5 .Title{background: url(https://static.igem.org/mediawiki/2017/0/0f/HP_Summary_img10.png) no-repeat;background-size: contain;height: 90px;line-height: 75px;}
 
/*--1920--*/
 
/*--1920--*/
 
@media only screen and (max-width: 1920px) {
 
@media only screen and (max-width: 1920px) {
Line 31: Line 42:
 
.Content .content{ width: 1160px;}
 
.Content .content{ width: 1160px;}
 
.Content .middle{ width: 600px;}
 
.Content .middle{ width: 600px;}
−
}
 
−
 
−
/*--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;}
 
−
.Content .content{ width: 1000px;}
 
−
.Content .middle{ width: 500px;}
 
−
.Content .left,.Content .right{ width: 220px;}
 
−
.Content img{ margin-bottom: 45px;}
 
 
}
 
}

Revision as of 07:43, 28 October 2017

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

.SSTi-SZGD{ background: url(HP_Summary_banner.jpeg) no-repeat center center; min-height: 465px; background-size: cover; padding-top: 15px;} .SSTi-SZGD .SubNav{ width: 800px; margin: 22% auto;} .SSTi-SZGD .SubNav div{ width: 220px; margin: 0 15px; background: rgba(0,0,0,0.431373); float: left; height: 100px; border-radius: 10px; border: 2px dashed #FAEE0D;} .SSTi-SZGD .SubNav a{ color: #FAEE0D; text-align: center; display: block; width: inherit; height: inherit; font-size: 3rem; padding: 30px 0;}

/*custom header*/ .header .nav .Human_Practices span,.header .nav .Human_Practices li:nth-of-type(1) a{ color: #FAEE0D;}

/*Content*/ .clear{clear: both;} .Content{ width: 1000px; height: 1300px; margin:auto; display: block; font-size: 13px; font-family: "Arial Regular";font-weight: bold;} .Content .Title{font-size: 29px; color: white;padding: 0 25px;} .Content .left{float:left;} .Content .right{float:right;} .Ques1 p,.Ques2 p{line-height: 28px;padding-left:10px;}

.Ques1{height:370px;} .Ques1 .Title{background:#151515;margin-bottom:20px;height: 60px;line-height: 58px;} .Ques1 .left,.Ques1 .right{} .Ques1 .left .Title{width:478px;} .Ques1 .right .Title{width: 478px;} .Ques1 p{width:478px;}

.Ques2 .Title{background: url(HP_Summary_img7.png) no-repeat;background-size: contain;height: 90px;line-height: 75px;} .Ques2,.Ques3,.Ques4,.Ques5{padding:20px 0;}

.Ques3 .Title{background: url(HP_Summary_img8.png) no-repeat;background-size: contain;height: 90px;line-height: 75px;} .Ques4 .Title{background: url(HP_Summary_img9.png) no-repeat;background-size: contain;height: 90px;line-height: 75px;} .Ques5 .Title{background: url(HP_Summary_img10.png) no-repeat;background-size: contain;height: 90px;line-height: 75px;} /*--1920--*/ @media only screen and (max-width: 1920px) { .header .nav .mainnav span{ padding-top: 6px; margin-bottom: 18.5px;} }

/*--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;} .Content .content{ width: 1160px;} .Content .middle{ width: 600px;} }