@viewlift/player-backup 2.0.275-backup → 2.0.277-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 (59) hide show
  1. package/cjs/{autoNextVideo-1794b788.js → autoNextVideo-ac28d2b9.js} +1 -1
  2. package/cjs/bundle.css +886 -655
  3. package/cjs/{features-d3baf5d9.js → features-e4017545.js} +1 -1
  4. package/cjs/generic-b1efe604.js +1 -0
  5. package/cjs/index-a178b333.js +1 -0
  6. package/cjs/{index-4beab557.js → index-e0c80240.js} +1 -1
  7. package/cjs/index.js +1 -1
  8. package/cjs/{multicamv2-f34a3e39.js → multicamv2-45a773a2.js} +1 -1
  9. package/cjs/{multicamv2-c917d820.js → multicamv2-ccee57f1.js} +1 -1
  10. package/cjs/{nextEpisodeButton-c8f1efd7.js → nextEpisodeButton-53ffc62b.js} +1 -1
  11. package/cjs/{playlist-c0a0170b.js → playlist-4a808d44.js} +1 -1
  12. package/cjs/{series-2e528555.js → series-111c723a.js} +1 -1
  13. package/cjs/{series-v2-b0b5cd9b.js → series-v2-c2be6eb6.js} +1 -1
  14. package/cjs/{series-v2-b17766c3.js → series-v2-d1d3245e.js} +1 -1
  15. package/cjs/{skin-31044cbc.js → skin-09625e52.js} +1 -1
  16. package/cjs/{skin-79e572a1.js → skin-198615d4.js} +1 -1
  17. package/cjs/{skin-0877d248.js → skin-34238400.js} +1 -1
  18. package/cjs/{skin-7e1fdb53.js → skin-6ee23c65.js} +1 -1
  19. package/cjs/{skin-0d14f786.js → skin-805e035d.js} +1 -1
  20. package/cjs/{skin-43f83728.js → skin-a35bb361.js} +1 -1
  21. package/cjs/{skin-2e365879.js → skin-af03307b.js} +1 -1
  22. package/cjs/{skin-8b6090c1.js → skin-d00de581.js} +1 -1
  23. package/cjs/{skin-803a1a7e.js → skin-d3afa145.js} +1 -1
  24. package/cjs/{util-7d9efa62.js → util-5aef53ed.js} +1 -1
  25. package/cjs/{videoSelector-8020153f.js → videoSelector-4244724a.js} +1 -1
  26. package/cjs/{videoSelector-3080cb9c.js → videoSelector-a445d0f0.js} +1 -1
  27. package/esm/{autoNextVideo-9a8932fe.js → autoNextVideo-ecd9516c.js} +1 -1
  28. package/esm/bundle.css +886 -655
  29. package/esm/components/next-ep-preview/next-ep-preview-backdrop.d.ts +5 -0
  30. package/esm/{features-4f718442.js → features-c47e31be.js} +1 -1
  31. package/esm/generic-1dab1dd7.js +1 -0
  32. package/esm/{index-b2e21252.js → index-9ad45b9f.js} +1 -1
  33. package/esm/index-bba29ff7.js +1 -0
  34. package/esm/index.js +1 -1
  35. package/esm/{multicamv2-81fd9a58.js → multicamv2-8732ca5f.js} +1 -1
  36. package/esm/{multicamv2-45f785a3.js → multicamv2-f90360ea.js} +1 -1
  37. package/esm/{nextEpisodeButton-7b1a1c73.js → nextEpisodeButton-64117f65.js} +1 -1
  38. package/esm/{playlist-7aa35809.js → playlist-aaf5934e.js} +1 -1
  39. package/esm/{series-75390e7e.js → series-1ac7db2b.js} +1 -1
  40. package/esm/{series-v2-78e1fd20.js → series-v2-9e4bd723.js} +1 -1
  41. package/esm/{series-v2-ac84d790.js → series-v2-c9ab640b.js} +1 -1
  42. package/esm/{skin-7572f1fa.js → skin-26b1a252.js} +1 -1
  43. package/esm/{skin-bda754fc.js → skin-2d1b9dce.js} +1 -1
  44. package/esm/{skin-1d68434e.js → skin-387ebd2a.js} +1 -1
  45. package/esm/{skin-c9583e71.js → skin-5e0fba94.js} +1 -1
  46. package/esm/{skin-c7c62107.js → skin-732ec4f4.js} +1 -1
  47. package/esm/{skin-7908c8ed.js → skin-8949e023.js} +1 -1
  48. package/esm/{skin-1264cc1e.js → skin-b5551178.js} +1 -1
  49. package/esm/{skin-c57c24fb.js → skin-dd3886b7.js} +1 -1
  50. package/esm/{skin-16d011b2.js → skin-ee3380b1.js} +1 -1
  51. package/esm/{util-e1ca0d8f.js → util-9cb953bb.js} +1 -1
  52. package/esm/{videoSelector-38e01f05.js → videoSelector-6a24a43c.js} +1 -1
  53. package/esm/{videoSelector-c9f706e4.js → videoSelector-a45d99aa.js} +1 -1
  54. package/package.json +1 -4
  55. package/viewlift-player-backup-2.0.277.tgz +0 -0
  56. package/cjs/generic-19eead80.js +0 -1
  57. package/cjs/index-8269a890.js +0 -1
  58. package/esm/generic-5b9a9f76.js +0 -1
  59. package/esm/index-03385e95.js +0 -1
package/esm/bundle.css CHANGED
@@ -1,6 +1,204 @@
1
1
 
2
2
 
3
3
 
4
+ .video-js.skin_vlone .vjs-control-bar .vjs-progress-control.vjs-control {
5
+ height: 0.7em;
6
+ position: absolute;
7
+ top: -0.7em;
8
+ width: 100%;
9
+ }
10
+
11
+ .video-js.skin_vlone .vjs-progress-holder.vjs-slider.vjs-slider-horizontal {
12
+ height: 100%;
13
+ }
14
+
15
+ .video-js.skin_vlone .vjs-playback-rate .vjs-playback-rate-value{
16
+ line-height: 2.5;
17
+ }
18
+
19
+ .video-js.skin_vlone button.vjs-control.vjs-button.vjs-rewind-button > svg{
20
+ height: 19px;
21
+ width: 19px;
22
+ cursor: pointer;
23
+ }
24
+ .video-js.skin_vlone .vjs-control {
25
+ user-select: none;
26
+ }
27
+ .video-js.skin_vlone .vjs-custom-control-spacer{
28
+ user-select: none;
29
+ }
30
+
31
+ .video-js.skin_vlone button.vjs-control.vjs-button.vjs-skip-button > svg{
32
+ height: 19px;
33
+ width: 19px;
34
+ cursor: pointer;
35
+ }
36
+
37
+ .video-js.skin_vlone .vjs-play-progress:before {
38
+ display: none !important;
39
+ }
40
+
41
+ .video-js.skin_vlone .vjs-progress-control>.vjs-progress-holder.vjs-slider {
42
+ margin: 0 !important;
43
+
44
+ }
45
+
46
+
47
+ .video-js.skin_vlone .vjs-custom-control-spacer {
48
+ display: block;
49
+ flex: 1 1 auto;
50
+ }
51
+
52
+ .video-js.skin_vlone .vjs-volume-panel.vjs-volume-panel-vertical{
53
+ z-index: 1;
54
+ }
55
+
56
+
57
+ .video-js.skin_vlone .vjs-control-bar {
58
+ height: 40px;
59
+ }
60
+
61
+ .video-js.skin_vlone .vjs-big-play-button .vjs-icon-placeholder:before,
62
+ .vjs-button>.vjs-icon-placeholder:before {
63
+ position: relative !important;
64
+ }
65
+ .video-js.skin_vlone .vjs-big-play-button .vjs-icon-placeholder:before{
66
+ display: flex;
67
+ left: 0px;
68
+ top: -1px;
69
+ }
70
+
71
+ .vjs-button>.vjs-icon-placeholder:before {
72
+ font-size: 2em !important;
73
+ }
74
+
75
+ .video-js.skin_vlone .vjs-control {
76
+ width: 4.3em;
77
+ }
78
+
79
+ .vjs-menu-button-popup .vjs-menu {
80
+ bottom: 10px !important;
81
+ }
82
+
83
+
84
+ .video-js.skin_vlone .vjs-control-bar .vjs-progress-control.vjs-control:hover {
85
+ height: 1.3em;
86
+ position: absolute;
87
+ top: -1.3em;
88
+ transition: height 0.3s, top 0.3s;
89
+ }
90
+
91
+
92
+ .video-js.skin_vlone.vjs-live .vjs-time-control{
93
+ display: none !important;
94
+ }
95
+
96
+ .video-js.skin_vlone .vjs-time-control {
97
+ display: block;
98
+ }
99
+ .video-js.skin_vlone .vjs-remaining-time {
100
+ display: none;
101
+ }
102
+
103
+ .video-js.skin_vlone .vjs-remaining-time.vjs-time-control.vjs-control>span.vjs-remaining-time-display {
104
+ line-height: 3.5em;
105
+ font-size: 1.1em;
106
+ min-width: 4em;
107
+ }
108
+
109
+ .video-js.skin_vlone .vjs-time-divider > div{
110
+ display: flex;
111
+ justify-content: center;
112
+ }
113
+
114
+ .video-js.skin_vlone .vjs-live-control{
115
+ align-items: center;
116
+ }
117
+ .video-js.skin_vlone .vjs-live-display{
118
+ height: 2.2em;
119
+ display: flex;
120
+ align-items: center;
121
+ font-family: monospace;
122
+ width: 4em;
123
+ justify-content: center;
124
+ background: red;
125
+ margin: 4px 0px 4px 12px;
126
+ }
127
+ .video-js.skin_vlone .vjs-live-display:hover{
128
+ cursor: pointer;
129
+ }
130
+
131
+ .video-js.skin_vlone .vjs-time-control {
132
+ line-height: 3.5em !important;
133
+ font-size: 1.1em !important;
134
+ width: min-content !important;
135
+ min-width: 1.5em;
136
+ padding: 0 !important;
137
+ user-select: none;
138
+ }
139
+
140
+ .video-js.skin_vlone .vjs-current-time.vjs-time-control.vjs-control {
141
+ margin-left: 16px !important;
142
+ }
143
+
144
+ .video-js.skin_vlone .vjs-text-track-settings .vjs-track-settings-controls .vjs-default-button,
145
+ .video-js.skin_vlone .vjs-text-track-settings .vjs-track-settings-controls .vjs-done-button {
146
+ font-size: 1.2em !important;
147
+ line-height: 1.5em !important;
148
+ padding: 0.2em 0.8em !important;
149
+ }
150
+
151
+
152
+ /* Big play */
153
+ .video-js.skin_vlone.vjs-paused .vjs-big-play-button {
154
+ width: 80px;
155
+ height: 80px;
156
+ display: flex;
157
+ justify-content: center;
158
+ align-items: center;
159
+ border: none;
160
+ position: absolute;
161
+ top: 0;
162
+ left: 0;
163
+ right: 0;
164
+ bottom: 0;
165
+ margin: auto;
166
+ font-size: 5em;
167
+ line-height: 1.3em;
168
+ transform: none !important;
169
+ border-radius: 1.3em;
170
+ }
171
+ .video-js.skin_vlone .ssai-ad-container{
172
+ position: absolute;
173
+ bottom: 4px;
174
+ }
175
+
176
+ @media(max-width:600px){
177
+ .video-js.skin_vlone button.vjs-big-play-button {
178
+ width: 50px !important;
179
+ height: 50px !important;
180
+ font-size: 2.1rem !important;
181
+ }
182
+
183
+ .video-js.skin_vlone .ssai-ad-container {
184
+ position: absolute;
185
+ bottom: 2px;
186
+ }
187
+ .video-js.skin_vlone .vjs-playback-rate .vjs-playback-rate-value {
188
+ display: none;
189
+ }
190
+
191
+ .video-js.skin_vlone button.vjs-control.vjs-button.vjs-rewind-button>svg {
192
+ display: none;
193
+ }
194
+
195
+ .video-js.skin_vlone button.vjs-control.vjs-button.vjs-skip-button>svg {
196
+ display: none;
197
+ }
198
+ }
199
+
200
+
201
+
4
202
 
