gztc.css 5.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276
  1. .Item{
  2. float:left;
  3. padding-right: 10px;
  4. position:relative;
  5. }
  6. .Item:last-child {
  7. padding:0
  8. }
  9. .moveLeft,
  10. .moveRight {
  11. height: 150px;
  12. padding-right: 15px;
  13. position: absolute;
  14. top: 0px;
  15. z-index: 10;
  16. display: none;
  17. }
  18. .moveLeft img,
  19. .moveRight img {
  20. margin-top: 35px;
  21. cursor: pointer;
  22. }
  23. .news{
  24. width:50px;
  25. height:50px;
  26. position:absolute;
  27. right:0;
  28. animation: news 0.5s infinite;
  29. }
  30. .news span{
  31. color:#fff;
  32. position:absolute;
  33. right:5px;
  34. }
  35. .ywItem{
  36. height:150px;
  37. color:rgba(0,0,0,1);
  38. background-size:cover;
  39. background-repeat:no-repeat;
  40. text-indent:15px;
  41. font-size:16px;
  42. cursor:pointer;
  43. position:relative
  44. }
  45. .ywItem img{
  46. width:30px;
  47. height:30px;
  48. position:absolute;
  49. z-index:99;
  50. left: 35px;
  51. top:85px;
  52. }
  53. .number{
  54. width:calc(100% - 100px);
  55. height:90px;
  56. line-height:90px;
  57. font-size:30px;
  58. float: right;
  59. text-align: center;
  60. }
  61. .circle{
  62. min-width:80px;
  63. min-height:80px;
  64. max-width:80px;
  65. max-height:80px;
  66. float:left;
  67. position:absolute;
  68. left:10px;
  69. bottom:10px;
  70. display:block;
  71. border-radius:15px;
  72. opacity:0.5;
  73. background-size:80%;
  74. }
  75. @keyframes news {
  76. 0% {
  77. opacity: 0.5;
  78. }
  79. 50% {
  80. opacity: 1;
  81. }
  82. 100% {
  83. opacity: 0.5;
  84. }
  85. }
  86. .circle-rgb{
  87. color:#000;
  88. overflow:hidden;
  89. left:10px;
  90. bottom:10px;
  91. }
  92. .circle-rgb .deng1{
  93. width:40px;
  94. height:40px;
  95. background-image:url("../img/1white.png");
  96. background-size:35px;
  97. background-position: 10px 8px;
  98. background-repeat:no-repeat
  99. }
  100. .circle-rgb .deng2{
  101. width:40px;
  102. height:40px;
  103. background-image:url("../img/1white.png");
  104. background-size:35px;
  105. background-position: 10px 8px;
  106. background-repeat:no-repeat
  107. }
  108. .circle-rgb .deng3{
  109. width:40px;
  110. height:40px;
  111. background-image:url("../img/1white.png");
  112. background-size:35px;
  113. background-position: 10px 8px;
  114. background-repeat:no-repeat
  115. }
  116. .circle-rgb .deng4{
  117. width:40px;
  118. height:40px;
  119. background-image:url("../img/1white.png");
  120. background-size:35px;
  121. background-position: 10px 8px;
  122. background-repeat:no-repeat
  123. }
  124. .circle-rgb .shan{
  125. animation: shan 0.5s infinite;
  126. }
  127. .circle-rgb .purple{
  128. width:40px;
  129. height:40px;
  130. margin:0;
  131. color:#fff;
  132. line-height:45px;
  133. text-indent:5px;
  134. font-size:14px;
  135. text-align:center;
  136. background-image:url("../img/1purple.png");
  137. background-size:23px;
  138. background-position: 11px 10px;
  139. background-repeat:no-repeat;
  140. cursor:pointer;
  141. }
  142. .circle-rgb .red{
  143. width:40px;
  144. height:40px;
  145. margin:0;
  146. color:#fff;
  147. line-height:45px;
  148. text-indent:5px;
  149. font-size:14px;
  150. text-align:center;
  151. background-image:url("../img/1red.png");
  152. background-size:23px;
  153. background-position: 11px 10px;
  154. background-repeat:no-repeat;
  155. cursor:pointer;
  156. }
  157. .circle-rgb .orange{
  158. width:40px;
  159. height:40px;
  160. margin:0;
  161. color:#fff;
  162. line-height:45px;
  163. text-indent:5px;
  164. font-size:14px;
  165. text-align:center;
  166. background-image:url("../img/1yellow.png");
  167. background-size:23px;
  168. background-position: 11px 10px;
  169. background-repeat:no-repeat;
  170. cursor:pointer;
  171. }
  172. .circle-rgb .green{
  173. width:40px;
  174. height:40px;
  175. margin:0;
  176. color:#fff;
  177. line-height:45px;
  178. text-indent:5px;
  179. font-size:14px;
  180. text-align:center;
  181. background-image:url("../img/1green.png");
  182. background-size:23px;
  183. background-position: 11px 10px;
  184. background-repeat:no-repeat;
  185. cursor:pointer;
  186. }
  187. @keyframes shan {
  188. 0% {
  189. opacity: 0.5;
  190. }
  191. 50% {
  192. opacity: 1;
  193. }
  194. 100% {
  195. opacity: 0.5;
  196. }
  197. }
  198. .total {
  199. width: 40%;
  200. height: 98px;
  201. line-height: 90px;
  202. font-weight: 600;
  203. font-size: 22px;
  204. text-indent: 0;
  205. text-align: center;
  206. }
  207. .btnLR {
  208. width: 50px;
  209. height: 150px;
  210. }
  211. .btnLR img{
  212. width:30px;
  213. height:150px;
  214. cursor:pointer
  215. }
  216. .total-item{
  217. float:left;
  218. cursor:pointer;
  219. padding:0 5px;
  220. font-size:16px;
  221. text-align:left;
  222. text-indent:5px
  223. }
  224. .purple{
  225. width:20px;
  226. height:20px;
  227. float:left;
  228. line-height:23px;
  229. white-space:nowrap;
  230. text-indent:25px;
  231. margin-top:10px;
  232. background-image:url("../img/1purple.png");
  233. background-repeat:no-repeat;
  234. }
  235. .red{
  236. width:20px;
  237. height:20px;
  238. float:left;
  239. line-height:23px;
  240. white-space:nowrap;
  241. text-indent:25px;
  242. margin-top:10px;
  243. background-image:url("../img/1red.png");
  244. background-repeat:no-repeat;
  245. }
  246. .yellow{
  247. width:20px;
  248. height:20px;
  249. float:left;
  250. line-height:23px;
  251. white-space:nowrap;
  252. text-indent:25px;
  253. margin-top:10px;
  254. background-image:url("../img/1yellow.png");
  255. background-repeat:no-repeat;
  256. }
  257. .green{
  258. width:20px;
  259. height:20px;
  260. float:left;
  261. line-height:23px;
  262. white-space:nowrap;
  263. text-indent:25px;
  264. margin-top:10px;
  265. background-image:url("../img/1green.png");
  266. background-repeat:no-repeat;
  267. }
  268. .pointer{
  269. cursor:pointer
  270. }