muchangZs.css 19 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953
  1. .right-grid1{
  2. grid-template-columns: 472px 750px auto;
  3. grid-template-rows: 1fr;
  4. }
  5. .right-grid-left1{
  6. grid-template-columns: 1fr;
  7. grid-template-rows: repeat(4,1fr);
  8. }
  9. .right-grid-center1{
  10. grid-template-columns: 1fr;
  11. grid-template-rows: 150px auto 210px;
  12. }
  13. .right-grid-center1{
  14. grid-template-columns: 1fr;
  15. grid-template-rows: 150px auto 210px 210px;
  16. }
  17. .right-grid-right1{
  18. grid-template-columns: 1fr;
  19. grid-template-rows: auto 210px 210px;
  20. }
  21. .right-grid-right-top1{
  22. grid-template-columns: repeat(2,1fr);
  23. grid-template-rows: repeat(2,1fr);
  24. }
  25. #chart-pzjgfb2,#chart-fmzzfb2,#chart-twjc,#chart-sbgz2,#chart-swtj,#chart-ys,#chart-sy,#lxrunning-msg{
  26. height:100%;
  27. width:100%;
  28. }
  29. #chart-ebtw,#chart-ebsc {
  30. height:252px;
  31. width:528px;
  32. }
  33. #chart-ttfb2,#chart-yffb2{
  34. height:100%;
  35. width:50%;
  36. }
  37. #lxrunning-msg{
  38. overflow:hidden;
  39. padding:0 10px;
  40. width:100%;
  41. height:201px;
  42. }
  43. .lx-msg-container{
  44. display:flex;
  45. justify-content:flex-start;
  46. align-items:start;
  47. }
  48. .lx-msg-name{
  49. width:80px;
  50. text-align:left;
  51. font-size:12px;
  52. color:#3996dc;
  53. overflow: hidden;
  54. text-overflow:ellipsis;
  55. white-space: nowrap;
  56. }
  57. .lx-msg-list{
  58. width:calc(100% - 80px);
  59. }
  60. .lxmsg-item{
  61. text-align:left;
  62. font-size:12px;
  63. width:100%;
  64. overflow: hidden;
  65. text-overflow:ellipsis;
  66. white-space: nowrap;
  67. }
  68. .mcdata-list{
  69. display: flex;
  70. align-items: center;
  71. justify-content: space-around;
  72. width:100%;
  73. }
  74. .build-map{
  75. width:100%;
  76. height:100%;
  77. display:flex;
  78. align-items:center;
  79. overflow:hidden;
  80. background-size: 100%;
  81. position:relative;
  82. }
  83. #diagonal {
  84. border: 0px none;
  85. top: 0px;
  86. left: 0;
  87. position: absolute;
  88. padding: 0px;
  89. opacity: 1;
  90. }
  91. .build-map.mc1{
  92. background-image: url(../images/ajmc.jpg);
  93. }
  94. .build-map.mc2{
  95. background-image: url(../images/qdhmc.jpg);
  96. }
  97. .build-map.mc3{
  98. background-image: url(../images/htmc.jpg);
  99. }
  100. .build-map img{
  101. width:100%;
  102. position: absolute;
  103. left: 0;
  104. top: 0;
  105. opacity: 0
  106. }
  107. .center-two-chart{
  108. display:flex;
  109. align-items:center;
  110. justify-content:space-between;
  111. width:100%;
  112. height:100%;
  113. }
  114. .center-two-chart .chart-left{
  115. width:calc(50% - 5px);
  116. height:100%;
  117. border: 0.5px solid #3e68c0;
  118. box-shadow: 0px 0px 4px rgba(65,110,204,1) inset;
  119. padding: 14px 8px 8px;
  120. }
  121. .chart-left .content-container {
  122. border: 0.5px solid #6076ae;
  123. border-top: 2px solid #6076ae;
  124. height: 100%;
  125. display: flex;
  126. justify-content: center;
  127. align-items: center;
  128. position: relative;
  129. background-color: rgba(113,138,149,0.1);
  130. }
  131. .chart-none-title{
  132. height:100%;
  133. flex:1;
  134. display:flex;
  135. flex-direction:column;
  136. }
  137. .chart-new-title{
  138. height:2em;
  139. font-size:0.8em;
  140. color:#ccf5f9;
  141. line-height:2em;
  142. padding-left:1em;
  143. }
  144. #chart-wdsdaq2,#chart-nh2{
  145. width:100%;
  146. height:calc(100% - 2em);
  147. }
  148. .build-wrapper{
  149. width:100%;
  150. height:100%;
  151. overflow:hidden;
  152. /* padding:2px; */
  153. }
  154. ul.build-container{
  155. height: 100%;
  156. white-space: nowrap;
  157. display: inline-block;
  158. padding:2px;
  159. }
  160. ul.build-container>li{
  161. padding:0 11px;
  162. height: 100%;
  163. display: inline-block;
  164. }
  165. .single ul>li.active>.build-contain:before{
  166. content:'';
  167. height:100%;
  168. width:100%;
  169. position:absolute;
  170. left:-2px;
  171. top:-2px;
  172. border: 2px solid #0efcfe;
  173. }
  174. ul.build-container>li>.build-contain{
  175. cursor: pointer;
  176. height: 100%;
  177. width: 225px;
  178. flex-direction: column;
  179. border: 0.5px solid #6076ae;
  180. border-top: 2px solid #6076ae;
  181. position: relative;
  182. }
  183. ul.build-container>li .leftbar{
  184. width: 65px;
  185. padding-top: 6%;
  186. height: 100%;
  187. float: left;
  188. }
  189. li .leftbar>.row-num{
  190. padding: 0 20px 0px;
  191. font-size: 1em;
  192. text-align: center;
  193. word-wrap: break-word;
  194. word-break: break-all;
  195. white-space: normal;
  196. line-height: 1.2em;
  197. color:#ccf5f9;
  198. }
  199. ul.build-container>li .cont{
  200. height: 100%;
  201. width: calc(100% - 65px);
  202. display: flex;
  203. float:left;
  204. flex-direction: column;
  205. flex: 1;
  206. justify-content: space-around;
  207. font-size: 1.2em;
  208. align-items: center;
  209. padding:5px 0;
  210. }
  211. ul.build-container>li .cont>.cont-item{
  212. width: 100%;
  213. display: flex;
  214. align-items: center;
  215. justify-content: flex-start;
  216. color:#ccf5f9;
  217. font-size:0.8em;
  218. }
  219. li .cont>.cont-item>img{
  220. width:20px;
  221. margin-right:10px;
  222. }
  223. li .cont>.cont-item>.cont-value{
  224. font-size:1em;
  225. color:#3996dc;
  226. margin-left:10px;
  227. }
  228. li .cont>.cont-item>.cont-status_t{
  229. font-size:1em;
  230. color:#37b13d;
  231. margin-left:10px;
  232. }
  233. li .cont>.cont-item>.cont-status_f{
  234. font-size:1em;
  235. color:#c83428;
  236. margin-left:10px;
  237. }
  238. .single1{
  239. height:100%;
  240. width:100%;
  241. position:relative;
  242. }
  243. #video-box,#mcwarning-list{
  244. width:100%;
  245. height:100%;
  246. overflow:hidden;
  247. }
  248. #video-box{
  249. display:flex;
  250. align-items:center;
  251. }
  252. #mcwarning-list{
  253. display:flex;
  254. flex-direction:column;
  255. justify-content:space-around;
  256. }
  257. #video-box video{
  258. width:100%;
  259. }
  260. #video-box>.video-container{
  261. width:100%;
  262. height:100%;
  263. }
  264. .video-container video{
  265. height:100%;
  266. width:100%;
  267. }
  268. .right-warning-box{
  269. display:flex;
  270. flex-direction:column;
  271. width:100%;
  272. height:78px;
  273. }
  274. .right-msg-box{
  275. display:flex;
  276. flex-direction:column;
  277. width:100%;
  278. height:78px;
  279. }
  280. .right-warning-box>.right-warning-item{
  281. display:flex;
  282. align-items:center;
  283. justify-content:flex-start;
  284. color:#ccf5f9;
  285. margin-top:6px;
  286. width:100%;
  287. font-size:0.8em;
  288. }
  289. .right-warning-box>.right-warning-item>img{
  290. width:20px;
  291. margin-right:15px;
  292. }
  293. .right-warning-box>.right-warning-item span{
  294. width:calc(100% - 35px);
  295. overflow: hidden;
  296. text-overflow:ellipsis;
  297. white-space: nowrap;
  298. }
  299. .right-msg-box>.right-msg-item{
  300. width:100%;
  301. font-size:0.8em;
  302. display:flex;
  303. align-items:center;
  304. justify-content:space-between;
  305. color:#ccf5f9;
  306. margin-top:6px;
  307. }
  308. .right-msg-box>.right-msg-item>span.right-msg-words{
  309. width:calc(100% - 109px);
  310. overflow: hidden;
  311. text-overflow:ellipsis;
  312. white-space: nowrap;
  313. }
  314. .right-msg-box>.right-msg-item>span.right-msg-datetime{
  315. margin-left:5px;
  316. }
  317. .mcfwcl-box{
  318. width:50%;
  319. height:100%;
  320. }
  321. .mcjc-top{
  322. display:flex;
  323. flex-direction:column;
  324. align-items:center;
  325. justify-content:space-between;
  326. padding-bottom: 10px;
  327. }
  328. .mcjc-top>.mcjc-top-title{
  329. line-height:2em;
  330. color:#ccf5f9;
  331. font-size:0.8em;
  332. }
  333. .mcjc-top>.mcjc-top-datetime{
  334. display:flex;
  335. align-items:center;
  336. justify-content:center;
  337. height:2em;
  338. font-size:0.8em;
  339. color:#ccf5f9;
  340. }
  341. .mcjc-top>.mcjc-top-datalist{
  342. display:flex;
  343. align-items:center;
  344. justify-content:center;
  345. }
  346. .mcjc-top>.mcjc-top-datalist>.mcjc-top-item,.mcjc-top>.mcjc-top-datalist>.mcjc-top-status,.mcjc-top>.mcjc-top-datalist>.mcjc-top-style{
  347. display:flex;
  348. align-items:center;
  349. justify-content:center;
  350. flex-direction:column;
  351. }
  352. .mcjc-top>.mcjc-top-datalist>.mcjc-top-status{
  353. margin: 0 20px;
  354. }
  355. .mcjc-top-item>.mcjc-top-itemname{
  356. font-size:0.8em;
  357. color:#ccf5f9;
  358. line-height:1.8em;
  359. }
  360. .mcjc-top-status>.mcjc-top-statusvalue{
  361. font-size:0.8em;
  362. line-height:1.8em;
  363. color:#17b45e;
  364. }
  365. .mcjc-top-status>.mcjc-top-statusvalue.leave{
  366. color:#dbb244;
  367. }
  368. .mcjc-top-style>.mcjc-top-stylevalue{
  369. font-size:0.8em;
  370. line-height:1.8em;
  371. color:#17b45e;
  372. }
  373. .mcjc-top-style>.mcjc-top-stylevalue.stop{
  374. color:#c83428;
  375. }
  376. .mcjc-top-style>.mcjc-top-stylevalue.waiting{
  377. color:#dbb244;
  378. }
  379. .mcjc-top-count{
  380. display:flex;
  381. align-items:center;
  382. justify-content:space-around;
  383. width:100%;
  384. }
  385. .mcjc-top-count>.mcjc-top-count-part{
  386. width:25%;
  387. display:flex;
  388. align-items:center;
  389. justify-content:center;
  390. flex-direction:column;
  391. color:#ccf5f9;
  392. }
  393. .mcjc-top-count>.mcjc-top-count-part .mcjc-top-count-part-value{
  394. color:#3996dc;
  395. font-size:1.2em;
  396. }
  397. .mcjc-top-count>.mcjc-top-count-part .mcjc-top-count-part-line{
  398. width:100%;
  399. height:1px;
  400. background-color:#449ba4;
  401. margin:6px 0;
  402. }
  403. .mcjc-top-count>.mcjc-top-count-part .mcjc-top-count-part-name{
  404. font-size:0.6em;
  405. }
  406. /*密码框*/
  407. #passwordConfirm{
  408. position: fixed;
  409. text-align: center;
  410. top: 50%;
  411. left: 50%;
  412. margin-left:-250px;
  413. width: 500px;
  414. display:none;
  415. z-index:99;
  416. }
  417. .webdesigntuts-workshop span {
  418. background: #111;
  419. background: -webkit-linear-gradient(#1b1b1b, #111);
  420. background: -moz-linear-gradient(#1b1b1b, #111);
  421. background: -o-linear-gradient(#1b1b1b, #111);
  422. background: -ms-linear-gradient(#1b1b1b, #111);
  423. background: linear-gradient(#1b1b1b, #111);
  424. border: 1px solid #000;
  425. border-radius: 5px;
  426. box-shadow: inset 0 0 0 1px #272727;
  427. display: inline-block;
  428. font-size: 0px;
  429. margin: 0 auto 0;
  430. padding: 20px;
  431. z-index: 1;
  432. box-shadow: 0px -10px 10px 0px rgba(255,255,255,0.1), -10px 0px 10px 0px rgba(255,255,255,0.1), 10px 0px 10px 0px rgba(255,255,255,0.1), 0px 10px 10px 0px rgba(255,255,255,0.1);
  433. }
  434. .webdesigntuts-workshop input {
  435. background: #222;
  436. background: -webkit-linear-gradient(#333, #222);
  437. background: -moz-linear-gradient(#333, #222);
  438. background: -o-linear-gradient(#333, #222);
  439. background: -ms-linear-gradient(#333, #222);
  440. background: linear-gradient(#333, #222);
  441. border: 1px solid #444;
  442. border-radius: 5px 0 0 5px;
  443. box-shadow: 0 2px 0 #000;
  444. color: #888;
  445. display: block;
  446. float: left;
  447. font-size: 13px;
  448. font-weight: 400;
  449. height: 40px;
  450. margin: 0;
  451. padding: 0 10px;
  452. text-shadow: 0 -1px 0 #000;
  453. width: 200px;
  454. z-index: 2;
  455. }
  456. .webdesigntuts-workshop button {
  457. background: #222;
  458. background: -webkit-linear-gradient(#333, #222);
  459. background: -moz-linear-gradient(#333, #222);
  460. background: -o-linear-gradient(#333, #222);
  461. background: -ms-linear-gradient(#333, #222);
  462. background: linear-gradient(#333, #222);
  463. -webkit-box-sizing: content-box;
  464. -moz-box-sizing: content-box;
  465. -o-box-sizing: content-box;
  466. -ms-box-sizing: content-box;
  467. box-sizing: content-box;
  468. border: 1px solid #444;
  469. border-left-color: #000;
  470. border-radius: 0 5px 5px 0;
  471. box-shadow: 0 2px 0 #000;
  472. color: #fff;
  473. display: block;
  474. float: left;
  475. font-family: 'Cabin', helvetica, arial, sans-serif;
  476. font-size: 13px;
  477. font-weight: 400;
  478. height: 38px;
  479. line-height: 38px;
  480. margin: 0;
  481. padding: 0;
  482. position: relative;
  483. text-shadow: 0 -1px 0 #000;
  484. width: 80px;
  485. z-index: 2;
  486. letter-spacing: 1px;
  487. outline: medium;
  488. }
  489. .webdesigntuts-workshop input {
  490. line-height: 40px;
  491. }
  492. .webdesigntuts-workshop input::-webkit-input-placeholder {
  493. color: #888;
  494. }
  495. .webdesigntuts-workshop input:focus {
  496. -webkit-animation: glow 800ms ease-out infinite alternate;
  497. -moz-animation: glow 800ms ease-out infinite alternate;
  498. -o-animation: glow 800ms ease-out infinite alternate;
  499. -ms-animation: glow 800ms ease-out infinite alternate;
  500. animation: glow 800ms ease-out infinite alternate;
  501. background: #222922;
  502. background: -webkit-linear-gradient(#333933, #222922);
  503. background: -moz-linear-gradient(#333933, #222922);
  504. background: -o-linear-gradient(#333933, #222922);
  505. background: -ms-linear-gradient(#333933, #222922);
  506. background: linear-gradient(#333933, #222922);
  507. border-color: #264482;
  508. box-shadow: 0 0 5px rgba(38,68,130,.2), inset 0 0 5px rgba(38,68,130,.1), 0 2px 0 #000;
  509. color: #efe;
  510. outline: none;
  511. }
  512. .webdesigntuts-workshop input:focus::-webkit-input-placeholder {
  513. color: #efe;
  514. }
  515. .webdesigntuts-workshop input:focus:-moz-placeholder {
  516. color: #efe;
  517. }
  518. .webdesigntuts-workshop input:-moz-placeholder {
  519. color: #888;
  520. }
  521. .webdesigntuts-workshop button:hover,
  522. .webdesigntuts-workshop button:focus {
  523. background: #292929;
  524. background: -webkit-linear-gradient(#264482939, #292929);
  525. background: -moz-linear-gradient(#264482939, #292929);
  526. background: -o-linear-gradient(#264482939, #292929);
  527. background: -ms-linear-gradient(#264482939, #292929);
  528. background: linear-gradient(#264482939, #292929);
  529. color: #608ff1;
  530. outline: none;
  531. }
  532. .webdesigntuts-workshop button:active {
  533. background: #292929;
  534. background: -webkit-linear-gradient(#264482939, #292929);
  535. background: -moz-linear-gradient(#264482939, #292929);
  536. background: -o-linear-gradient(#264482939, #292929);
  537. background: -ms-linear-gradient(#264482939, #292929);
  538. background: linear-gradient(#264482939, #292929);
  539. box-shadow: 0 1px 0 #000, inset 1px 0 1px #222;
  540. top: 1px;
  541. }
  542. @-webkit-keyframes glow {
  543. 0% {
  544. border-color: #264482;
  545. box-shadow: 0 0 5px rgba(38,68,130,.2), inset 0 0 5px rgba(38,68,130,.1), 0 2px 0 #000;
  546. }
  547. 100% {
  548. border-color: #709bf3;
  549. box-shadow: 0 0 20px rgba(38,68,130,.6), inset 0 0 10px rgba(38,68,130,.4), 0 2px 0 #000;
  550. }
  551. }
  552. @-moz-keyframes glow {
  553. 0% {
  554. border-color: #264482;
  555. box-shadow: 0 0 5px rgba(38,68,130,.2), inset 0 0 5px rgba(38,68,130,.1), 0 2px 0 #000;
  556. }
  557. 100% {
  558. border-color: #709bf3;
  559. box-shadow: 0 0 20px rgba(38,68,130,.6), inset 0 0 10px rgba(38,68,130,.4), 0 2px 0 #000;
  560. }
  561. }
  562. @-o-keyframes glow {
  563. 0% {
  564. border-color: #264482;
  565. box-shadow: 0 0 5px rgba(38,68,130,.2), inset 0 0 5px rgba(38,68,130,.1), 0 2px 0 #000;
  566. }
  567. 100% {
  568. border-color: #709bf3;
  569. box-shadow: 0 0 20px rgba(38,68,130,.6), inset 0 0 10px rgba(38,68,130,.4), 0 2px 0 #000;
  570. }
  571. }
  572. @-ms-keyframes glow {
  573. 0% {
  574. border-color: #264482;
  575. box-shadow: 0 0 5px rgba(38,68,130,.2), inset 0 0 5px rgba(38,68,130,.1), 0 2px 0 #000;
  576. }
  577. 100% {
  578. border-color: #709bf3;
  579. box-shadow: 0 0 20px rgba(38,68,130,.6), inset 0 0 10px rgba(38,68,130,.4), 0 2px 0 #000;
  580. }
  581. }
  582. @keyframes glow {
  583. 0% {
  584. border-color: #264482;
  585. box-shadow: 0 0 5px rgba(38,68,130,.2), inset 0 0 5px rgba(38,68,130,.1), 0 2px 0 #000;
  586. }
  587. 100% {
  588. border-color: #709bf3;
  589. box-shadow: 0 0 20px rgba(38,68,130,.6), inset 0 0 10px rgba(38,68,130,.4), 0 2px 0 #000;
  590. }
  591. }
  592. /*料线控制弹窗*/
  593. #lxcontroller-container{
  594. display:none;
  595. }
  596. #lxcontroller{
  597. position:fixed;
  598. width:1600px;
  599. height:800px;
  600. background-color:#021429;
  601. top:50%;
  602. left:50%;
  603. margin-top:-400px;
  604. margin-left:-750px;
  605. border-radius:10px;
  606. display:flex;
  607. z-index:900;
  608. color:#fff;
  609. }
  610. .lxbuild-choose{
  611. width:240px;
  612. position:relative;
  613. display:flex;
  614. flex-direction:column;
  615. align-items:start;
  616. justify-content:flex-start;
  617. color:#fff;
  618. padding-top:60px;
  619. padding-left:30px;
  620. }
  621. .lxbuild-choose:after{
  622. content:'';
  623. width:2px;
  624. height:100%;
  625. background-color:#335bcc;
  626. position:absolute;
  627. right:0;
  628. top:0;
  629. }
  630. .areabuild-name{
  631. font-size:16px;
  632. margin-bottom:30px;
  633. cursor:pointer;
  634. }
  635. .areabuild-name.active{
  636. color:#335bcc;
  637. }
  638. .lx-container{
  639. flex:1;
  640. position:relative;
  641. display:none;
  642. }
  643. .lxcontroller-header{
  644. height:60px;
  645. line-height:60px;
  646. text-align:center;
  647. position:relative;
  648. font-size:20px;
  649. letter-spacing:5px;
  650. color:#fff;
  651. }
  652. .lxcontroller-header:after{
  653. content:'';
  654. position:absolute;
  655. bottom:0px;
  656. left:0;
  657. }
  658. .lxcontroller-body{
  659. width:1480px;
  660. height:680px;
  661. }
  662. .lxcontroller-body:after{
  663. content:'';
  664. display:table;
  665. clear:both;
  666. }
  667. .lxcontroller-box{
  668. display:flex;
  669. margin-left:30px;
  670. margin-bottom:20px;
  671. float:left;
  672. }
  673. .lxleft-name{
  674. width:100px;
  675. padding-top:50px;
  676. }
  677. .lxright-content{
  678. }
  679. .lxright-head{
  680. display:flex;
  681. justify-content:space-between;
  682. align-items:center;
  683. height:50px;
  684. font-size:16px;
  685. width:320px;
  686. }
  687. .congtrol-name{
  688. width:150px;
  689. text-align:center;
  690. }
  691. .lx-name{
  692. height:24px;
  693. line-height:24px;
  694. }
  695. .lxright-item{
  696. display:flex;
  697. justify-content:space-between;
  698. align-items:center;
  699. width:320px;
  700. position:relative;
  701. margin-bottom:15px;
  702. }
  703. .lxright-item:after{
  704. content:'';
  705. width: 0;
  706. height: 0;
  707. border: 8px solid;
  708. position:absolute;
  709. left:-20px;
  710. top:4px;
  711. border-color: transparent transparent transparent #335bcc;
  712. }
  713. .lxright-item input{
  714. width:150px;
  715. text-align:center;
  716. height:24px;
  717. border:1px solid #335bcc;
  718. border-radius:4px;
  719. outline:none;
  720. background-color:transparent;
  721. color:#fff;
  722. }
  723. .saveBtns{
  724. display:flex;
  725. justify-content:center;
  726. align-items:center;
  727. }
  728. .norbtns{
  729. width:120px;
  730. height:35px;
  731. line-height:35px;
  732. text-align:center;
  733. color:#fff;
  734. border-radius:5px;
  735. }
  736. .saveIt{
  737. background-color:#335bcc;
  738. margin-right:30px;
  739. }
  740. .cancelIt{
  741. background-color:#ef4229
  742. }
  743. .datetimeInput{
  744. position:relative;
  745. }
  746. /*体温监测弹窗*/
  747. #temp-outwindow{
  748. position:fixed;
  749. width:1200px;
  750. height:710px;
  751. background-color:#021429;
  752. top:50%;
  753. left:50%;
  754. margin-top:-300px;
  755. margin-left:-600px;
  756. border-radius:10px;
  757. display:none;
  758. }
  759. .temp-outwindow-head{
  760. height:60px;
  761. line-height:60px;
  762. text-align:center;
  763. position:relative;
  764. font-size:20px;
  765. letter-spacing:5px;
  766. color:#fff;
  767. }
  768. .temp-window-body{
  769. padding:10px;
  770. height:340px;
  771. width:1200px;
  772. overflow:hidden;
  773. }
  774. .temp-window-body:after{
  775. content:'';
  776. clear:both;
  777. display:table;
  778. }
  779. .temp-data-tiem{
  780. display:flex;
  781. font-size:14px;
  782. float:left;
  783. margin-left:25px;
  784. margin-bottom: 15px;
  785. }
  786. .temp-data-name{
  787. width:100px;
  788. margin-right:10px;
  789. }
  790. .checkEb {
  791. color:red;
  792. }
  793. .temp-data-value{
  794. width:50px;
  795. }
  796. #lxrunning-msg{
  797. padding-right:3px;
  798. padding-left: 3px;
  799. display:flex;
  800. flex-direction:column;
  801. align-items:center;
  802. justify-content: space-between;
  803. }
  804. .fgitems-content{
  805. display:flex;
  806. flex-direction:column;
  807. align-items:center;
  808. justify-content: space-between;
  809. width:100%;
  810. height:32%;
  811. background-color:#ddd;
  812. border-radius:5px;
  813. }
  814. .fgitems-head{
  815. display:flex;
  816. align-items:center;
  817. justify-content:start;
  818. width:100%;
  819. margin-top:3px;
  820. }
  821. .fgitems-nums{
  822. width:35px;
  823. height:18px;
  824. position: relative;
  825. line-height: 20px;
  826. font-size: 12px;
  827. color: #fff;
  828. padding-right: 10px;
  829. text-align:center;
  830. margin-right:10px;
  831. margin-left:5px;
  832. }
  833. .arrow-color1{
  834. background-color:#58b2ef;
  835. }
  836. .arrow-color2{
  837. background-color:#1fbcaf
  838. }
  839. .arrow-color3{
  840. background-color:#92d050
  841. }
  842. .fgitems-nums:before {
  843. content: '';
  844. width: 0px;
  845. height: 0px;
  846. border-color: transparent #ddd;
  847. border-width: 0px 9px 9px 0px;
  848. border-style: solid;
  849. position: absolute;
  850. right: 0;
  851. top: 0px;
  852. }
  853. .fgitems-nums:after {
  854. content: '';
  855. width: 0px;
  856. height: 0px;
  857. border-color: #ddd transparent;
  858. border-width: 0px 0px 9px 9px;
  859. border-style: solid;
  860. position: absolute;
  861. right: 0px;
  862. bottom: 0px;
  863. }
  864. .fgitems-name{
  865. font-size:14px;
  866. transform : scale(0.9);
  867. font-weight:bold;
  868. color:#333;
  869. font-family:Impact, Haettenschweiler, "Franklin Gothic Bold", "Arial Black", "sans-serif";
  870. }
  871. .fgitems-desc{
  872. font-size:12px;
  873. transform : scale(0.9);
  874. color:#635353;
  875. }
  876. .fgitems-body{
  877. display:flex;
  878. align-items:center;
  879. justify-content:center;
  880. width:100%;
  881. }
  882. .fg-items-body-speed{
  883. font-size:12px;
  884. transform : scale(0.9);
  885. color:#333;
  886. }
  887. .speed-arrow{
  888. height:2px;
  889. width:50px;
  890. background-color:#c00000;
  891. position:relative;
  892. margin-left:10px;
  893. }
  894. .right-arrow{
  895. width: 0;
  896. height: 0;
  897. border-width: 6px;
  898. border-style: solid;
  899. border-color: transparent transparent transparent #c00000;
  900. margin-right:4px;
  901. }
  902. .addspedds{
  903. color:#c00000;
  904. font-size:12px;
  905. position:absolute;
  906. top:-16px;
  907. left:0px;
  908. width:100%;
  909. text-align:center;
  910. transform : scale(0.9);
  911. }
  912. .fgitems-foot{
  913. display:flex;
  914. align-items:center;
  915. justify-content:start;
  916. width:100%;
  917. margin-bottom:3px;
  918. }
  919. .foot-name{
  920. color:#c00000;
  921. font-size:14px;
  922. font-weight:bold;
  923. transform : scale(0.9);
  924. }
  925. .foot-value{
  926. color:#333;
  927. font-size:12px;
  928. transform : scale(0.9);
  929. }