@viewlift/player-backup 2.0.304-backup → 2.0.305-backup

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (60) hide show
  1. package/cjs/{autoNextVideo-4837ff44.js → autoNextVideo-873f10b5.js} +1 -1
  2. package/cjs/bundle.css +970 -970
  3. package/cjs/{features-35821239.js → features-e4e58f99.js} +1 -1
  4. package/cjs/generic-99296539.js +1 -0
  5. package/cjs/{index-b6fe43ac.js → index-5e426c27.js} +1 -1
  6. package/cjs/{index-330e0bd9.js → index-7e189768.js} +1 -1
  7. package/cjs/{index-48c739ee.js → index-e8f44e0a.js} +1 -1
  8. package/cjs/{index-c2982870.js → index-f2e08806.js} +1 -1
  9. package/cjs/index.js +1 -1
  10. package/cjs/{multicamv2-0950cfd9.js → multicamv2-749ad829.js} +1 -1
  11. package/cjs/{multicamv2-c47357d9.js → multicamv2-eb95bf1f.js} +1 -1
  12. package/cjs/{nextEpisodeButton-2921adbd.js → nextEpisodeButton-e986a0bc.js} +1 -1
  13. package/cjs/{playlist-d5607cad.js → playlist-88414b09.js} +1 -1
  14. package/cjs/{series-99d70430.js → series-a6f2fd6e.js} +1 -1
  15. package/cjs/{series-v2-8a53b69c.js → series-v2-6319e033.js} +1 -1
  16. package/cjs/{series-v2-3e77221f.js → series-v2-65879014.js} +1 -1
  17. package/cjs/{skin-ffb61803.js → skin-20ee4e2a.js} +1 -1
  18. package/cjs/{skin-5108592a.js → skin-269f611e.js} +1 -1
  19. package/cjs/{skin-d691715a.js → skin-48d50e2e.js} +1 -1
  20. package/cjs/{skin-72d95ca5.js → skin-5405239f.js} +1 -1
  21. package/cjs/{skin-ea0e0331.js → skin-a2429e04.js} +1 -1
  22. package/cjs/{skin-632baab6.js → skin-b0bbc888.js} +1 -1
  23. package/cjs/{skin-a5fcfafd.js → skin-b5ca0cb0.js} +1 -1
  24. package/cjs/{skin-92e87fae.js → skin-db674d95.js} +1 -1
  25. package/cjs/{skin-b1629004.js → skin-e5ecdc0c.js} +1 -1
  26. package/cjs/{skin-c125f0f9.js → skin-f3cea156.js} +1 -1
  27. package/cjs/{videoSelector-4d1407a1.js → videoSelector-5b4e625a.js} +1 -1
  28. package/cjs/{videoSelector-8dc7e880.js → videoSelector-766a3d58.js} +1 -1
  29. package/esm/{autoNextVideo-d4f0c0e0.js → autoNextVideo-91414a44.js} +1 -1
  30. package/esm/bundle.css +970 -970
  31. package/esm/{features-dcfb2809.js → features-4c015a1a.js} +1 -1
  32. package/esm/generic-80295906.js +1 -0
  33. package/esm/{index-0b18e334.js → index-2438cc5c.js} +1 -1
  34. package/esm/{index-482a3ad6.js → index-3ac93834.js} +1 -1
  35. package/esm/{index-0a18ab16.js → index-ad8cf892.js} +1 -1
  36. package/esm/{index-49a4116a.js → index-b7b0c19f.js} +1 -1
  37. package/esm/index.js +1 -1
  38. package/esm/{multicamv2-a85777a6.js → multicamv2-9a65dbe7.js} +1 -1
  39. package/esm/{multicamv2-41808335.js → multicamv2-b33eb8aa.js} +1 -1
  40. package/esm/{nextEpisodeButton-82e1ff70.js → nextEpisodeButton-a5e4c9ab.js} +1 -1
  41. package/esm/{playlist-a48be6e8.js → playlist-3cbc8448.js} +1 -1
  42. package/esm/{series-8076ce3f.js → series-aa5d229d.js} +1 -1
  43. package/esm/{series-v2-fbd88587.js → series-v2-80e7e96a.js} +1 -1
  44. package/esm/{series-v2-8a8d61c6.js → series-v2-eeb48c22.js} +1 -1
  45. package/esm/{skin-b85fa341.js → skin-1aa3a2a4.js} +1 -1
  46. package/esm/{skin-fabf69ae.js → skin-4e7ed113.js} +1 -1
  47. package/esm/{skin-607beba6.js → skin-5cad697b.js} +1 -1
  48. package/esm/{skin-dfcb0249.js → skin-61615df8.js} +1 -1
  49. package/esm/{skin-14be9be3.js → skin-61ff8139.js} +1 -1
  50. package/esm/{skin-32713204.js → skin-69510b4b.js} +1 -1
  51. package/esm/{skin-3779805c.js → skin-81dcb6fc.js} +1 -1
  52. package/esm/{skin-531e8212.js → skin-e9eeb5da.js} +1 -1
  53. package/esm/{skin-382f17e7.js → skin-ead560a6.js} +1 -1
  54. package/esm/{skin-dff8a656.js → skin-f7d16420.js} +1 -1
  55. package/esm/{videoSelector-e3f64e95.js → videoSelector-addc3c1c.js} +1 -1
  56. package/esm/{videoSelector-9a1dd40f.js → videoSelector-b5366835.js} +1 -1
  57. package/package.json +29 -29
  58. package/cjs/generic-befcf1eb.js +0 -1
  59. package/esm/generic-2d23b129.js +0 -1
  60. package/viewlift-player-backup-2.0.304-backup.tgz +0 -0
package/esm/bundle.css CHANGED
@@ -1,7 +1,6 @@
1
1
 
2
2
 
3
3
 