5
203
  .video-js.skin_news_live .vjs-button>.vjs-icon-placeholder:before {
6
204
  font-size: 2.2em;
@@ -504,258 +702,57 @@
504
702
 
505
703
 
506
704
 
507
- .video-js.skin_vlone .vjs-control-bar .vjs-progress-control.vjs-control {
508
- height: 0.7em;
509
- position: absolute;
510
- top: -0.7em;
511
- width: 100%;
705
+ .video-js.skin_mini .vjs-button>.vjs-icon-placeholder:before {
706
+ font-size: 2.2em;
707
+ line-height: 2.6;
512
708
  }
513
-
514
- .video-js.skin_vlone .vjs-progress-holder.vjs-slider.vjs-slider-horizontal {
515
- height: 100%;
709
+ .video-js.skin_mini{
710
+ overflow: hidden;
516
711
  }
517
-
518
- .video-js.skin_vlone .vjs-playback-rate .vjs-playback-rate-value{
519
- line-height: 2.5;
712
+ .video-js.skin_mini .vjs-control-bar{
713
+ z-index: 1 !important;
714
+ height: 4em !important;
715
+ background: black !important;
520
716
  }
521
717
 
522
- .video-js.skin_vlone button.vjs-control.vjs-button.vjs-rewind-button > svg{
523
- height: 19px;
524
- width: 19px;
525
- cursor: pointer;
526
- }
527
- .video-js.skin_vlone .vjs-control {
528
- user-select: none;
529
- }
530
- .video-js.skin_vlone .vjs-custom-control-spacer{
531
- user-select: none;
718
+ .video-js.skin_mini .vjs-fade>* {
719
+ visibility: hidden !important;
720
+ opacity: 0 !important;
721
+ transition: visibility 1s, opacity 1s !important;
532
722
  }
533
723
 
534
- .video-js.skin_vlone button.vjs-control.vjs-button.vjs-skip-button > svg{
535
- height: 19px;
536
- width: 19px;
537
- cursor: pointer;
724
+ .video-js.skin_mini .custom-spaced-progress-bar {
725
+ position: absolute;
726
+ width: 100%;
727
+ display: flex;
728
+ height: 0.5em;
729
+ top: -0.5em;
538
730
  }
539
731
 
540
- .video-js.skin_vlone .vjs-play-progress:before {
541
- display: none !important;
732
+ .video-js.skin_mini .vjs-progress-control {
733
+ /* left: -6px; */
734
+ position: relative;
735
+ width: 100%;
736
+ height: 0.5em;
737
+ transition: height 0.1s, top 0.1s;
542
738
  }
543
739
 
544
- .video-js.skin_vlone .vjs-progress-control>.vjs-progress-holder.vjs-slider {
545
- margin: 0 !important;
546
740
 
547
- }
548
741
 
549
742
 
550
- .video-js.skin_vlone .vjs-custom-control-spacer {
551
- display: block;
552
- flex: 1 1 auto;
553
- }
554
-
555
- .video-js.skin_vlone .vjs-volume-panel.vjs-volume-panel-vertical{
556
- z-index: 1;
557
- }
558
-
559
-
560
- .video-js.skin_vlone .vjs-control-bar {
561
- height: 40px;
562
- }
563
-
564
- .video-js.skin_vlone .vjs-big-play-button .vjs-icon-placeholder:before,
565
- .vjs-button>.vjs-icon-placeholder:before {
566
- position: relative !important;
567
- }
568
- .video-js.skin_vlone .vjs-big-play-button .vjs-icon-placeholder:before{
569
- display: flex;
570
- left: 0px;
571
- top: -1px;
572
- }
573
-
574
- .vjs-button>.vjs-icon-placeholder:before {
575
- font-size: 2em !important;
576
- }
577
-
578
- .video-js.skin_vlone .vjs-control {
579
- width: 4.3em;
580
- }
581
-
582
- .vjs-menu-button-popup .vjs-menu {
583
- bottom: 10px !important;
584
- }
585
-
586
-
587
- .video-js.skin_vlone .vjs-control-bar .vjs-progress-control.vjs-control:hover {
588
- height: 1.3em;
589
- position: absolute;
590
- top: -1.3em;
591
- transition: height 0.3s, top 0.3s;
592
- }
593
-
594
-
595
- .video-js.skin_vlone.vjs-live .vjs-time-control{
596
- display: none !important;
597
- }
598
-
599
- .video-js.skin_vlone .vjs-time-control {
600
- display: block;
601
- }
602
- .video-js.skin_vlone .vjs-remaining-time {
603
- display: none;
604
- }
605
-
606
- .video-js.skin_vlone .vjs-remaining-time.vjs-time-control.vjs-control>span.vjs-remaining-time-display {
607
- line-height: 3.5em;
608
- font-size: 1.1em;
609
- min-width: 4em;
610
- }
611
-
612
- .video-js.skin_vlone .vjs-time-divider > div{
613
- display: flex;
614
- justify-content: center;
615
- }
616
-
617
- .video-js.skin_vlone .vjs-live-control{
618
- align-items: center;
619
- }
620
- .video-js.skin_vlone .vjs-live-display{
621
- height: 2.2em;
622
- display: flex;
623
- align-items: center;
624
- font-family: monospace;
625
- width: 4em;
626
- justify-content: center;
627
- background: red;
628
- margin: 4px 0px 4px 12px;
629
- }
630
- .video-js.skin_vlone .vjs-live-display:hover{
631
- cursor: pointer;
632
- }
633
-
634
- .video-js.skin_vlone .vjs-time-control {
635
- line-height: 3.5em !important;
636
- font-size: 1.1em !important;
637
- width: min-content !important;
638
- min-width: 1.5em;
639
- padding: 0 !important;
640
- user-select: none;
641
- }
642
-
643
- .video-js.skin_vlone .vjs-current-time.vjs-time-control.vjs-control {
644
- margin-left: 16px !important;
645
- }
646
-
647
- .video-js.skin_vlone .vjs-text-track-settings .vjs-track-settings-controls .vjs-default-button,
648
- .video-js.skin_vlone .vjs-text-track-settings .vjs-track-settings-controls .vjs-done-button {
649
- font-size: 1.2em !important;
650
- line-height: 1.5em !important;
651
- padding: 0.2em 0.8em !important;
652
- }
653
-
654
-
655
- /* Big play */
656
- .video-js.skin_vlone.vjs-paused .vjs-big-play-button {
657
- width: 80px;
658
- height: 80px;
659
- display: flex;
660
- justify-content: center;
661
- align-items: center;
662
- border: none;
663
- position: absolute;
664
- top: 0;
665
- left: 0;
666
- right: 0;
667
- bottom: 0;
668
- margin: auto;
669
- font-size: 5em;
670
- line-height: 1.3em;
671
- transform: none !important;
672
- border-radius: 1.3em;
673
- }
674
- .video-js.skin_vlone .ssai-ad-container{
675
- position: absolute;
676
- bottom: 4px;
677
- }
678
-
679
- @media(max-width:600px){
680
- .video-js.skin_vlone button.vjs-big-play-button {
681
- width: 50px !important;
682
- height: 50px !important;
683
- font-size: 2.1rem !important;
684
- }
685
-
686
- .video-js.skin_vlone .ssai-ad-container {
687
- position: absolute;
688
- bottom: 2px;
689
- }
690
- .video-js.skin_vlone .vjs-playback-rate .vjs-playback-rate-value {
691
- display: none;
692
- }
693
-
694
- .video-js.skin_vlone button.vjs-control.vjs-button.vjs-rewind-button>svg {
695
- display: none;
696
- }
697
-
698
- .video-js.skin_vlone button.vjs-control.vjs-button.vjs-skip-button>svg {
699
- display: none;
700
- }
701
- }
702
-
703
- .video-js.skin_news .vjs-button>.vjs-icon-placeholder:before {
704
- font-size: 2.2em;
705
- line-height: 2.6;
706
- }
707
- .video-js.skin_news .vjs-custom-big-mute.vjs-control{
708
- background: white;
709
- }
710
- .video-js.skin_news .vjs-control-bar{
711
- z-index: 1 !important;
712
- height: 5em !important;
713
- background: black !important;
714
- }
715
- .video-js.skin_news .vjs-playback-rate .vjs-playback-rate-value{
716
- display: flex;
717
- align-items: center;
718
- justify-content: center;
719
- }
720
-
721
- .video-js.skin_news .vjs-fade>* {
722
- visibility: hidden !important;
723
- opacity: 0 !important;
724
- transition: visibility 1s, opacity 1s !important;
725
- }
726
-
727
- .video-js.skin_news .custom-spaced-progress-bar {
728
- position: absolute;
729
- width: 100%;
730
- display: flex;
731
- height: 0.5em;
732
- top: -0.5em;
733
- }
734
-
735
- .video-js.skin_news .vjs-progress-control {
736
- /* left: -6px; */
737
- position: relative;
738
- width: 100%;
739
- height: 0.5em;
740
- transition: height 0.1s, top 0.1s;
741
- }
742
-
743
-
744
-
745
-
746
- .video-js.skin_news .vjs-custom-control-spacer {
743
+ .video-js.skin_mini .vjs-custom-control-spacer {
747
744
  display: block;
748
745
  flex: 1 1 auto;
749
746
  }
750
747
 
751
- .video-js.skin_news .vjs-progress-control .vjs-progress-holder {
748
+ .video-js.skin_mini .vjs-progress-control .vjs-progress-holder {
752
749
  margin: 0 0px 0 0px;
753
750
  }
754
- .video-js.skin_news .vjs-remaining-time.vjs-time-control.vjs-control{
751
+ .video-js.skin_mini .vjs-remaining-time.vjs-time-control.vjs-control{
755
752
  display: none;
756
753
  }
757
754
 
758
- .video-js.skin_news button.vjs-control.vjs-button.vjs-slowmo-button {
755
+ .video-js.skin_mini button.vjs-control.vjs-button.vjs-slowmo-button {
759
756
  font-size: 14px;
760
757
  font-weight: 500;
761
758
  align-self: center;
@@ -764,143 +761,158 @@
764
761
  border-radius: 8px;
765
762
  }
766
763
 
767
- .video-js.skin_news .vjs-progress-control .vjs-progress-holder{
768
- height: 6px !important;
764
+ .video-js.skin_mini .vjs-progress-control .vjs-progress-holder{
765
+ height: 5px !important;
769
766
  }
770
767
 
771
- .video-js.skin_news .vjs-play-progress:before {
772
- font-size: 1.5em;
768
+ .video-js.skin_mini .vjs-play-progress:before {
769
+ font-size: 1.3em;
773
770
  line-height: unset;
774
771
  top: -0.3333333333em;
775
772
  }
776
773
 
777
- .video-js.skin_news .vjs-play-progress .vjs-time-tooltip {
774
+ .video-js.skin_mini .vjs-play-progress .vjs-time-tooltip {
778
775
  display: none !important;
779
776
  }
780
777
 
781
778
  /* */
782
- .video-js.skin_news .vjs-mouse-display{
779
+ .video-js.skin_mini .vjs-mouse-display{
783
780
  font-size: 1.6666666667em;
784
781
  }
785
782
 
786
- .video-js.skin_news .vjs-progress-control:hover .vjs-progress-holder {
783
+ .video-js.skin_mini .vjs-progress-control:hover .vjs-progress-holder {
787
784
  font-size: 1em !important;
788
785
  }
789
786
 
790
- .video-js.skin_news .vjs-button{
791
- width: 5.3em;
787
+ .video-js.skin_mini .vjs-button{
788
+ width: 3em;
792
789
  display: flex;
793
790
  align-items: center;
794
791
  justify-content: center;
795
792
  }
796
793
 
797
794
 
798
- .video-js.skin_news .vjs-fullscreen .icon-minimize,
795
+ .video-js.skin_mini .vjs-fullscreen .icon-minimize,
799
796
  .icon-maximize {
800
797
  display: block;
801
798
  height: 32px;
802
799
  }
803
800
 
804
- .video-js.skin_news .vjs-playback-rate .vjs-playback-rate-value{
801
+ .video-js.skin_mini .vjs-playback-rate .vjs-playback-rate-value{
805
802
  line-height: 4;
806
803
  }
807
804
 
808
- .video-js.skin_news .vjs-fullscreen .icon-maximize,
805
+ .video-js.skin_mini .vjs-fullscreen .icon-maximize,
809
806
  .icon-minimize {
810
807
  display: none;
811
808
  height: 32px;
812
809
  }
813
810
 
814
- .video-js.skin_news button.vjs-play-control.vjs-control.vjs-button{
811
+ .video-js.skin_mini button.vjs-play-control.vjs-control.vjs-button{
815
812
  outline: none !important;
816
813
  }
817
- .video-js.skin_news .vjs-fullscreen-control .vjs-icon-placeholder:before,
814
+ .video-js.skin_mini .vjs-fullscreen-control .vjs-icon-placeholder:before,
818
815
  .vjs-icon-fullscreen-enter:before {
819
816
  /* content: '' !important; */
820
817
  }
821
818
 
822
- .video-js.skin_news button.vjs-fullscreen-control.vjs-control.vjs-button {
819
+ .video-js.skin_mini button.vjs-fullscreen-control.vjs-control.vjs-button {
823
820
  display: flex;
824
821
  justify-content: center;
825
822
  align-items: center;
826
823
  /* transform: rotate(90deg); */
827
824
  }
828
825
 
829
- .video-js.skin_news .vjs-subs-caps-button .vjs-icon-placeholder:before{
826
+ .video-js.skin_mini .vjs-subs-caps-button .vjs-icon-placeholder:before{
830
827
  display: none;
831
828
  }
832
- .video-js.skin_news .vjs-volume-panel .vjs-volume-control{
829
+ .video-js.skin_mini .vjs-volume-panel .vjs-volume-control{
833
830
  margin-left: -10px;
831
+ display: none;
834
832
  }
835
833
 
836
- .video-js.skin_news .skipbtn:hover{
834
+ .video-js.skin_mini .vjs-loading-spinner {
835
+ position: absolute;
836
+ top: 50%;
837
+ left: 50%;
838
+ transform: translate(-50%, -50%);
839
+ opacity: .85;
840
+ text-align: left;
841
+ border: .2em solid rgba(43, 51, 63, .7);
842
+ box-sizing: border-box;
843
+ background-clip: padding-box;
844
+ width: 3em;
845
+ height: 3em;
846
+ border-radius: 50%;
847
+ visibility: hidden;
848
+ }
849
+
850
+ .video-js.skin_mini .skipbtn:hover{
837
851
  cursor: pointer;
838
852
  }
839
853
 
840
- .video-js.skin_news .rewindbtn:hover{
854
+ .video-js.skin_mini .rewindbtn:hover{
841
855
  cursor: pointer;
842
856
  }
843
857
 
844
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control{
858
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control{
845
859
  position: relative;
846
860
  padding-left: 0;
847
861
  }
848
862
 
849
- .video-js.skin_news.vjs-seeking .vjs-big-play-button{
850
- display: none !important;
863
+ .video-js.skin_mini.vjs-paused .vjs-big-play-button {
864
+ width: 40px;
865
+ height: 40px;
866
+ display: flex;
867
+ justify-content: center;
868
+ align-items: center;
869
+ border: none;
870
+ position: absolute;
871
+ top: 0;
872
+ left: 0;
873
+ right: 0;
874
+ bottom: 0;
875
+ margin: auto;
876
+ font-size: 3em;
877
+ line-height: 1.3em;
878
+ transform: none !important;
879
+ border-radius: 1.3em;
851
880
  }
852
881
 
853
- .video-js.skin_news.vjs-paused .vjs-big-play-button {
854
- width: 90px;
855
- height: 90px;
856
- display: flex;
857
- justify-content: center;
858
- align-items: center;
859
- border-radius: 50%;
860
- position: absolute;
861
- top: 0;
862
- left: 0;
863
- right: 0;
864
- bottom: 0;
865
- margin: auto;
866
- font-size: 6em;
867
- line-height: 1.4em;
868
- border: 0.05em solid;
869
- color: inherit;
870
- }
871
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control.vjs-at-live-edge{
882
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control.vjs-at-live-edge{
872
883
  font-weight: bold;
873
884
  }
874
885
 
875
- .video-js.skin_news .vjs-menu > ul.vjs-menu-content{
876
- bottom: 2.4em !important;
877
- right: -1em;
886
+ .video-js.skin_mini .vjs-menu > ul.vjs-menu-content{
887
+ bottom: 1.1em !important;
888
+ right: 1em;
878
889
  z-index: 1;
890
+ font-size: 10px;
879
891
  }
880
892
 
881
- .video-js.skin_news .vjs-chromecast-button .vjs-icon-placeholder {
893
+ .video-js.skin_mini .vjs-chromecast-button .vjs-icon-placeholder {
882
894
  width: 24px !important;
883
895
  height: 24px !important;
884
896
  }
885
- .settings-selector-icon>svg{
897
+ .video-js.skin_mini .settings-selector-icon>svg{
886
898
  height: 19px !important;
887
899
  width: 19px !important;
888
900
  }
889
901
 
890
902
 
891
- .video-js.skin_news button.vjs-rewind-button{
903
+ .video-js.skin_mini button.vjs-rewind-button{
892
904
  cursor: pointer;
893
905
  }
894
906
 
895
- .video-js.skin_news .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
907
+ .video-js.skin_mini .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
896
908
  padding-right: 0;
897
909
  }
898
910
 
899
- .video-js.skin_news .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
911
+ .video-js.skin_mini .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
900
912
  padding-left: 0;
901
913
  }
902
914
 
903
- .video-js.skin_news .vjs-control-bar .vjs-time-control.vjs-time-divider {
915
+ .video-js.skin_mini .vjs-control-bar .vjs-time-control.vjs-time-divider {
904
916
  padding-left: 0;
905
917
  padding-right: 0;
906
918
  display: flex;
@@ -908,46 +920,48 @@
908
920
  width: min-content;
909
921
  }
910
922
 
911
- .video-js.skin_news.vjs-live .vjs-control-bar .vjs-time-control {
923
+ .video-js.skin_mini.vjs-live .vjs-control-bar .vjs-time-control {
912
924
  display: none
913
925
  }
914
- .video-js.skin_news.vjs-liveui .vjs-control-bar .vjs-time-control {
926
+ .video-js.skin_mini.vjs-liveui .vjs-control-bar .vjs-time-control {
915
927
  display: none
916
928
  }
917
929
 
918
- .video-js.skin_news .vjs-control-bar .vjs-time-control {
919
- display: flex;
920
- align-items: center;
921
- font-weight: 700;
922
- font-size: 12px;
923
- min-width: 1.2em;
930
+ .video-js.skin_mini .vjs-control-bar .vjs-time-control {
931
+ display: flex;
932
+ align-items: center;
933
+ font-weight: 700;
934
+ font-size: 9px;
935
+ min-width: 0.8em;
936
+ padding-left: 0;
924
937
  }
925
938
 
926
- .video-js.skin_news .vjs-remaining-time.vjs-time-control.vjs-control {
939
+ .video-js.skin_mini .vjs-remaining-time.vjs-time-control.vjs-control {
927
940
  display: none;
928
941
  font-size: 11px;
929
942
  justify-content: center;
930
943
  align-items: center;
931
944
  user-select: none;
932
945
  }
933
- .video-js.skin_news.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
946
+ .video-js.skin_mini.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
934
947
  display: none;
935
948
  }
936
949
 
937
- .video-js.skin_news button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
950
+ .video-js.skin_mini button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
938
951
  height: min-content;
939
952
  width: min-content;
940
953
  }
941
- .video-js.skin_news .vjs-volume-panel.vjs-volume-panel-vertical{
942
- width: 6em;
954
+ .video-js.skin_mini .vjs-volume-panel.vjs-volume-panel-vertical{
955
+ width: 3em;
956
+ margin-right: 4px;
943
957
  }
944
958
 
945
- .video-js.skin_news .content{
959
+ .video-js.skin_mini .content{
946
960
  bottom: 3.4rem !important;
947
961
  right: -4rem !important;
948
962
  }
949
963
 
950
- .setting-icon > svg{
964
+ .video-js.skin_mini .setting-icon > svg{
951
965
  height:18px !important;
952
966
  }
953
967
 
@@ -961,15 +975,16 @@
961
975
  pointer-events:none
962
976
  }
963
977
 
964
- .video-js.skin_news iframe{
978
+ .video-js.skin_mini iframe{
965
979
  width: 100%;
966
980
  height: 100%;
967
981
  }
968
982
 
969
- .video-js.skin_news .vjs-live-control{
983
+ .video-js.skin_mini .vjs-live-control{
970
984
  align-items: center;
985
+ max-width: 5em;
971
986
  }
972
- .video-js.skin_news .vjs-live-control.vjs-control .vjs-live-display{
987
+ .video-js.skin_mini .vjs-live-control.vjs-control .vjs-live-display{
973
988
  height: 2.2em;
974
989
  display: flex;
975
990
  align-items: center;
@@ -977,279 +992,210 @@
977
992
  width: 4em;
978
993
  justify-content: center;
979
994
  background: red;
980
- margin: 4px 0px 4px 12px;
995
+ margin: 4px 0px 4px 2px;
981
996
  }
982
997
 
983
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control:focus{
998
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:focus{
984
999
  text-shadow: none;
985
1000
  }
986
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-seek-to-live-text {
1001
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-seek-to-live-text {
987
1002
  display: none;
988
1003
  font-size: 12px;
989
1004
  }
990
1005
 
991
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder {
992
- height: 2.2em;
1006
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder {
1007
+ height: 1.8em;
993
1008
  display: inline-flex;
994
1009
  align-items: center;
995
- /* font-family: monospace; */
1010
+ font-family: monospace;
996
1011
  justify-content: center;
997
- border: 2px solid;
998
- margin: 4px 0px 4px 6px;
1012
+ border: 1.5px solid;
1013
+ margin: 4px 0px 4px 2px;
999
1014
  white-space: pre;
1000
- padding: 0px 6px;
1015
+ padding: 2px 4px;
1001
1016
  font-size: 1.2em;
1002
1017
  font-weight: 500;
1003
1018
  color: rgba(255, 255, 2555, 0.7);
1004
-
1005
- letter-spacing: -.1px;
1006
- line-height: normal;
1007
- text-transform: uppercase;
1008
- color: #FFFFFF;
1009
- opacity: .7;
1010
- font-family: "Proxima Nova";
1011
- }
1012
-
1013
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder:hover{
1014
- opacity: 1;
1015
1019
  }
1016
1020
 
1017
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder::before {
1021
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder::before {
1018
1022
  content: "NOT LIVE";
1019
- }
1020
-
1021
- .settings-selection.vjs-control.vjs-button{
1022
- display: flex !important;
1023
- }
1024
-
1025
- @media(max-width:576px){
1026
- .settings-selection.vjs-control.vjs-button{
1027
- display: none !important;
1028
- }
1023
+ word-spacing: -4px;
1029
1024
  }
1030
1025
 
1031
1026
 
1032
- @media(max-width:576px){
1027
+ @media(max-width:600px){
1033
1028
  .tvProviderImage{
1034
1029
  display: none
1035
1030
  }
1036
- .video-js.skin_news .vjs-fullscreen .icon-minimize,
1031
+ .video-js.skin_mini .vjs-fullscreen .icon-minimize,
1037
1032
  .icon-maximize {
1038
1033
  height: 30px !important;
1039
1034
  }
1040
1035
 
1041
- .video-js.skin_news .vjs-fullscreen .icon-maximize,
1036
+ .video-js.skin_mini .vjs-fullscreen .icon-maximize,
1042
1037
  .icon-minimize {
1043
1038
  height: 30px !important;
1044
1039
  }
1045
- .video-js.skin_news .vjs-volume-panel.vjs-volume-panel-vertical{
1046
- width: 4.5em;
1040
+ .video-js.skin_mini .vjs-volume-panel.vjs-volume-panel-vertical{
1041
+ width: 3.5em;
1047
1042
  }
1048
- .video-js.skin_news button.vjs-fullscreen-control.vjs-control.vjs-button>span.vjs-icon-placeholder::before {
1043
+ .video-js.skin_mini button.vjs-fullscreen-control.vjs-control.vjs-button>span.vjs-icon-placeholder::before {
1049
1044
  height: min-content;
1050
1045
  }
1051
1046
 
1052
- .video-js.skin_news button.vjs-slowmo-button{
1047
+ .video-js.skin_mini button.vjs-slowmo-button{
1053
1048
  display: none;
1054
1049
  }
1055
- .video-js.skin_news button.vjs-rewind-button{
1050
+ .video-js.skin_mini button.vjs-rewind-button{
1056
1051
  display: none;
1057
1052
  }
1058
- .video-js.skin_news button.vjs-rewind-button>svg{
1053
+ .video-js.skin_mini button.vjs-rewind-button>svg{
1059
1054
  height: 20px;
1060
1055
  }
1061
- .video-js.skin_news .vjs-button{
1062
- width: 4.8em;
1056
+ .video-js.skin_mini .vjs-button{
1057
+ width: 3em;
1063
1058
  }
1064
- .video-js.skin_news .widget-selection{
1059
+ .video-js.skin_mini .widget-selection{
1065
1060
  display: none;
1066
1061
  }
1067
- .video-js.skin_news .container{
1062
+ .video-js.skin_mini .container{
1068
1063
  display: none !important;
1069
1064
  }
1070
- .video-js.skin_news .vjs-control-bar{
1065
+ .video-js.skin_mini .vjs-control-bar{
1071
1066
  height: 4em !important;
1072
1067
  }
1073
- .video-js.skin_news .vjs-button>.vjs-icon-placeholder:before{
1068
+ .video-js.skin_mini .vjs-button>.vjs-icon-placeholder:before{
1074
1069
  font-size: 2.5em;
1075
1070
  line-height: 1.5;
1076
1071
  }
1077
- .video-js.skin_news .vjs-play-progress:before {
1072
+ .video-js.skin_mini .vjs-play-progress:before {
1078
1073
  font-size: 1.2em;
1079
1074
  position: absolute;
1080
1075
  right: -0.5em;
1081
1076
  z-index: 1;
1082
1077
  }
1083
- .video-js.skin_news button.vjs-skip-button>svg{
1078
+ .video-js.skin_mini button.vjs-skip-button>svg{
1084
1079
  height: 20px;
1085
1080
  }
1086
- .video-js.skin_news button.vjs-big-play-button {
1087
- width: 50px !important;
1088
- height: 50px !important;
1089
- font-size: 2.1rem !important;
1090
- }
1091
1081
 
1092
1082
  .stream-selector-icon>svg{
1093
1083
  width: 24px;
1094
1084
  height: 24px;
1095
1085
  }
1096
- .video-js.skin_news.vjs-live .vjs-progress-control .vjs-progress-holder{
1097
- margin: 0 12px 0 12px;
1098
- }
1099
- .video-js.skin_news .vjs-seek-to-live-text{
1086
+ .video-js.skin_mini .vjs-seek-to-live-text{
1100
1087
  font-size: 12px;
1101
1088
  }
1102
- .video-js.skin_news .vjs-progress-control .vjs-progress-holder {
1103
- margin: 0 12px 0 12px;
1089
+
1090
+ .video-js.skin_mini .vjs-text-track-display-ttml span {
1091
+ color: white !important;
1092
+ font-size: 16px !important;
1093
+ background-color: rgba(0,0,0,0.2) !important;
1094
+ }
1104
1095
  }
1096
+
1097
+ .video-js.skin_mini .vjs-text-track-display-ttml span {
1098
+ color: white !important;
1099
+ font-size: 16px !important;
1100
+ background-color: rgba(0,0,0,0.2) !important;
1105
1101
  }
1106
- .video-js.skin_news.vjs-paused .vjs-big-play-button {
1107
- width: 90px;
1108
- height: 90px;
1109
- display: flex;
1110
- justify-content: center;
1111
- align-items: center;
1112
- border-radius: 50%;
1113
- position: absolute;
1114
- top: 0;
1115
- left: 0;
1116
- right: 0;
1117
- bottom: 0;
1118
- margin: auto;
1119
- font-size: 6em;
1120
- line-height: 1.4em;
1102
+
1103
+ .video-js.skin_mini .vjs-text-track-display-ttml p {
1104
+ font-size: 18px !important;
1121
1105
  }
1122
1106
 
1123
- .video-js.skin_news .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1107
+ .video-js.skin_mini.vjs-has-started.vjs-user-active.vjs-controls-enabled .vjs-text-track-display-ttml p {
1108
+ margin-bottom: 1rem !important;
1109
+ }
1110
+
1111
+
1112
+ .video-js.skin_mini .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1124
1113
  display: flex;
1125
1114
  justify-content: center;
1126
1115
  align-items: center;
1127
1116
  height: 100%;
1128
1117
  transition: width 0.1s;
1129
1118
  }
1119
+ .video-js.skin_mini .vjs-track-settings-colors fieldset.vjs-fg.vjs-track-setting{
1120
+ margin: 2px;
1121
+ }
1130
1122
 
1131
- .video-js.skin_news .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:active .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1123
+ .video-js.skin_mini .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:active .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1132
1124
  display: flex;
1133
1125
  justify-content: center;
1134
1126
  align-items: center;
1135
1127
  height: 100%;
1136
1128
  transition: width 0.1s;
1137
1129
  }
1138
- .video-js.skin_news.vjs-fullscreen .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
1139
- display: none !important;
1140
- }
1141
- .video-js.skin_news .ssai-ad-container{
1142
- position: absolute;
1143
- bottom: 14px;
1130
+ .video-js.skin_mini .vjs-text-track-settings .vjs-modal-dialog-content{
1131
+ display: grid;
1132
+ font-size: 10px;
1133
+ grid-template-columns: 1fr;
1134
+ grid-template-rows: 1fr;
1135
+ padding: 1px 0px 0 0px;
1136
+ margin: 0;
1144
1137
  }
1145
1138
 
1146
- @media (max-width: 576px) {
1147
- .video-js.skin_news .ssai-ad-container{
1148
- bottom: 2px;
1149
- }
1150
- .video-js.skin_news .vjs-progress-control .vjs-progress-holder{
1139
+ @media (max-width: 600px) {
1140
+ .video-js.skin_mini .vjs-progress-control .vjs-progress-holder{
1151
1141
  height: 5px !important;
1152
1142
  }
1153
- .video-js.skin_news button.vjs-big-play-button {
1154
- width: 50px !important;
1155
- height: 50px !important;
1156
- font-size: 2.1rem !important;
1157
- }
1158
1143
 
1159
- .vjs-playback-rate.vjs-menu-button.vjs-menu-button-popup.vjs-control.vjs-button{
1144
+ .video-js.skin_mini .vjs-playback-rate.vjs-menu-button.vjs-menu-button-popup.vjs-control.vjs-button{
1160
1145
  display: none;
1161
1146
  }
1162
- .video-js.skin_news .vjs-menu > ul.vjs-menu-content {
1163
- bottom: 2.4em !important;
1164
- right: -1em;
1165
- z-index: 1;
1166
- }
1167
- .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
1168
- display: none !important;
1169
- }
1170
-
1171
- .video-js.skin_news .vjs-text-track-display-ttml span {
1172
- color: white !important;
1173
- font-size: 13px !important;
1174
- background-color: black !important;
1175
- }
1176
- }
1177
1147
 
1178
- .video-js.skin_news .vjs-text-track-display-ttml span {
1179
- color: white !important;
1180
- font-size: 16px !important;
1181
- background-color: black !important;
1182
- }
1183
-
1184
- .video-js.skin_news.vjs-has-started.vjs-user-active.vjs-controls-enabled .vjs-text-track-display-ttml p {
1185
- margin-bottom: 2rem !important;
1186
- }
1187
-
1188
- .video-js.skin_news .vjs-text-track-display-ttml p {
1189
- font-size: 18px !important;
1190
- }
1191
-
1192
-
1193
- .video-js.skin_news .vjs-text-track-settings .vjs-track-settings-controls .vjs-default-button,
1194
- .video-js.skin_news .vjs-text-track-settings .vjs-track-settings-controls .vjs-done-button {
1195
- font-size: 1.2em !important;
1196
- line-height: 1.5em !important;
1197
- padding: 0.2em 0.8em !important;
1198
1148
  }
1199
1149
 
1200
- .video-js.skin_news .vjs-control-bar .vjs-svg-icon{
1150
+ .video-js.skin_mini .vjs-control-bar .vjs-svg-icon{
1201
1151
  content: none !important;
1202
1152
  fill: none !important;
1203
1153
  filter: none !important;
1204
1154
  }
1205
1155
 
1206
1156
  /* svg icons opacity and hover effect */
1207
- .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button svg {
1157
+ .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button svg {
1208
1158
  opacity: 0.7 !important;
1209
1159
  }
1210
1160
 
1211
- .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button:hover svg {
1212
- opacity: 1 !important;
1213
- }
1214
- .video-js.skin_news .vjs-control-bar .vjs-remaining-time.vjs-time-control.vjs-control{
1215
- opacity: 0.7 !important;
1216
- }
1217
- .video-js.skin_news .vjs-control-bar .vjs-remaining-time.vjs-time-control.vjs-control:hover{
1161
+ .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button:hover svg {
1218
1162
  opacity: 1 !important;
1219
1163
  }
1220
1164
 
1221
- .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
1165
+ .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
1222
1166
  color: rgba(255, 255, 2555, 0.7)!important;
1223
1167
  }
1224
1168
 
1225
- .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
1169
+ .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
1226
1170
  color: rgba(255, 255, 2555, 1)!important;
1227
1171
  }
1228
1172
 
1229
1173
 
1230
-
1231
-
1232
-
1233
- .video-js.skin_mini .vjs-button>.vjs-icon-placeholder:before {
1174
+ .video-js.skin_news .vjs-button>.vjs-icon-placeholder:before {
1234
1175
  font-size: 2.2em;
1235
1176
  line-height: 2.6;
1236
1177
  }
1237
- .video-js.skin_mini{
1238
- overflow: hidden;
1178
+ .video-js.skin_news .vjs-custom-big-mute.vjs-control{
1179
+ background: white;
1239
1180
  }
1240
- .video-js.skin_mini .vjs-control-bar{
1181
+ .video-js.skin_news .vjs-control-bar{
1241
1182
  z-index: 1 !important;
1242
- height: 4em !important;
1183
+ height: 5em !important;
1243
1184
  background: black !important;
1244
1185
  }
1186
+ .video-js.skin_news .vjs-playback-rate .vjs-playback-rate-value{
1187
+ display: flex;
1188
+ align-items: center;
1189
+ justify-content: center;
1190
+ }
1245
1191
 
1246
- .video-js.skin_mini .vjs-fade>* {
1192
+ .video-js.skin_news .vjs-fade>* {
1247
1193
  visibility: hidden !important;
1248
1194
  opacity: 0 !important;
1249
1195
  transition: visibility 1s, opacity 1s !important;
1250
1196
  }
1251
1197
 
1252
- .video-js.skin_mini .custom-spaced-progress-bar {
1198
+ .video-js.skin_news .custom-spaced-progress-bar {
1253
1199
  position: absolute;
1254
1200
  width: 100%;
1255
1201
  display: flex;
@@ -1257,7 +1203,7 @@
1257
1203
  top: -0.5em;
1258
1204
  }
1259
1205
 
1260
- .video-js.skin_mini .vjs-progress-control {
1206
+ .video-js.skin_news .vjs-progress-control {
1261
1207
  /* left: -6px; */
1262
1208
  position: relative;
1263
1209
  width: 100%;
@@ -1268,19 +1214,19 @@
1268
1214
 
1269
1215
 
1270
1216
 
1271
- .video-js.skin_mini .vjs-custom-control-spacer {
1217
+ .video-js.skin_news .vjs-custom-control-spacer {
1272
1218
  display: block;
1273
1219
  flex: 1 1 auto;
1274
1220
  }
1275
1221
 
1276
- .video-js.skin_mini .vjs-progress-control .vjs-progress-holder {
1222
+ .video-js.skin_news .vjs-progress-control .vjs-progress-holder {
1277
1223
  margin: 0 0px 0 0px;
1278
1224
  }
1279
- .video-js.skin_mini .vjs-remaining-time.vjs-time-control.vjs-control{
1225
+ .video-js.skin_news .vjs-remaining-time.vjs-time-control.vjs-control{
1280
1226
  display: none;
1281
1227
  }
1282
1228
 
1283
- .video-js.skin_mini button.vjs-control.vjs-button.vjs-slowmo-button {
1229
+ .video-js.skin_news button.vjs-control.vjs-button.vjs-slowmo-button {
1284
1230
  font-size: 14px;
1285
1231
  font-weight: 500;
1286
1232
  align-self: center;
@@ -1289,158 +1235,143 @@
1289
1235
  border-radius: 8px;
1290
1236
  }
1291
1237
 
1292
- .video-js.skin_mini .vjs-progress-control .vjs-progress-holder{
1293
- height: 5px !important;
1238
+ .video-js.skin_news .vjs-progress-control .vjs-progress-holder{
1239
+ height: 6px !important;
1294
1240
  }
1295
1241
 
1296
- .video-js.skin_mini .vjs-play-progress:before {
1297
- font-size: 1.3em;
1242
+ .video-js.skin_news .vjs-play-progress:before {
1243
+ font-size: 1.5em;
1298
1244
  line-height: unset;
1299
1245
  top: -0.3333333333em;
1300
1246
  }
1301
1247
 
1302
- .video-js.skin_mini .vjs-play-progress .vjs-time-tooltip {
1248
+ .video-js.skin_news .vjs-play-progress .vjs-time-tooltip {
1303
1249
  display: none !important;
1304
1250
  }
1305
1251
 
1306
1252
  /* */
1307
- .video-js.skin_mini .vjs-mouse-display{
1253
+ .video-js.skin_news .vjs-mouse-display{
1308
1254
  font-size: 1.6666666667em;
1309
1255
  }
1310
1256
 
1311
- .video-js.skin_mini .vjs-progress-control:hover .vjs-progress-holder {
1257
+ .video-js.skin_news .vjs-progress-control:hover .vjs-progress-holder {
1312
1258
  font-size: 1em !important;
1313
1259
  }
1314
1260
 
1315
- .video-js.skin_mini .vjs-button{
1316
- width: 3em;
1261
+ .video-js.skin_news .vjs-button{
1262
+ width: 5.3em;
1317
1263
  display: flex;
1318
1264
  align-items: center;
1319
1265
  justify-content: center;
1320
1266
  }
1321
1267
 
1322
1268
 
1323
- .video-js.skin_mini .vjs-fullscreen .icon-minimize,
1269
+ .video-js.skin_news .vjs-fullscreen .icon-minimize,
1324
1270
  .icon-maximize {
1325
1271
  display: block;
1326
1272
  height: 32px;
1327
1273
  }
1328
1274
 
1329
- .video-js.skin_mini .vjs-playback-rate .vjs-playback-rate-value{
1275
+ .video-js.skin_news .vjs-playback-rate .vjs-playback-rate-value{
1330
1276
  line-height: 4;
1331
1277
  }
1332
1278
 
1333
- .video-js.skin_mini .vjs-fullscreen .icon-maximize,
1279
+ .video-js.skin_news .vjs-fullscreen .icon-maximize,
1334
1280
  .icon-minimize {
1335
1281
  display: none;
1336
1282
  height: 32px;
1337
1283
  }
1338
1284
 
1339
- .video-js.skin_mini button.vjs-play-control.vjs-control.vjs-button{
1285
+ .video-js.skin_news button.vjs-play-control.vjs-control.vjs-button{
1340
1286
  outline: none !important;
1341
1287
  }
1342
- .video-js.skin_mini .vjs-fullscreen-control .vjs-icon-placeholder:before,
1288
+ .video-js.skin_news .vjs-fullscreen-control .vjs-icon-placeholder:before,
1343
1289
  .vjs-icon-fullscreen-enter:before {
1344
1290
  /* content: '' !important; */
1345
1291
  }
1346
1292
 
1347
- .video-js.skin_mini button.vjs-fullscreen-control.vjs-control.vjs-button {
1293
+ .video-js.skin_news button.vjs-fullscreen-control.vjs-control.vjs-button {
1348
1294
  display: flex;
1349
1295
  justify-content: center;
1350
1296
  align-items: center;
1351
1297
  /* transform: rotate(90deg); */
1352
1298
  }
1353
1299
 
1354
- .video-js.skin_mini .vjs-subs-caps-button .vjs-icon-placeholder:before{
1300
+ .video-js.skin_news .vjs-subs-caps-button .vjs-icon-placeholder:before{
1355
1301
  display: none;
1356
1302
  }
1357
- .video-js.skin_mini .vjs-volume-panel .vjs-volume-control{
1303
+ .video-js.skin_news .vjs-volume-panel .vjs-volume-control{
1358
1304
  margin-left: -10px;
1359
- display: none;
1360
- }
1361
-
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;
1376
1305
  }
1377
1306
 
1378
- .video-js.skin_mini .skipbtn:hover{
1307
+ .video-js.skin_news .skipbtn:hover{
1379
1308
  cursor: pointer;
1380
1309
  }
1381
1310
 
1382
- .video-js.skin_mini .rewindbtn:hover{
1311
+ .video-js.skin_news .rewindbtn:hover{
1383
1312
  cursor: pointer;
1384
1313
  }
1385
1314
 
1386
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control{
1315
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control{
1387
1316
  position: relative;
1388
1317
  padding-left: 0;
1389
1318
  }
1390
1319
 
1391
- .video-js.skin_mini.vjs-paused .vjs-big-play-button {
1392
- width: 40px;
1393
- height: 40px;
1394
- display: flex;
1395
- justify-content: center;
1396
- align-items: center;
1397
- border: none;
1398
- position: absolute;
1399
- top: 0;
1400
- left: 0;
1401
- right: 0;
1402
- bottom: 0;
1403
- margin: auto;
1404
- font-size: 3em;
1405
- line-height: 1.3em;
1406
- transform: none !important;
1407
- border-radius: 1.3em;
1320
+ .video-js.skin_news.vjs-seeking .vjs-big-play-button{
1321
+ display: none !important;
1408
1322
  }
1409
1323
 
1410
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control.vjs-at-live-edge{
1324
+ .video-js.skin_news.vjs-paused .vjs-big-play-button {
1325
+ width: 90px;
1326
+ height: 90px;
1327
+ display: flex;
1328
+ justify-content: center;
1329
+ align-items: center;
1330
+ border-radius: 50%;
1331
+ position: absolute;
1332
+ top: 0;
1333
+ left: 0;
1334
+ right: 0;
1335
+ bottom: 0;
1336
+ margin: auto;
1337
+ font-size: 6em;
1338
+ line-height: 1.4em;
1339
+ border: 0.05em solid;
1340
+ color: inherit;
1341
+ }
1342
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control.vjs-at-live-edge{
1411
1343
  font-weight: bold;
1412
1344
  }
1413
1345
 
1414
- .video-js.skin_mini .vjs-menu > ul.vjs-menu-content{
1415
- bottom: 1.1em !important;
1416
- right: 1em;
1346
+ .video-js.skin_news .vjs-menu > ul.vjs-menu-content{
1347
+ bottom: 2.4em !important;
1348
+ right: -1em;
1417
1349
  z-index: 1;
1418
- font-size: 10px;
1419
1350
  }
1420
1351
 
1421
- .video-js.skin_mini .vjs-chromecast-button .vjs-icon-placeholder {
1352
+ .video-js.skin_news .vjs-chromecast-button .vjs-icon-placeholder {
1422
1353
  width: 24px !important;
1423
1354
  height: 24px !important;
1424
1355
  }
1425
- .video-js.skin_mini .settings-selector-icon>svg{
1356
+ .settings-selector-icon>svg{
1426
1357
  height: 19px !important;
1427
1358
  width: 19px !important;
1428
1359
  }
1429
1360
 
1430
1361
 
1431
- .video-js.skin_mini button.vjs-rewind-button{
1362
+ .video-js.skin_news button.vjs-rewind-button{
1432
1363
  cursor: pointer;
1433
1364
  }
1434
1365
 
1435
- .video-js.skin_mini .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
1366
+ .video-js.skin_news .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
1436
1367
  padding-right: 0;
1437
1368
  }
1438
1369
 
1439
- .video-js.skin_mini .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
1370
+ .video-js.skin_news .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
1440
1371
  padding-left: 0;
1441
1372
  }
1442
1373
 
1443
- .video-js.skin_mini .vjs-control-bar .vjs-time-control.vjs-time-divider {
1374
+ .video-js.skin_news .vjs-control-bar .vjs-time-control.vjs-time-divider {
1444
1375
  padding-left: 0;
1445
1376
  padding-right: 0;
1446
1377
  display: flex;
@@ -1448,48 +1379,46 @@
1448
1379
  width: min-content;
1449
1380
  }
1450
1381
 
1451
- .video-js.skin_mini.vjs-live .vjs-control-bar .vjs-time-control {
1382
+ .video-js.skin_news.vjs-live .vjs-control-bar .vjs-time-control {
1452
1383
  display: none
1453
1384
  }
1454
- .video-js.skin_mini.vjs-liveui .vjs-control-bar .vjs-time-control {
1385
+ .video-js.skin_news.vjs-liveui .vjs-control-bar .vjs-time-control {
1455
1386
  display: none
1456
1387
  }
1457
1388
 
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;
1389
+ .video-js.skin_news .vjs-control-bar .vjs-time-control {
1390
+ display: flex;
1391
+ align-items: center;
1392
+ font-weight: 700;
1393
+ font-size: 12px;
1394
+ min-width: 1.2em;
1465
1395
  }
1466
1396
 
1467
- .video-js.skin_mini .vjs-remaining-time.vjs-time-control.vjs-control {
1397
+ .video-js.skin_news .vjs-remaining-time.vjs-time-control.vjs-control {
1468
1398
  display: none;
1469
1399
  font-size: 11px;
1470
1400
  justify-content: center;
1471
1401
  align-items: center;
1472
1402
  user-select: none;
1473
1403
  }
1474
- .video-js.skin_mini.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
1404
+ .video-js.skin_news.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
1475
1405
  display: none;
1476
1406
  }
1477
1407
 
1478
- .video-js.skin_mini button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
1408
+ .video-js.skin_news button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
1479
1409
  height: min-content;
1480
1410
  width: min-content;
1481
1411
  }
1482
- .video-js.skin_mini .vjs-volume-panel.vjs-volume-panel-vertical{
1483
- width: 3em;
1484
- margin-right: 4px;
1412
+ .video-js.skin_news .vjs-volume-panel.vjs-volume-panel-vertical{
1413
+ width: 6em;
1485
1414
  }
1486
1415
 
1487
- .video-js.skin_mini .content{
1416
+ .video-js.skin_news .content{
1488
1417
  bottom: 3.4rem !important;
1489
1418
  right: -4rem !important;
1490
1419
  }
1491
1420
 
1492
- .video-js.skin_mini .setting-icon > svg{
1421
+ .setting-icon > svg{
1493
1422
  height:18px !important;
1494
1423
  }
1495
1424
 
@@ -1503,16 +1432,15 @@
1503
1432
  pointer-events:none
1504
1433
  }
1505
1434
 
1506
- .video-js.skin_mini iframe{
1435
+ .video-js.skin_news iframe{
1507
1436
  width: 100%;
1508
1437
  height: 100%;
1509
1438
  }
1510
1439
 
1511
- .video-js.skin_mini .vjs-live-control{
1440
+ .video-js.skin_news .vjs-live-control{
1512
1441
  align-items: center;
1513
- max-width: 5em;
1514
1442
  }
1515
- .video-js.skin_mini .vjs-live-control.vjs-control .vjs-live-display{
1443
+ .video-js.skin_news .vjs-live-control.vjs-control .vjs-live-display{
1516
1444
  height: 2.2em;
1517
1445
  display: flex;
1518
1446
  align-items: center;
@@ -1520,185 +1448,257 @@
1520
1448
  width: 4em;
1521
1449
  justify-content: center;
1522
1450
  background: red;
1523
- margin: 4px 0px 4px 2px;
1451
+ margin: 4px 0px 4px 12px;
1524
1452
  }
1525
1453
 
1526
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:focus{
1454
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control:focus{
1527
1455
  text-shadow: none;
1528
1456
  }
1529
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-seek-to-live-text {
1457
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-seek-to-live-text {
1530
1458
  display: none;
1531
1459
  font-size: 12px;
1532
1460
  }
1533
1461
 
1534
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder {
1535
- height: 1.8em;
1462
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder {
1463
+ height: 2.2em;
1536
1464
  display: inline-flex;
1537
1465
  align-items: center;
1538
- font-family: monospace;
1466
+ /* font-family: monospace; */
1539
1467
  justify-content: center;
1540
- border: 1.5px solid;
1541
- margin: 4px 0px 4px 2px;
1468
+ border: 2px solid;
1469
+ margin: 4px 0px 4px 6px;
1542
1470
  white-space: pre;
1543
- padding: 2px 4px;
1471
+ padding: 0px 6px;
1544
1472
  font-size: 1.2em;
1545
1473
  font-weight: 500;
1546
1474
  color: rgba(255, 255, 2555, 0.7);
1475
+
1476
+ letter-spacing: -.1px;
1477
+ line-height: normal;
1478
+ text-transform: uppercase;
1479
+ color: #FFFFFF;
1480
+ opacity: .7;
1481
+ font-family: "Proxima Nova";
1547
1482
  }
1548
1483
 
1549
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder::before {
1484
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder:hover{
1485
+ opacity: 1;
1486
+ }
1487
+
1488
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder::before {
1550
1489
  content: "NOT LIVE";
1551
- word-spacing: -4px;
1552
1490
  }
1553
1491
 
1492
+ .settings-selection.vjs-control.vjs-button{
1493
+ display: flex !important;
1494
+ }
1495
+
1496
+ @media(max-width:576px){
1497
+ .settings-selection.vjs-control.vjs-button{
1498
+ display: none !important;
1499
+ }
1500
+ }
1554
1501
 
1555
- @media(max-width:600px){
1502
+
1503
+ @media(max-width:576px){
1556
1504
  .tvProviderImage{
1557
1505
  display: none
1558
1506
  }
1559
- .video-js.skin_mini .vjs-fullscreen .icon-minimize,
1507
+ .video-js.skin_news .vjs-fullscreen .icon-minimize,
1560
1508
  .icon-maximize {
1561
1509
  height: 30px !important;
1562
1510
  }
1563
1511
 
1564
- .video-js.skin_mini .vjs-fullscreen .icon-maximize,
1512
+ .video-js.skin_news .vjs-fullscreen .icon-maximize,
1565
1513
  .icon-minimize {
1566
1514
  height: 30px !important;
1567
1515
  }
1568
- .video-js.skin_mini .vjs-volume-panel.vjs-volume-panel-vertical{
1569
- width: 3.5em;
1516
+ .video-js.skin_news .vjs-volume-panel.vjs-volume-panel-vertical{
1517
+ width: 4.5em;
1570
1518
  }
1571
- .video-js.skin_mini button.vjs-fullscreen-control.vjs-control.vjs-button>span.vjs-icon-placeholder::before {
1519
+ .video-js.skin_news button.vjs-fullscreen-control.vjs-control.vjs-button>span.vjs-icon-placeholder::before {
1572
1520
  height: min-content;
1573
1521
  }
1574
1522
 
1575
- .video-js.skin_mini button.vjs-slowmo-button{
1523
+ .video-js.skin_news button.vjs-slowmo-button{
1576
1524
  display: none;
1577
1525
  }
1578
- .video-js.skin_mini button.vjs-rewind-button{
1526
+ .video-js.skin_news button.vjs-rewind-button{
1579
1527
  display: none;
1580
1528
  }
1581
- .video-js.skin_mini button.vjs-rewind-button>svg{
1529
+ .video-js.skin_news button.vjs-rewind-button>svg{
1582
1530
  height: 20px;
1583
1531
  }
1584
- .video-js.skin_mini .vjs-button{
1585
- width: 3em;
1532
+ .video-js.skin_news .vjs-button{
1533
+ width: 4.8em;
1586
1534
  }
1587
- .video-js.skin_mini .widget-selection{
1535
+ .video-js.skin_news .widget-selection{
1588
1536
  display: none;
1589
1537
  }
1590
- .video-js.skin_mini .container{
1538
+ .video-js.skin_news .container{
1591
1539
  display: none !important;
1592
1540
  }
1593
- .video-js.skin_mini .vjs-control-bar{
1541
+ .video-js.skin_news .vjs-control-bar{
1594
1542
  height: 4em !important;
1595
1543
  }
1596
- .video-js.skin_mini .vjs-button>.vjs-icon-placeholder:before{
1544
+ .video-js.skin_news .vjs-button>.vjs-icon-placeholder:before{
1597
1545
  font-size: 2.5em;
1598
1546
  line-height: 1.5;
1599
1547
  }
1600
- .video-js.skin_mini .vjs-play-progress:before {
1548
+ .video-js.skin_news .vjs-play-progress:before {
1601
1549
  font-size: 1.2em;
1602
1550
  position: absolute;
1603
1551
  right: -0.5em;
1604
1552
  z-index: 1;
1605
1553
  }
1606
- .video-js.skin_mini button.vjs-skip-button>svg{
1554
+ .video-js.skin_news button.vjs-skip-button>svg{
1607
1555
  height: 20px;
1608
1556
  }
1557
+ .video-js.skin_news button.vjs-big-play-button {
1558
+ width: 50px !important;
1559
+ height: 50px !important;
1560
+ font-size: 2.1rem !important;
1561
+ }
1609
1562
 
1610
1563
  .stream-selector-icon>svg{
1611
1564
  width: 24px;
1612
1565
  height: 24px;
1613
1566
  }
1614
- .video-js.skin_mini .vjs-seek-to-live-text{
1615
- font-size: 12px;
1616
- }
1617
-
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
- }
1623
- }
1624
-
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;
1567
+ .video-js.skin_news.vjs-live .vjs-progress-control .vjs-progress-holder{
1568
+ margin: 0 12px 0 12px;
1629
1569
  }
1630
-
1631
- .video-js.skin_mini .vjs-text-track-display-ttml p {
1632
- font-size: 18px !important;
1570
+ .video-js.skin_news .vjs-seek-to-live-text{
1571
+ font-size: 12px;
1633
1572
  }
1634
-
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 .vjs-progress-control .vjs-progress-holder {
1574
+ margin: 0 12px 0 12px;
1575
+ }
1576
+ }
1577
+ .video-js.skin_news.vjs-paused .vjs-big-play-button {
1578
+ width: 90px;
1579
+ height: 90px;
1580
+ display: flex;
1581
+ justify-content: center;
1582
+ align-items: center;
1583
+ border-radius: 50%;
1584
+ position: absolute;
1585
+ top: 0;
1586
+ left: 0;
1587
+ right: 0;
1588
+ bottom: 0;
1589
+ margin: auto;
1590
+ font-size: 6em;
1591
+ line-height: 1.4em;
1637
1592
  }
1638
1593
 
1639
-
1640
- .video-js.skin_mini .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1594
+ .video-js.skin_news .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1641
1595
  display: flex;
1642
1596
  justify-content: center;
1643
1597
  align-items: center;
1644
1598
  height: 100%;
1645
1599
  transition: width 0.1s;
1646
1600
  }
1647
- .video-js.skin_mini .vjs-track-settings-colors fieldset.vjs-fg.vjs-track-setting{
1648
- margin: 2px;
1649
- }
1650
1601
 
1651
- .video-js.skin_mini .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:active .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1602
+ .video-js.skin_news .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:active .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1652
1603
  display: flex;
1653
1604
  justify-content: center;
1654
1605
  align-items: center;
1655
1606
  height: 100%;
1656
1607
  transition: width 0.1s;
1657
1608
  }
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;
1609
+ .video-js.skin_news.vjs-fullscreen .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
1610
+ display: none !important;
1611
+ }
1612
+ .video-js.skin_news .ssai-ad-container{
1613
+ position: absolute;
1614
+ bottom: 14px;
1665
1615
  }
1666
1616
 
1667
- @media (max-width: 600px) {
1668
- .video-js.skin_mini .vjs-progress-control .vjs-progress-holder{
1617
+ @media (max-width: 576px) {
1618
+ .video-js.skin_news .ssai-ad-container{
1619
+ bottom: 2px;
1620
+ }
1621
+ .video-js.skin_news .vjs-progress-control .vjs-progress-holder{
1669
1622
  height: 5px !important;
1670
1623
  }
1624
+ .video-js.skin_news button.vjs-big-play-button {
1625
+ width: 50px !important;
1626
+ height: 50px !important;
1627
+ font-size: 2.1rem !important;
1628
+ }
1671
1629
 
1672
- .video-js.skin_mini .vjs-playback-rate.vjs-menu-button.vjs-menu-button-popup.vjs-control.vjs-button{
1630
+ .vjs-playback-rate.vjs-menu-button.vjs-menu-button-popup.vjs-control.vjs-button{
1673
1631
  display: none;
1674
1632
  }
1633
+ .video-js.skin_news .vjs-menu > ul.vjs-menu-content {
1634
+ bottom: 2.4em !important;
1635
+ right: -1em;
1636
+ z-index: 1;
1637
+ }
1638
+ .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
1639
+ display: none !important;
1640
+ }
1675
1641
 
1642
+ .video-js.skin_news .vjs-text-track-display-ttml span {
1643
+ color: white !important;
1644
+ font-size: 13px !important;
1645
+ background-color: black !important;
1646
+ }
1676
1647
  }
1677
1648
 
1678
- .video-js.skin_mini .vjs-control-bar .vjs-svg-icon{
1649
+ .video-js.skin_news .vjs-text-track-display-ttml span {
1650
+ color: white !important;
1651
+ font-size: 16px !important;
1652
+ background-color: black !important;
1653
+ }
1654
+
1655
+ .video-js.skin_news.vjs-has-started.vjs-user-active.vjs-controls-enabled .vjs-text-track-display-ttml p {
1656
+ margin-bottom: 2rem !important;
1657
+ }
1658
+
1659
+ .video-js.skin_news .vjs-text-track-display-ttml p {
1660
+ font-size: 18px !important;
1661
+ }
1662
+
1663
+
1664
+ .video-js.skin_news .vjs-text-track-settings .vjs-track-settings-controls .vjs-default-button,
1665
+ .video-js.skin_news .vjs-text-track-settings .vjs-track-settings-controls .vjs-done-button {
1666
+ font-size: 1.2em !important;
1667
+ line-height: 1.5em !important;
1668
+ padding: 0.2em 0.8em !important;
1669
+ }
1670
+
1671
+ .video-js.skin_news .vjs-control-bar .vjs-svg-icon{
1679
1672
  content: none !important;
1680
1673
  fill: none !important;
1681
1674
  filter: none !important;
1682
1675
  }
1683
1676
 
1684
1677
  /* svg icons opacity and hover effect */
1685
- .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button svg {
1678
+ .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button svg {
1686
1679
  opacity: 0.7 !important;
1687
1680
  }
1688
1681
 
1689
- .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button:hover svg {
1682
+ .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button:hover svg {
1683
+ opacity: 1 !important;
1684
+ }
1685
+ .video-js.skin_news .vjs-control-bar .vjs-remaining-time.vjs-time-control.vjs-control{
1686
+ opacity: 0.7 !important;
1687
+ }
1688
+ .video-js.skin_news .vjs-control-bar .vjs-remaining-time.vjs-time-control.vjs-control:hover{
1690
1689
  opacity: 1 !important;
1691
1690
  }
1692
1691
 
1693
- .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
1692
+ .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
1694
1693
  color: rgba(255, 255, 2555, 0.7)!important;
1695
1694
  }
1696
1695
 
1697
- .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
1696
+ .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
1698
1697
  color: rgba(255, 255, 2555, 1)!important;
1699
1698
  }
1700
1699
 
1701
1700
 
1701
+
1702
1702
  /* CSS for videojs-dvr-seekbar */
1703
1703
 
1704
1704
  .video-js.vjs-dvr-seekbar {
@@ -1880,6 +1880,7 @@
1880
1880
 
1881
1881
 
1882
1882
 
1883
+
1883
1884
  .video-js .multicamera-parent.default{
1884
1885
  height: 345px;
1885
1886
  position: absolute;
@@ -1960,8 +1961,6 @@
1960
1961
 
1961
1962
 
1962
1963
 
1963
-
1964
-
1965
1964
  .vjs-custom-big-mute.vjs-control{
1966
1965
  position: absolute;
1967
1966
  align-items: center;
@@ -2010,81 +2009,313 @@
2010
2009
  width: 22px;
2011
2010
  }
2012
2011
 
2013
- /* nextep */
2014
- .next-ep-preview{
2012
+
2013
+ /* nextep — up-next card */
2014
+ .next-ep-preview {
2015
2015
  position: absolute;
2016
+ z-index: 15;
2016
2017
  height: min-content;
2017
- width: 300px;
2018
+ width: min(216px, 12vw);
2018
2019
  bottom: 16%;
2019
2020
  right: 1.5%;
2020
- padding: 13px;
2021
+ padding: 14px 16px 16px;
2022
+ border-radius: 12px;
2023
+ /* background: rgba(8, 8, 8, 0.92); */
2024
+ box-sizing: border-box;
2025
+ font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
2026
+ color: #fff;
2027
+ }
2028
+
2029
+ .next-heading-wrapper {
2030
+ display: flex;
2031
+ flex-direction: row;
2032
+ justify-content: space-between;
2033
+ align-items: center;
2034
+ margin-bottom: 8px;
2035
+ }
2036
+
2037
+ .next-ep-header {
2038
+ text-align: left;
2039
+ font-weight: 600;
2040
+ font-size: 11px;
2041
+ text-transform: uppercase;
2042
+ color: rgba(255, 255, 255, 0.95);
2043
+ margin: 0;
2044
+ }
2045
+
2046
+ .next-ep-close {
2047
+ display: flex;
2048
+ align-items: center;
2049
+ justify-content: center;
2050
+ padding: 2px 4px;
2051
+ margin: 0;
2021
2052
  border-radius: 4px;
2022
- background: rgba(0, 0, 0, 0.75);
2053
+ cursor: pointer;
2054
+ color: rgba(255, 255, 255, 0.85);
2055
+ line-height: 0;
2056
+ opacity: 0.9;
2023
2057
  }
2024
- .next-ep-img{
2025
- width: 185px;
2026
- height: 95px;
2027
-
2058
+
2059
+ .next-ep-close:hover {
2060
+ opacity: 1;
2061
+ }
2062
+
2063
+ .next-ep-content {
2064
+ display: flex;
2065
+ flex-direction: column;
2066
+ align-items: stretch;
2067
+ gap: 12px;
2068
+ cursor: pointer;
2069
+ }
2070
+
2071
+ .next-ep-content:hover {
2072
+ opacity: 0.98;
2028
2073
  }
2029
- .next-ep-img-container{
2074
+
2075
+ .next-ep-thumb-wrap {
2076
+ position: relative;
2077
+ width: 100%;
2078
+ aspect-ratio: 16 / 9;
2079
+ border-radius: 8px;
2080
+ overflow: hidden;
2081
+ background: #1a1a1a;
2082
+ }
2083
+
2084
+ .next-ep-img {
2030
2085
  width: 100%;
2031
2086
  height: 100%;
2087
+ object-fit: cover;
2088
+ display: block;
2032
2089
  }
2033
- .next-ep-header{
2034
- text-align: left;
2035
- font-weight: bold;
2036
- font-size: 18px;
2037
- margin-bottom: 8px;
2090
+
2091
+ .next-ep-duration {
2092
+ position: absolute;
2093
+ left: 10px;
2094
+ bottom: 10px;
2095
+ padding: 3px 8px;
2096
+ border-radius: 999px;
2097
+ font-size: 11px;
2098
+ font-weight: 600;
2099
+ color: #fff;
2100
+ background: rgba(0, 0, 0, 0.65);
2101
+ letter-spacing: 0.02em;
2102
+ }
2103
+
2104
+ .next-ep-duration--empty {
2105
+ display: none;
2106
+ }
2107
+
2108
+ .next-ep-countdown-overlay {
2109
+ position: absolute;
2110
+ inset: 0;
2111
+ display: flex;
2112
+ align-items: center;
2113
+ justify-content: center;
2114
+ pointer-events: none;
2115
+ }
2116
+
2117
+ .next-ep-countdown-svg {
2118
+ width: 38%;
2119
+ max-width: 120px;
2120
+ height: auto;
2121
+ filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.35));
2122
+ }
2123
+
2124
+ .next-ep-countdown-track {
2125
+ stroke: rgba(255, 255, 255, 0.28);
2126
+ stroke-width: 4;
2038
2127
  }
2039
2128
 
2040
- .next-ep-title{
2041
- font-size: 15px;
2042
- margin-left: 8px;
2129
+ .next-ep-countdown-progress {
2130
+ stroke: #fff;
2131
+ stroke-width: 4;
2132
+ stroke-linecap: round;
2133
+ }
2043
2134
 
2135
+ .next-ep-countdown-num {
2136
+ position: absolute;
2137
+ left: 50%;
2138
+ top: 50%;
2139
+ transform: translate(-50%, -52%);
2140
+ font-size: clamp(28px, 9vw, 28px);
2141
+ font-weight: 700;
2142
+ line-height: 1;
2143
+ color: #fff;
2144
+ text-shadow: 0 1px 3px rgba(0, 0, 0, 0.45);
2044
2145
  }
2045
2146
 
2046
- .next-ep-content{
2147
+ .next-ep-meta-with-logo {
2047
2148
  display: flex;
2048
- align-items: center;
2149
+ flex-direction: row;
2150
+ gap: 10px;
2151
+ min-width: 0;
2049
2152
  }
2050
- .next-ep-content:hover{
2051
- cursor: pointer;
2153
+
2154
+ .next-ep-meta-with-logo > .next-ep-meta {
2155
+ flex: 1;
2156
+ min-width: 0;
2052
2157
  }
2053
- .next-heading-wrapper{
2158
+
2159
+ .next-ep-meta {
2054
2160
  display: flex;
2055
- flex-direction: unset;
2056
- justify-content: space-between;
2161
+ flex-direction: column;
2162
+ gap: 0px;
2163
+ min-width: 0;
2164
+ }
2165
+
2166
+ .next-ep-title {
2167
+ font-size: 16px;
2168
+ font-weight: 700;
2169
+ line-height: 1.25;
2170
+ color: #fff;
2171
+ margin: 0;
2172
+ min-width: 0;
2173
+ white-space: nowrap;
2174
+ overflow: hidden;
2175
+ text-overflow: ellipsis;
2176
+ }
2177
+
2178
+ .next-ep-desc {
2179
+ font-size: 13px;
2180
+ font-weight: 400;
2181
+ line-height: 1.35;
2182
+ color: rgba(255, 255, 255, 0.82);
2183
+ margin: 0;
2184
+ min-width: 0;
2185
+ white-space: nowrap;
2186
+ overflow: hidden;
2187
+ text-overflow: ellipsis;
2188
+ }
2189
+
2190
+ .next-ep-desc--empty {
2191
+ display: none;
2192
+ }
2193
+
2194
+ .next-ep-meta-row {
2195
+ display: flex;
2196
+ flex-direction: row;
2057
2197
  align-items: center;
2198
+ justify-content: flex-start;
2199
+ gap: 10px;
2200
+ margin-top: 2px;
2058
2201
  }
2059
- .next-ep-close{
2060
- align-items: right;
2061
- font-weight: bold;
2062
- font-size: 18px;
2063
- margin-bottom: 8px;
2064
- font-size: 20px;
2065
- border-radius: 3px;
2066
- cursor: pointer;
2202
+
2203
+ .next-ep-meta-row-left {
2204
+ display: flex;
2205
+ flex-direction: row;
2206
+ align-items: center;
2207
+ gap: 10px;
2208
+ min-width: 0;
2067
2209
  }
2068
2210
 
2069
- @media (max-width:600px){
2070
- .next-ep-preview{
2071
- width: 170px;
2072
- right: 2.5%;
2073
- padding: 6px;
2211
+ .next-ep-badge {
2212
+ flex-shrink: 0;
2213
+ font-size: 10px;
2214
+ font-weight: 600;
2215
+ letter-spacing: 0.08em;
2216
+ text-transform: uppercase;
2217
+ padding: 3px 8px;
2218
+ border: 1px solid rgba(255, 255, 255, 0.75);
2219
+ border-radius: 2px;
2220
+ color: rgba(255, 255, 255, 0.95);
2221
+ }
2222
+
2223
+ .next-ep-badge--empty {
2224
+ display: none;
2225
+ }
2226
+
2227
+ .next-ep-episode {
2228
+ font-size: 13px;
2229
+ color: rgba(255, 255, 255, 0.88);
2230
+ white-space: nowrap;
2231
+ overflow: hidden;
2232
+ text-overflow: ellipsis;
2233
+ }
2234
+
2235
+ .next-ep-network-logo {
2236
+ flex-shrink: 0;
2237
+ max-height: 22px;
2238
+ max-width: 56px;
2239
+ width: auto;
2240
+ height: auto;
2241
+ object-fit: contain;
2242
+ opacity: 0.98;
2243
+ }
2244
+
2245
+ .next-ep-network-logo--empty {
2246
+ display: none;
2247
+ }
2248
+
2249
+ @media (max-width: 600px) {
2250
+ .next-ep-preview {
2251
+ width: calc(100% - 32px);
2252
+ max-width: 280px;
2253
+ right: 12px;
2254
+ padding: 10px 12px 12px;
2074
2255
  bottom: 56px;
2075
2256
  }
2076
- .next-ep-header{
2077
- font-size: 12px;
2078
- }
2079
- .next-ep-img {
2080
- width: 100px;
2081
- height: 60px;
2257
+
2258
+ .next-ep-header {
2259
+ font-size: 10px;
2082
2260
  }
2261
+
2083
2262
  .next-ep-title {
2263
+ font-size: 14px;
2264
+ }
2265
+
2266
+ .next-ep-desc {
2267
+ font-size: 12px;
2268
+ }
2269
+
2270
+ .next-ep-badge {
2084
2271
  font-size: 9px;
2085
- margin-left: 8px;
2272
+ padding: 2px 6px;
2273
+ }
2274
+
2275
+ .next-ep-episode {
2276
+ font-size: 11px;
2086
2277
  }
2087
2278
  }
2279
+
2280
+ /* Full-player thumbnail while the next episode asset loads */
2281
+ .video-js.next-ep-load-pending {
2282
+ position: relative;
2283
+ }
2284
+
2285
+ /* Full-player thumbnail while next-ep-preview is visible */
2286
+ .video-js:has(.next-ep-preview-player-thumb) {
2287
+ position: relative;
2288
+ }
2289
+
2290
+ .next-ep-preview-player-thumb {
2291
+ position: absolute;
2292
+ inset: 0;
2293
+ z-index: 5;
2294
+ overflow: hidden;
2295
+ background: #000;
2296
+ pointer-events: none;
2297
+ }
2298
+
2299
+ .next-ep-load-overlay {
2300
+ position: absolute;
2301
+ inset: 0;
2302
+ z-index: 10;
2303
+ overflow: hidden;
2304
+ background: #000;
2305
+ pointer-events: none;
2306
+ }
2307
+
2308
+ .next-ep-load-overlay-img {
2309
+ width: 100%;
2310
+ height: 100%;
2311
+ object-fit: cover;
2312
+ display: block;
2313
+ }
2314
+
2315
+ .video-js.next-ep-load-pending .vjs-loading-spinner {
2316
+ z-index: 30 !important;
2317
+ }
2318
+
2088
2319
  /* a wrapper element that tracks the mouse vertically */
2089
2320
  .vjs-thumbnail-holder {
2090
2321
  position: absolute;