Difference between revisions of "Team:SSTi-SZGD/css/Software"
YuhangYang (Talk | contribs) |
YuhangYang (Talk | contribs) |
||
| Line 53: | Line 53: | ||
.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{font-size: | + | .Content{font-size: 13px;} |
.Content ul{ left: -539px;} | .Content ul{ left: -539px;} | ||
.Content ul li{ margin: 85px 74.5px; height: 600px;} | .Content ul li{ margin: 85px 74.5px; height: 600px;} | ||
| − | .Content .Title{ font-size: | + | .Content .Title{ font-size: 29px;width: 310px; height: 60px; padding: 0 25px; line-height: 58px;} |
.Content p{ line-height: 26.5px;} | .Content p{ line-height: 26.5px;} | ||
.clear{clear: both;} | .clear{clear: both;} | ||
| Line 88: | Line 88: | ||
.text1,.text2{border-bottom:2px solid #DFCA00;padding:35px 50px;} | .text1,.text2{border-bottom:2px solid #DFCA00;padding:35px 50px;} | ||
.text2{margin-bottom:200px;} | .text2{margin-bottom:200px;} | ||
| − | .text2 p span{font-size: | + | .text2 p span{font-size: 18px;} |
/*--1190--*/ | /*--1190--*/ | ||
Revision as of 04:45, 30 October 2017
body{ min-width: 1024px; min-height: 465px; position: relative;}
.SSTi-SZGD{ background: url(
) no-repeat center center; height: 600px; background-size: cover; padding-top: 15px;}
/*custom header*/ .header .nav .Application span,.header .nav .Application li:nth-of-type(2) a{ color: #FAEE0D;} /*Content*/ .Content{ width: 100%; background: #FFFFFF;font-size: 1.8rem;font-family: "Arial Regular";font-weight: bold;text-align: justify;} .Content .left{ float: left;} .Content .right{ float: right;} .Content .Title{ font-size: 4rem; color: white; background: #DFCA00;width: 450px; height: 78px; padding: 0 25px; line-height: 75px;} .Content p{ line-height: 37.5px;}
.Software{ width: 1360px; margin: auto;} .warp1 .left{width: 655px;} .warp1 .right{width: 655px;height:541px;background:url(https://static.igem.org/mediawiki/2017/4/44/SOFTWARE_img2.pnghttps://static.igem.org/mediawiki/2017/4/44/SOFTWARE_img2.png);padding:0 40px;background-repeat: no-repeat;font-size: 16px;} .clear{clear: both;} .warp1 .right p{margin-top:35px;} .warp1 .left img{margin: auto;} .warp2{position:relative;height:2000px;} .warp2 .left,.warp2 .right{width:360px;margin:70px 0;} .warp2 .right{float: left;margin-left:30px;} .line{position: absolute;} .line1{border-right:10px solid #DFCA00;top:20px;left:0;width:856px;height:170px;} .line0{top:0;left:0;border-bottom:10px solid #DFCA00;margin-right:455px;padding:0 200px 35px 10px;} .line2{top:170px;left:0;width:750px;} .line3{top:50px;left:800px;width:514px;height:1650px;border-top:10px solid #DFCA00;border-bottom:10px solid #DFCA00;} .line3 .img{padding-left:160px;margin-top:170px;} .line3 p{padding-left:150px;margin-top:70px;border-bottom:10px solid #DFCA00;padding-bottom:70px;} .line4{top:1050px;left:0;width:850px;height:800px;border-right:10px solid #DFCA00;} .line4 .img{width:905px;height:740px;padding:60px 20px;margin-top:30px;border-top:10px solid #DFCA00;border-bottom:10px solid #DFCA00;} .line5{top:1300px;left:450px;padding:60px 20px;background: #FFFFFF;} .video .left,.video .right{width:665px;} .video .left div,video{width:350px;margin:0 auto;padding:25px 0;} .video .right{height:711px;border-left:2px solid #DFCA00;padding:35px 0;padding-left:20px;} .text{height:477px;border-top:2px solid #DFCA00;border-bottom:2px solid #DFCA00;} .text .left,.text .right{width:665px;padding:35px 0;} .text .left{padding-left:50px;} .text .right{border-left:2px solid #DFCA00;padding-left:20px;} .text1,.text2{border-bottom:2px solid #DFCA00;padding:35px 50px;} .text2{margin-bottom:200px;} .text2 p span{font-size: 2.5rem;} /*--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;} }
/*--1920--*/ @media only screen and (max-width: 1920px) { html{ font-size: 55%;} .header .logo span{ margin-top: 16px;} .header .nav .mainnav span{ margin-bottom: 21.5px;} .topic p{ font-size: 5rem;} .Content{font-size: 13px;} .Content ul{ left: -539px;} .Content ul li{ margin: 85px 74.5px; height: 600px;}
.Content .Title{ font-size: 29px;width: 310px; height: 60px; padding: 0 25px; line-height: 58px;} .Content p{ line-height: 26.5px;} .clear{clear: both;} .Software{ width: 1000px; margin: auto;} .warp1 .left{width: 455px;} .warp1 .left img{width:60%;margin: auto;} .warp1 .right{width: 480px;height:433px;background:url(../img/SOFTWARE_img2.png);padding:0 20px;background-repeat: no-repeat;font-size: 1.2rem;background-size: contain;} .warp1 .right p{margin-top:35px;} .warp2 .left,.warp2 .right{width:305px;margin:60px 0;} .warp2{position:relative;height:1425px;} .warp2 .right{float: left;margin-left:30px;} .line{position: absolute;} .line0{top:0;left:0;border-bottom:7px solid #DFCA00;margin-right:305px;padding:0 200px 20px 5px;} .line1{border-right:7px solid #DFCA00;top:10px;left:0;width:665px;height:120px;} .line2{top:90px;left:0;width:640px;} .line3{top:40px;left:620px;width:380px;height:1245px;border-top:7px solid #DFCA00;border-bottom:7px solid #DFCA00;} .line3 .img{padding-left:80px;margin-top:100px;} .line2 .img img,.line3 .img img,.line4 .img img{width:300px;} .line3 p{padding-left:80px;margin-top:60px;border-bottom:7px solid #DFCA00;padding-bottom:60px;} .line4{top:750px;left:0;width:665px;height:645px;border-right:7px solid #DFCA00;} .line4 .img{width:690px;height:595px;padding:60px 20px;margin-top:25px;border-top:7px solid #DFCA00;border-bottom:7px solid #DFCA00;} .line5{top:960px;left:358px;padding:60px 20px;background: #FFFFFF;} .video .left,.video .right,.text .left,.text .right{width:480px;} .video .left div,video{width:295px;margin:0 auto;padding:25px 0;} .video .right{height:620px;border-left:2px solid #DFCA00;padding:35px 0;padding-left:20px;} .text{height:335px;border-top:2px solid #DFCA00;border-bottom:2px solid #DFCA00;} .text .left,.text .right{padding:35px 0;} .text .left{padding-left:50px;} .text .right{border-left:2px solid #DFCA00;padding-left:20px;} .text1,.text2{border-bottom:2px solid #DFCA00;padding:35px 50px;} .text2{margin-bottom:200px;} .text2 p span{font-size: 18px;}
/*--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 ul{ left: -450px;} .Content ul li{ margin: 85px 36.5px;} }
/*--1024--*/ @media only screen and (max-width: 1024px) { .Content ul{ left: -830px;} .Content ul li{ margin: 85px 220px;} }
;padding:0){kind=link}