4
-
5
4
  .video-js.skin_vlone .vjs-control-bar .vjs-progress-control.vjs-control {
6
5
  height: 0.7em;
7
6
  position: absolute;
@@ -200,31 +199,27 @@
200
199
 
201
200
 
202
201
 
203
- .video-js.skin_news .vjs-button>.vjs-icon-placeholder:before {
202
+
203
+ .video-js.skin_mini .vjs-button>.vjs-icon-placeholder:before {
204
204
  font-size: 2.2em;
205
205
  line-height: 2.6;
206
206
  }
207
- .video-js.skin_news .vjs-custom-big-mute.vjs-control{
208
- background: white;
207
+ .video-js.skin_mini{
208
+ overflow: hidden;
209
209
  }
210
- .video-js.skin_news .vjs-control-bar{
210
+ .video-js.skin_mini .vjs-control-bar{
211
211
  z-index: 1 !important;
212
- height: 5em !important;
212
+ height: 4em !important;
213
213
  background: black !important;
214
214
  }
215
- .video-js.skin_news .vjs-playback-rate .vjs-playback-rate-value{
216
- display: flex;
217
- align-items: center;
218
- justify-content: center;
219
- }
220
215
 
221
- .video-js.skin_news .vjs-fade>* {
216
+ .video-js.skin_mini .vjs-fade>* {
222
217
  visibility: hidden !important;
223
218
  opacity: 0 !important;
224
219
  transition: visibility 1s, opacity 1s !important;
225
220
  }
226
221
 
227
- .video-js.skin_news .custom-spaced-progress-bar {
222
+ .video-js.skin_mini .custom-spaced-progress-bar {
228
223
  position: absolute;
229
224
  width: 100%;
230
225
  display: flex;
@@ -232,7 +227,7 @@
232
227
  top: -0.5em;
233
228
  }
234
229
 
235
- .video-js.skin_news .vjs-progress-control {
230
+ .video-js.skin_mini .vjs-progress-control {
236
231
  /* left: -6px; */
237
232
  position: relative;
238
233
  width: 100%;
@@ -243,19 +238,19 @@
243
238
 
244
239
 
245
240
 
246
- .video-js.skin_news .vjs-custom-control-spacer {
241
+ .video-js.skin_mini .vjs-custom-control-spacer {
247
242
  display: block;
248
243
  flex: 1 1 auto;
249
244
  }
250
245
 
251
- .video-js.skin_news .vjs-progress-control .vjs-progress-holder {
246
+ .video-js.skin_mini .vjs-progress-control .vjs-progress-holder {
252
247
  margin: 0 0px 0 0px;
253
248
  }
254
- .video-js.skin_news .vjs-remaining-time.vjs-time-control.vjs-control{
249
+ .video-js.skin_mini .vjs-remaining-time.vjs-time-control.vjs-control{
255
250
  display: none;
256
251
  }
257
252
 
258
- .video-js.skin_news button.vjs-control.vjs-button.vjs-slowmo-button {
253
+ .video-js.skin_mini button.vjs-control.vjs-button.vjs-slowmo-button {
259
254
  font-size: 14px;
260
255
  font-weight: 500;
261
256
  align-self: center;
@@ -264,143 +259,158 @@
264
259
  border-radius: 8px;
265
260
  }
266
261
 
267
- .video-js.skin_news .vjs-progress-control .vjs-progress-holder{
268
- height: 6px !important;
262
+ .video-js.skin_mini .vjs-progress-control .vjs-progress-holder{
263
+ height: 5px !important;
269
264
  }
270
265
 
271
- .video-js.skin_news .vjs-play-progress:before {
272
- font-size: 1.5em;
266
+ .video-js.skin_mini .vjs-play-progress:before {
267
+ font-size: 1.3em;
273
268
  line-height: unset;
274
269
  top: -0.3333333333em;
275
270
  }
276
271
 
277
- .video-js.skin_news .vjs-play-progress .vjs-time-tooltip {
272
+ .video-js.skin_mini .vjs-play-progress .vjs-time-tooltip {
278
273
  display: none !important;
279
274
  }
280
275
 
281
276
  /* */
282
- .video-js.skin_news .vjs-mouse-display{
277
+ .video-js.skin_mini .vjs-mouse-display{
283
278
  font-size: 1.6666666667em;
284
279
  }
285
280
 
286
- .video-js.skin_news .vjs-progress-control:hover .vjs-progress-holder {
281
+ .video-js.skin_mini .vjs-progress-control:hover .vjs-progress-holder {
287
282
  font-size: 1em !important;
288
283
  }
289
284
 
290
- .video-js.skin_news .vjs-button{
291
- width: 5.3em;
285
+ .video-js.skin_mini .vjs-button{
286
+ width: 3em;
292
287
  display: flex;
293
288
  align-items: center;
294
289
  justify-content: center;
295
290
  }
296
291
 
297
292
 
298
- .video-js.skin_news .vjs-fullscreen .icon-minimize,
293
+ .video-js.skin_mini .vjs-fullscreen .icon-minimize,
299
294
  .icon-maximize {
300
295
  display: block;
301
296
  height: 32px;
302
297
  }
303
298
 
304
- .video-js.skin_news .vjs-playback-rate .vjs-playback-rate-value{
299
+ .video-js.skin_mini .vjs-playback-rate .vjs-playback-rate-value{
305
300
  line-height: 4;
306
301
  }
307
302
 
308
- .video-js.skin_news .vjs-fullscreen .icon-maximize,
303
+ .video-js.skin_mini .vjs-fullscreen .icon-maximize,
309
304
  .icon-minimize {
310
305
  display: none;
311
306
  height: 32px;
312
307
  }
313
308
 
314
- .video-js.skin_news button.vjs-play-control.vjs-control.vjs-button{
309
+ .video-js.skin_mini button.vjs-play-control.vjs-control.vjs-button{
315
310
  outline: none !important;
316
311
  }
317
- .video-js.skin_news .vjs-fullscreen-control .vjs-icon-placeholder:before,
312
+ .video-js.skin_mini .vjs-fullscreen-control .vjs-icon-placeholder:before,
318
313
  .vjs-icon-fullscreen-enter:before {
319
314
  /* content: '' !important; */
320
315
  }
321
316
 
322
- .video-js.skin_news button.vjs-fullscreen-control.vjs-control.vjs-button {
317
+ .video-js.skin_mini button.vjs-fullscreen-control.vjs-control.vjs-button {
323
318
  display: flex;
324
319
  justify-content: center;
325
320
  align-items: center;
326
321
  /* transform: rotate(90deg); */
327
322
  }
328
323
 
329
- .video-js.skin_news .vjs-subs-caps-button .vjs-icon-placeholder:before{
324
+ .video-js.skin_mini .vjs-subs-caps-button .vjs-icon-placeholder:before{
330
325
  display: none;
331
326
  }
332
- .video-js.skin_news .vjs-volume-panel .vjs-volume-control{
327
+ .video-js.skin_mini .vjs-volume-panel .vjs-volume-control{
333
328
  margin-left: -10px;
329
+ display: none;
334
330
  }
335
331
 
336
- .video-js.skin_news .skipbtn:hover{
332
+ .video-js.skin_mini .vjs-loading-spinner {
333
+ position: absolute;
334
+ top: 50%;
335
+ left: 50%;
336
+ transform: translate(-50%, -50%);
337
+ opacity: .85;
338
+ text-align: left;
339
+ border: .2em solid rgba(43, 51, 63, .7);
340
+ box-sizing: border-box;
341
+ background-clip: padding-box;
342
+ width: 3em;
343
+ height: 3em;
344
+ border-radius: 50%;
345
+ visibility: hidden;
346
+ }
347
+
348
+ .video-js.skin_mini .skipbtn:hover{
337
349
  cursor: pointer;
338
350
  }
339
351
 
340
- .video-js.skin_news .rewindbtn:hover{
352
+ .video-js.skin_mini .rewindbtn:hover{
341
353
  cursor: pointer;
342
354
  }
343
355
 
344
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control{
356
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control{
345
357
  position: relative;
346
358
  padding-left: 0;
347
359
  }
348
360
 
349
- .video-js.skin_news.vjs-seeking .vjs-big-play-button{
350
- display: none !important;
361
+ .video-js.skin_mini.vjs-paused .vjs-big-play-button {
362
+ width: 40px;
363
+ height: 40px;
364
+ display: flex;
365
+ justify-content: center;
366
+ align-items: center;
367
+ border: none;
368
+ position: absolute;
369
+ top: 0;
370
+ left: 0;
371
+ right: 0;
372
+ bottom: 0;
373
+ margin: auto;
374
+ font-size: 3em;
375
+ line-height: 1.3em;
376
+ transform: none !important;
377
+ border-radius: 1.3em;
351
378
  }
352
379
 
353
- .video-js.skin_news.vjs-paused .vjs-big-play-button {
354
- width: 90px;
355
- height: 90px;
356
- display: flex;
357
- justify-content: center;
358
- align-items: center;
359
- border-radius: 50%;
360
- position: absolute;
361
- top: 0;
362
- left: 0;
363
- right: 0;
364
- bottom: 0;
365
- margin: auto;
366
- font-size: 6em;
367
- line-height: 1.4em;
368
- border: 0.05em solid;
369
- color: inherit;
370
- }
371
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control.vjs-at-live-edge{
380
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control.vjs-at-live-edge{
372
381
  font-weight: bold;
373
382
  }
374
383
 
375
- .video-js.skin_news .vjs-menu > ul.vjs-menu-content{
376
- bottom: 2.4em !important;
377
- right: -1em;
384
+ .video-js.skin_mini .vjs-menu > ul.vjs-menu-content{
385
+ bottom: 1.1em !important;
386
+ right: 1em;
378
387
  z-index: 1;
388
+ font-size: 10px;
379
389
  }
380
390
 
381
- .video-js.skin_news .vjs-chromecast-button .vjs-icon-placeholder {
391
+ .video-js.skin_mini .vjs-chromecast-button .vjs-icon-placeholder {
382
392
  width: 24px !important;
383
393
  height: 24px !important;
384
394
  }
385
- .settings-selector-icon>svg{
395
+ .video-js.skin_mini .settings-selector-icon>svg{
386
396
  height: 19px !important;
387
397
  width: 19px !important;
388
398
  }
389
399
 
390
400
 
391
- .video-js.skin_news button.vjs-rewind-button{
401
+ .video-js.skin_mini button.vjs-rewind-button{
392
402
  cursor: pointer;
393
403
  }
394
404
 
395
- .video-js.skin_news .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
405
+ .video-js.skin_mini .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
396
406
  padding-right: 0;
397
407
  }
398
408
 
399
- .video-js.skin_news .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
409
+ .video-js.skin_mini .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
400
410
  padding-left: 0;
401
411
  }
402
412
 
403
- .video-js.skin_news .vjs-control-bar .vjs-time-control.vjs-time-divider {
413
+ .video-js.skin_mini .vjs-control-bar .vjs-time-control.vjs-time-divider {
404
414
  padding-left: 0;
405
415
  padding-right: 0;
406
416
  display: flex;
@@ -408,46 +418,48 @@
408
418
  width: min-content;
409
419
  }
410
420
 
411
- .video-js.skin_news.vjs-live .vjs-control-bar .vjs-time-control {
421
+ .video-js.skin_mini.vjs-live .vjs-control-bar .vjs-time-control {
412
422
  display: none
413
423
  }
414
- .video-js.skin_news.vjs-liveui .vjs-control-bar .vjs-time-control {
424
+ .video-js.skin_mini.vjs-liveui .vjs-control-bar .vjs-time-control {
415
425
  display: none
416
426
  }
417
427
 
418
- .video-js.skin_news .vjs-control-bar .vjs-time-control {
419
- display: flex;
420
- align-items: center;
421
- font-weight: 700;
422
- font-size: 12px;
423
- min-width: 1.2em;
428
+ .video-js.skin_mini .vjs-control-bar .vjs-time-control {
429
+ display: flex;
430
+ align-items: center;
431
+ font-weight: 700;
432
+ font-size: 9px;
433
+ min-width: 0.8em;
434
+ padding-left: 0;
424
435
  }
425
436
 
426
- .video-js.skin_news .vjs-remaining-time.vjs-time-control.vjs-control {
437
+ .video-js.skin_mini .vjs-remaining-time.vjs-time-control.vjs-control {
427
438
  display: none;
428
439
  font-size: 11px;
429
440
  justify-content: center;
430
441
  align-items: center;
431
442
  user-select: none;
432
443
  }
433
- .video-js.skin_news.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
444
+ .video-js.skin_mini.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
434
445
  display: none;
435
446
  }
436
447
 
437
- .video-js.skin_news button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
448
+ .video-js.skin_mini button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
438
449
  height: min-content;
439
450
  width: min-content;
440
451
  }
441
- .video-js.skin_news .vjs-volume-panel.vjs-volume-panel-vertical{
442
- width: 6em;
452
+ .video-js.skin_mini .vjs-volume-panel.vjs-volume-panel-vertical{
453
+ width: 3em;
454
+ margin-right: 4px;
443
455
  }
444
456
 
445
- .video-js.skin_news .content{
457
+ .video-js.skin_mini .content{
446
458
  bottom: 3.4rem !important;
447
459
  right: -4rem !important;
448
460
  }
449
461
 
450
- .setting-icon > svg{
462
+ .video-js.skin_mini .setting-icon > svg{
451
463
  height:18px !important;
452
464
  }
453
465
 
@@ -461,15 +473,16 @@
461
473
  pointer-events:none
462
474
  }
463
475
 
464
- .video-js.skin_news iframe{
476
+ .video-js.skin_mini iframe{
465
477
  width: 100%;
466
478
  height: 100%;
467
479
  }
468
480
 
469
- .video-js.skin_news .vjs-live-control{
481
+ .video-js.skin_mini .vjs-live-control{
470
482
  align-items: center;
483
+ max-width: 5em;
471
484
  }
472
- .video-js.skin_news .vjs-live-control.vjs-control .vjs-live-display{
485
+ .video-js.skin_mini .vjs-live-control.vjs-control .vjs-live-display{
473
486
  height: 2.2em;
474
487
  display: flex;
475
488
  align-items: center;
@@ -477,282 +490,210 @@
477
490
  width: 4em;
478
491
  justify-content: center;
479
492
  background: red;
480
- margin: 4px 0px 4px 12px;
493
+ margin: 4px 0px 4px 2px;
481
494
  }
482
495
 
483
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control:focus{
496
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:focus{
484
497
  text-shadow: none;
485
498
  }
486
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-seek-to-live-text {
499
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-seek-to-live-text {
487
500
  display: none;
488
501
  font-size: 12px;
489
502
  }
490
503
 
491
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder {
492
- height: 2.2em;
504
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder {
505
+ height: 1.8em;
493
506
  display: inline-flex;
494
507
  align-items: center;
495
- /* font-family: monospace; */
508
+ font-family: monospace;
496
509
  justify-content: center;
497
- border: 2px solid;
498
- margin: 4px 0px 4px 6px;
510
+ border: 1.5px solid;
511
+ margin: 4px 0px 4px 2px;
499
512
  white-space: pre;
500
- padding: 0px 6px;
513
+ padding: 2px 4px;
501
514
  font-size: 1.2em;
502
515
  font-weight: 500;
503
516
  color: rgba(255, 255, 2555, 0.7);
504
-
505
- letter-spacing: -.1px;
506
- line-height: normal;
507
- text-transform: uppercase;
508
- color: #FFFFFF;
509
- opacity: .7;
510
- font-family: "Proxima Nova";
511
- }
512
-
513
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder:hover{
514
- opacity: 1;
515
517
  }
516
518
 
517
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder::before {
519
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder::before {
518
520
  content: "NOT LIVE";
519
- }
520
-
521
- .settings-selection.vjs-control.vjs-button{
522
- display: flex !important;
523
- }
524
-
525
- @media(max-width:576px){
526
- .settings-selection.vjs-control.vjs-button{
527
- display: none !important;
528
- }
521
+ word-spacing: -4px;
529
522
  }
530
523
 
531
524
 
532
- @media(max-width:576px){
525
+ @media(max-width:600px){
533
526
  .tvProviderImage{
534
527
  display: none
535
528
  }
536
- .video-js.skin_news .vjs-fullscreen .icon-minimize,
529
+ .video-js.skin_mini .vjs-fullscreen .icon-minimize,
537
530
  .icon-maximize {
538
531
  height: 30px !important;
539
532
  }
540
533
 
541
- .video-js.skin_news .vjs-fullscreen .icon-maximize,
534
+ .video-js.skin_mini .vjs-fullscreen .icon-maximize,
542
535
  .icon-minimize {
543
536
  height: 30px !important;
544
537
  }
545
- .video-js.skin_news .vjs-volume-panel.vjs-volume-panel-vertical{
546
- width: 4.5em;
538
+ .video-js.skin_mini .vjs-volume-panel.vjs-volume-panel-vertical{
539
+ width: 3.5em;
547
540
  }
548
- .video-js.skin_news button.vjs-fullscreen-control.vjs-control.vjs-button>span.vjs-icon-placeholder::before {
541
+ .video-js.skin_mini button.vjs-fullscreen-control.vjs-control.vjs-button>span.vjs-icon-placeholder::before {
549
542
  height: min-content;
550
543
  }
551
544
 
552
- .video-js.skin_news button.vjs-slowmo-button{
545
+ .video-js.skin_mini button.vjs-slowmo-button{
553
546
  display: none;
554
547
  }
555
- .video-js.skin_news button.vjs-rewind-button{
548
+ .video-js.skin_mini button.vjs-rewind-button{
556
549
  display: none;
557
550
  }
558
- .video-js.skin_news button.vjs-rewind-button>svg{
551
+ .video-js.skin_mini button.vjs-rewind-button>svg{
559
552
  height: 20px;
560
553
  }
561
- .video-js.skin_news .vjs-button{
562
- width: 4.8em;
554
+ .video-js.skin_mini .vjs-button{
555
+ width: 3em;
563
556
  }
564
- .video-js.skin_news .widget-selection{
557
+ .video-js.skin_mini .widget-selection{
565
558
  display: none;
566
559
  }
567
- .video-js.skin_news .container{
560
+ .video-js.skin_mini .container{
568
561
  display: none !important;
569
562
  }
570
- .video-js.skin_news .vjs-control-bar{
563
+ .video-js.skin_mini .vjs-control-bar{
571
564
  height: 4em !important;
572
565
  }
573
- .video-js.skin_news .vjs-button>.vjs-icon-placeholder:before{
566
+ .video-js.skin_mini .vjs-button>.vjs-icon-placeholder:before{
574
567
  font-size: 2.5em;
575
568
  line-height: 1.5;
576
569
  }
577
- .video-js.skin_news .vjs-play-progress:before {
570
+ .video-js.skin_mini .vjs-play-progress:before {
578
571
  font-size: 1.2em;
579
572
  position: absolute;
580
573
  right: -0.5em;
581
574
  z-index: 1;
582
575
  }
583
- .video-js.skin_news button.vjs-skip-button>svg{
576
+ .video-js.skin_mini button.vjs-skip-button>svg{
584
577
  height: 20px;
585
578
  }
586
- .video-js.skin_news button.vjs-big-play-button {
587
- width: 50px !important;
588
- height: 50px !important;
589
- font-size: 2.1rem !important;
590
- }
591
579
 
592
580
  .stream-selector-icon>svg{
593
581
  width: 24px;
594
582
  height: 24px;
595
583
  }
596
- .video-js.skin_news.vjs-live .vjs-progress-control .vjs-progress-holder{
597
- margin: 0 12px 0 12px;
598
- }
599
- .video-js.skin_news .vjs-seek-to-live-text{
584
+ .video-js.skin_mini .vjs-seek-to-live-text{
600
585
  font-size: 12px;
601
586
  }
602
- .video-js.skin_news .vjs-progress-control .vjs-progress-holder {
603
- margin: 0 12px 0 12px;
587
+
588
+ .video-js.skin_mini .vjs-text-track-display-ttml span {
589
+ color: white !important;
590
+ font-size: 16px !important;
591
+ background-color: rgba(0,0,0,0.2) !important;
592
+ }
604
593
  }
594
+
595
+ .video-js.skin_mini .vjs-text-track-display-ttml span {
596
+ color: white !important;
597
+ font-size: 16px !important;
598
+ background-color: rgba(0,0,0,0.2) !important;
605
599
  }
606
- .video-js.skin_news.vjs-paused .vjs-big-play-button {
607
- width: 90px;
608
- height: 90px;
609
- display: flex;
610
- justify-content: center;
611
- align-items: center;
612
- border-radius: 50%;
613
- position: absolute;
614
- top: 0;
615
- left: 0;
616
- right: 0;
617
- bottom: 0;
618
- margin: auto;
619
- font-size: 6em;
620
- line-height: 1.4em;
600
+
601
+ .video-js.skin_mini .vjs-text-track-display-ttml p {
602
+ font-size: 18px !important;
621
603
  }
622
604
 
623
- .video-js.skin_news .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
605
+ .video-js.skin_mini.vjs-has-started.vjs-user-active.vjs-controls-enabled .vjs-text-track-display-ttml p {
606
+ margin-bottom: 1rem !important;
607
+ }
608
+
609
+
610
+ .video-js.skin_mini .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
624
611
  display: flex;
625
612
  justify-content: center;
626
613
  align-items: center;
627
614
  height: 100%;
628
615
  transition: width 0.1s;
629
616
  }
617
+ .video-js.skin_mini .vjs-track-settings-colors fieldset.vjs-fg.vjs-track-setting{
618
+ margin: 2px;
619
+ }
630
620
 
631
- .video-js.skin_news .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:active .vjs-volume-control.vjs-control.vjs-volume-horizontal {
621
+ .video-js.skin_mini .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:active .vjs-volume-control.vjs-control.vjs-volume-horizontal {
632
622
  display: flex;
633
623
  justify-content: center;
634
624
  align-items: center;
635
625
  height: 100%;
636
626
  transition: width 0.1s;
637
627
  }
638
- .video-js.skin_news.vjs-fullscreen .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
639
- display: none !important;
640
- }
641
- .video-js.skin_news .ssai-ad-container{
642
- position: absolute;
643
- bottom: 14px;
628
+ .video-js.skin_mini .vjs-text-track-settings .vjs-modal-dialog-content{
629
+ display: grid;
630
+ font-size: 10px;
631
+ grid-template-columns: 1fr;
632
+ grid-template-rows: 1fr;
633
+ padding: 1px 0px 0 0px;
634
+ margin: 0;
644
635
  }
645
636
 
646
- @media (max-width: 576px) {
647
- .video-js.skin_news .ssai-ad-container{
648
- bottom: 2px;
649
- }
650
- .video-js.skin_news .vjs-progress-control .vjs-progress-holder{
637
+ @media (max-width: 600px) {
638
+ .video-js.skin_mini .vjs-progress-control .vjs-progress-holder{
651
639
  height: 5px !important;
652
640
  }
653
- .video-js.skin_news button.vjs-big-play-button {
654
- width: 50px !important;
655
- height: 50px !important;
656
- font-size: 2.1rem !important;
657
- }
658
641
 
659
- .vjs-playback-rate.vjs-menu-button.vjs-menu-button-popup.vjs-control.vjs-button{
642
+ .video-js.skin_mini .vjs-playback-rate.vjs-menu-button.vjs-menu-button-popup.vjs-control.vjs-button{
660
643
  display: none;
661
644
  }
662
- .video-js.skin_news .vjs-menu > ul.vjs-menu-content {
663
- bottom: 2.4em !important;
664
- right: -1em;
665
- z-index: 1;
666
- }
667
- .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
668
- display: none !important;
669
- }
670
-
671
- .video-js.skin_news .vjs-text-track-display-ttml span {
672
- color: white;
673
- font-size: 13px;
674
- background-color: black;
675
- }
676
- }
677
-
678
- .video-js.skin_news .vjs-text-track-display-ttml span {
679
- color: white;
680
- font-size: 16px;
681
- background-color: black;
682
- }
683
-
684
- .video-js.skin_news.vjs-has-started.vjs-user-active.vjs-controls-enabled .vjs-text-track-display-ttml p {
685
- margin-bottom: 2rem !important;
686
- }
687
-
688
- .video-js.skin_news .vjs-text-track-display-ttml p {
689
- font-size: 18px !important;
690
- }
691
645
 
692
-
693
- .video-js.skin_news .vjs-text-track-settings .vjs-track-settings-controls .vjs-default-button,
694
- .video-js.skin_news .vjs-text-track-settings .vjs-track-settings-controls .vjs-done-button {
695
- font-size: 1.2em !important;
696
- line-height: 1.5em !important;
697
- padding: 0.2em 0.8em !important;
698
646
  }
699
647
 
700
- .video-js.skin_news .vjs-control-bar .vjs-svg-icon{
648
+ .video-js.skin_mini .vjs-control-bar .vjs-svg-icon{
701
649
  content: none !important;
702
650
  fill: none !important;
703
651
  filter: none !important;
704
652
  }
705
653
 
706
654
  /* svg icons opacity and hover effect */
707
- .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button svg {
655
+ .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button svg {
708
656
  opacity: 0.7 !important;
709
657
  }
710
658
 
711
- .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button:hover svg {
712
- opacity: 1 !important;
713
- }
714
- .video-js.skin_news .vjs-control-bar .vjs-remaining-time.vjs-time-control.vjs-control{
715
- opacity: 0.7 !important;
716
- }
717
- .video-js.skin_news .vjs-control-bar .vjs-remaining-time.vjs-time-control.vjs-control:hover{
659
+ .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button:hover svg {
718
660
  opacity: 1 !important;
719
661
  }
720
662
 
721
- .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
663
+ .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
722
664
  color: rgba(255, 255, 2555, 0.7)!important;
723
665
  }
724
666
 
725
- .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
667
+ .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
726
668
  color: rgba(255, 255, 2555, 1)!important;
727
669
  }
728
670
 
729
671
 
730
-
731
- .video-js.skin_news_live .vjs-button>.vjs-icon-placeholder:before {
672
+ .video-js.skin_news .vjs-button>.vjs-icon-placeholder:before {
732
673
  font-size: 2.2em;
733
674
  line-height: 2.6;
734
675
  }
735
- .video-js.skin_news_live .vjs-custom-big-mute.vjs-control{
736
- background: #fcb700;
676
+ .video-js.skin_news .vjs-custom-big-mute.vjs-control{
677
+ background: white;
737
678
  }
738
- .video-js.skin_news_live .vjs-control-bar{
679
+ .video-js.skin_news .vjs-control-bar{
739
680
  z-index: 1 !important;
740
681
  height: 5em !important;
741
682
  background: black !important;
742
683
  }
743
- .video-js.skin_news_live .vjs-playback-rate .vjs-playback-rate-value{
684
+ .video-js.skin_news .vjs-playback-rate .vjs-playback-rate-value{
744
685
  display: flex;
745
686
  align-items: center;
746
687
  justify-content: center;
747
688
  }
748
689
 
749
- .video-js.skin_news_live .vjs-fade>* {
690
+ .video-js.skin_news .vjs-fade>* {
750
691
  visibility: hidden !important;
751
692
  opacity: 0 !important;
752
693
  transition: visibility 1s, opacity 1s !important;
753
694
  }
754
695
 
755
- .video-js.skin_news_live .custom-spaced-progress-bar {
696
+ .video-js.skin_news .custom-spaced-progress-bar {
756
697
  position: absolute;
757
698
  width: 100%;
758
699
  display: flex;
@@ -760,7 +701,7 @@
760
701
  top: -0.5em;
761
702
  }
762
703
 
763
- .video-js.skin_news_live .vjs-progress-control {
704
+ .video-js.skin_news .vjs-progress-control {
764
705
  /* left: -6px; */
765
706
  position: relative;
766
707
  width: 100%;
@@ -768,25 +709,22 @@
768
709
  transition: height 0.1s, top 0.1s;
769
710
  }
770
711
 
771
- .video-js.skin_news_live .vjs-volume-panel{
772
- min-width: 5.3em;
773
- }
774
712
 
775
713
 
776
714
 
777
- .video-js.skin_news_live .vjs-custom-control-spacer {
778
- /* display: block; */
779
- /* flex: 1 1 auto; */
715
+ .video-js.skin_news .vjs-custom-control-spacer {
716
+ display: block;
717
+ flex: 1 1 auto;
780
718
  }
781
719
 
782
- .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder {
720
+ .video-js.skin_news .vjs-progress-control .vjs-progress-holder {
783
721
  margin: 0 0px 0 0px;
784
722
  }
785
- .video-js.skin_news_live .vjs-remaining-time.vjs-time-control.vjs-control{
723
+ .video-js.skin_news .vjs-remaining-time.vjs-time-control.vjs-control{
786
724
  display: none;
787
725
  }
788
726
 
789
- .video-js.skin_news_live button.vjs-control.vjs-button.vjs-slowmo-button {
727
+ .video-js.skin_news button.vjs-control.vjs-button.vjs-slowmo-button {
790
728
  font-size: 14px;
791
729
  font-weight: 500;
792
730
  align-self: center;
@@ -795,30 +733,30 @@
795
733
  border-radius: 8px;
796
734
  }
797
735
 
798
- .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder{
736
+ .video-js.skin_news .vjs-progress-control .vjs-progress-holder{
799
737
  height: 6px !important;
800
738
  }
801
739
 
802
- .video-js.skin_news_live .vjs-play-progress:before {
740
+ .video-js.skin_news .vjs-play-progress:before {
803
741
  font-size: 1.5em;
804
742
  line-height: unset;
805
743
  top: -0.3333333333em;
806
744
  }
807
745
 
808
- .video-js.skin_news_live .vjs-play-progress .vjs-time-tooltip {
746
+ .video-js.skin_news .vjs-play-progress .vjs-time-tooltip {
809
747
  display: none !important;
810
748
  }
811
749
 
812
750
  /* */
813
- .video-js.skin_news_live .vjs-mouse-display{
751
+ .video-js.skin_news .vjs-mouse-display{
814
752
  font-size: 1.6666666667em;
815
753
  }
816
754
 
817
- .video-js.skin_news_live .vjs-progress-control:hover .vjs-progress-holder {
755
+ .video-js.skin_news .vjs-progress-control:hover .vjs-progress-holder {
818
756
  font-size: 1em !important;
819
757
  }
820
758
 
821
- .video-js.skin_news_live .vjs-button{
759
+ .video-js.skin_news .vjs-button{
822
760
  width: 5.3em;
823
761
  display: flex;
824
762
  align-items: center;
@@ -826,71 +764,63 @@
826
764
  }
827
765
 
828
766
 
829
- .video-js.skin_news_live .vjs-fullscreen .icon-minimize,
767
+ .video-js.skin_news .vjs-fullscreen .icon-minimize,
830
768
  .icon-maximize {
831
769
  display: block;
832
770
  height: 32px;
833
771
  }
834
772
 
835
- .video-js.skin_news_live .vjs-playback-rate .vjs-playback-rate-value{
773
+ .video-js.skin_news .vjs-playback-rate .vjs-playback-rate-value{
836
774
  line-height: 4;
837
775
  }
838
776
 
839
- .video-js.skin_news_live .vjs-fullscreen .icon-maximize,
777
+ .video-js.skin_news .vjs-fullscreen .icon-maximize,
840
778
  .icon-minimize {
841
779
  display: none;
842
780
  height: 32px;
843
781
  }
844
782
 
845
- .video-js.skin_news_live button.vjs-play-control.vjs-control.vjs-button{
783
+ .video-js.skin_news button.vjs-play-control.vjs-control.vjs-button{
846
784
  outline: none !important;
847
- /* flex: 1; */
848
- }
849
- .video-js.skin_news_live .vjs-play-toggle-container{
850
- display: flex;
851
- flex: 1;
852
- justify-content: center;
853
785
  }
854
-
855
-
856
- .video-js.skin_news_live .vjs-fullscreen-control .vjs-icon-placeholder:before,
786
+ .video-js.skin_news .vjs-fullscreen-control .vjs-icon-placeholder:before,
857
787
  .vjs-icon-fullscreen-enter:before {
858
788
  /* content: '' !important; */
859
789
  }
860
790
 
861
- .video-js.skin_news_live button.vjs-fullscreen-control.vjs-control.vjs-button {
791
+ .video-js.skin_news button.vjs-fullscreen-control.vjs-control.vjs-button {
862
792
  display: flex;
863
793
  justify-content: center;
864
794
  align-items: center;
865
795
  /* transform: rotate(90deg); */
866
796
  }
867
797
 
868
- .video-js.skin_news_live .vjs-subs-caps-button .vjs-icon-placeholder:before{
798
+ .video-js.skin_news .vjs-subs-caps-button .vjs-icon-placeholder:before{
869
799
  display: none;
870
800
  }
871
- .video-js.skin_news_live .vjs-volume-panel .vjs-volume-control{
801
+ .video-js.skin_news .vjs-volume-panel .vjs-volume-control{
872
802
  margin-left: -10px;
873
803
  }
874
804
 
875
- .video-js.skin_news_live .skipbtn:hover{
805
+ .video-js.skin_news .skipbtn:hover{
876
806
  cursor: pointer;
877
807
  }
878
808
 
879
- .video-js.skin_news_live .rewindbtn:hover{
809
+ .video-js.skin_news .rewindbtn:hover{
880
810
  cursor: pointer;
881
811
  }
882
812
 
883
- .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control{
813
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control{
884
814
  position: relative;
885
815
  padding-left: 0;
886
816
  }
887
817
 
888
- .video-js.skin_news_live.vjs-seeking .vjs-big-play-button{
818
+ .video-js.skin_news.vjs-seeking .vjs-big-play-button{
889
819
  display: none !important;
890
820
  }
891
821
 
892
- .video-js.skin_news_live.vjs-paused .vjs-big-play-button {
893
- /* width: 90px;
822
+ .video-js.skin_news.vjs-paused .vjs-big-play-button {
823
+ width: 90px;
894
824
  height: 90px;
895
825
  display: flex;
896
826
  justify-content: center;
@@ -905,20 +835,19 @@
905
835
  font-size: 6em;
906
836
  line-height: 1.4em;
907
837
  border: 0.05em solid;
908
- color: inherit; */
909
- display: none !important;
838
+ color: inherit;
910
839
  }
911
- .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control{
840
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control.vjs-at-live-edge{
912
841
  font-weight: bold;
913
842
  }
914
843
 
915
- .video-js.skin_news_live .vjs-menu > ul.vjs-menu-content{
844
+ .video-js.skin_news .vjs-menu > ul.vjs-menu-content{
916
845
  bottom: 2.4em !important;
917
846
  right: -1em;
918
847
  z-index: 1;
919
848
  }
920
849
 
921
- .video-js.skin_news_live .vjs-chromecast-button .vjs-icon-placeholder {
850
+ .video-js.skin_news .vjs-chromecast-button .vjs-icon-placeholder {
922
851
  width: 24px !important;
923
852
  height: 24px !important;
924
853
  }
@@ -928,34 +857,34 @@
928
857
  }
929
858
 
930
859
 
931
- .video-js.skin_news_live button.vjs-rewind-button{
860
+ .video-js.skin_news button.vjs-rewind-button{
932
861
  cursor: pointer;
933
862
  }
934
863
 
935
- .video-js.skin_news_live .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
864
+ .video-js.skin_news .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
936
865
  padding-right: 0;
937
- display: none;
938
866
  }
939
867
 
940
- .video-js.skin_news_live .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
868
+ .video-js.skin_news .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
941
869
  padding-left: 0;
942
- display: none;
943
870
  }
944
871
 
945
- .video-js.skin_news_live .vjs-control-bar .vjs-time-control.vjs-time-divider {
872
+ .video-js.skin_news .vjs-control-bar .vjs-time-control.vjs-time-divider {
946
873
  padding-left: 0;
947
874
  padding-right: 0;
948
- display: none;
875
+ display: flex;
876
+ justify-content: center;
877
+ width: min-content;
949
878
  }
950
879
 
951
- .video-js.skin_news_live.vjs-live .vjs-control-bar .vjs-time-control {
880
+ .video-js.skin_news.vjs-live .vjs-control-bar .vjs-time-control {
952
881
  display: none
953
882
  }
954
- .video-js.skin_news_live.vjs-liveui .vjs-control-bar .vjs-time-control {
883
+ .video-js.skin_news.vjs-liveui .vjs-control-bar .vjs-time-control {
955
884
  display: none
956
885
  }
957
886
 
958
- .video-js.skin_news_live .vjs-control-bar .vjs-time-control {
887
+ .video-js.skin_news .vjs-control-bar .vjs-time-control {
959
888
  display: flex;
960
889
  align-items: center;
961
890
  font-weight: 700;
@@ -963,26 +892,26 @@
963
892
  min-width: 1.2em;
964
893
  }
965
894
 
966
- .video-js.skin_news_live .vjs-remaining-time.vjs-time-control.vjs-control {
895
+ .video-js.skin_news .vjs-remaining-time.vjs-time-control.vjs-control {
967
896
  display: none;
968
897
  font-size: 11px;
969
898
  justify-content: center;
970
899
  align-items: center;
971
900
  user-select: none;
972
901
  }
973
- .video-js.skin_news_live.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
902
+ .video-js.skin_news.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
974
903
  display: none;
975
904
  }
976
905
 
977
- .video-js.skin_news_live button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
906
+ .video-js.skin_news button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
978
907
  height: min-content;
979
908
  width: min-content;
980
909
  }
981
- .video-js.skin_news_live .vjs-volume-panel.vjs-volume-panel-vertical{
910
+ .video-js.skin_news .vjs-volume-panel.vjs-volume-panel-vertical{
982
911
  width: 6em;
983
912
  }
984
913
 
985
- .video-js.skin_news_live .content{
914
+ .video-js.skin_news .content{
986
915
  bottom: 3.4rem !important;
987
916
  right: -4rem !important;
988
917
  }
@@ -1001,16 +930,15 @@
1001
930
  pointer-events:none
1002
931
  }
1003
932
 
1004
- .video-js.skin_news_live iframe{
933
+ .video-js.skin_news iframe{
1005
934
  width: 100%;
1006
935
  height: 100%;
1007
936
  }
1008
937
 
1009
- .video-js.skin_news_live .vjs-live-control{
938
+ .video-js.skin_news .vjs-live-control{
1010
939
  align-items: center;
1011
- display: none;
1012
940
  }
1013
- .video-js.skin_news_live .vjs-live-control.vjs-control .vjs-live-display{
941
+ .video-js.skin_news .vjs-live-control.vjs-control .vjs-live-display{
1014
942
  height: 2.2em;
1015
943
  display: flex;
1016
944
  align-items: center;
@@ -1021,22 +949,43 @@
1021
949
  margin: 4px 0px 4px 12px;
1022
950
  }
1023
951
 
1024
- .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control:focus{
952
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control:focus{
1025
953
  text-shadow: none;
1026
954
  }
955
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-seek-to-live-text {
956
+ display: none;
957
+ font-size: 12px;
958
+ }
1027
959
 
1028
- .video-js.skin_news_live .vjs-control-bar .vjs-seek-to-live-control.vjs-control{
1029
- display: flex;
960
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder {
961
+ height: 2.2em;
962
+ display: inline-flex;
963
+ align-items: center;
964
+ /* font-family: monospace; */
1030
965
  justify-content: center;
1031
- min-width: 5.3em;
1032
- pointer-events: none;
1033
- user-select: none;
966
+ border: 2px solid;
967
+ margin: 4px 0px 4px 6px;
968
+ white-space: pre;
969
+ padding: 0px 6px;
970
+ font-size: 1.2em;
971
+ font-weight: 500;
972
+ color: rgba(255, 255, 2555, 0.7);
973
+
974
+ letter-spacing: -.1px;
975
+ line-height: normal;
976
+ text-transform: uppercase;
977
+ color: #FFFFFF;
978
+ opacity: .7;
979
+ font-family: "Proxima Nova";
1034
980
  }
1035
981
 
1036
- .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control .vjs-icon-placeholder::before{
1037
- color: white;
982
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder:hover{
983
+ opacity: 1;
1038
984
  }
1039
985
 
986
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder::before {
987
+ content: "NOT LIVE";
988
+ }
1040
989
 
1041
990
  .settings-selection.vjs-control.vjs-button{
1042
991
  display: flex !important;
@@ -1053,57 +1002,57 @@
1053
1002
  .tvProviderImage{
1054
1003
  display: none
1055
1004
  }
1056
- .video-js.skin_news_live .vjs-fullscreen .icon-minimize,
1005
+ .video-js.skin_news .vjs-fullscreen .icon-minimize,
1057
1006
  .icon-maximize {
1058
1007
  height: 30px !important;
1059
1008
  }
1060
1009
 
1061
- .video-js.skin_news_live .vjs-fullscreen .icon-maximize,
1010
+ .video-js.skin_news .vjs-fullscreen .icon-maximize,
1062
1011
  .icon-minimize {
1063
1012
  height: 30px !important;
1064
1013
  }
1065
- .video-js.skin_news_live .vjs-volume-panel.vjs-volume-panel-vertical{
1014
+ .video-js.skin_news .vjs-volume-panel.vjs-volume-panel-vertical{
1066
1015
  width: 4.5em;
1067
1016
  }
1068
- .video-js.skin_news_live button.vjs-fullscreen-control.vjs-control.vjs-button>span.vjs-icon-placeholder::before {
1017
+ .video-js.skin_news button.vjs-fullscreen-control.vjs-control.vjs-button>span.vjs-icon-placeholder::before {
1069
1018
  height: min-content;
1070
1019
  }
1071
1020
 
1072
- .video-js.skin_news_live button.vjs-slowmo-button{
1021
+ .video-js.skin_news button.vjs-slowmo-button{
1073
1022
  display: none;
1074
1023
  }
1075
- .video-js.skin_news_live button.vjs-rewind-button{
1024
+ .video-js.skin_news button.vjs-rewind-button{
1076
1025
  display: none;
1077
1026
  }
1078
- .video-js.skin_news_live button.vjs-rewind-button>svg{
1027
+ .video-js.skin_news button.vjs-rewind-button>svg{
1079
1028
  height: 20px;
1080
1029
  }
1081
- .video-js.skin_news_live .vjs-button{
1030
+ .video-js.skin_news .vjs-button{
1082
1031
  width: 4.8em;
1083
1032
  }
1084
- .video-js.skin_news_live .widget-selection{
1033
+ .video-js.skin_news .widget-selection{
1085
1034
  display: none;
1086
1035
  }
1087
- .video-js.skin_news_live .container{
1036
+ .video-js.skin_news .container{
1088
1037
  display: none !important;
1089
1038
  }
1090
- .video-js.skin_news_live .vjs-control-bar{
1039
+ .video-js.skin_news .vjs-control-bar{
1091
1040
  height: 4em !important;
1092
1041
  }
1093
- .video-js.skin_news_live .vjs-button>.vjs-icon-placeholder:before{
1042
+ .video-js.skin_news .vjs-button>.vjs-icon-placeholder:before{
1094
1043
  font-size: 2.5em;
1095
1044
  line-height: 1.5;
1096
1045
  }
1097
- .video-js.skin_news_live .vjs-play-progress:before {
1046
+ .video-js.skin_news .vjs-play-progress:before {
1098
1047
  font-size: 1.2em;
1099
1048
  position: absolute;
1100
1049
  right: -0.5em;
1101
1050
  z-index: 1;
1102
1051
  }
1103
- .video-js.skin_news_live button.vjs-skip-button>svg{
1052
+ .video-js.skin_news button.vjs-skip-button>svg{
1104
1053
  height: 20px;
1105
1054
  }
1106
- .video-js.skin_news_live button.vjs-big-play-button {
1055
+ .video-js.skin_news button.vjs-big-play-button {
1107
1056
  width: 50px !important;
1108
1057
  height: 50px !important;
1109
1058
  font-size: 2.1rem !important;
@@ -1113,17 +1062,17 @@
1113
1062
  width: 24px;
1114
1063
  height: 24px;
1115
1064
  }
1116
- .video-js.skin_news_live.vjs-live .vjs-progress-control .vjs-progress-holder{
1065
+ .video-js.skin_news.vjs-live .vjs-progress-control .vjs-progress-holder{
1117
1066
  margin: 0 12px 0 12px;
1118
1067
  }
1119
- .video-js.skin_news_live .vjs-seek-to-live-text{
1068
+ .video-js.skin_news .vjs-seek-to-live-text{
1120
1069
  font-size: 12px;
1121
1070
  }
1122
- .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder {
1071
+ .video-js.skin_news .vjs-progress-control .vjs-progress-holder {
1123
1072
  margin: 0 12px 0 12px;
1124
1073
  }
1125
1074
  }
1126
- .video-js.skin_news_live.vjs-paused .vjs-big-play-button {
1075
+ .video-js.skin_news.vjs-paused .vjs-big-play-button {
1127
1076
  width: 90px;
1128
1077
  height: 90px;
1129
1078
  display: flex;
@@ -1140,7 +1089,7 @@
1140
1089
  line-height: 1.4em;
1141
1090
  }
1142
1091
 
1143
- .video-js.skin_news_live .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1092
+ .video-js.skin_news .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1144
1093
  display: flex;
1145
1094
  justify-content: center;
1146
1095
  align-items: center;
@@ -1148,22 +1097,29 @@
1148
1097
  transition: width 0.1s;
1149
1098
  }
1150
1099
 
1151
- .video-js.skin_news_live .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1100
+ .video-js.skin_news .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:active .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1152
1101
  display: flex;
1153
1102
  justify-content: center;
1154
1103
  align-items: center;
1155
1104
  height: 100%;
1156
1105
  transition: width 0.1s;
1157
1106
  }
1158
- .video-js.skin_news_live.vjs-fullscreen .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
1107
+ .video-js.skin_news.vjs-fullscreen .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
1159
1108
  display: none !important;
1160
1109
  }
1110
+ .video-js.skin_news .ssai-ad-container{
1111
+ position: absolute;
1112
+ bottom: 14px;
1113
+ }
1161
1114
 
1162
1115
  @media (max-width: 576px) {
1163
- .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder{
1116
+ .video-js.skin_news .ssai-ad-container{
1117
+ bottom: 2px;
1118
+ }
1119
+ .video-js.skin_news .vjs-progress-control .vjs-progress-holder{
1164
1120
  height: 5px !important;
1165
1121
  }
1166
- .video-js.skin_news_live button.vjs-big-play-button {
1122
+ .video-js.skin_news button.vjs-big-play-button {
1167
1123
  width: 50px !important;
1168
1124
  height: 50px !important;
1169
1125
  font-size: 2.1rem !important;
@@ -1172,866 +1128,910 @@
1172
1128
  .vjs-playback-rate.vjs-menu-button.vjs-menu-button-popup.vjs-control.vjs-button{
1173
1129
  display: none;
1174
1130
  }
1175
- .video-js.skin_news_live .vjs-menu > ul.vjs-menu-content {
1131
+ .video-js.skin_news .vjs-menu > ul.vjs-menu-content {
1176
1132
  bottom: 2.4em !important;
1177
1133
  right: -1em;
1178
1134
  z-index: 1;
1179
1135
  }
1180
- .video-js.skin_news_live .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
1136
+ .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
1181
1137
  display: none !important;
1182
1138
  }
1183
1139
 
1184
- .video-js.skin_news_live .vjs-text-track-display-ttml span {
1185
- color: white !important;
1186
- font-size: 13px !important;
1187
- background-color: black !important;
1140
+ .video-js.skin_news .vjs-text-track-display-ttml span {
1141
+ color: white;
1142
+ font-size: 13px;
1143
+ background-color: black;
1188
1144
  }
1189
1145
  }
1190
1146
 
1191
- .video-js.skin_news_live .vjs-text-track-display-ttml {
1192
- width: 100% !important;
1193
- }
1194
-
1195
- .video-js.skin_news_live .vjs-text-track-display-ttml span {
1196
- color: white !important;
1197
- font-size: 16px !important;
1198
- background-color: black !important;
1147
+ .video-js.skin_news .vjs-text-track-display-ttml span {
1148
+ color: white;
1149
+ font-size: 16px;
1150
+ background-color: black;
1199
1151
  }
1200
1152
 
1201
- .video-js.skin_news_live.vjs-has-started.vjs-user-active.vjs-controls-enabled .vjs-text-track-display-ttml p {
1153
+ .video-js.skin_news.vjs-has-started.vjs-user-active.vjs-controls-enabled .vjs-text-track-display-ttml p {
1202
1154
  margin-bottom: 2rem !important;
1203
1155
  }
1204
1156
 
1205
- .video-js.skin_news_live .vjs-text-track-display-ttml p {
1157
+ .video-js.skin_news .vjs-text-track-display-ttml p {
1206
1158
  font-size: 18px !important;
1207
1159
  }
1208
1160
 
1209
1161
 
1210
- .video-js.skin_news_live .vjs-text-track-settings .vjs-track-settings-controls .vjs-default-button,
1211
- .video-js.skin_news_live .vjs-text-track-settings .vjs-track-settings-controls .vjs-done-button {
1162
+ .video-js.skin_news .vjs-text-track-settings .vjs-track-settings-controls .vjs-default-button,
1163
+ .video-js.skin_news .vjs-text-track-settings .vjs-track-settings-controls .vjs-done-button {
1212
1164
  font-size: 1.2em !important;
1213
1165
  line-height: 1.5em !important;
1214
1166
  padding: 0.2em 0.8em !important;
1215
1167
  }
1216
1168
 
1217
- .video-js.skin_news_live .vjs-control-bar .vjs-svg-icon{
1169
+ .video-js.skin_news .vjs-control-bar .vjs-svg-icon{
1218
1170
  content: none !important;
1219
1171
  fill: none !important;
1220
1172
  filter: none !important;
1221
1173
  }
1222
1174
 
1223
- .video-js.skin_news_live .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
1175
+ /* svg icons opacity and hover effect */
1176
+ .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button svg {
1177
+ opacity: 0.7 !important;
1178
+ }
1179
+
1180
+ .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button:hover svg {
1181
+ opacity: 1 !important;
1182
+ }
1183
+ .video-js.skin_news .vjs-control-bar .vjs-remaining-time.vjs-time-control.vjs-control{
1184
+ opacity: 0.7 !important;
1185
+ }
1186
+ .video-js.skin_news .vjs-control-bar .vjs-remaining-time.vjs-time-control.vjs-control:hover{
1187
+ opacity: 1 !important;
1188
+ }
1189
+
1190
+ .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
1224
1191
  color: rgba(255, 255, 2555, 0.7)!important;
1225
1192
  }
1226
1193
 
1227
- .video-js.skin_news_live .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
1194
+ .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
1228
1195
  color: rgba(255, 255, 2555, 1)!important;
1229
1196
  }
1230
1197
 
1231
1198
 
1232
1199
 
1233
- .video-js.skin_mini .vjs-button>.vjs-icon-placeholder:before {
1234
- font-size: 2.2em;
1235
- line-height: 2.6;
1236
- }
1237
- .video-js.skin_mini{
1238
- overflow: hidden;
1239
- }
1240
- .video-js.skin_mini .vjs-control-bar{
1241
- z-index: 1 !important;
1242
- height: 4em !important;
1243
- background: black !important;
1244
- }
1245
1200
 
1246
- .video-js.skin_mini .vjs-fade>* {
1247
- visibility: hidden !important;
1248
- opacity: 0 !important;
1249
- transition: visibility 1s, opacity 1s !important;
1201
+ .video-js.skin_cn_news .vjs-control-bar {
1202
+ z-index: 1 !important;
1203
+ height: auto !important;
1204
+ padding: 0.8em 30px 0.6em;
1205
+ background: transparent !important;
1206
+ display: flex;
1207
+ flex-wrap: wrap;
1208
+ align-items: center;
1209
+ column-gap: 10px;
1250
1210
  }
1251
1211
 
1252
- .video-js.skin_mini .custom-spaced-progress-bar {
1212
+
1213
+ .video-js.skin_cn_news .vjs-control-bar::before {
1214
+ content: '';
1253
1215
  position: absolute;
1254
- width: 100%;
1255
- display: flex;
1256
- height: 0.5em;
1257
- top: -0.5em;
1216
+ left: 0;
1217
+ right: 0;
1218
+ bottom: 0;
1219
+ top: -3em;
1220
+ background: linear-gradient(
1221
+ to top,
1222
+ rgba(0, 0, 0, 0.85) 0%,
1223
+ rgba(0, 0, 0, 0.7) 40%,
1224
+ rgba(0, 0, 0, 0.55) 70%,
1225
+ rgba(0, 0, 0, 0.38) 86%,
1226
+ transparent 100%
1227
+ );
1228
+ pointer-events: none;
1229
+ z-index: -1;
1258
1230
  }
1259
1231
 
1260
- .video-js.skin_mini .vjs-progress-control {
1261
- /* left: -6px; */
1232
+ .video-js.skin_cn_news .vjs-control-bar .vjs-progress-control {
1233
+ order: -1;
1234
+ flex: 0 0 100%;
1235
+ width: 80%;
1236
+ margin: 0 0 5em;
1262
1237
  position: relative;
1263
- width: 100%;
1264
- height: 0.5em;
1265
- transition: height 0.1s, top 0.1s;
1266
1238
  }
1267
1239
 
1240
+ .video-js.skin_cn_news .vjs-control-bar > .vjs-control,
1241
+ .video-js.skin_cn_news .vjs-control-bar > .vjs-button {
1242
+ width: auto;
1243
+ min-width: 0;
1244
+ }
1245
+ .video-js.skin_cn_news .vjs-control-bar .vjs-button {
1246
+ display: inline-flex;
1247
+ align-items: center;
1248
+ justify-content: center;
1249
+ height: 7em;
1250
+ padding: 0 10px;
1251
+ color: #fff;
1252
+ }
1268
1253
 
1254
+ .video-js.skin_cn_news .vjs-svg-icon::before {
1255
+ content: none !important;
1256
+ }
1269
1257
 
1270
1258
 
1271
- .video-js.skin_mini .vjs-custom-control-spacer {
1259
+ .video-js.skin_cn_news .vjs-control-bar .vjs-svg-icon {
1260
+ display: inline-flex;
1261
+ align-items: center;
1262
+ justify-content: center;
1263
+ }
1264
+ .video-js.skin_cn_news .vjs-control-bar .vjs-svg-icon svg,
1265
+ .video-js.skin_cn_news .vjs-rewind-button svg {
1266
+ width: 24px;
1267
+ height: 24px;
1272
1268
  display: block;
1273
- flex: 1 1 auto;
1274
1269
  }
1275
1270
 
1276
- .video-js.skin_mini .vjs-progress-control .vjs-progress-holder {
1277
- margin: 0 0px 0 0px;
1278
- }
1279
- .video-js.skin_mini .vjs-remaining-time.vjs-time-control.vjs-control{
1280
- display: none;
1281
- }
1282
1271
 
1283
- .video-js.skin_mini button.vjs-control.vjs-button.vjs-slowmo-button {
1284
- font-size: 14px;
1285
- font-weight: 500;
1286
- align-self: center;
1287
- height: min-content;
1288
- padding: 5px 2px;
1289
- border-radius: 8px;
1290
- }
1291
1272
 
1292
- .video-js.skin_mini .vjs-progress-control .vjs-progress-holder{
1293
- height: 5px !important;
1273
+ .video-js.skin_cn_news .vjs-subs-caps-button {
1274
+ opacity: 1;
1294
1275
  }
1295
1276
 
1296
- .video-js.skin_mini .vjs-play-progress:before {
1297
- font-size: 1.3em;
1298
- line-height: unset;
1299
- top: -0.3333333333em;
1300
- }
1301
-
1302
- .video-js.skin_mini .vjs-play-progress .vjs-time-tooltip {
1303
- display: none !important;
1304
- }
1305
1277
 
1306
- /* */
1307
- .video-js.skin_mini .vjs-mouse-display{
1308
- font-size: 1.6666666667em;
1309
- }
1310
1278
 
1311
- .video-js.skin_mini .vjs-progress-control:hover .vjs-progress-holder {
1312
- font-size: 1em !important;
1279
+ .video-js.skin_cn_news .vjs-volume-panel {
1280
+ margin: 0;
1281
+ display: inline-flex;
1282
+ align-items: center;
1283
+ align-self: center;
1284
+ height: 2.2em;
1285
+ min-width: 7em;
1286
+ transition: none;
1313
1287
  }
1314
-
1315
- .video-js.skin_mini .vjs-button{
1316
- width: 3em;
1288
+ .video-js.skin_cn_news .vjs-volume-panel .vjs-volume-control.vjs-volume-horizontal {
1289
+ width: 0;
1290
+ height: 100%;
1317
1291
  display: flex;
1318
1292
  align-items: center;
1319
- justify-content: center;
1293
+ overflow: hidden;
1294
+ opacity: 0;
1295
+ transition: width 0.15s ease, opacity 0.15s ease;
1320
1296
  }
1321
-
1322
-
1323
- .video-js.skin_mini .vjs-fullscreen .icon-minimize,
1324
- .icon-maximize {
1325
- display: block;
1326
- height: 32px;
1297
+ .video-js.skin_cn_news .vjs-volume-panel:hover .vjs-volume-control.vjs-volume-horizontal,
1298
+ .video-js.skin_cn_news .vjs-volume-panel:active .vjs-volume-control.vjs-volume-horizontal,
1299
+ .video-js.skin_cn_news .vjs-volume-panel.vjs-hover .vjs-volume-control.vjs-volume-horizontal,
1300
+ .video-js.skin_cn_news .vjs-volume-panel:focus-within .vjs-volume-control.vjs-volume-horizontal {
1301
+ width: 5em;
1302
+ opacity: 1;
1327
1303
  }
1328
1304
 
1329
- .video-js.skin_mini .vjs-playback-rate .vjs-playback-rate-value{
1330
- line-height: 4;
1305
+ .video-js.skin_cn_news .vjs-volume-bar {
1306
+ width: 4em;
1307
+ height: 0.3em;
1308
+ margin: 0 0.45em;
1331
1309
  }
1332
1310
 
1333
- .video-js.skin_mini .vjs-fullscreen .icon-maximize,
1334
- .icon-minimize {
1335
- display: none;
1336
- height: 32px;
1337
- }
1338
1311
 
1339
- .video-js.skin_mini button.vjs-play-control.vjs-control.vjs-button{
1340
- outline: none !important;
1341
- }
1342
- .video-js.skin_mini .vjs-fullscreen-control .vjs-icon-placeholder:before,
1343
- .vjs-icon-fullscreen-enter:before {
1344
- /* content: '' !important; */
1312
+ .video-js.skin_cn_news .vjs-volume-control .vjs-mouse-display {
1313
+ display: none !important;
1345
1314
  }
1346
1315
 
1347
- .video-js.skin_mini button.vjs-fullscreen-control.vjs-control.vjs-button {
1348
- display: flex;
1349
- justify-content: center;
1350
- align-items: center;
1351
- /* transform: rotate(90deg); */
1316
+ .video-js.skin_cn_news .vjs-mute-control.vjs-vol-0 ~ .vjs-volume-control .vjs-volume-level {
1317
+ width: 0 !important;
1352
1318
  }
1353
1319
 
1354
- .video-js.skin_mini .vjs-subs-caps-button .vjs-icon-placeholder:before{
1355
- display: none;
1356
- }
1357
- .video-js.skin_mini .vjs-volume-panel .vjs-volume-control{
1358
- margin-left: -10px;
1359
- display: none;
1360
- }
1361
1320
 
1362
- .video-js.skin_mini .vjs-loading-spinner {
1363
- position: absolute;
1364
- top: 50%;
1365
- left: 50%;
1366
- transform: translate(-50%, -50%);
1367
- opacity: .85;
1368
- text-align: left;
1369
- border: .2em solid rgba(43, 51, 63, .7);
1370
- box-sizing: border-box;
1371
- background-clip: padding-box;
1372
- width: 3em;
1373
- height: 3em;
1374
- border-radius: 50%;
1375
- visibility: hidden;
1321
+ .video-js.skin_cn_news .vjs-custom-control-spacer {
1322
+ display: block !important;
1323
+ flex: 1 1 auto;
1376
1324
  }
1377
1325
 
1378
- .video-js.skin_mini .skipbtn:hover{
1379
- cursor: pointer;
1380
- }
1381
1326
 
1382
- .video-js.skin_mini .rewindbtn:hover{
1383
- cursor: pointer;
1327
+ .video-js.skin_cn_news .vjs-big-play-button {
1328
+ display: none;
1384
1329
  }
1385
-
1386
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control{
1387
- position: relative;
1388
- padding-left: 0;
1330
+ .video-js.skin_cn_news .vjs-big-play-button .vjs-icon-placeholder:before {
1331
+ position: relative !important;
1332
+ display: flex;
1333
+ left: 0;
1334
+ top: -1px;
1389
1335
  }
1390
-
1391
- .video-js.skin_mini.vjs-paused .vjs-big-play-button {
1392
- width: 40px;
1393
- height: 40px;
1336
+ .video-js.skin_cn_news.vjs-paused:not(.vjs-seeking):not(.vjs-ended) .vjs-big-play-button {
1394
1337
  display: flex;
1395
1338
  justify-content: center;
1396
1339
  align-items: center;
1397
- border: none;
1398
1340
  position: absolute;
1399
1341
  top: 0;
1400
1342
  left: 0;
1401
1343
  right: 0;
1402
1344
  bottom: 0;
1403
1345
  margin: auto;
1404
- font-size: 3em;
1346
+ width: 80px;
1347
+ height: 80px;
1348
+ border: none;
1349
+ border-radius: 50%;
1350
+ background: rgba(0, 0, 0, 0.55);
1351
+ font-size: 5em;
1405
1352
  line-height: 1.3em;
1406
1353
  transform: none !important;
1407
- border-radius: 1.3em;
1408
1354
  }
1409
1355
 
1410
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control.vjs-at-live-edge{
1411
- font-weight: bold;
1412
- }
1413
1356
 
1414
- .video-js.skin_mini .vjs-menu > ul.vjs-menu-content{
1415
- bottom: 1.1em !important;
1416
- right: 1em;
1417
- z-index: 1;
1418
- font-size: 10px;
1357
+ .video-js.skin_cn_news .vjs-progress-control .vjs-progress-holder {
1358
+ height: 4px !important;
1359
+ margin: 0;
1360
+ border-radius: 20px;
1361
+ background-color: #393944;
1419
1362
  }
1420
1363
 
1421
- .video-js.skin_mini .vjs-chromecast-button .vjs-icon-placeholder {
1422
- width: 24px !important;
1423
- height: 24px !important;
1424
- }
1425
- .video-js.skin_mini .settings-selector-icon>svg{
1426
- height: 19px !important;
1427
- width: 19px !important;
1364
+ .video-js.skin_cn_news .vjs-play-progress {
1365
+ background-color: #ffffff;
1366
+ border-radius: 20px;
1428
1367
  }
1429
1368
 
1430
-
1431
- .video-js.skin_mini button.vjs-rewind-button{
1432
- cursor: pointer;
1369
+ .video-js.skin_cn_news .vjs-load-progress,
1370
+ .video-js.skin_cn_news .vjs-load-progress div {
1371
+ background: rgba(255, 255, 255, 0.15);
1372
+ border-radius: 20px;
1433
1373
  }
1434
1374
 
1435
- .video-js.skin_mini .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
1436
- padding-right: 0;
1437
- }
1438
1375
 
1439
- .video-js.skin_mini .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
1440
- padding-left: 0;
1376
+ .video-js.skin_cn_news .vjs-play-progress:before {
1377
+ content: '';
1378
+ width: 16px;
1379
+ height: 16px;
1380
+ border-radius: 50%;
1381
+ background: #ffffff;
1382
+ border: 2px solid rgba(0, 0, 0, 0.6);
1383
+ box-sizing: border-box;
1384
+ box-shadow: 0 0 0 2px #ffffff, 0 0 3px rgba(0, 0, 0, 0.45);
1385
+ top: -6px;
1386
+ right: -8px;
1387
+ position: absolute;
1441
1388
  }
1442
-
1443
- .video-js.skin_mini .vjs-control-bar .vjs-time-control.vjs-time-divider {
1444
- padding-left: 0;
1445
- padding-right: 0;
1446
- display: flex;
1447
- justify-content: center;
1448
- width: min-content;
1389
+ .video-js.skin_cn_news .vjs-play-progress .vjs-time-tooltip {
1390
+ display: none !important;
1449
1391
  }
1450
1392
 
1451
- .video-js.skin_mini.vjs-live .vjs-control-bar .vjs-time-control {
1452
- display: none
1453
- }
1454
- .video-js.skin_mini.vjs-liveui .vjs-control-bar .vjs-time-control {
1455
- display: none
1393
+ .video-js.skin_cn_news .vjs-mouse-display .vjs-time-tooltip {
1394
+ background: #ffffff;
1395
+ color: #0a0e17;
1396
+ font-weight: 700;
1397
+ border-radius: 3px;
1456
1398
  }
1457
1399
 
1458
- .video-js.skin_mini .vjs-control-bar .vjs-time-control {
1459
- display: flex;
1460
- align-items: center;
1461
- font-weight: 700;
1462
- font-size: 9px;
1463
- min-width: 0.8em;
1464
- padding-left: 0;
1400
+ .video-js.skin_cn_news .vjs-live-control {
1401
+ display: none !important;
1465
1402
  }
1466
-
1467
- .video-js.skin_mini .vjs-remaining-time.vjs-time-control.vjs-control {
1468
- display: none;
1469
- font-size: 11px;
1470
- justify-content: center;
1403
+ .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-control {
1404
+ display: inline-flex;
1471
1405
  align-items: center;
1472
- user-select: none;
1406
+ align-self: center;
1407
+ height: 2.2em;
1408
+ gap: 5px;
1409
+ width: auto;
1410
+ padding: 0 10px;
1411
+ border: 1px solid rgba(255, 255, 255, 0.45);
1412
+ border-radius: 4px;
1413
+ cursor: pointer;
1473
1414
  }
1474
- .video-js.skin_mini.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
1415
+
1416
+ .video-js.skin_cn_news .vjs-seek-to-live-control .vjs-icon-placeholder {
1475
1417
  display: none;
1476
1418
  }
1477
-
1478
- .video-js.skin_mini button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
1479
- height: min-content;
1480
- width: min-content;
1419
+ .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge .vjs-icon-placeholder {
1420
+ display: inline-flex;
1421
+ align-items: center;
1481
1422
  }
1482
- .video-js.skin_mini .vjs-volume-panel.vjs-volume-panel-vertical{
1483
- width: 3em;
1484
- margin-right: 4px;
1423
+ .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge .vjs-icon-placeholder::before {
1424
+ content: '';
1425
+ display: inline-block;
1426
+ width: 8px;
1427
+ height: 8px;
1428
+ border-radius: 50%;
1429
+ background: #ff2d2d; /* red live dot */
1485
1430
  }
1486
-
1487
- .video-js.skin_mini .content{
1488
- bottom: 3.4rem !important;
1489
- right: -4rem !important;
1431
+ .video-js.skin_cn_news .vjs-seek-to-live-text {
1432
+ color: #ffffff;
1433
+ font-weight: 700;
1434
+ font-size: 12px;
1435
+ letter-spacing: 0.03em;
1490
1436
  }
1491
1437
 
1492
- .video-js.skin_mini .setting-icon > svg{
1493
- height:18px !important;
1438
+ .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge {
1439
+ border-color: transparent;
1440
+ }
1441
+ .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge .vjs-seek-to-live-text {
1442
+ color: #ff2d2d;
1494
1443
  }
1495
1444
 
1496
- .output-overlay{
1497
- position: absolute;
1498
- bottom: 0;
1499
- height: 100%;
1500
- width: 100%;
1501
- z-index: 0;
1502
- border: 0;
1503
- pointer-events:none
1504
- }
1505
-
1506
- .video-js.skin_mini iframe{
1507
- width: 100%;
1508
- height: 100%;
1509
- }
1510
-
1511
- .video-js.skin_mini .vjs-live-control{
1512
- align-items: center;
1513
- max-width: 5em;
1445
+ /* ---- time controls ---- */
1446
+ .video-js.skin_cn_news .vjs-current-time,
1447
+ .video-js.skin_cn_news .vjs-duration,
1448
+ .video-js.skin_cn_news .vjs-time-divider {
1449
+ display: none !important;
1514
1450
  }
1515
- .video-js.skin_mini .vjs-live-control.vjs-control .vjs-live-display{
1516
- height: 2.2em;
1517
- display: flex;
1451
+ .video-js.skin_cn_news .vjs-remaining-time.vjs-time-control.vjs-control {
1452
+ display: none;
1518
1453
  align-items: center;
1519
- font-family: monospace;
1520
- width: 4em;
1521
1454
  justify-content: center;
1522
- background: red;
1523
- margin: 4px 0px 4px 2px;
1455
+ font-size: 11px;
1456
+ font-weight: 700;
1457
+ color: #fff;
1458
+ padding: 0 6px;
1459
+ user-select: none;
1524
1460
  }
1525
1461
 
1526
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:focus{
1527
- text-shadow: none;
1462
+
1463
+ .video-js.skin_cn_news .vjs-chapter-marker {
1464
+ z-index: 2;
1465
+ width: var(--vl-chapter-size, 8px);
1466
+ height: var(--vl-chapter-size, 8px);
1467
+ top: 50%;
1468
+ bottom: auto;
1469
+ background: var(--vl-chapter-color, #ffffff);
1470
+ opacity: var(--vl-chapter-opacity, 1);
1471
+ border-radius: 50%;
1472
+ box-shadow: 0 0 2px rgba(0, 0, 0, 0.6); /* keep white dots visible on the white bar */
1473
+ transform: translate(-50%, -50%) scale(1);
1474
+ transition: background-color 0.12s ease;
1528
1475
  }
1529
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-seek-to-live-text {
1530
- display: none;
1531
- font-size: 12px;
1476
+ .video-js.skin_cn_news .vjs-chapter-marker:hover {
1477
+ background: var(--vl-chapter-hover, #0a5cff);
1532
1478
  }
1533
-
1534
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder {
1535
- height: 1.8em;
1536
- display: inline-flex;
1537
- align-items: center;
1538
- font-family: monospace;
1539
- justify-content: center;
1540
- border: 1.5px solid;
1541
- margin: 4px 0px 4px 2px;
1542
- white-space: pre;
1543
- padding: 2px 4px;
1544
- font-size: 1.2em;
1545
- font-weight: 500;
1546
- color: rgba(255, 255, 2555, 0.7);
1479
+ .video-js.skin_cn_news .vjs-chapter-marker.vjs-chapter-marker--active {
1480
+ background: var(--vl-chapter-active, #0a5cff);
1547
1481
  }
1548
1482
 
1549
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder::before {
1550
- content: "NOT LIVE";
1551
- word-spacing: -4px;
1552
- }
1553
1483
 
1484
+ .video-js.skin_cn_news .vjs-chapter-marker .vjs-chapter-marker__icon {
1485
+ width: 16px;
1486
+ height: 16px;
1487
+ bottom: 160%;
1488
+ filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.6));
1489
+ }
1554
1490
 
1555
- @media(max-width:600px){
1556
- .tvProviderImage{
1557
- display: none
1558
- }
1559
- .video-js.skin_mini .vjs-fullscreen .icon-minimize,
1560
- .icon-maximize {
1561
- height: 30px !important;
1562
- }
1563
1491
 
1564
- .video-js.skin_mini .vjs-fullscreen .icon-maximize,
1565
- .icon-minimize {
1566
- height: 30px !important;
1567
- }
1568
- .video-js.skin_mini .vjs-volume-panel.vjs-volume-panel-vertical{
1569
- width: 3.5em;
1570
- }
1571
- .video-js.skin_mini button.vjs-fullscreen-control.vjs-control.vjs-button>span.vjs-icon-placeholder::before {
1572
- height: min-content;
1573
- }
1492
+ .video-js.skin_cn_news .vjs-chapter-preview {
1493
+ background: var(--vl-chapter-tooltip, #0a5cff);
1494
+ border-radius: 6px;
1495
+ padding: 8px 10px;
1496
+ width: max-content;
1497
+ max-width: 300px;
1498
+ text-align: left;
1499
+ box-shadow: 0 4px 14px rgba(0, 0, 0, 0.45);
1500
+ }
1501
+ .video-js.skin_cn_news .vjs-chapter-preview .vjs-chapter-preview__time {
1502
+ color: #ffffff;
1503
+ font-size: 13px;
1504
+ font-weight: 400;
1505
+ margin-bottom: 2px;
1506
+ }
1507
+ .video-js.skin_cn_news .vjs-chapter-preview .vjs-chapter-preview__label {
1508
+ color: #ffffff;
1509
+ font-size: 13px;
1510
+ font-weight: 400;
1511
+ line-height: 1.3;
1512
+ white-space: normal;
1513
+ text-align: left;
1514
+ }
1515
+ .video-js.skin_cn_news .vjs-chapter-preview .vjs-chapter-preview__pointer {
1516
+ border-top-color: var(--vl-chapter-tooltip, #0a5cff);
1517
+ }
1574
1518
 
1575
- .video-js.skin_mini button.vjs-slowmo-button{
1576
- display: none;
1577
- }
1578
- .video-js.skin_mini button.vjs-rewind-button{
1579
- display: none;
1580
- }
1581
- .video-js.skin_mini button.vjs-rewind-button>svg{
1582
- height: 20px;
1583
- }
1584
- .video-js.skin_mini .vjs-button{
1585
- width: 3em;
1519
+ /* ---- responsive ---- */
1520
+ @media (max-width: 576px) {
1521
+ .video-js.skin_cn_news .vjs-control-bar {
1522
+ height: 3.2em !important;
1523
+ padding: 0 8px;
1586
1524
  }
1587
- .video-js.skin_mini .widget-selection{
1588
- display: none;
1525
+ .video-js.skin_cn_news .vjs-control-bar .vjs-button {
1526
+ padding: 0 6px;
1589
1527
  }
1590
- .video-js.skin_mini .container{
1528
+ .video-js.skin_cn_news .vjs-control.vjs-button.vjs-picture-in-picture-control {
1591
1529
  display: none !important;
1592
1530
  }
1593
- .video-js.skin_mini .vjs-control-bar{
1594
- height: 4em !important;
1595
- }
1596
- .video-js.skin_mini .vjs-button>.vjs-icon-placeholder:before{
1597
- font-size: 2.5em;
1598
- line-height: 1.5;
1599
- }
1600
- .video-js.skin_mini .vjs-play-progress:before {
1601
- font-size: 1.2em;
1602
- position: absolute;
1603
- right: -0.5em;
1604
- z-index: 1;
1605
- }
1606
- .video-js.skin_mini button.vjs-skip-button>svg{
1607
- height: 20px;
1608
1531
  }
1609
1532
 
1610
- .stream-selector-icon>svg{
1611
- width: 24px;
1612
- height: 24px;
1533
+ .video-js.skin_news_live .vjs-button>.vjs-icon-placeholder:before {
1534
+ font-size: 2.2em;
1535
+ line-height: 2.6;
1613
1536
  }
1614
- .video-js.skin_mini .vjs-seek-to-live-text{
1615
- font-size: 12px;
1537
+ .video-js.skin_news_live .vjs-custom-big-mute.vjs-control{
1538
+ background: #fcb700;
1539
+ }
1540
+ .video-js.skin_news_live .vjs-control-bar{
1541
+ z-index: 1 !important;
1542
+ height: 5em !important;
1543
+ background: black !important;
1544
+ }
1545
+ .video-js.skin_news_live .vjs-playback-rate .vjs-playback-rate-value{
1546
+ display: flex;
1547
+ align-items: center;
1548
+ justify-content: center;
1616
1549
  }
1617
1550
 
1618
- .video-js.skin_mini .vjs-text-track-display-ttml span {
1619
- color: white !important;
1620
- font-size: 16px !important;
1621
- background-color: rgba(0,0,0,0.2) !important;
1622
- }
1551
+ .video-js.skin_news_live .vjs-fade>* {
1552
+ visibility: hidden !important;
1553
+ opacity: 0 !important;
1554
+ transition: visibility 1s, opacity 1s !important;
1623
1555
  }
1624
1556
 
1625
- .video-js.skin_mini .vjs-text-track-display-ttml span {
1626
- color: white !important;
1627
- font-size: 16px !important;
1628
- background-color: rgba(0,0,0,0.2) !important;
1557
+ .video-js.skin_news_live .custom-spaced-progress-bar {
1558
+ position: absolute;
1559
+ width: 100%;
1560
+ display: flex;
1561
+ height: 0.5em;
1562
+ top: -0.5em;
1629
1563
  }
1630
1564
 
1631
- .video-js.skin_mini .vjs-text-track-display-ttml p {
1632
- font-size: 18px !important;
1565
+ .video-js.skin_news_live .vjs-progress-control {
1566
+ /* left: -6px; */
1567
+ position: relative;
1568
+ width: 100%;
1569
+ height: 0.5em;
1570
+ transition: height 0.1s, top 0.1s;
1633
1571
  }
1634
1572
 
1635
- .video-js.skin_mini.vjs-has-started.vjs-user-active.vjs-controls-enabled .vjs-text-track-display-ttml p {
1636
- margin-bottom: 1rem !important;
1573
+ .video-js.skin_news_live .vjs-volume-panel{
1574
+ min-width: 5.3em;
1637
1575
  }
1638
1576
 
1639
1577
 
1640
- .video-js.skin_mini .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1641
- display: flex;
1642
- justify-content: center;
1643
- align-items: center;
1644
- height: 100%;
1645
- transition: width 0.1s;
1578
+
1579
+ .video-js.skin_news_live .vjs-custom-control-spacer {
1580
+ /* display: block; */
1581
+ /* flex: 1 1 auto; */
1646
1582
  }
1647
- .video-js.skin_mini .vjs-track-settings-colors fieldset.vjs-fg.vjs-track-setting{
1648
- margin: 2px;
1583
+
1584
+ .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder {
1585
+ margin: 0 0px 0 0px;
1586
+ }
1587
+ .video-js.skin_news_live .vjs-remaining-time.vjs-time-control.vjs-control{
1588
+ display: none;
1649
1589
  }
1650
1590
 
1651
- .video-js.skin_mini .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:active .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1652
- display: flex;
1653
- justify-content: center;
1654
- align-items: center;
1655
- height: 100%;
1656
- transition: width 0.1s;
1591
+ .video-js.skin_news_live button.vjs-control.vjs-button.vjs-slowmo-button {
1592
+ font-size: 14px;
1593
+ font-weight: 500;
1594
+ align-self: center;
1595
+ height: min-content;
1596
+ padding: 5px 2px;
1597
+ border-radius: 8px;
1657
1598
  }
1658
- .video-js.skin_mini .vjs-text-track-settings .vjs-modal-dialog-content{
1659
- display: grid;
1660
- font-size: 10px;
1661
- grid-template-columns: 1fr;
1662
- grid-template-rows: 1fr;
1663
- padding: 1px 0px 0 0px;
1664
- margin: 0;
1599
+
1600
+ .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder{
1601
+ height: 6px !important;
1665
1602
  }
1666
1603
 
1667
- @media (max-width: 600px) {
1668
- .video-js.skin_mini .vjs-progress-control .vjs-progress-holder{
1669
- height: 5px !important;
1670
- }
1604
+ .video-js.skin_news_live .vjs-play-progress:before {
1605
+ font-size: 1.5em;
1606
+ line-height: unset;
1607
+ top: -0.3333333333em;
1608
+ }
1671
1609
 
1672
- .video-js.skin_mini .vjs-playback-rate.vjs-menu-button.vjs-menu-button-popup.vjs-control.vjs-button{
1673
- display: none;
1674
- }
1610
+ .video-js.skin_news_live .vjs-play-progress .vjs-time-tooltip {
1611
+ display: none !important;
1612
+ }
1675
1613
 
1614
+ /* */
1615
+ .video-js.skin_news_live .vjs-mouse-display{
1616
+ font-size: 1.6666666667em;
1676
1617
  }
1677
1618
 
1678
- .video-js.skin_mini .vjs-control-bar .vjs-svg-icon{
1679
- content: none !important;
1680
- fill: none !important;
1681
- filter: none !important;
1619
+ .video-js.skin_news_live .vjs-progress-control:hover .vjs-progress-holder {
1620
+ font-size: 1em !important;
1682
1621
  }
1683
1622
 
1684
- /* svg icons opacity and hover effect */
1685
- .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button svg {
1686
- opacity: 0.7 !important;
1623
+ .video-js.skin_news_live .vjs-button{
1624
+ width: 5.3em;
1625
+ display: flex;
1626
+ align-items: center;
1627
+ justify-content: center;
1687
1628
  }
1688
1629
 
1689
- .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button:hover svg {
1690
- opacity: 1 !important;
1630
+
1631
+ .video-js.skin_news_live .vjs-fullscreen .icon-minimize,
1632
+ .icon-maximize {
1633
+ display: block;
1634
+ height: 32px;
1691
1635
  }
1692
1636
 
1693
- .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
1694
- color: rgba(255, 255, 2555, 0.7)!important;
1637
+ .video-js.skin_news_live .vjs-playback-rate .vjs-playback-rate-value{
1638
+ line-height: 4;
1695
1639
  }
1696
1640
 
1697
- .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
1698
- color: rgba(255, 255, 2555, 1)!important;
1641
+ .video-js.skin_news_live .vjs-fullscreen .icon-maximize,
1642
+ .icon-minimize {
1643
+ display: none;
1644
+ height: 32px;
1645
+ }
1646
+
1647
+ .video-js.skin_news_live button.vjs-play-control.vjs-control.vjs-button{
1648
+ outline: none !important;
1649
+ /* flex: 1; */
1650
+ }
1651
+ .video-js.skin_news_live .vjs-play-toggle-container{
1652
+ display: flex;
1653
+ flex: 1;
1654
+ justify-content: center;
1699
1655
  }
1700
1656
 
1701
1657
 
1658
+ .video-js.skin_news_live .vjs-fullscreen-control .vjs-icon-placeholder:before,
1659
+ .vjs-icon-fullscreen-enter:before {
1660
+ /* content: '' !important; */
1661
+ }
1702
1662
 
1703
- .video-js.skin_cn_news .vjs-control-bar {
1704
- z-index: 1 !important;
1705
- height: auto !important;
1706
- padding: 0.8em 30px 0.6em;
1707
- background: transparent !important;
1663
+ .video-js.skin_news_live button.vjs-fullscreen-control.vjs-control.vjs-button {
1708
1664
  display: flex;
1709
- flex-wrap: wrap;
1665
+ justify-content: center;
1710
1666
  align-items: center;
1711
- column-gap: 10px;
1667
+ /* transform: rotate(90deg); */
1712
1668
  }
1713
1669
 
1670
+ .video-js.skin_news_live .vjs-subs-caps-button .vjs-icon-placeholder:before{
1671
+ display: none;
1672
+ }
1673
+ .video-js.skin_news_live .vjs-volume-panel .vjs-volume-control{
1674
+ margin-left: -10px;
1675
+ }
1714
1676
 
1715
- .video-js.skin_cn_news .vjs-control-bar::before {
1716
- content: '';
1717
- position: absolute;
1718
- left: 0;
1719
- right: 0;
1720
- bottom: 0;
1721
- top: -3em;
1722
- background: linear-gradient(
1723
- to top,
1724
- rgba(0, 0, 0, 0.85) 0%,
1725
- rgba(0, 0, 0, 0.7) 40%,
1726
- rgba(0, 0, 0, 0.55) 70%,
1727
- rgba(0, 0, 0, 0.38) 86%,
1728
- transparent 100%
1729
- );
1730
- pointer-events: none;
1731
- z-index: -1;
1677
+ .video-js.skin_news_live .skipbtn:hover{
1678
+ cursor: pointer;
1732
1679
  }
1733
1680
 
1734
- .video-js.skin_cn_news .vjs-control-bar .vjs-progress-control {
1735
- order: -1;
1736
- flex: 0 0 100%;
1737
- width: 80%;
1738
- margin: 0 0 5em;
1681
+ .video-js.skin_news_live .rewindbtn:hover{
1682
+ cursor: pointer;
1683
+ }
1684
+
1685
+ .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control{
1739
1686
  position: relative;
1687
+ padding-left: 0;
1740
1688
  }
1741
1689
 
1742
- .video-js.skin_cn_news .vjs-control-bar > .vjs-control,
1743
- .video-js.skin_cn_news .vjs-control-bar > .vjs-button {
1744
- width: auto;
1745
- min-width: 0;
1690
+ .video-js.skin_news_live.vjs-seeking .vjs-big-play-button{
1691
+ display: none !important;
1746
1692
  }
1747
- .video-js.skin_cn_news .vjs-control-bar .vjs-button {
1748
- display: inline-flex;
1749
- align-items: center;
1750
- justify-content: center;
1751
- height: 7em;
1752
- padding: 0 10px;
1753
- color: #fff;
1693
+
1694
+ .video-js.skin_news_live.vjs-paused .vjs-big-play-button {
1695
+ /* width: 90px;
1696
+ height: 90px;
1697
+ display: flex;
1698
+ justify-content: center;
1699
+ align-items: center;
1700
+ border-radius: 50%;
1701
+ position: absolute;
1702
+ top: 0;
1703
+ left: 0;
1704
+ right: 0;
1705
+ bottom: 0;
1706
+ margin: auto;
1707
+ font-size: 6em;
1708
+ line-height: 1.4em;
1709
+ border: 0.05em solid;
1710
+ color: inherit; */
1711
+ display: none !important;
1712
+ }
1713
+ .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control{
1714
+ font-weight: bold;
1754
1715
  }
1755
1716
 
1756
- .video-js.skin_cn_news .vjs-svg-icon::before {
1757
- content: none !important;
1717
+ .video-js.skin_news_live .vjs-menu > ul.vjs-menu-content{
1718
+ bottom: 2.4em !important;
1719
+ right: -1em;
1720
+ z-index: 1;
1721
+ }
1722
+
1723
+ .video-js.skin_news_live .vjs-chromecast-button .vjs-icon-placeholder {
1724
+ width: 24px !important;
1725
+ height: 24px !important;
1726
+ }
1727
+ .settings-selector-icon>svg{
1728
+ height: 19px !important;
1729
+ width: 19px !important;
1758
1730
  }
1759
1731
 
1760
1732
 
1761
- .video-js.skin_cn_news .vjs-control-bar .vjs-svg-icon {
1762
- display: inline-flex;
1763
- align-items: center;
1764
- justify-content: center;
1765
- }
1766
- .video-js.skin_cn_news .vjs-control-bar .vjs-svg-icon svg,
1767
- .video-js.skin_cn_news .vjs-rewind-button svg {
1768
- width: 24px;
1769
- height: 24px;
1770
- display: block;
1733
+ .video-js.skin_news_live button.vjs-rewind-button{
1734
+ cursor: pointer;
1771
1735
  }
1772
1736
 
1737
+ .video-js.skin_news_live .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
1738
+ padding-right: 0;
1739
+ display: none;
1740
+ }
1773
1741
 
1774
-
1775
- .video-js.skin_cn_news .vjs-subs-caps-button {
1776
- opacity: 1;
1742
+ .video-js.skin_news_live .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
1743
+ padding-left: 0;
1744
+ display: none;
1777
1745
  }
1778
1746
 
1747
+ .video-js.skin_news_live .vjs-control-bar .vjs-time-control.vjs-time-divider {
1748
+ padding-left: 0;
1749
+ padding-right: 0;
1750
+ display: none;
1751
+ }
1779
1752
 
1753
+ .video-js.skin_news_live.vjs-live .vjs-control-bar .vjs-time-control {
1754
+ display: none
1755
+ }
1756
+ .video-js.skin_news_live.vjs-liveui .vjs-control-bar .vjs-time-control {
1757
+ display: none
1758
+ }
1780
1759
 
1781
- .video-js.skin_cn_news .vjs-volume-panel {
1782
- margin: 0;
1783
- display: inline-flex;
1760
+ .video-js.skin_news_live .vjs-control-bar .vjs-time-control {
1761
+ display: flex;
1784
1762
  align-items: center;
1785
- align-self: center;
1786
- height: 2.2em;
1787
- min-width: 7em;
1788
- transition: none;
1763
+ font-weight: 700;
1764
+ font-size: 12px;
1765
+ min-width: 1.2em;
1789
1766
  }
1790
- .video-js.skin_cn_news .vjs-volume-panel .vjs-volume-control.vjs-volume-horizontal {
1791
- width: 0;
1792
- height: 100%;
1793
- display: flex;
1767
+
1768
+ .video-js.skin_news_live .vjs-remaining-time.vjs-time-control.vjs-control {
1769
+ display: none;
1770
+ font-size: 11px;
1771
+ justify-content: center;
1794
1772
  align-items: center;
1795
- overflow: hidden;
1796
- opacity: 0;
1797
- transition: width 0.15s ease, opacity 0.15s ease;
1773
+ user-select: none;
1798
1774
  }
1799
- .video-js.skin_cn_news .vjs-volume-panel:hover .vjs-volume-control.vjs-volume-horizontal,
1800
- .video-js.skin_cn_news .vjs-volume-panel:active .vjs-volume-control.vjs-volume-horizontal,
1801
- .video-js.skin_cn_news .vjs-volume-panel.vjs-hover .vjs-volume-control.vjs-volume-horizontal,
1802
- .video-js.skin_cn_news .vjs-volume-panel:focus-within .vjs-volume-control.vjs-volume-horizontal {
1803
- width: 5em;
1804
- opacity: 1;
1775
+ .video-js.skin_news_live.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
1776
+ display: none;
1805
1777
  }
1806
1778
 
1807
- .video-js.skin_cn_news .vjs-volume-bar {
1808
- width: 4em;
1809
- height: 0.3em;
1810
- margin: 0 0.45em;
1779
+ .video-js.skin_news_live button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
1780
+ height: min-content;
1781
+ width: min-content;
1811
1782
  }
1812
-
1813
-
1814
- .video-js.skin_cn_news .vjs-volume-control .vjs-mouse-display {
1815
- display: none !important;
1783
+ .video-js.skin_news_live .vjs-volume-panel.vjs-volume-panel-vertical{
1784
+ width: 6em;
1816
1785
  }
1817
1786
 
1818
- .video-js.skin_cn_news .vjs-mute-control.vjs-vol-0 ~ .vjs-volume-control .vjs-volume-level {
1819
- width: 0 !important;
1787
+ .video-js.skin_news_live .content{
1788
+ bottom: 3.4rem !important;
1789
+ right: -4rem !important;
1820
1790
  }
1821
1791
 
1792
+ .setting-icon > svg{
1793
+ height:18px !important;
1794
+ }
1822
1795
 
1823
- .video-js.skin_cn_news .vjs-custom-control-spacer {
1824
- display: block !important;
1825
- flex: 1 1 auto;
1796
+ .output-overlay{
1797
+ position: absolute;
1798
+ bottom: 0;
1799
+ height: 100%;
1800
+ width: 100%;
1801
+ z-index: 0;
1802
+ border: 0;
1803
+ pointer-events:none
1826
1804
  }
1827
1805
 
1806
+ .video-js.skin_news_live iframe{
1807
+ width: 100%;
1808
+ height: 100%;
1809
+ }
1828
1810
 
1829
- .video-js.skin_cn_news .vjs-big-play-button {
1811
+ .video-js.skin_news_live .vjs-live-control{
1812
+ align-items: center;
1830
1813
  display: none;
1831
1814
  }
1832
- .video-js.skin_cn_news .vjs-big-play-button .vjs-icon-placeholder:before {
1833
- position: relative !important;
1834
- display: flex;
1835
- left: 0;
1836
- top: -1px;
1837
- }
1838
- .video-js.skin_cn_news.vjs-paused:not(.vjs-seeking):not(.vjs-ended) .vjs-big-play-button {
1815
+ .video-js.skin_news_live .vjs-live-control.vjs-control .vjs-live-display{
1816
+ height: 2.2em;
1839
1817
  display: flex;
1840
- justify-content: center;
1841
1818
  align-items: center;
1842
- position: absolute;
1843
- top: 0;
1844
- left: 0;
1845
- right: 0;
1846
- bottom: 0;
1847
- margin: auto;
1848
- width: 80px;
1849
- height: 80px;
1850
- border: none;
1851
- border-radius: 50%;
1852
- background: rgba(0, 0, 0, 0.55);
1853
- font-size: 5em;
1854
- line-height: 1.3em;
1855
- transform: none !important;
1819
+ font-family: monospace;
1820
+ width: 4em;
1821
+ justify-content: center;
1822
+ background: red;
1823
+ margin: 4px 0px 4px 12px;
1856
1824
  }
1857
1825
 
1858
-
1859
- .video-js.skin_cn_news .vjs-progress-control .vjs-progress-holder {
1860
- height: 4px !important;
1861
- margin: 0;
1862
- border-radius: 20px;
1863
- background-color: #393944;
1826
+ .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control:focus{
1827
+ text-shadow: none;
1864
1828
  }
1865
1829
 
1866
- .video-js.skin_cn_news .vjs-play-progress {
1867
- background-color: #ffffff;
1868
- border-radius: 20px;
1830
+ .video-js.skin_news_live .vjs-control-bar .vjs-seek-to-live-control.vjs-control{
1831
+ display: flex;
1832
+ justify-content: center;
1833
+ min-width: 5.3em;
1834
+ pointer-events: none;
1835
+ user-select: none;
1869
1836
  }
1870
1837
 
1871
- .video-js.skin_cn_news .vjs-load-progress,
1872
- .video-js.skin_cn_news .vjs-load-progress div {
1873
- background: rgba(255, 255, 255, 0.15);
1874
- border-radius: 20px;
1838
+ .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control .vjs-icon-placeholder::before{
1839
+ color: white;
1875
1840
  }
1876
1841
 
1877
1842
 
1878
- .video-js.skin_cn_news .vjs-play-progress:before {
1879
- content: '';
1880
- width: 16px;
1881
- height: 16px;
1882
- border-radius: 50%;
1883
- background: #ffffff;
1884
- border: 2px solid rgba(0, 0, 0, 0.6);
1885
- box-sizing: border-box;
1886
- box-shadow: 0 0 0 2px #ffffff, 0 0 3px rgba(0, 0, 0, 0.45);
1887
- top: -6px;
1888
- right: -8px;
1889
- position: absolute;
1890
- }
1891
- .video-js.skin_cn_news .vjs-play-progress .vjs-time-tooltip {
1892
- display: none !important;
1843
+ .settings-selection.vjs-control.vjs-button{
1844
+ display: flex !important;
1893
1845
  }
1894
1846
 
1895
- .video-js.skin_cn_news .vjs-mouse-display .vjs-time-tooltip {
1896
- background: #ffffff;
1897
- color: #0a0e17;
1898
- font-weight: 700;
1899
- border-radius: 3px;
1847
+ @media(max-width:576px){
1848
+ .settings-selection.vjs-control.vjs-button{
1849
+ display: none !important;
1850
+ }
1900
1851
  }
1901
1852
 
1902
- .video-js.skin_cn_news .vjs-live-control {
1903
- display: none !important;
1853
+
1854
+ @media(max-width:576px){
1855
+ .tvProviderImage{
1856
+ display: none
1857
+ }
1858
+ .video-js.skin_news_live .vjs-fullscreen .icon-minimize,
1859
+ .icon-maximize {
1860
+ height: 30px !important;
1861
+ }
1862
+
1863
+ .video-js.skin_news_live .vjs-fullscreen .icon-maximize,
1864
+ .icon-minimize {
1865
+ height: 30px !important;
1866
+ }
1867
+ .video-js.skin_news_live .vjs-volume-panel.vjs-volume-panel-vertical{
1868
+ width: 4.5em;
1869
+ }
1870
+ .video-js.skin_news_live button.vjs-fullscreen-control.vjs-control.vjs-button>span.vjs-icon-placeholder::before {
1871
+ height: min-content;
1872
+ }
1873
+
1874
+ .video-js.skin_news_live button.vjs-slowmo-button{
1875
+ display: none;
1876
+ }
1877
+ .video-js.skin_news_live button.vjs-rewind-button{
1878
+ display: none;
1879
+ }
1880
+ .video-js.skin_news_live button.vjs-rewind-button>svg{
1881
+ height: 20px;
1882
+ }
1883
+ .video-js.skin_news_live .vjs-button{
1884
+ width: 4.8em;
1885
+ }
1886
+ .video-js.skin_news_live .widget-selection{
1887
+ display: none;
1888
+ }
1889
+ .video-js.skin_news_live .container{
1890
+ display: none !important;
1891
+ }
1892
+ .video-js.skin_news_live .vjs-control-bar{
1893
+ height: 4em !important;
1894
+ }
1895
+ .video-js.skin_news_live .vjs-button>.vjs-icon-placeholder:before{
1896
+ font-size: 2.5em;
1897
+ line-height: 1.5;
1898
+ }
1899
+ .video-js.skin_news_live .vjs-play-progress:before {
1900
+ font-size: 1.2em;
1901
+ position: absolute;
1902
+ right: -0.5em;
1903
+ z-index: 1;
1904
1904
  }
1905
- .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-control {
1906
- display: inline-flex;
1907
- align-items: center;
1908
- align-self: center;
1909
- height: 2.2em;
1910
- gap: 5px;
1911
- width: auto;
1912
- padding: 0 10px;
1913
- border: 1px solid rgba(255, 255, 255, 0.45);
1914
- border-radius: 4px;
1915
- cursor: pointer;
1905
+ .video-js.skin_news_live button.vjs-skip-button>svg{
1906
+ height: 20px;
1907
+ }
1908
+ .video-js.skin_news_live button.vjs-big-play-button {
1909
+ width: 50px !important;
1910
+ height: 50px !important;
1911
+ font-size: 2.1rem !important;
1916
1912
  }
1917
1913
 
1918
- .video-js.skin_cn_news .vjs-seek-to-live-control .vjs-icon-placeholder {
1919
- display: none;
1920
- }
1921
- .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge .vjs-icon-placeholder {
1922
- display: inline-flex;
1923
- align-items: center;
1914
+ .stream-selector-icon>svg{
1915
+ width: 24px;
1916
+ height: 24px;
1924
1917
  }
1925
- .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge .vjs-icon-placeholder::before {
1926
- content: '';
1927
- display: inline-block;
1928
- width: 8px;
1929
- height: 8px;
1930
- border-radius: 50%;
1931
- background: #ff2d2d; /* red live dot */
1918
+ .video-js.skin_news_live.vjs-live .vjs-progress-control .vjs-progress-holder{
1919
+ margin: 0 12px 0 12px;
1932
1920
  }
1933
- .video-js.skin_cn_news .vjs-seek-to-live-text {
1934
- color: #ffffff;
1935
- font-weight: 700;
1921
+ .video-js.skin_news_live .vjs-seek-to-live-text{
1936
1922
  font-size: 12px;
1937
- letter-spacing: 0.03em;
1938
1923
  }
1939
-
1940
- .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge {
1941
- border-color: transparent;
1924
+ .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder {
1925
+ margin: 0 12px 0 12px;
1942
1926
  }
1943
- .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge .vjs-seek-to-live-text {
1944
- color: #ff2d2d;
1945
1927
  }
1946
-
1947
- /* ---- time controls ---- */
1948
- .video-js.skin_cn_news .vjs-current-time,
1949
- .video-js.skin_cn_news .vjs-duration,
1950
- .video-js.skin_cn_news .vjs-time-divider {
1951
- display: none !important;
1928
+ .video-js.skin_news_live.vjs-paused .vjs-big-play-button {
1929
+ width: 90px;
1930
+ height: 90px;
1931
+ display: flex;
1932
+ justify-content: center;
1933
+ align-items: center;
1934
+ border-radius: 50%;
1935
+ position: absolute;
1936
+ top: 0;
1937
+ left: 0;
1938
+ right: 0;
1939
+ bottom: 0;
1940
+ margin: auto;
1941
+ font-size: 6em;
1942
+ line-height: 1.4em;
1952
1943
  }
1953
- .video-js.skin_cn_news .vjs-remaining-time.vjs-time-control.vjs-control {
1954
- display: none;
1944
+
1945
+ .video-js.skin_news_live .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1946
+ display: flex;
1947
+ justify-content: center;
1955
1948
  align-items: center;
1949
+ height: 100%;
1950
+ transition: width 0.1s;
1951
+ }
1952
+
1953
+ .video-js.skin_news_live .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1954
+ display: flex;
1956
1955
  justify-content: center;
1957
- font-size: 11px;
1958
- font-weight: 700;
1959
- color: #fff;
1960
- padding: 0 6px;
1961
- user-select: none;
1956
+ align-items: center;
1957
+ height: 100%;
1958
+ transition: width 0.1s;
1959
+ }
1960
+ .video-js.skin_news_live.vjs-fullscreen .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
1961
+ display: none !important;
1962
1962
  }
1963
1963
 
1964
+ @media (max-width: 576px) {
1965
+ .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder{
1966
+ height: 5px !important;
1967
+ }
1968
+ .video-js.skin_news_live button.vjs-big-play-button {
1969
+ width: 50px !important;
1970
+ height: 50px !important;
1971
+ font-size: 2.1rem !important;
1972
+ }
1964
1973
 
1965
- .video-js.skin_cn_news .vjs-chapter-marker {
1966
- z-index: 2;
1967
- width: var(--vl-chapter-size, 8px);
1968
- height: var(--vl-chapter-size, 8px);
1969
- top: 50%;
1970
- bottom: auto;
1971
- background: var(--vl-chapter-color, #ffffff);
1972
- opacity: var(--vl-chapter-opacity, 1);
1973
- border-radius: 50%;
1974
- box-shadow: 0 0 2px rgba(0, 0, 0, 0.6); /* keep white dots visible on the white bar */
1975
- transform: translate(-50%, -50%) scale(1);
1976
- transition: background-color 0.12s ease;
1977
- }
1978
- .video-js.skin_cn_news .vjs-chapter-marker:hover {
1979
- background: var(--vl-chapter-hover, #0a5cff);
1974
+ .vjs-playback-rate.vjs-menu-button.vjs-menu-button-popup.vjs-control.vjs-button{
1975
+ display: none;
1976
+ }
1977
+ .video-js.skin_news_live .vjs-menu > ul.vjs-menu-content {
1978
+ bottom: 2.4em !important;
1979
+ right: -1em;
1980
+ z-index: 1;
1980
1981
  }
1981
- .video-js.skin_cn_news .vjs-chapter-marker.vjs-chapter-marker--active {
1982
- background: var(--vl-chapter-active, #0a5cff);
1982
+ .video-js.skin_news_live .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
1983
+ display: none !important;
1984
+ }
1985
+
1986
+ .video-js.skin_news_live .vjs-text-track-display-ttml span {
1987
+ color: white !important;
1988
+ font-size: 13px !important;
1989
+ background-color: black !important;
1990
+ }
1983
1991
  }
1984
1992
 
1993
+ .video-js.skin_news_live .vjs-text-track-display-ttml {
1994
+ width: 100% !important;
1995
+ }
1985
1996
 
1986
- .video-js.skin_cn_news .vjs-chapter-marker .vjs-chapter-marker__icon {
1987
- width: 16px;
1988
- height: 16px;
1989
- bottom: 160%;
1990
- filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.6));
1997
+ .video-js.skin_news_live .vjs-text-track-display-ttml span {
1998
+ color: white !important;
1999
+ font-size: 16px !important;
2000
+ background-color: black !important;
1991
2001
  }
1992
2002
 
2003
+ .video-js.skin_news_live.vjs-has-started.vjs-user-active.vjs-controls-enabled .vjs-text-track-display-ttml p {
2004
+ margin-bottom: 2rem !important;
2005
+ }
1993
2006
 
1994
- .video-js.skin_cn_news .vjs-chapter-preview {
1995
- background: var(--vl-chapter-tooltip, #0a5cff);
1996
- border-radius: 6px;
1997
- padding: 8px 10px;
1998
- width: max-content;
1999
- max-width: 300px;
2000
- text-align: left;
2001
- box-shadow: 0 4px 14px rgba(0, 0, 0, 0.45);
2007
+ .video-js.skin_news_live .vjs-text-track-display-ttml p {
2008
+ font-size: 18px !important;
2002
2009
  }
2003
- .video-js.skin_cn_news .vjs-chapter-preview .vjs-chapter-preview__time {
2004
- color: #ffffff;
2005
- font-size: 13px;
2006
- font-weight: 400;
2007
- margin-bottom: 2px;
2010
+
2011
+
2012
+ .video-js.skin_news_live .vjs-text-track-settings .vjs-track-settings-controls .vjs-default-button,
2013
+ .video-js.skin_news_live .vjs-text-track-settings .vjs-track-settings-controls .vjs-done-button {
2014
+ font-size: 1.2em !important;
2015
+ line-height: 1.5em !important;
2016
+ padding: 0.2em 0.8em !important;
2008
2017
  }
2009
- .video-js.skin_cn_news .vjs-chapter-preview .vjs-chapter-preview__label {
2010
- color: #ffffff;
2011
- font-size: 13px;
2012
- font-weight: 400;
2013
- line-height: 1.3;
2014
- white-space: normal;
2015
- text-align: left;
2018
+
2019
+ .video-js.skin_news_live .vjs-control-bar .vjs-svg-icon{
2020
+ content: none !important;
2021
+ fill: none !important;
2022
+ filter: none !important;
2016
2023
  }
2017
- .video-js.skin_cn_news .vjs-chapter-preview .vjs-chapter-preview__pointer {
2018
- border-top-color: var(--vl-chapter-tooltip, #0a5cff);
2024
+
2025
+ .video-js.skin_news_live .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
2026
+ color: rgba(255, 255, 2555, 0.7)!important;
2019
2027
  }
2020
2028
 
2021
- /* ---- responsive ---- */
2022
- @media (max-width: 576px) {
2023
- .video-js.skin_cn_news .vjs-control-bar {
2024
- height: 3.2em !important;
2025
- padding: 0 8px;
2026
- }
2027
- .video-js.skin_cn_news .vjs-control-bar .vjs-button {
2028
- padding: 0 6px;
2029
- }
2030
- .video-js.skin_cn_news .vjs-control.vjs-button.vjs-picture-in-picture-control {
2031
- display: none !important;
2032
- }
2029
+ .video-js.skin_news_live .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
2030
+ color: rgba(255, 255, 2555, 1)!important;
2033
2031
  }
2034
2032
 
2033
+
2034
+
2035
2035
  /* CSS for videojs-dvr-seekbar */
2036
2036
 
2037
2037
  .video-js.vjs-dvr-seekbar {
@@ -2212,7 +2212,6 @@
2212
2212
 
2213
2213
 
2214
2214
 
2215
-
2216
2215
  .video-js .multicamera-parent.default{
2217
2216
  height: 345px;
2218
2217
  position: absolute;
@@ -2293,6 +2292,8 @@
2293
2292
 
2294
2293
 
2295
2294
 
2295
+
2296
+
2296
2297
  .vjs-custom-big-mute.vjs-control{
2297
2298
  position: absolute;
2298
2299
  align-items: center;
@@ -2342,7 +2343,6 @@
2342
2343
  }
2343
2344
 
2344
2345
 
2345
-
2346
2346
  /* nextep — up-next card (centered in player, scales with player size) */
2347
2347
  .video-js:has(.next-ep-preview),
2348
2348
  .video-js:has(.next-ep-preview-player-thumb) {
@@ -2631,38 +2631,6 @@
2631
2631
  z-index: 30 !important;
2632
2632
  }
2633
2633
 
2634
- /* a wrapper element that tracks the mouse vertically */
2635
- .vjs-thumbnail-holder {
2636
- position: absolute;
2637
- left: -1000px;
2638
- }
2639
-
2640
- /* the thumbnail image itself */
2641
- .vjs-thumbnail {
2642
- position: absolute;
2643
- left: 0;
2644
- bottom: 1.3em;
2645
- opacity: 0;
2646
- transition: opacity .2s ease;
2647
- -webkit-transition: opacity .2s ease;
2648
- -moz-transition: opacity .2s ease;
2649
- -mz-transition: opacity .2s ease;
2650
- }
2651
-
2652
- /* fade in the thumbnail when hovering over the progress bar */
2653
- /* .fake-active is needed for Android only. It's removed on touchend/touchecancel */
2654
- .vjs-progress-control:hover .vjs-thumbnail,
2655
- .vjs-progress-control.fake-active .vjs-thumbnail,
2656
- .vjs-progress-control:active .vjs-thumbnail {
2657
- opacity: 1;
2658
- }
2659
-
2660
- /* ... but hide the thumbnail when hovering directly over it */
2661
- .vjs-progress-control:hover .vjs-thumbnail:hover,
2662
- .vjs-progress-control:active .vjs-thumbnail:active {
2663
- opacity: 0;
2664
- }
2665
-
2666
2634
  .video-js.vjs-quality-menu {
2667
2635
  display: block;
2668
2636
  }
@@ -2733,6 +2701,38 @@
2733
2701
  -webkit-animation: vjs-spinner-spin 1.1s cubic-bezier(0.6, 0.2, 0, 0.8) infinite;
2734
2702
  animation: vjs-spinner-spin 1.1s cubic-bezier(0.6, 0.2, 0, 0.8) infinite;
2735
2703
  }
2704
+ /* a wrapper element that tracks the mouse vertically */
2705
+ .vjs-thumbnail-holder {
2706
+ position: absolute;
2707
+ left: -1000px;
2708
+ }
2709
+
2710
+ /* the thumbnail image itself */
2711
+ .vjs-thumbnail {
2712
+ position: absolute;
2713
+ left: 0;
2714
+ bottom: 1.3em;
2715
+ opacity: 0;
2716
+ transition: opacity .2s ease;
2717
+ -webkit-transition: opacity .2s ease;
2718
+ -moz-transition: opacity .2s ease;
2719
+ -mz-transition: opacity .2s ease;
2720
+ }
2721
+
2722
+ /* fade in the thumbnail when hovering over the progress bar */
2723
+ /* .fake-active is needed for Android only. It's removed on touchend/touchecancel */
2724
+ .vjs-progress-control:hover .vjs-thumbnail,
2725
+ .vjs-progress-control.fake-active .vjs-thumbnail,
2726
+ .vjs-progress-control:active .vjs-thumbnail {
2727
+ opacity: 1;
2728
+ }
2729
+
2730
+ /* ... but hide the thumbnail when hovering directly over it */
2731
+ .vjs-progress-control:hover .vjs-thumbnail:hover,
2732
+ .vjs-progress-control:active .vjs-thumbnail:active {
2733
+ opacity: 0;
2734
+ }
2735
+
2736
2736
  .vjs-poster {
2737
2737
  display: inline-block;
2738
2738
  vertical-align: middle;