@vidispine/vdt-videojs 21.3.0 → 21.4.0-pre.1
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.
- package/lib/index.cjs.js +97 -96
- package/lib/index.esm.js +76 -75
- package/lib/index.umd.js +99 -98
- package/lib/package.json +1 -1
- package/lib/style.css +134 -49
- package/package.json +1 -1
package/lib/style.css
CHANGED
|
@@ -379,7 +379,9 @@
|
|
|
379
379
|
|
|
380
380
|
.video-js.vjs-fluid,
|
|
381
381
|
.video-js.vjs-16-9,
|
|
382
|
-
.video-js.vjs-4-3
|
|
382
|
+
.video-js.vjs-4-3,
|
|
383
|
+
.video-js.vjs-9-16,
|
|
384
|
+
.video-js.vjs-1-1 {
|
|
383
385
|
width: 100%;
|
|
384
386
|
max-width: 100%;
|
|
385
387
|
height: 0;
|
|
@@ -393,6 +395,14 @@
|
|
|
393
395
|
padding-top: 75%;
|
|
394
396
|
}
|
|
395
397
|
|
|
398
|
+
.video-js.vjs-9-16 {
|
|
399
|
+
padding-top: 177.7777777778%;
|
|
400
|
+
}
|
|
401
|
+
|
|
402
|
+
.video-js.vjs-1-1 {
|
|
403
|
+
padding-top: 100%;
|
|
404
|
+
}
|
|
405
|
+
|
|
396
406
|
.video-js.vjs-fill {
|
|
397
407
|
width: 100%;
|
|
398
408
|
height: 100%;
|
|
@@ -451,8 +461,8 @@ body.vjs-full-window {
|
|
|
451
461
|
|
|
452
462
|
.vjs-lock-showing {
|
|
453
463
|
display: block !important;
|
|
454
|
-
opacity: 1;
|
|
455
|
-
visibility: visible;
|
|
464
|
+
opacity: 1 !important;
|
|
465
|
+
visibility: visible !important;
|
|
456
466
|
}
|
|
457
467
|
|
|
458
468
|
.vjs-no-js {
|
|
@@ -614,6 +624,11 @@ body.vjs-full-window {
|
|
|
614
624
|
color: #2B333F;
|
|
615
625
|
}
|
|
616
626
|
|
|
627
|
+
.video-js .vjs-menu *:not(.vjs-selected):focus:not(:focus-visible),
|
|
628
|
+
.js-focus-visible .vjs-menu *:not(.vjs-selected):focus:not(.focus-visible) {
|
|
629
|
+
background: none;
|
|
630
|
+
}
|
|
631
|
+
|
|
617
632
|
.vjs-menu li.vjs-menu-title {
|
|
618
633
|
text-align: center;
|
|
619
634
|
text-transform: uppercase;
|
|
@@ -746,6 +761,7 @@ body.vjs-full-window {
|
|
|
746
761
|
.vjs-has-started.vjs-user-inactive.vjs-playing .vjs-control-bar {
|
|
747
762
|
visibility: visible;
|
|
748
763
|
opacity: 0;
|
|
764
|
+
pointer-events: none;
|
|
749
765
|
transition: visibility 1s, opacity 1s;
|
|
750
766
|
}
|
|
751
767
|
|
|
@@ -779,6 +795,10 @@ body.vjs-full-window {
|
|
|
779
795
|
line-height: 1.67;
|
|
780
796
|
}
|
|
781
797
|
|
|
798
|
+
.vjs-button > .vjs-icon-placeholder {
|
|
799
|
+
display: block;
|
|
800
|
+
}
|
|
801
|
+
|
|
782
802
|
.video-js .vjs-control:focus:before,
|
|
783
803
|
.video-js .vjs-control:hover:before,
|
|
784
804
|
.video-js .vjs-control:focus {
|
|
@@ -1074,6 +1094,7 @@ body.vjs-full-window {
|
|
|
1074
1094
|
.video-js .vjs-volume-level:before {
|
|
1075
1095
|
position: absolute;
|
|
1076
1096
|
font-size: 0.9em;
|
|
1097
|
+
z-index: 1;
|
|
1077
1098
|
}
|
|
1078
1099
|
|
|
1079
1100
|
.vjs-slider-vertical .vjs-volume-level {
|
|
@@ -1082,6 +1103,7 @@ body.vjs-full-window {
|
|
|
1082
1103
|
.vjs-slider-vertical .vjs-volume-level:before {
|
|
1083
1104
|
top: -0.5em;
|
|
1084
1105
|
left: -0.3em;
|
|
1106
|
+
z-index: 1;
|
|
1085
1107
|
}
|
|
1086
1108
|
|
|
1087
1109
|
.vjs-slider-horizontal .vjs-volume-level {
|
|
@@ -1116,6 +1138,77 @@ body.vjs-full-window {
|
|
|
1116
1138
|
left: -2em;
|
|
1117
1139
|
}
|
|
1118
1140
|
|
|
1141
|
+
.video-js .vjs-volume-tooltip {
|
|
1142
|
+
background-color: #fff;
|
|
1143
|
+
background-color: rgba(255, 255, 255, 0.8);
|
|
1144
|
+
border-radius: 0.3em;
|
|
1145
|
+
color: #000;
|
|
1146
|
+
float: right;
|
|
1147
|
+
font-family: Arial, Helvetica, sans-serif;
|
|
1148
|
+
font-size: 1em;
|
|
1149
|
+
padding: 6px 8px 8px 8px;
|
|
1150
|
+
pointer-events: none;
|
|
1151
|
+
position: absolute;
|
|
1152
|
+
top: -3.4em;
|
|
1153
|
+
visibility: hidden;
|
|
1154
|
+
z-index: 1;
|
|
1155
|
+
}
|
|
1156
|
+
|
|
1157
|
+
.video-js .vjs-volume-control:hover .vjs-volume-tooltip,
|
|
1158
|
+
.video-js .vjs-volume-control:hover .vjs-progress-holder:focus .vjs-volume-tooltip {
|
|
1159
|
+
display: block;
|
|
1160
|
+
font-size: 1em;
|
|
1161
|
+
visibility: visible;
|
|
1162
|
+
}
|
|
1163
|
+
|
|
1164
|
+
.video-js .vjs-volume-vertical:hover .vjs-volume-tooltip,
|
|
1165
|
+
.video-js .vjs-volume-vertical:hover .vjs-progress-holder:focus .vjs-volume-tooltip {
|
|
1166
|
+
left: 1em;
|
|
1167
|
+
top: -12px;
|
|
1168
|
+
}
|
|
1169
|
+
|
|
1170
|
+
.video-js .vjs-volume-control.disabled:hover .vjs-volume-tooltip {
|
|
1171
|
+
font-size: 1em;
|
|
1172
|
+
}
|
|
1173
|
+
|
|
1174
|
+
.video-js .vjs-volume-control .vjs-mouse-display {
|
|
1175
|
+
display: none;
|
|
1176
|
+
position: absolute;
|
|
1177
|
+
width: 100%;
|
|
1178
|
+
height: 1px;
|
|
1179
|
+
background-color: #000;
|
|
1180
|
+
z-index: 1;
|
|
1181
|
+
}
|
|
1182
|
+
|
|
1183
|
+
.video-js .vjs-volume-horizontal .vjs-mouse-display {
|
|
1184
|
+
width: 1px;
|
|
1185
|
+
height: 100%;
|
|
1186
|
+
}
|
|
1187
|
+
|
|
1188
|
+
.vjs-no-flex .vjs-volume-control .vjs-mouse-display {
|
|
1189
|
+
z-index: 0;
|
|
1190
|
+
}
|
|
1191
|
+
|
|
1192
|
+
.video-js .vjs-volume-control:hover .vjs-mouse-display {
|
|
1193
|
+
display: block;
|
|
1194
|
+
}
|
|
1195
|
+
|
|
1196
|
+
.video-js.vjs-user-inactive .vjs-volume-control .vjs-mouse-display {
|
|
1197
|
+
visibility: hidden;
|
|
1198
|
+
opacity: 0;
|
|
1199
|
+
transition: visibility 1s, opacity 1s;
|
|
1200
|
+
}
|
|
1201
|
+
|
|
1202
|
+
.video-js.vjs-user-inactive.vjs-no-flex .vjs-volume-control .vjs-mouse-display {
|
|
1203
|
+
display: none;
|
|
1204
|
+
}
|
|
1205
|
+
|
|
1206
|
+
.vjs-mouse-display .vjs-volume-tooltip {
|
|
1207
|
+
color: #fff;
|
|
1208
|
+
background-color: #000;
|
|
1209
|
+
background-color: rgba(0, 0, 0, 0.8);
|
|
1210
|
+
}
|
|
1211
|
+
|
|
1119
1212
|
.vjs-poster {
|
|
1120
1213
|
display: inline-block;
|
|
1121
1214
|
vertical-align: middle;
|
|
@@ -1166,6 +1259,7 @@ body.vjs-full-window {
|
|
|
1166
1259
|
}
|
|
1167
1260
|
|
|
1168
1261
|
.video-js .vjs-seek-to-live-control {
|
|
1262
|
+
align-items: center;
|
|
1169
1263
|
cursor: pointer;
|
|
1170
1264
|
flex: none;
|
|
1171
1265
|
display: inline-flex;
|
|
@@ -1475,60 +1569,54 @@ video::-webkit-media-text-track-display {
|
|
|
1475
1569
|
line-height: inherit;
|
|
1476
1570
|
}
|
|
1477
1571
|
|
|
1478
|
-
.video-js
|
|
1479
|
-
.video-js
|
|
1480
|
-
.video-js
|
|
1481
|
-
.video-js
|
|
1482
|
-
.video-js
|
|
1483
|
-
.video-js
|
|
1484
|
-
.video-js
|
|
1485
|
-
.video-js
|
|
1486
|
-
.video-js
|
|
1487
|
-
.video-js
|
|
1488
|
-
.video-js
|
|
1489
|
-
.video-js
|
|
1490
|
-
.video-js
|
|
1491
|
-
.video-js
|
|
1492
|
-
.video-js
|
|
1493
|
-
.video-js
|
|
1494
|
-
.video-js
|
|
1495
|
-
.video-js
|
|
1496
|
-
.video-js
|
|
1497
|
-
.video-js
|
|
1498
|
-
.video-js
|
|
1499
|
-
.video-js
|
|
1500
|
-
.video-js
|
|
1501
|
-
.video-js
|
|
1502
|
-
.video-js
|
|
1503
|
-
.video-js
|
|
1504
|
-
.video-js
|
|
1505
|
-
.video-js
|
|
1506
|
-
.video-js
|
|
1507
|
-
.video-js
|
|
1508
|
-
.video-js
|
|
1572
|
+
.video-js.vjs-layout-small .vjs-current-time,
|
|
1573
|
+
.video-js.vjs-layout-small .vjs-time-divider,
|
|
1574
|
+
.video-js.vjs-layout-small .vjs-duration,
|
|
1575
|
+
.video-js.vjs-layout-small .vjs-remaining-time,
|
|
1576
|
+
.video-js.vjs-layout-small .vjs-playback-rate,
|
|
1577
|
+
.video-js.vjs-layout-small .vjs-chapters-button,
|
|
1578
|
+
.video-js.vjs-layout-small .vjs-descriptions-button,
|
|
1579
|
+
.video-js.vjs-layout-small .vjs-captions-button,
|
|
1580
|
+
.video-js.vjs-layout-small .vjs-subtitles-button,
|
|
1581
|
+
.video-js.vjs-layout-small .vjs-audio-button,
|
|
1582
|
+
.video-js.vjs-layout-small .vjs-volume-control, .video-js.vjs-layout-x-small .vjs-current-time,
|
|
1583
|
+
.video-js.vjs-layout-x-small .vjs-time-divider,
|
|
1584
|
+
.video-js.vjs-layout-x-small .vjs-duration,
|
|
1585
|
+
.video-js.vjs-layout-x-small .vjs-remaining-time,
|
|
1586
|
+
.video-js.vjs-layout-x-small .vjs-playback-rate,
|
|
1587
|
+
.video-js.vjs-layout-x-small .vjs-chapters-button,
|
|
1588
|
+
.video-js.vjs-layout-x-small .vjs-descriptions-button,
|
|
1589
|
+
.video-js.vjs-layout-x-small .vjs-captions-button,
|
|
1590
|
+
.video-js.vjs-layout-x-small .vjs-subtitles-button,
|
|
1591
|
+
.video-js.vjs-layout-x-small .vjs-audio-button,
|
|
1592
|
+
.video-js.vjs-layout-x-small .vjs-volume-control, .video-js.vjs-layout-tiny .vjs-current-time,
|
|
1593
|
+
.video-js.vjs-layout-tiny .vjs-time-divider,
|
|
1594
|
+
.video-js.vjs-layout-tiny .vjs-duration,
|
|
1595
|
+
.video-js.vjs-layout-tiny .vjs-remaining-time,
|
|
1596
|
+
.video-js.vjs-layout-tiny .vjs-playback-rate,
|
|
1597
|
+
.video-js.vjs-layout-tiny .vjs-chapters-button,
|
|
1598
|
+
.video-js.vjs-layout-tiny .vjs-descriptions-button,
|
|
1599
|
+
.video-js.vjs-layout-tiny .vjs-captions-button,
|
|
1600
|
+
.video-js.vjs-layout-tiny .vjs-subtitles-button,
|
|
1601
|
+
.video-js.vjs-layout-tiny .vjs-audio-button,
|
|
1602
|
+
.video-js.vjs-layout-tiny .vjs-volume-control {
|
|
1509
1603
|
display: none;
|
|
1510
1604
|
}
|
|
1511
|
-
.video-js:
|
|
1512
|
-
.video-js:not(.vjs-fullscreen).vjs-layout-small .vjs-volume-panel.vjs-volume-panel-horizontal:active,
|
|
1513
|
-
.video-js:not(.vjs-fullscreen).vjs-layout-small .vjs-volume-panel.vjs-volume-panel-horizontal.vjs-slider-active, .video-js:not(.vjs-fullscreen).vjs-layout-x-small .vjs-volume-panel.vjs-volume-panel-horizontal:hover,
|
|
1514
|
-
.video-js:not(.vjs-fullscreen).vjs-layout-x-small .vjs-volume-panel.vjs-volume-panel-horizontal:active,
|
|
1515
|
-
.video-js:not(.vjs-fullscreen).vjs-layout-x-small .vjs-volume-panel.vjs-volume-panel-horizontal.vjs-slider-active, .video-js:not(.vjs-fullscreen).vjs-layout-tiny .vjs-volume-panel.vjs-volume-panel-horizontal:hover,
|
|
1516
|
-
.video-js:not(.vjs-fullscreen).vjs-layout-tiny .vjs-volume-panel.vjs-volume-panel-horizontal:active,
|
|
1517
|
-
.video-js:not(.vjs-fullscreen).vjs-layout-tiny .vjs-volume-panel.vjs-volume-panel-horizontal.vjs-slider-active {
|
|
1605
|
+
.video-js.vjs-layout-small .vjs-volume-panel.vjs-volume-panel-horizontal:hover, .video-js.vjs-layout-small .vjs-volume-panel.vjs-volume-panel-horizontal:active, .video-js.vjs-layout-small .vjs-volume-panel.vjs-volume-panel-horizontal.vjs-slider-active, .video-js.vjs-layout-small .vjs-volume-panel.vjs-volume-panel-horizontal.vjs-hover, .video-js.vjs-layout-x-small .vjs-volume-panel.vjs-volume-panel-horizontal:hover, .video-js.vjs-layout-x-small .vjs-volume-panel.vjs-volume-panel-horizontal:active, .video-js.vjs-layout-x-small .vjs-volume-panel.vjs-volume-panel-horizontal.vjs-slider-active, .video-js.vjs-layout-x-small .vjs-volume-panel.vjs-volume-panel-horizontal.vjs-hover, .video-js.vjs-layout-tiny .vjs-volume-panel.vjs-volume-panel-horizontal:hover, .video-js.vjs-layout-tiny .vjs-volume-panel.vjs-volume-panel-horizontal:active, .video-js.vjs-layout-tiny .vjs-volume-panel.vjs-volume-panel-horizontal.vjs-slider-active, .video-js.vjs-layout-tiny .vjs-volume-panel.vjs-volume-panel-horizontal.vjs-hover {
|
|
1518
1606
|
width: auto;
|
|
1519
1607
|
width: initial;
|
|
1520
1608
|
}
|
|
1521
|
-
.video-js
|
|
1609
|
+
.video-js.vjs-layout-x-small:not(.vjs-liveui) .vjs-subs-caps-button, .video-js.vjs-layout-x-small:not(.vjs-live) .vjs-subs-caps-button, .video-js.vjs-layout-tiny .vjs-subs-caps-button {
|
|
1522
1610
|
display: none;
|
|
1523
1611
|
}
|
|
1524
|
-
.video-js
|
|
1612
|
+
.video-js.vjs-layout-x-small.vjs-liveui .vjs-custom-control-spacer, .video-js.vjs-layout-tiny .vjs-custom-control-spacer {
|
|
1525
1613
|
flex: auto;
|
|
1526
1614
|
display: block;
|
|
1527
1615
|
}
|
|
1528
|
-
.video-js
|
|
1616
|
+
.video-js.vjs-layout-x-small.vjs-liveui.vjs-no-flex .vjs-custom-control-spacer, .video-js.vjs-layout-tiny.vjs-no-flex .vjs-custom-control-spacer {
|
|
1529
1617
|
width: auto;
|
|
1530
1618
|
}
|
|
1531
|
-
.video-js
|
|
1619
|
+
.video-js.vjs-layout-x-small.vjs-liveui .vjs-progress-control, .video-js.vjs-layout-tiny .vjs-progress-control {
|
|
1532
1620
|
display: none;
|
|
1533
1621
|
}
|
|
1534
1622
|
|
|
@@ -1653,12 +1741,9 @@ video::-webkit-media-text-track-display {
|
|
|
1653
1741
|
|
|
1654
1742
|
.js-focus-visible .video-js *:focus:not(.focus-visible) {
|
|
1655
1743
|
outline: none;
|
|
1656
|
-
background: none;
|
|
1657
1744
|
}
|
|
1658
1745
|
|
|
1659
|
-
.video-js *:focus:not(:focus-visible)
|
|
1660
|
-
.video-js .vjs-menu *:focus:not(:focus-visible) {
|
|
1746
|
+
.video-js *:focus:not(:focus-visible) {
|
|
1661
1747
|
outline: none;
|
|
1662
|
-
background: none;
|
|
1663
1748
|
}
|
|
1664
1749
|
button,input,select,textarea,video{outline:none}.video-js .vjs-menu-item,button:focus{outline:initial}.video-js{max-width:100%;overflow:hidden}.video-js.init{height:0!important;display:none}.video-js video{transform:translateZ(0);-webkit-transform:translateZ(0);display:block}.video-js .vjs-poster{background-size:cover}.video-js .vjs-control-bar{height:50px;padding-top:6px;display:flex;background:-moz-linear-gradient(top,transparent 0,transparent 15%,rgba(0,0,0,.3) 100%);background:-webkit-linear-gradient(top,transparent,transparent 15%,rgba(0,0,0,.3));background:linear-gradient(180deg,transparent 0,transparent 15%,rgba(0,0,0,.3));filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#00000000",endColorstr="#4d000000",GradientType=0);transform:translateZ(0);-webkit-transform:translateZ(0);z-index:2}.video-js .vjs-control-bar .vdt-seekbar-wrapper{top:0;left:0;height:10px;width:100%;position:absolute;margin:0 auto}.video-js .vjs-big-play-button{font-size:90px;border:0;background-color:transparent;text-shadow:1px 2px 40px rgba(0,0,0,.4);z-index:2}.video-js .vjs-big-play-button .vjs-icon-placeholder:before{padding-top:5px}.video-js:hover .vjs-big-play-button,.video-js:hover .vjs-big-play-button:focus{background-color:transparent}.video-js .vjs-progress-control{top:0;left:0;position:absolute;display:block;width:100%;height:10px}.video-js .vjs-progress-control .vjs-load-progress{background:hsla(0,0%,100%,.2)}.video-js .vjs-progress-control .vjs-play-progress .vjs-time-tooltip,.video-js .vjs-progress-control:hover .vjs-play-progress .vjs-time-tooltip{display:none}.video-js .vjs-time-control.duration,.video-js .vjs-time-control.vjs-duration{margin-right:auto}.video-js .vdt-screenshot-button .vjs-icon-placeholder,.video-js .vjs-subs-caps-button .vjs-icon-placeholder{opacity:.6}.video-js.has-vdt-menu .vjs-subs-caps-button{display:none}.video-js.subtitles-active .vjs-subs-caps-button .vjs-icon-placeholder{opacity:1}.video-js .vjs-control{font-size:14px}.video-js .vjs-play-progress.vjs-slider-bar{background-color:red}.video-js .vjs-current-time,.video-js .vjs-no-flex .vjs-current-time,.video-js .vjs-time-control{display:block}.video-js .vjs-time-control{font-size:14px;padding:0;min-width:14px;text-align:center}.video-js .vjs-volume-panel,.video-js .vjs-volume-panel .vjs-mute-control{width:3em}.video-js .vjs-menu-button-popup .vjs-menu{bottom:20px}.video-js .vjs-menu-button-popup .vjs-menu .vjs-menu-content{background-color:rgba(28,28,28,.9);border-radius:7px}.video-js .vjs-menu-button-popup .vjs-menu li.vjs-menu-item:focus:not(.vjs-selected){background-color:transparent}.video-js .vjs-menu-button-popup .vjs-menu li.vjs-menu-item:hover:not(.vjs-selected){background-color:hsla(0,0%,100%,.2)}.video-js .vjs-menu-button-popup .vjs-menu .vjs-menu-item-text{color:#fff}.video-js .vjs-menu-button-popup .vjs-menu .vjs-menu-item.vjs-selected .vjs-menu-item-text{color:#333}.video-js .vdt-player-osd{pointer-events:none;position:absolute;top:0;left:0;height:100%;width:100%;opacity:0;z-index:4;-webkit-transform:translateZ(0) scale3d(.5,.5,.5);-webkit-backface-visibility:hidden;backface-visibility:hidden;transform:translateZ(0) scale3d(.5,.5,.5);transition:all .2s ease-out}.video-js .vdt-player-osd.active{opacity:1;-webkit-transform:scaleX(1);transform:scaleX(1)}.video-js .vdt-player-osd table{width:100%;height:100%}.video-js .vdt-player-osd table td{vertical-align:middle;text-align:center}.video-js .vdt-player-osd table td .osd-feedback-icon:before{font-family:VideoJS;content:"\f101";font-size:50px;padding:15px;display:inline-block;height:80px;width:80px;text-align:center;background:rgba(0,0,0,.2);border-radius:100%}.video-js .vdt-player-osd table td .pause:before{content:"\f103"}.video-js .vdt-player-osd table td .volchange.high:before{content:"\f107"}.video-js .vdt-player-osd table td .volchange.mid:before{content:"\f106"}.video-js .vdt-player-osd table td .volchange.low:before{content:"\f105"}.video-js .vdt-player-osd table td .mute:before,.video-js .vdt-player-osd table td .volchange.null:before{content:"\f104"}.video-js .vdt-player-osd table td .unmute:before{content:"\f107"}.video-js .vdt-player-osd table td .backward-jump:before,.video-js .vdt-player-osd table td .forward-jump:before{content:"\f101\f101";letter-spacing:-38px;padding-left:0;padding-right:34px}.video-js .vdt-player-osd table td .backward-jump:before{-webkit-transform:scaleX(-1);transform:scaleX(-1)}@keyframes vjs-spinner-fade{0%{border-top-color:hsla(0,0%,100%,.6)}35%{border-top-color:#fff}to{border-top-color:hsla(0,0%,100%,.6)}}.video-js .vjs-loading-spinner{margin:-40px 0 0 -40px;opacity:.85;border:5px solid hsla(0,0%,100%,.7);width:80px;height:80px;border-radius:100px;z-index:5}.video-js .vjs-loading-spinner:after,.video-js .vjs-loading-spinner:before{margin:-5px}.video-js .vjs-text-track-display,.video-js.vjs-user-inactive.vjs-playing .vjs-text-track-display{bottom:0;transition:transform .3s ease-out;-webkit-transform:translateZ(0);-webkit-backface-visibility:hidden;backface-visibility:hidden}.video-js .vjs-text-track-display>div,.video-js.vjs-user-inactive.vjs-playing .vjs-text-track-display>div{display:table;width:100%;height:100%;margin:0!important}.video-js .vjs-text-track-display .vjs-text-track-cue,.video-js.vjs-user-inactive.vjs-playing .vjs-text-track-display .vjs-text-track-cue{width:100%!important;bottom:0!important;top:auto!important;left:auto!important;right:auto!important;font-size:18px!important;height:auto!important;padding-bottom:1.5%;display:table-cell}.video-js .vjs-text-track-display .vjs-text-track-cue>div,.video-js.vjs-user-inactive.vjs-playing .vjs-text-track-display .vjs-text-track-cue>div{padding:2px 4px;line-height:1.25;border-radius:2px}.video-js.vjs-fullscreen .vjs-text-track-display .vjs-text-track-cue,.video-js.vjs-user-inactive.vjs-playing.vjs-fullscreen .vjs-text-track-display .vjs-text-track-cue{-webkit-backface-visibility:hidden;backface-visibility:hidden;font-size:24px!important}.video-js.vjs-controls-enabled.vjs-user-active .vjs-control-bar,.video-js.vjs-has-started.vjs-user-inactive.vjs-paused .vjs-control-bar,.video-js.vjs-has-started.vjs-user-inactive.vjs-playing:not(.vjs-fullscreen) .vjs-control-bar,.video-jsdiv .vjs-control-bar{opacity:1}.video-js.vjs-has-started.vjs-user-inactive.vjs-playing:not(.controls-below-player) .vjs-control-bar,.video-js:not(.controls-below-player) .vjs-control-bar{-webkit-backface-visibility:hidden;backface-visibility:hidden;transform:translate3d(0,50px,0);transition:transform .3s ease-in-out}.video-js.vjs-controls-enabled.vjs-user-active:not(.controls-below-player) .vjs-control-bar,.video-js.vjs-has-started.vjs-user-inactive.vjs-paused:not(.controls-below-player) .vjs-control-bar{transform:translateZ(0);-webkit-transform:translateZ(0)}.video-js.vjs-controls-enabled.vjs-user-active:not(.controls-below-player):not(.vjs-controls-disabled) .vjs-text-track-display,.video-js.vjs-has-started.vjs-user-inactive.vjs-paused:not(.controls-below-player):not(.vjs-controls-disabled) .vjs-text-track-display{transform:translate3d(0,-50px,0)}.video-js .vdt-timecode{display:inline;font-family:"monospace",sans-serif;margin-left:20px}.video-js .vdt-timecode input,.video-js .vdt-timecode span{font-size:16px}.video-js .vdt-timecode span{text-align:center;display:inline-block}.video-js .vdt-timecode input{display:inline-block;width:auto;border:0;background:transparent;color:inherit;width:21px}@media (max-width:640px){.video-js .vdt-timecode{flex-grow:3}}.video-js .vdt-timecode.duration{margin-left:0;margin-right:auto}.video-js .vdt-timecode.duration span{cursor:default}.video-js .vdt-timecode.duration:before{content:"/";display:inline-block;margin:0 5px;font-size:16px}@media (max-width:640px){.video-js .vdt-timecode.duration{display:none}}.video-js .vdt-cinema-button,.video-js .vdt-screenshot-button,.video-js .vdt-settings-menu-button{cursor:pointer}.video-js .vdt-cinema-button:after,.video-js .vdt-screenshot-button:after,.video-js .vdt-settings-menu-button:after{content:"\f10b";font-family:VideoJS;font-size:22px}.video-js .vdt-cinema-button:active,.video-js .vdt-cinema-button:focus,.video-js .vdt-screenshot-button:active,.video-js .vdt-screenshot-button:focus,.video-js .vdt-settings-menu-button:active,.video-js .vdt-settings-menu-button:focus{opacity:.6}.video-js .vdt-cinema-button:after{content:"\f10a"}.video-js .vdt-settings-menu-button:after{content:"\f110"}.video-js .vdt-help-overlay,.video-js .vdt-waveform-visual{position:absolute;top:0;left:0;background:#888;height:100%;width:100%;display:none;background:#88bfe8;background:-moz-linear-gradient(top,#88bfe8 0,#71a1c4 100%);background:-webkit-linear-gradient(top,#88bfe8,#71a1c4);background:linear-gradient(180deg,#88bfe8 0,#71a1c4);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#88bfe8",endColorstr="#71a1c4",GradientType=0)}.video-js .vdt-help-overlay canvas,.video-js .vdt-waveform-visual canvas{height:100%;width:100%}.video-js.vjs-has-started .vdt-waveform-visual{display:block}.video-js .vdt-help-overlay{font-size:15px;background:transparent;z-index:2;transition:opacity 1s ease-in-out;opacity:0;padding-bottom:12px}.video-js .vdt-help-overlay>table{height:100%;margin:0 auto}.video-js .vdt-help-overlay>table td.vdt-help-contents table{border-radius:7px;max-height:400px;-webkit-backdrop-filter:blur(10px);background:rgba(0,0,0,.6)}.video-js .vdt-help-overlay>table td.vdt-help-contents table td{padding:6px}.video-js .vdt-help-overlay>table td.vdt-help-contents table td:nth-child(2),.video-js .vdt-help-overlay>table td.vdt-help-contents table td td:nth-child(4){padding:4px 9px}.video-js .vdt-help-overlay>table td.vdt-help-contents table td:nth-child(2){padding-right:32px}.video-js .vdt-help-overlay>table td.vdt-help-contents table td:first-child div,.video-js .vdt-help-overlay>table td.vdt-help-contents table td:nth-child(3) div{text-align:center;padding:3px;border:1px solid #fff;border-radius:2px;background:hsla(0,0%,100%,.1);font-size:13px;min-width:21px}.video-js .vdt-help-overlay>table td.vdt-help-contents table td:first-child{padding-left:16px}.video-js .vdt-help-overlay>table td.vdt-help-contents table td:last-child{padding-right:16px}.video-js .vdt-help-overlay>table td.vdt-help-contents table tr:first-child td{padding-top:16px}.video-js .vdt-help-overlay>table td.vdt-help-contents table tr:last-child td{padding-bottom:16px}.video-js .vdt-help-overlay>table td{vertical-align:middle}.video-js .vdt-help-overlay.active{display:block;opacity:1}.video-js.controls-below-player:not(.vjs-controls-disabled).vjs-fullscreen .vjs-text-track-display,.video-js.controls-below-player:not(.vjs-controls-disabled).vjs-fullscreen.vjs-user-inactive.vjs-playing .vjs-text-track-display{bottom:60px}.video-js.controls-below-player:not(.vjs-fullscreen):not(.vjs-controls-disabled){overflow:visible;width:auto;height:auto;background-color:transparent;margin-bottom:70px}.video-js.controls-below-player:not(.vjs-fullscreen):not(.vjs-controls-disabled) video{position:relative}.video-js.controls-below-player:not(.vjs-fullscreen):not(.vjs-controls-disabled) .vjs-control-bar{transform:translate3d(0,60px,0);transition:all .3s ease-in-out;background:transparent}.video-js.controls-below-player:not(.vjs-fullscreen):not(.vjs-controls-disabled) .vjs-control-bar .vdt-timecode:not(.vjs-menu-item-text),.video-js.controls-below-player:not(.vjs-fullscreen):not(.vjs-controls-disabled) .vjs-control-bar .vjs-button:not(.vjs-menu-item-text){color:#333}.video-js.controls-below-player:not(.vjs-fullscreen):not(.vjs-controls-disabled).on-dark .vjs-control-bar .vdt-timecode:not(.vjs-menu-item-text),.video-js.controls-below-player:not(.vjs-fullscreen):not(.vjs-controls-disabled).on-dark .vjs-control-bar .vjs-button:not(.vjs-menu-item-text){color:#efefef}.video-js.controls-below-player:not(.vjs-fullscreen):not(.vjs-controls-disabled) .vjs-progress-holder{margin:0 auto}.video-js.controls-below-player:not(.vjs-fullscreen):not(.vjs-controls-disabled) .vjs-menu{bottom:35px}.video-js.controls-below-player:not(.vjs-fullscreen):not(.vjs-controls-disabled) .vjs-poster{height:auto}.video-js .vjs-picture-in-picture-control,.video-js .vjs-play-progress .vjs-time-tooltip,.video-js .vjs-play-progress:before,.video-js .vjs-progress-control:hover .vjs-progress-holder:focus .vjs-time-tooltip,.video-js .vjs-progress-control:hover .vjs-time-tooltips,.video-js .vjs-remaining-time{display:none}
|