body { background:no-repeat; background-size: cover; } .jcgmt-container { float: left; padding: 3px; } .jcgmt-container .jcgmt-lbl { font-size: 10px; color: #fff; line-height: 14px; text-align: center; width: 68px; margin: 0 auto; position: absolute; bottom: -10px; left: 23%; background-image: linear-gradient(to left, #27241b 0%, #7d5618 50%, #27241b 100%); } .jcgmt-clockHolder { width: 100px; margin: 0 auto; position: relative; overflow: hidden; } .jcgmt-sec, .jcgmt-min, .jcgmt-hour { display: block; position: absolute; } .jcgmt-rotatingWrapper { position: absolute; width: 100px; height: 100px; } .jcgmt-digital, .jcgmt-date { font-weight: bold; font-size: 12px; color: #fff; text-align: center; margin-left: 8px; position: absolute; bottom: -24px; left: 25px } .tv30-1 .tv-top { height: 130px; width: 100%; background-size: 250px; } .tv30-1 .tv-top img{ width:80px;margin-top:0 } .tv30-1 .tv-top .bgimg{ width: 300px; margin-top: 30px; } .tv30-1 .tv-top .newdata { color: #fff; position: absolute; left: 12%; bottom: -30px; } .tv30-1 .tv-top .timebox { width: 100%; height: 130px; padding: 0 15%; margin: auto; background-size: 250px; position:fixed } .tv30-1 .tv-top .timebox>div { width: 20%; position: relative; } .tv30-1 .tv-center { width: 94%; margin: 2px auto 10px; box-shadow: 0 0 30px 10px rgba(34, 34, 34, .8) inset; border: 1px solid #222; padding: 20px; height: 220px; } .tv30-1 .tv-center ul li { height: 200px; width: 20%; float: left; position: relative; } .tv30-1 .tv-center ul li>div { width: 100%; height: 100%; } .tv30-1 .tv-center .titp { position: absolute; left: 10px; top: 5px; color: #fff; } .tv30-1 .tv-center .legenddiv { position: absolute; right: 10px; top: 5px; color: #fff; font-size: 8px } .tv30-1 .tv-center .legenddiv .pie1 { vertical-align: middle; display: inline-block; width: 8px; height: 8px; background: #f90; border-radius: 50%; } .tv30-1 .tv-center .legenddiv .pie2 { vertical-align: middle; display: inline-block; width: 8px; height: 8px; background: #0061d0; border-radius: 50%; } .tv30-1 .tv-center .legenddiv .pie3 { vertical-align: middle; display: inline-block; width: 8px; height: 8px; background: #3fffea; border-radius: 50%; } .jcgmt-digital { display: none; } .tv30-1 .tv-bottom { width: 94%; margin: auto; box-shadow: 0 0 30px 10px rgba(34, 34, 34, .8) inset; border: 1px solid #222; padding: 0 20px; height: 160px; } .tv30-1 .tv-bottom ul li { height: 160px; width: 14%; float: left; position: relative; } .tv30-1 .tv-bottom ul li p { position: absolute; left: 0; top: 10px; color: #fff; } .tv30-1 .tv-bottom ul li>div { width: 100%; height: 100%; } .tv30-2 .tv-top { height: 50px; width: 100%; } .tv30-2 .tv-top h2 { font-size: 20px; color: #fff; text-align: center; line-height: 50px; font-weight: bold; background-image: -webkit-linear-gradient(bottom, #3e8aec, #d9fcfd); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; } .tv30-2 .tv-center { width: 98%; margin: 10px auto; padding: 0px; height: 300px; } .tv30-2 .tv-center .pull-left { position: relative; height: 300px; width: 39%; float: left; box-shadow: 0 0 30px 10px rgba(34, 34, 34, .8) inset; border: 1px solid #222; } .tv30-2 .tv-center .pull-left div { height: 300px; width: 100%; } .tv30-2 .tv-center .pull-right { height: 300px; width: 60%; float: left; box-shadow: 0 0 30px 10px rgba(34, 34, 34, .8) inset; border: 1px solid #222; } .tv30-2 .tv-center .pull-right ul li { position: relative; width: 33.3%; float: left; height: 150px } .tv30-2 .tv-center .pull-right ul li>div { width: 100%; height: 100%; } .tv30-2 .tv-center .titp { position: absolute; left: 10px; top: 5px; color: #fff; } .tv30-2 .tv-center .legenddiv { position: absolute; right: 10px; top: 5px; color: #fff; font-size: 8px } .tv30-2 .tv-center .legenddiv .pie1 { vertical-align: middle; display: inline-block; width: 8px; height: 8px; background: #f90; border-radius: 50%; } .tv30-2 .tv-center .legenddiv .pie2 { vertical-align: middle; display: inline-block; width: 8px; height: 8px; background: #0061d0; border-radius: 50%; } .tv30-2 .tv-center .legenddiv .pie3 { vertical-align: middle; display: inline-block; width: 8px; height: 8px; background: #3fffea; border-radius: 50%; } .tv30-2 .tv-bottom { width: 98%; margin: auto; box-shadow: 0 0 30px 10px rgba(34, 34, 34, .8) inset; border: 1px solid #222; padding: 0 20px; height: 160px; } .tv30-2 .tv-bottom ul li { height: 160px; width: 14%; float: left; position: relative; } .tv30-2 .tv-bottom ul li p { position: absolute; left: 0; top: 10px; color: #fff; } .tv30-2 .tv-bottom ul li>div { width: 100%; height: 100%; } .tv30-3 .tv-top { height: 50px; width: 100%; background-size: 300px 50px; } .tv30-3 .tv-top div { background-size: 300px 50px; } .tv30-3 .tv-top h2 span { font-size: 20px; color: #fff; text-align: center; line-height: 50px; font-weight: bold; background-image: -webkit-linear-gradient(bottom, #ff9900, #d9b593); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; } .tv30-3 .tv-top h2 { font-size: 20px; color: #fff; text-align: center; line-height: 50px; font-weight: bold; background-image: -webkit-linear-gradient(bottom, #3e8aec, #d9fcfd); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; background: url(../../../Content/images/data/top_bg.png) center no-repeat; background-size: 500px 50px; } .tv30-3 .tv-center { width: 98%; margin: 0px auto; padding: 0px; height: 310px; } .tv30-3 .tv-center .pull-right { height: 320px; width: 100%; } .tv30-3 .tv-center .pull-right ul li { position: relative; width: 33.3%; float: left; height: 150px } .tv30-3 .tv-center .pull-right ul li>div { width: 100%; height: 100%; } .tv30-3 .tv-center .titp { position: absolute; left: 10px; top: 5px; color: #fff; } .tv30-3 .tv-bottom { margin: auto; position:fixed;bottom:10px;left:10px;right:10px; box-shadow: 0 0 30px 10px rgba(34, 34, 34, .8) inset; border: 1px solid #222; padding: 0 20px; height: 180px; background: url(../../images/data/bottom_bg.png) no-repeat center bottom; background-size: 500px 1px; } .tv30-3 .tv-bottom ul li { height: 180px; width: 33.3%; float: left; position: relative; } .tv30-3 .tv-bottom ul li p { position: absolute; left: 0; top: 5px; color: #fff; } .tv30-3 .tv-bottom ul li>div { width: 100%; height: 100%; top:0px } .tv30-4 .tv-top div { background-size: 300px 50px; } .tv30-4 .tv-top { height: 50px; width: 100%; background-size: 300px 50px; } .tv30-4 .tv-top h2 span { font-size: 20px; color: #fff; text-align: center; line-height: 50px; font-weight: bold; background-image: -webkit-linear-gradient(bottom, #ff9900, #d9b593); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; } .tv30-4 .tv-top h2 { font-size: 20px; color: #fff; text-align: center; line-height: 50px; font-weight: bold; background-image: -webkit-linear-gradient(bottom, #3e8aec, #d9fcfd); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; background: url(../../../Content/images/data/top_bg.png) center no-repeat; background-size: 500px 50px; } .tv30-4 .tv-center { width: 94%; margin: 10px auto; padding: 0px; height: 250px; } .tv30-4 .tv-center .pull-left { position: relative; height: 260px; width: 33%; float: left; } .tv30-4 .tv-center .pull-left div { height: 260px; width: 100%; } .tv30-4 .tv-center .pull-right { height: 260px; width: 60%; float: left; } .tv30-4 .tv-center .pull-right ul li { position: relative; width: 50%; float: left; height: 150px } .tv30-4 .tv-center .pull-right ul li>div { width: 100%; height: 135px; } .tv30-4 .tv-center .titp { position: absolute; left: 10px; top: 5px; color: #fff; } .tv30-4 .tv-center .legenddiv { position: absolute; right: 10px; top: 5px; color: #fff; font-size: 8px } .tv30-4 .tv-center .legenddiv .pie1 { vertical-align: middle; display: inline-block; width: 8px; height: 8px; background: #f90; border-radius: 50%; } .tv30-4 .tv-center .legenddiv .pie2 { vertical-align: middle; display: inline-block; width: 8px; height: 8px; background: #0061d0; border-radius: 50%; } .tv30-4 .tv-center .legenddiv .pie3 { vertical-align: middle; display: inline-block; width: 8px; height: 8px; background: #3fffea; border-radius: 50%; } .tv30-4 .tv-bottom { width: 94%; margin: auto; box-shadow: 0 0 30px 10px rgba(34, 34, 34, .8) inset; border: 1px solid #222; padding: 0 20px; height: 160px; background: url(../../images/data/bottom_bg.png) no-repeat center bottom; background-size: 500px 1px; } .tv30-4 .tv-bottom ul li { height: 160px; width: 25%; float: left; position: relative; } .tv30-4 .tv-bottom ul li p { position: absolute; left: 0; top: 10px; color: #fff; } .tv30-4 .tv-bottom ul li>div { width: 100%; height: 100%; } .tv30-4 .top { width: 100%; height: 70px; position:inherit } .tv30-4 .top_box { width: 100%; height: 80px; top:50px } /*.tv30-4 .shuju_box { width: 96%; margin-left: auto; margin-right: auto; padding-top: 12px; } .tv30-4 .shuju_box .shuju { float: left; width: 13.2%; height: 76px; text-align: center; overflow: hidden; box-shadow: 0 0 30px 10px rgba(34, 34, 34, .8) inset; margin: 0 0.5%; border: 1px solid #222; } .tv30-4 .shuju_item { height: 75px; } .tv30-4 .shuju_item h2 { background-image: -webkit-linear-gradient(bottom, #3e8aec, #d9fcfd); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; font-size: 30px; padding-bottom: 5px; padding-top: 5px; font-weight: 600; height: 45px; } .tv30-4 .shuju_item p { font-size: 12px; color: #f90; }*/ /*第五个*/ .tv-top img{width:300px;margin-top:30px} .tv30-5 .tv-top { height: 50px; width: 100%; background-size: 300px 50px; } .tv30-5 .tv-top div { background-size: 300px 50px; } .tv30-5 .tv-top h2 { text-align: center; line-height: 50px; background: url(../../../Content/images/data/top_bg.png) center no-repeat; background-size: 500px 50px; } .tv30-5 .tv-top h2 span { font-size: 20px; color: #fff; text-align: center; line-height: 50px; font-weight: bold; background-image: -webkit-linear-gradient(bottom, #ff9900, #d9b593); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; } .tv30-5 .tv-center { width: 94%; margin: 10px auto; padding: 0px; height: 260px; } .tv30-5 .tv-center .pull-left { position: relative; height: 300px; width: 37.3%; float: left; } .tv30-5 .tv-center .pull-left:nth-of-type(1) { width: 24.3%; padding-left:1% } .tv30-5 .data_cont p{font-size:9px} .tv30-5 .tv-center .pull-left:nth-of-type(2) { margin-right: 1% } .tv30-5 .tv-center .pull-left>div { height: 240px; width: 100%; position:inherit; top:0 } .tv30-5 .left li img{ height:14px } .tv30-5 .tv-center .pull-right { height: 300px; width: 60%; float: left; } .tv30-5 .tv-center .pull-right ul li { position: relative; width: 50%; float: left; height: 150px } .tv30-5 .tv-center .pull-right ul li>div { width: 100%; height: 100%; } .tv30-5 .tv-center .titp { position: absolute; left: 10px; top: 5px; color: #fff; } .tv30-5 .tv-center .legenddiv { position: absolute; right: 10px; top: 5px; color: #fff; font-size: 8px } .tv30-5 .tv-center .legenddiv .pie1 { vertical-align: middle; display: inline-block; width: 8px; height: 8px; background: #f90; border-radius: 50%; } .tv30-5 .tv-center .legenddiv .pie2 { vertical-align: middle; display: inline-block; width: 8px; height: 8px; background: #0061d0; border-radius: 50%; } .tv30-5 .tv-center .legenddiv .pie3 { vertical-align: middle; display: inline-block; width: 8px; height: 8px; background: #3fffea; border-radius: 50%; } .tv30-5 .tv-bottom { margin: auto; position:fixed;left:10px;right:10px;bottom:10px; box-shadow: 0 0 30px 10px rgba(34, 34, 34, .8) inset; border: 1px solid #222; padding: 0 20px; height: 160px; background: url(../../images/data/bottom_bg.png) no-repeat center bottom; background-size: 500px 1px } .tv30-5 .tv-bottom ul li { height: 160px; width: 33.3%; float: left; position: relative; } .tv30-5 .tv-bottom ul li p { position: absolute; left: 0; top: 5px; color: #fff; } .tv30-5 .tv-bottom ul li>div { width: 100%; height: 100%; top:0px; position:relative } .tv30-5 .top { width: 100%; height: 60px; position:inherit } .tv30-5 .top_box { width: 100%; height: 60px; top:50px; } /*.tv30-5 .shuju_box { width: 96%; margin-left: auto; margin-right: auto; padding-top: 7px; } .tv30-5 .shuju_box .shuju { float: left; width: 13.2%; height: 55px; text-align: center; overflow: hidden; box-shadow: 0 0 30px 10px rgba(34, 34, 34, .8) inset; margin: 0 0.5%; border: 1px solid #222; } .tv30-5 .shuju_item { height: 65px; } .tv30-5 .shuju_item h2 { background-image: -webkit-linear-gradient(bottom, #3e8aec, #d9fcfd); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; font-size: 30px; padding-bottom: 5px; padding-top: 5px; font-weight: 600; height: 35px; } .tv30-5 .shuju_item p { font-size: 14px; color: #f90; }*/ .left li { float: left; width: 48%; margin-right: 0px; margin-bottom: 25px; } .data_cont h2 { font-size: 20px; color: #f90; margin-bottom: 5px; } .data_cont p { color: #fff; font-size: 12px; } .data_icon { background-image: url(../../../Content/images/data/data_icon.png); background-repeat: no-repeat; display: block; } .left li .data_icon { padding-left: 8px; margin-bottom: 10px; } .icon1 { width: 26px; height: 24px; background-position: 0 0; } .icon2 { width: 28px; height: 24px; background-position: -152px 0; } .icon3 { width: 23px; height: 24px; background-position: 0 -55px; } .icon4 { width: 28px; height: 24px; background-position: -155px -57px; } .icon5 { width: 38px; height: 24px; background-position: 0px -117px; } .icon6 { width: 24px; height: 24px; background-position: -156px -118px; } .icon7 { width: 25px; height: 24px; background-position: 0px -190px; } .icon8 { width: 24px; height: 24px; background-position: -156px -184px; } .gtp { background: #222222; color: #fff; display: block; width: 100%; height: 22px; line-height: 22px; text-indent: 10px; } .tv30-5 .spantitbox { color: #999; margin: 2px 0; } .tv30-5 .spantitbox span { display: inline-block; } .tv30-5 .spantitbox .ww1 { width: 30%; text-indent: 23px } .tv30-5 .spantitbox .ww2 { width: 15% } .tv30-5 .spantitbox .ww3 { width: 13% } .tv30-5 .spantitbox .ww4 { width: 20% } .tv30-5 .spantitbox .ww5 { width: 17% } .tv30-5 .contentspan { color: #fff } .tv30-5 .contentspan li { line-height: 20px; font-size:12px } .tv30-5 .contentspan span { display: inline-block; color: #fff } .tv30-5 .contentspan .ww1 { width: 30%; } .tv30-5 .contentspan .ww2 { width: 15% } .tv30-5 .contentspan .ww3 { width: 13% } .tv30-5 .contentspan .ww4 { width: 20% } .tv30-5 .contentspan .ww5 { width: 17% } .tv30-5 .spantitbox2 { color: #999; margin: 2px 0; } .tv30-5 .spantitbox2 span { display: inline-block; } .tv30-5 .spantitbox2 .ww1 { width: 35%; text-indent: 23px } .tv30-5 .spantitbox2 .ww2 { width: 15% } .tv30-5 .spantitbox2 .ww3 { width: 25% } .tv30-5 .spantitbox2 .ww4 { width: 30% } .tv30-5 .spantitbox2 .ww5 { width: 15% } .tv30-5 .contentspan2 { color: #fff } .tv30-5 .contentspan2 li { line-height: 20px; font-size:12px; } .tv30-5 .contentspan2 span { display: inline-block; color: #fff } .tv30-5 .contentspan2 .ww1 { width: 40%; text-overflow: ellipsis; white-space: nowrap; /* overflow: hidden; */ } .tv30-5 .contentspan2 .ww2 { width: 10% } .tv30-5 .contentspan2 .ww3 { width: 25% } .tv30-5 .contentspan2 .ww4 { width: 30% } .tv30-5 .contentspan2 .ww5 { width: 15% } .onespan { margin-right: 3px; display: inline-block; width: 18px; height: 18px; background: red; color: #fff; text-align: center; line-height: 18px; } .twospan { margin-right: 3px; display: inline-block; width: 18px; height: 18px; background: #ff9900; color: #fff; text-align: center; line-height: 18px; } .threespan { margin-right: 3px; display: inline-block; width: 18px; height: 18px; background: #0072ff; color: #fff; text-align: center; line-height: 18px; } .spanbg { margin-right: 3px; display: inline-block; width: 18px; height: 18px; background: #333333; color: #fff; text-align: center; line-height: 18px; }