You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
232 lines
5.8 KiB
232 lines
5.8 KiB
.congestion { |
|
width: 100%; |
|
|
|
.tit { |
|
width: 100%; |
|
background: url(../../../assets/CommandPlatform/tit.png); |
|
background-size: 100% 100%; |
|
background-repeat: no-repeat; |
|
height: 58px; |
|
font-family: PangMenZhengDao; |
|
font-weight: normal; |
|
font-style: italic; |
|
font-stretch: normal; |
|
line-height: 16px; |
|
letter-spacing: 6px; |
|
color: #ffffff; |
|
box-shadow: 0px 1px 2px 0px rgba(38, 46, 64, 0.27); |
|
margin-bottom: 40px; |
|
position: relative; |
|
|
|
img { |
|
position: absolute; |
|
left: 120px; |
|
top: -20px; |
|
width: 48px; |
|
height: 42px; |
|
} |
|
|
|
div { |
|
position: absolute; |
|
left: 180px; |
|
top: -12px; |
|
font-size: 44px; |
|
} |
|
} |
|
|
|
|
|
|
|
.containerTop { |
|
width: 100%; |
|
height: 95px; |
|
margin-bottom: 44px; |
|
display: flex; |
|
|
|
.interval { |
|
margin-bottom: 14px; |
|
} |
|
|
|
.top1 { |
|
margin: 0 20px 0 36px; |
|
line-height: 95px; |
|
font-size: 30px; |
|
font-family: MicrosoftYaHei; |
|
font-weight: normal; |
|
font-stretch: normal; |
|
letter-spacing: 3px; |
|
} |
|
|
|
.top2 { |
|
margin-right: 12px; |
|
display: flex; |
|
|
|
.num { |
|
width: 82px; |
|
height: 95px; |
|
line-height: 95px; |
|
text-align: center; |
|
margin-right: 12px; |
|
|
|
font-family: LetsgoDigital-Regular; |
|
font-size: 50px; |
|
font-weight: normal; |
|
font-stretch: normal; |
|
letter-spacing: 8px; |
|
color: #ffffff; |
|
box-shadow: 0px 10px 5px 0px rgba(1, 10, 18, 0.17); |
|
background: url(../../../assets/CommandPlatform/数字框.png); |
|
background-size: 100% 100%; |
|
background-repeat: no-repeat; |
|
} |
|
|
|
} |
|
|
|
.num:last-child { |
|
margin-right: 0; |
|
} |
|
|
|
.top3 { |
|
margin-right: 45px; |
|
line-height: 95px; |
|
font-family: MicrosoftYaHei; |
|
font-size: 29px; |
|
font-weight: normal; |
|
font-stretch: normal; |
|
letter-spacing: 0px; |
|
color: #b7dff9; |
|
} |
|
|
|
.top4 { |
|
margin-right: 18px; |
|
font-family: MicrosoftYaHei; |
|
font-size: 30px; |
|
font-weight: normal; |
|
font-stretch: normal; |
|
letter-spacing: 0px; |
|
color: #b7dff9; |
|
} |
|
|
|
.top5 { |
|
display: flex; |
|
|
|
img { |
|
width: 30px; |
|
height: 32px; |
|
margin-top: 10px; |
|
} |
|
} |
|
|
|
.top5>div:nth-child(1) { |
|
margin-right: 10px; |
|
text-align: right; |
|
font-family: MicrosoftYaHei; |
|
font-size: 30px; |
|
font-weight: normal; |
|
font-stretch: normal; |
|
letter-spacing: 0px; |
|
color: #ffffff; |
|
} |
|
} |
|
|
|
.containerBottom { |
|
width: 100%; |
|
display: flex; |
|
justify-content: space-between; |
|
|
|
&>div { |
|
width: 236px; |
|
|
|
.num1 { |
|
background: url(../../../assets/CommandPlatform/z4.png); |
|
|
|
background-size: 100% 100%; |
|
background-repeat: no-repeat; |
|
} |
|
|
|
.num2 { |
|
background: url(../../../assets/CommandPlatform/z5.png); |
|
|
|
background-size: 100% 100%; |
|
background-repeat: no-repeat; |
|
} |
|
|
|
.num3 { |
|
background: url(../../../assets/CommandPlatform/z6.png); |
|
|
|
background-size: 100% 100%; |
|
background-repeat: no-repeat; |
|
} |
|
|
|
&>div { |
|
|
|
|
|
width: 100%; |
|
height: 82px; |
|
text-align: center; |
|
margin-bottom: 12px; |
|
position: relative; |
|
|
|
.numtop { |
|
width: 100%; |
|
position: absolute; |
|
top: -14px; |
|
font-size: 36px; |
|
font-weight: normal; |
|
font-stretch: normal; |
|
letter-spacing: 5px; |
|
font-family: MicrosoftYaHei; |
|
} |
|
|
|
.numbottom { |
|
width: 100%; |
|
position: absolute; |
|
top: 32px; |
|
font-family: MicrosoftYaHei; |
|
font-size: 30px; |
|
font-weight: normal; |
|
font-stretch: normal; |
|
letter-spacing: 3px; |
|
} |
|
} |
|
|
|
.compare { |
|
width: 100%; |
|
display: flex; |
|
justify-content: space-between; |
|
padding: 0 24px; |
|
|
|
.compareFont { |
|
font-family: MicrosoftYaHei; |
|
font-size: 30px; |
|
font-weight: normal; |
|
font-stretch: normal; |
|
letter-spacing: 0px; |
|
color: #b7dff9; |
|
|
|
} |
|
|
|
.compareNum { |
|
display: flex; |
|
text-align: right; |
|
font-size: 30px; |
|
font-weight: normal; |
|
font-stretch: normal; |
|
letter-spacing: 0px; |
|
color: #ffffff; |
|
|
|
&>div:nth-child(1) { |
|
margin-right: 8px; |
|
} |
|
|
|
img { |
|
width: 30px; |
|
height: 30px; |
|
margin-top: -6px; |
|
} |
|
} |
|
} |
|
} |
|
|
|
|
|
} |
|
} |