ravnur-player-public 3.4.4 → 3.4.6

package/src/styles/index.js

@@ -1,1966 +0,0 @@
-import { createElement, first } from '../utils';
-
-/* eslint max-len: 0 */
-
-import getPlaylistStyles from './playlist.css';
-
-function _getStyles(styles, rect) {
-   let videoHeight4ccLayout = 'calc(100% - 160px)';
-
-   if (rect) {
-      videoHeight4ccLayout = rect.bottom - rect.top - 160 + 'px';
-   }
-
-   return `
-.rplayer {
-   font-family: 'Roboto',sans-serif;
-   width: 100%;
-   height: 100%;
-   -webkit-user-select: none;
-   -ms-user-select: none;
-   user-select: none;
-   outline: 0;
-   position: relative;
-   z-index: 1;
-   text-align: left;
-}
-
-.rplayer, .rplayer * {
-   box-sizing: border-box;
-}
-
-.rplayer--fullscreen .rplayer__inner {
-   height: 100% !important;
-   width: 100% !important;
-   min-height: 100vh;
-   min-width: 100vw;
-   z-index: 9999999;
-   position: static;
-   padding-bottom: 0;
-   margin: 0 auto
-}
-
-@media (orientation: portrait) {
-   .rplayer--fullscreen .rplayer--iphone .rmp-extensions {
-      bottom: 40px;
-   }
-   .rplayer--fullscreen .rplayer--iphone .rmp-ext-cc__text {
-      bottom: 125px;
-   }
-}
-
-.rplayer--fullscreen:-webkit-full-screen .rplayer__inner,
-.rplayer--fullscreen:-moz-full-screen .rplayer__inner,
-.rplayer--fullscreen:-ms-fullscreen .rplayer__inner,
-.rplayer--fullscreen:fullscreen .rplayer__inner,
-   min-height: 100vh;
-   min-width: 100vw;
-}
-
-.rplayer--fullscreen .rplayer__playlist-wrapper {
-   display: none;
-}
-
-.rplayer button span {
-   display: inline;
-   padding: 0;
-}
-
-.rplayer--fullscreen .rplayer .rmp-flash-wrapper, .rplayer--fullscreen .rplayer video {
-   background-color: black;
-}
-
-.rplayer audio {
-   width: 100%
-}
-
-.rplayer video {
-   outline: 0
-}
-
-.rplayer--fullscreen {
-   position: fixed!important;
-   top: 0!important;
-   bottom: 0!important;
-   right: 0!important;
-   left: 0!important;
-   background-color: black;
-   width: 100%!important;
-   max-width: 100% !important;
-   height: 100vh !important;
-   z-index: 9999999!important;
-   display: block;
-}
-
-.rplayer--fullscreen .rplayer {
-   display: table-cell;
-   vertical-align: middle
-}
-
-.rplayer__inner {
-   margin: auto;
-   background-color: black;
-}
-
-.rplayer__inner, .rplayer__playlist-wrapper {
-   position: relative;
-   overflow: hidden;
-   width: 100%;
-   height: 100%;
-}
-
-.rplayer__inner--playing .rmp-ext-help, .rplayer__inner--playing .rmp-ext-title {
-   opacity: 0;
-   z-index: -9;
-}
-
-.rplayer__inner--loading>* {
-   visibility: hidden
-}
-
-.rplayer__inner--loading>.loader {
-   border: 4px solid #f3f3f3;
-   border-top: 4px solid #666;
-   border-radius: 50%;
-   width: 60px;
-   height: 60px;
-   animation: spin 2s linear infinite;
-   visibility: visible;
-   position: absolute;
-   left: 50%;
-   top: 50%;
-   margin-top: -30px;
-   margin-left: -30px
-}
-
-@keyframes spin {
-   0% {
-      transform: rotate(0deg)
-   }
-
-   to {
-      transform: rotate(-360deg)
-   }
-}
-
-@-webkit-keyframes spin {
-   0% {
-      transform: rotate(0deg)
-   }
-
-   to {
-      transform: rotate(360deg)
-   }
-}
-
-.rplayer .rmp-flash-wrapper,.rplayer video {
-   background-color: transparent;
-   position: absolute;
-   top: 0;
-   left: 0;
-   bottom: 0;
-   height: 100%;
-   width: 100%;
-   border: 0
-}
-
-.rplayer .rplayer__inner--cc-below .rmp-flash-wrapper[id],.rplayer .rplayer__inner--cc-below video {
-   position: relative;
-   height: ${videoHeight4ccLayout};
-}
-
-.rplayer--cc-75-below .rplayer__inner--cc-below .rmp-flash-wrapper[id],.rplayer--cc-75-below .rplayer__inner--cc-below video {
-   height: calc(100% - 110px);
-}
-
-.rplayer--cc-100-below .rplayer__inner--cc-below .rmp-flash-wrapper[id],.rplayer--cc-100-below .rplayer__inner--cc-below video {
-   height: calc(100% - 140px);
-}
-
-.rplayer--cc-125-below .rplayer__inner--cc-below .rmp-flash-wrapper[id],.rplayer--cc-125-below .rplayer__inner--cc-below video {
-   height: calc(100% - 150px);
-}
-
-.rplayer--cc-150-below .rplayer__inner--cc-below .rmp-flash-wrapper[id],.rplayer--cc-150-below .rplayer__inner--cc-below video {
-   height: calc(100% - 170px);
-}
-
-.rplayer--cc-200-below .rplayer__inner--cc-below .rmp-flash-wrapper[id],.rplayer--cc-200-below .rplayer__inner--cc-below video {
-   height: calc(100% - 200px);
-}
-
-.rplayer--fullscreen .rplayer--cc-75-below .rplayer__inner--cc-below .rmp-flash-wrapper[id],.rplayer--fullscreen .rplayer--cc-75-below .rplayer__inner--cc-below video {
-   height: calc(100vh - 130px);
-}
-
-.rplayer--fullscreen .rplayer--cc-100-below .rplayer__inner--cc-below .rmp-flash-wrapper[id],.rplayer--fullscreen .rplayer--cc-100-below .rplayer__inner--cc-below video {
-   height: calc(100vh - 160px);
-}
-
-.rplayer--fullscreen .rplayer--cc-125-below .rplayer__inner--cc-below .rmp-flash-wrapper[id],.rplayer--fullscreen .rplayer--cc-125-below .rplayer__inner--cc-below video {
-   height: calc(100vh - 180px);
-}
-
-.rplayer--fullscreen .rplayer--cc-150-below .rplayer__inner--cc-below .rmp-flash-wrapper[id],.rplayer--fullscreen .rplayer--cc-150-below .rplayer__inner--cc-below video {
-   height: calc(100vh - 210px);
-}
-
-.rplayer--fullscreen .rplayer--cc-200-below .rplayer__inner--cc-below .rmp-flash-wrapper[id],.rplayer--fullscreen .rplayer--cc-200-below .rplayer__inner--cc-below video {
-   height: calc(100vh - 230px);
-}
-
-.rmp-extensions, .rmp-ext-title {
-   height: 86px;
-   left: 0;
-   right: 0;
-   position: absolute;
-   background-repeat: repeat-x;
-
-   background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAADGCAYAAAAT+OqFAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA0xpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTM4IDc5LjE1OTgyNCwgMjAxNi8wOS8xNC0wMTowOTowMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6RDg2NUVBOEM1QTQ0MTFFNzlGNTJDQTRCNzY1MURGNEMiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6RDg2NUVBOEI1QTQ0MTFFNzlGNTJDQTRCNzY1MURGNEMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTcgKE1hY2ludG9zaCkiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0iYWRvYmU6ZG9jaWQ6cGhvdG9zaG9wOjAzOTcwY2FjLWEyYWMtMTE3YS05OGUxLWI5NzUzOTY2ZTQ4MyIgc3RSZWY6ZG9jdW1lbnRJRD0iYWRvYmU6ZG9jaWQ6cGhvdG9zaG9wOjAzOTcwY2FjLWEyYWMtMTE3YS05OGUxLWI5NzUzOTY2ZTQ4MyIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PoORptwAAACaSURBVHjafFBbDoAgDBsbev87egsF8fEBtqmY2LRrGRtmZpvfcD7QEE7BKtYIinAruoNVAQXvKAjv2R27HHiMOpN7TN0qWjVRo7XU5iNnKFuvqfczwZTxgbj/hNJUDj/3n5xPpTJcSDIokrrMGM6dJZQvBOaisyRqgXLB2jJ1s3DHLCuOkXEMNQF1plUDt1Sbkxv4iMQG+CXAAOG1UnHx2OgyAAAAAElFTkSuQmCC');
-
-   color: ${styles.mainColor};
-   z-index: 4;
-   transition: opacity 500ms ease;
-}
-
-.rplayer--iphone .rmp-extensions, .rplayer--iphone .rmp-ext-title {
-   transition: none;
-   transform: translateZ(0);
-   z-index: 9;
-   background: linear-gradient(360deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0.75) 50%, rgba(0,0,0,0) 100%);
-}
-
-.rmp-extensions {
-   background-position: bottom;
-   bottom: -26px;
-   padding-top: 26px;
-   padding-right: 5px;
-   font-size: 12px;
-   z-index: 5;
-   display: flex;
-}
-
-.rmp-ext-backward, .rmp-ext-prev-frame, .rmp-ext-play, .rmp-ext-next-frame, .rmp-ext-forward, 
-.rmp-ext-volume, .rmp-ext-progress, .rmp-ext-settings, .rmp-ext-theater, .rmp-ext-cc, .rmp-ext-toc,
-.rmp-ext-audio-tracks, .rmp-ext-search, .rmp-ext-settings, .rmp-ext-fullscreen, .rmp-ext-bottom-next,
-.rmp-ext-bottom-prev {
-   max-height: 31px;
-}
-
-.rplayer--mobile .rmp-extensions {
-   bottom: -20px;
-}
-
-.rplayer__inner--light .rmp-ext-help,
-.rmp-extensions--hidden > .rmp-extensions, .rmp-extensions--hidden > .rmp-ext-title, .rmp-extensions--hidden > .rmp-ext-help {
-   opacity: 0;
-}
-
-.rplayer__inner--light.rplayer__inner--hovering .rmp-extensions, .rplayer__inner--light.rplayer__inner--hovering .rmp-ext-help,
-.rplayer__inner--active .rmp-extensions, .rplayer__inner--active .rmp-ext-help {
-   opacity: 1;
-}
-
-.rmp-extensions button, .rmp-ext-help__button {
-   height: 32px;
-   border: none;
-   cursor: pointer;
-   position: relative;
-   background-color: transparent;
-   float: left;
-   color: ${styles.submenuColor};
-   width: 36px
-}
-
-
-.rplayer--mobile .rmp-extensions .rmp-ext-forward, .rplayer--mobile .rmp-extensions .rmp-ext-backward {
-   display: none;
-}
-
-.rplayer--mobile .arrow svg {
-   width: 24px !important;
-   height: 24px !important;
-}
-
-.rmp-extensions button svg, .rmp-ext-help__button {
-   width: 24px;
-   height: 24px;
-   display: block;
-   fill: ${styles.mainColor};
-   opacity: .75
-}
-
-.rmp-extensions button:hover svg, .rmp-ext-help__button:hover {
-   opacity: 1
-}
-
-.rmp-extensions button, .rmp-ext-title__title,
-.rplayer__playlist-item, .rmp-ext-c2pa__item {
-   padding: 0 5px;
-   outline-offset: -2px;
-}
-
-.rplayer__inner--accessibility .rmp-extensions button:focus,
-.rplayer__inner--accessibility .rmp-ext-progress__bar:focus,
-.rplayer__inner--accessibility .rmp-ext-title__title:focus,
-.rplayer__inner--accessibility .rplayer__playlist-item:focus,
-.rplayer__inner--accessibility .rmp-ext-c2pa__item:focus {
-   outline: 2px solid blue;
-}
-
-.rmp-extensions > button:first-of-type {
-   margin-left: 6px
-}
-
-.rmp-ext-placeholder {
-   position: absolute;
-   top: 0;
-   right: 0;
-   bottom: 0;
-   left: 0;
-   z-index: 1;
-   background-color: #000;
-   opacity: 0.001;
-}
-
-.rmp-ext-placeholder--animation {
-   background-color: transparent;
-   opacity: 1;
-}
-
-.rplayer__inner--light .rmp-ext-placeholder__play-btn {
-   display: inline-block;
-}
-
-.rplayer__inner--light .rmp-ext-placeholder {
-   background-color: transparent;
-   opacity: 1;
-   cursor: pointer;
-}
-
-.rplayer__inner--light.rplayer__inner--hovering .rmp-ext-placeholder__play-btn {
-   width: 78px;
-   height: 78px;
-   margin-top: -40px;
-   margin-left: -40px;
-   cursor: pointer;
-}
-
-.rplayer__inner--light.rplayer__inner--hovering .rmp-ext-placeholder__play-btn svg {
-   top: 11px;
-   left: 11px;
-   cursor: pointer;
-}
-
-.rmp-ext-placeholder__play-btn {
-   background-color: rgba(61,61,61,.75);
-   border: 0 none;
-   border-radius: 50%;
-   position: absolute;
-   width: 72px;
-   height: 72px;
-   left: 50%;
-   top: 50%;
-   margin-top: -36px;
-   margin-left: -36px;
-   display: none;
-   outline: none;
-}
-
-.rmp-ext-placeholder__icon {
-   position: absolute;
-   width: 56px;
-   height: 56px;
-   left: 50%;
-   top: 50%;
-   margin-top: -28px;
-   margin-left: -28px
-}
-
-.rmp-ext-placeholder__icon svg, .rmp-ext-placeholder__play-btn svg {
-   position: absolute;
-   width: 56px;
-   height: 56px;
-   fill: #222
-}
-
-.rmp-ext-placeholder__play-btn svg {
-   fill: ${styles.mainColor};
-   position: absolute;
-   top: 8px;
-   left: 8px;
-}
-
-.rmp-ext-placeholder--animation .rmp-ext-placeholder__icon {
-   animation: disappear-icon .75s ease 1
-}
-
-@keyframes disappear-icon {
-   0% {
-      opacity: 1
-   }
-
-   to {
-      transform: scale(2);
-      opacity: 0
-   }
-}
-
-@-webkit-keyframes disappear-icon {
-   0% {
-      opacity: 1
-   }
-
-   to {
-      transform: scale(2);
-      opacity: 0
-   }
-}
-
-.rmp-extensions .rmp-ext-play svg {
-   display: none
-}
-
-.rmp-extensions .rmp-ext-play--paused .play,.rmp-extensions .rmp-ext-play--playing .pause, .rmp-extensions .rmp-ext-play--ended .replay {
-   display: block
-}
-
-.rmp-ext-progress {
-   flex-grow: 1;
-}
-
-.rmp-ext-progress__current {
-   line-height: 32px;
-   padding: 0 8px;
-   user-select: none
-}
-
-.rmp-ext-progress__overlay {
-   background-color: #fff;
-   display: block;
-   position: absolute;
-   top: 0;
-   left: 0;
-   right: 0;
-   bottom: 0;
-   opacity: .75
-}
-
-.rmp-ext-progress__bar {
-   cursor: pointer;
-   height: 4px;
-   border-radius: 2px;
-   position: absolute;
-   top: 14px;
-   left: 16px;
-   right: 16px;
-   display: block;
-   -webkit-box-shadow: 0 0 2px 0 rgba(51,51,51,.5);
-   box-shadow: 0 0 2px 0 rgba(51,51,51,.5);
-   transition: all 50ms linear
-}
-
-.rmp-ext-progress__generic-live-stream.rmp-ext-progress__bar {
-   pointer-events: none;
-}
-.rmp-ext-progress__generic-live-stream .rmp-ext-progress__progress {
-   width: 100% !important;
-   background-color: #e62048;
-}
-.rmp-ext-progress__generic-live-stream .rmp-ext-progress__handle,
-.rmp-ext-progress__generic-live-stream .rmp-ext-progress__play-progress,
-.rmp-ext-progress__generic-live-stream.rmp-ext-progress > span:nth-child(2),
-.rmp-ext-progress__generic-live-stream.rmp-ext-progress > span:nth-child(3) {
-   display: none;
-}
-
-.rmp-ext-progress__bar:hover {
-   height: 8px;
-   margin-top: -2px
-}
-
-.rmp-ext-progress__bar-padding {
-   position: absolute;
-   z-index: 5;
-   bottom: -2px;
-   left: 0;
-   right: 0;
-   display: block;
-   height: 18px;
-   cursor: pointer;
-}
-
-.rmp-ext-progress__duration {
-   line-height: 32px;
-   padding: 0 8px;
-   user-select: none;
-   position: relative
-}
-
-.rmp-ext-progress__handle {
-   position: absolute;
-   left: 0;
-   width: 6px;
-   height: 10px;
-   top: -3px;
-   margin-left: -3px;
-   cursor: pointer;
-   background-color: #fff;
-   border-radius: 2px;
-   -webkit-box-shadow: 0 0 2px 0 rgba(51,51,51,.25);
-   box-shadow: 0 0 2px 0 rgba(51,51,51,.25);
-   z-index: 7;
-   transform: translateZ(0);
-}
-
-@media only screen and (max-device-width: 768px) and (pointer:coarse) {
-   .rmp-ext-progress__handle {
-      width: 12px !important;
-      height: 24px !important;
-      top: -9px !important;
-      margin-left: -6px !important;
-      background-color: transparent;
-      box-shadow: none;
-      transform: translateZ(0);
-      padding: 6px 5px;
-   }
-
-   .rmp-ext-progress__chapter-bubble {
-      z-index: 5;
-   }
-
-   .rmp-ext-progress__handle:before {
-      content: '';
-      display: block;
-      width: 6px;
-      height: 10px;
-      top: -3px;
-      margin-left: -3px;
-      background-color: #fff;
-      border-radius: 2px;
-      -webkit-box-shadow: 0 0 2px 0 rgba(51,51,51,.25);
-      box-shadow: 0 0 2px 0 rgba(51,51,51,.25);
-      transform: translateZ(0);
-   }
-
-   .rmp-ext-progress__bar:hover .rmp-ext-progress__handle:before {
-      height: 14px;
-   }
-}
-
-.rmp-ext-progress__progress {
-   left: 0;
-   position: absolute;
-   top: 0;
-   bottom: 0;
-   background: #fff;
-   z-index: 2
-}
-
-.rmp-ext-progress__play-progress {
-   left: 0;
-   position: absolute;
-   top: 0;
-   bottom: 0;
-   background: ${styles.accentColor};
-   z-index: 3
-}
-
-.rmp-ext-progress__bar:hover .rmp-ext-progress__handle {
-   top: -4px;
-   height: 16px
-}
-
-.rmp-ext-progress__tooltip {
-   position: absolute;
-   bottom: 80px;
-   background-color: #333;
-   padding: 4px 8px;
-   font-size: 12px;
-   border-radius: 4px;
-   display: none;
-   text-align: center;
-   z-index: 5
-}
-
-.rmp-ext-progress__thumbmail:not(:empty) {
-   margin-bottom: 7px
-}
-
-.rmp-ext-progress__thumbmail-time,.rmp-ext-volume {
-   display: inline-block
-}
-
-.rmp-ext-volume__btn .muted,.rmp-ext-volume__btn--muted .unmuted {
-   display: none
-}
-
-.rmp-ext-volume__btn--muted .muted {
-   display: block
-}
-
-.rmp-ext-progress__tooltip--visible {
-   display: flex !important;
-   justify-content: center !important;
-   flex-direction: column !important;
-   align-items: center !important;
-}
-
-.rmp-ext-progress__chapter-bubble {
-   position: absolute;
-   display: block;
-   width: 12px;
-   height: 12px;
-   top: 50%;
-   margin-top: -6px;
-   margin-left: -6px;
-   z-index: 6
-}
-
-.rmp-ext-progress__chapter-bubble:before {
-   content: '';
-   position: absolute;
-   display: block;
-   position: absolute;
-   width: 8px;
-   height: 8px;
-   border-radius: 50%;
-   background-color: ${styles.chaptersBubbleColor};
-   top: 50%;
-   margin-top: -4px;
-   margin-left: 2px;
-   -webkit-box-shadow: 0 0 2px 0 rgba(251,251,251,.85);
-   box-shadow: 0 0 2px 0 rgba(251,251,251,.85);
-}
-
-.rmp-ext-volume__selector {
-   position: absolute;
-   bottom: 56px;
-   border-radius: 4px;
-   display: none;
-   z-index: 8;
-   background-color: ${styles.submenuBgColor};
-   width: 33px;
-}
-
-.rmp-ext-volume__selector--open, .rmp-ext-volume__selector--active {
-   display: block;
-}
-
-.rmp-ext-volume__slider {
-   cursor: pointer;
-   height: 100px;
-   display: inline-block;
-   width: 4px;
-   margin: 6px 14px;
-   position: relative;
-   line-height: 32px
-}
-
-.rmp-ext-volume__handle,.rmp-ext-volume__overlay,.rmp-ext-volume__progress {
-   position: absolute;
-   -webkit-box-shadow: 0 0 2px 0 rgba(51,51,51,.5);
-   box-shadow: 0 0 2px 0 rgba(51,51,51,.5);
-   border-radius: 2px
-}
-
-.rmp-ext-volume__handle {
-   width: 12px;
-   height: 8px;
-   margin-top: -4px;
-   cursor: pointer;
-   z-index: 2;
-   left: -4px;
-   border: 1px solid #90A4AE;
-   background-color: #fff
-}
-
-.rmp-ext-volume__overlay,.rmp-ext-volume__progress {
-   left: 0;
-   right: 0;
-   bottom: 0;
-   background-color: ${styles.accentColor}
-}
-
-.rmp-ext-volume__overlay {
-   display: block;
-   top: 0;
-   background-color: #fff;
-   opacity: .75
-}
-
-.rmp-ext-theater--hidden {
-   display: none;
-}
-
-.rmp-ext-fullscreen .exit-fullscreen-icon,.rmp-ext-fullscreen--exit .fullscreen-icon,
-.rmp-ext-theater--exit .rmp-ext-theater__icon,.rmp-ext-theater .rmp-ext-theater__exit-icon {
-   display: none
-}
-
-.rmp-ext-fullscreen--exit .exit-fullscreen-icon, .rmp-ext-theater--exit .rmp-ext-theater__exit-icon {
-   display: block
-}
-
-.rmp-ext-cc__text {
-   position: absolute;
-   bottom: 60px;
-   left: 0;
-   right: 0;
-   text-align: center;
-   display: none;
-   pointer-events: none;
-   color: ${styles.mainColor};
-   font-size: 18px;
-   opacity: .85;
-   z-index: 3;
-   transition: bottom 250ms ease
-}
-
-.rmp-ext-crawl {
-   position: absolute;
-   bottom: 60px;
-   left: 0;
-   right: 0;
-   pointer-events: none;
-   z-index: 3;
-   transition: bottom 250ms ease;
-   background-color: #224367;
-   color: #FFFFFF;
-   padding: 5px 0;
-   overflow: hidden;
-   white-space: nowrap;
-}
- 
- .rmp-ext-crawl__text {
-   width: max-content;
-   will-change: transform;
- }
-
- .rmp-ext-crawl__text * {
-   color: inherit !important;
- }
-
- .rmp-ext-crawl > .rmp-ext-crawl__text, .rmp-ext-crawl > .rmp-ext-crawl__text > * {
-   display: inline-block;
-   margin: 0;
-   padding: 0;
- }
-
-.rmp-ext-crawl--exist > .rmp-ext-cc__text {
-   bottom: 100px;
-}
-
-.rplayer--iphone .rmp-ext-cc__text {
-   transition: none;
-   bottom: 100px;
-   will-change: auto;
-}
-
-.rmp-extensions--hidden > .rmp-ext-cc__text {
-   bottom: 10px
-}
-
-.rmp-extensions--hidden > .rmp-ext-crawl {
-   bottom: 10px
-}
-
-.rmp-extensions--hidden.rmp-ext-crawl--exist > .rmp-ext-cc__text {
-   bottom: 50px
-}
-
-.rmp-ext-cc__text--visible {
-   display: block
-}
-
-.rmp-ext-cc__text-holder {
-   background-color: #333;
-   padding: 4px 8px;
-   border-radius: 4px;
-   display: inline-block;
-   line-height: 1.2
-}
-
-.rplayer__inner--cc-below .rmp-ext-cc__text {
-   position: static;
-   margin-top: 5px;
-}
-
-.rmp-ext-cc__selector {
-   position: absolute;
-   bottom: 56px;
-   border-radius: 4px;
-   display: none;
-   z-index: 8;
-   margin-left: -15px;
-   background-color: ${styles.submenuBgColor};
-   overflow: hidden;
-   width: 250px
-}
-
-.rmp-ext-cc__selector--open {
-   display: block
-}
-
-.rmp-ext-cc__selector .rmp-ext-cc__item {
-   padding-left: 18px;
-}
-
-.rmp-ext-cc__selector button:hover {
-   background-color: rgba(51,51,51,.25)
-}
-
-.rmp-ext-cc__item--checked:before,.rmp-ext-settings__item--checked:before,.rmp-ext-toc__lang-item--checked:before,.rmp-ext-audio-tracks__item--checked:before {
-   position: absolute;
-   content: '•';
-   margin-left: -12px;
-   font-size: 24px;
-   margin-top: -1px
-}
-
-.rmp-ext-toc {
-   width: 34px;
-   padding: 0 2px
-}
-
-.rmp-ext-toc__selector {
-   position: absolute;
-   bottom: 56px;
-   border-radius: 4px;
-   display: none;
-   z-index: 8;
-   overflow: hidden;
-   background-color: ${styles.submenuBgColor};
-   width: 250px
-}
-
-.rmp-ext-toc__chapters > .rmp-ext-toc__item {
-   width: 100%;
-   height: auto;
-   min-height: 32px;
-   text-align: left;
-   padding: 0 15px;
-}
-
-.rmp-ext-toc__chapters:empty {
-   padding-top: 0;
-}
-
-
-.rmp-ext-toc__selector--open {
-   display: block
-}
-
-.rmp-ext-toc__item,.rmp-ext-toc__selector a:hover {
-   text-decoration: none;
-   color: #000
-}
-
-.rmp-ext-toc__item {
-   margin-bottom: 14px;
-   display: block;
-   color: ${styles.submenuColor};
-   padding: 8px 0
-}
-
-.rmp-ext-toc__item:hover {
-   color: #333;
-   text-decoration: underline
-}
-
-.rmp-ext-toc__item:last-child {
-   margin-bottom: 0
-}
-
-button.rmp-ext-toc__more {
-   text-align: left;
-   width: 100%;
-   line-height: 32px;
-   padding-left: 12px;
-   border-top: 1px solid #AAA;
-}
-
-.rmp-ext-toc__more .arrow {
-   float: right;
-   width: 20px;
-   margin-top: 4px;
-}
-
-.rmp-ext-toc__more .arrow svg, button.rmp-ext-toc__back svg {
-   fill: ${styles.submenuColor}
-}
-
-.rmp-ext-toc__main-step:after, .rmp-ext-toc__languages-step:after {
-   content: ' ';
-   display: table;
-   clear: both;
-}
-
-.rmp-ext-toc__main-step, .rmp-ext-toc__languages-step, .rmp-ext-toc__translate-step {
-   display: none;
-   position: absolute;
-   left: 265px;
-   bottom: 0;
-   width: 100%;
-   overflow: auto;
-}
-
-.rmp-ext-toc__selector--main-step .rmp-ext-toc__main-step,
-.rmp-ext-toc__selector--translate-step .rmp-ext-toc__translate-step,
-.rmp-ext-toc__selector--languages-step .rmp-ext-toc__languages-step {
-   display: block;
-   position: relative;
-   left: 0;
-   width: 100%;
-}
-
-.rmp-ext-toc__selector--languages-step .rmp-ext-toc__main-step,
-.rmp-ext-toc__selector--translate-step .rmp-ext-toc__main-step,
-.rmp-ext-toc__selector--translate-step .rmp-ext-toc__languages-step {
-   display: none;
-   position: absolute;
-   left: -265px;
-}
-
-.rmp-ext-toc__selector--languages-step .rmp-ext-toc__back,
-.rmp-ext-toc__selector--translate-step .rmp-ext-toc__back {
-   border-bottom: 1px solid #AAA;
-   text-align: left;
-   width: 100%;
-   line-height: 32px;
-}
-
-.rmp-ext-toc__back span:first-of-type {
-   float: left;
-   padding: 3px 0;
-}
-
-button.rmp-ext-toc__lang-item {
-   width: 100%;
-   text-align: left;
-   padding: 0 12px 0 20px;
-   line-height: 32px;
-}
-
-
-.rmp-ext-toc__selector button:hover {
-   background-color: rgba(51,51,51,.25)
-}
-
-
-.rmp-ext-popover {
-   position: absolute;
-   bottom: 56px;
-   background-color: #666;
-   z-index: 9;
-   padding: 4px 6px;
-   border-radius: 4px;
-   font-size: 12px;
-   opacity: .875;
-   display: none
-}
-
-.rmp-annotation:hover .rmp-annotation__button,.rmp-ext-popover--visible {
-   display: block
-}
-
-.rmp-annotation {
-   position: absolute;
-   background-color: rgba(0,0,0,.8);
-   padding: 4px 6px;
-   color: #fff;
-   border: 1px solid #888;
-   display: none;
-   z-index: 3
-}
-
-.rmp-annotation--visible {
-   display: block
-}
-
-.rmp-annotation__button {
-   position: absolute;
-   top: -6px;
-   right: -6px;
-   background-color: #eee;
-   height: 18px;
-   width: 18px;
-   border-radius: 50%;
-   border: 0 none;
-   display: none;
-   cursor: pointer
-}
-
-.rmp-annotation__button svg {
-   fill: #666;
-   position: absolute;
-   top: 1px;
-   left: 1px
-}
-
-.rmp-annotation__button:hover svg {
-   fill: #333
-}
-
-.rmp-ext-poster, .rmp-ext-poster img {
-   width: 100%
-}
-.rmp-ext-poster img {
-   position: absolute;
-   margin: auto;
-   top: 0;
-   left: 0;
-   right: 0;
-   bottom: 0;
-
-   width: 100% !important;
-   height: auto !important;
-}
-
-.rmp-ext-poster {
-   position: absolute;
-   top: 0;
-   right: 0;
-   bottom: 0;
-   left: 0;
-   background-color: black;
-}
-
-.rmp-ext-poster--hidden {
-   display: none
-}
-
-.rmp-ext-settings {
-   width: 34px;
-   padding: 0 2px;
-}
-
-.rmp-ext-settings__selector {
-   position: absolute;
-   bottom: 56px;
-   border-radius: 4px;
-   display: none;
-   z-index: 8;
-   background-color: ${styles.submenuBgColor};
-   width: 260px;
-   right: 5px;
-   overflow: hidden;
-}
-
-.rmp-ext-settings__selector--open {
-   display: block
-}
-
-.rmp-ext-settings__selector button {
-   width: 100%;
-   text-align: left;
-   padding: 0 6px;
-   line-height: 32px;
-}
-
-.rmp-ext-settings__selector button:hover {
-   background-color: rgba(51,51,51,.25)
-}
-
-.rmp-ext-download__more .arrow, .rmp-ext-settings__more .arrow {
-   float: right;
-   width: 20px;
-   margin-top: 5px;
-}
-
-.rmp-ext-download__more .arrow svg, .rmp-ext-settings__more .arrow svg {
-   fill: ${styles.submenuColor}
-}
-
-.rmp-ext-settings__current-value, .rmp-ext-cc__current-value, .rmp-ext-toc__current-value {
-   float: right;
-   font-size: 11px;
-   color: #757575
-}
-
-.rmp-ext-cc__settings--progress .rmp-ext-cc__current-value {
-   font-style: italic;
-}
-
-.rmp-ext-cc__settings--progress {
-   background-color: transparent !important;
-}
-
-
-.rmp-ext-cc__settings--progress > span {
-   opacity: 0.5;
-}
-
-.rmp-ext-download__main-step, .rmp-ext-settings__main-step {
-   width: 100%;
-   left: 0;
-   position: relative;
-}
-
-.rmp-ext-download__main-step:after, .rmp-ext-download__additional-step:after,
-.rmp-ext-settings__main-step:after, .rmp-ext-settings__additional-step:after, .rplayer--right-playlist:after {
-   content: ' ';
-   display: table;
-   clear: both;
-}
-
-.rmp-ext-download__additional-step, .rmp-ext-settings__additional-step {
-   display: none;
-   position: absolute;
-   left: 265px;
-   bottom: 0;
-   width: 100%;
-   overflow: auto;
-}
-
-.rmp-ext-download__selector--additional .rmp-ext-download__additional-step,
-.rmp-ext-settings__selector--additional .rmp-ext-settings__additional-step {
-   display: block;
-   position: relative;
-   left: 0;
-   width: 100%;
-}
-
-.rmp-ext-download__selector--additional .rmp-ext-download__main-step,
-.rmp-ext-settings__selector--additional .rmp-ext-settings__main-step {
-   display: none;
-   position: absolute;
-   left: -265px;
-}
-
-button.rmp-ext-download__back, button.rmp-ext-settings__back {
-   border-bottom: 1px solid #AAA;
-}
-
-button.rmp-ext-download__back svg, button.rmp-ext-settings__back svg {
-   fill: ${styles.submenuColor};
-   float: left;
-}
-
-.rmp-ext-download__back > span:first-of-type, .rmp-ext-settings__back > span:first-of-type {
-   display: block;
-   float: left;
-   padding: 4px 0;
-}
-
-button.rmp-ext-settings__item {
-   padding-left: 20px
-}
-
-button.rmp-ext-settings__item.rmp-ext-settings__item--checked:before {
-   margin-top: -1px;
-}
-
-.rmp-ext-audio-tracks, .rmp-ext-search {
-   width: 34px;
-   padding: 0 2px;
-}
-
-.rmp-ext-search--hidden {
-   display: none;
-}
-
-.rmp-ext-audio-tracks__selector, .rmp-ext-search__selector {
-   position: absolute;
-   bottom: 56px;
-   border-radius: 4px;
-   display: none;
-   z-index: 8;
-   background-color: ${styles.submenuBgColor};
-   width: 260px;
-   right: 5px;
-   overflow: auto;
-}
-
-.rmp-ext-audio-tracks__selector--open, .rmp-ext-search__selector--open {
-   display: block
-}
-
-.rmp-ext-audio-tracks__selector button, .rmp-ext-search__selector button {
-   width: 100%;
-   text-align: left;
-   padding: 0 6px 0 20px;
-   line-height: 32px;
-}
-
-.rmp-ext-audio-tracks__selector button:hover, .rmp-ext-search__selector button:hover {
-   background-color: rgba(51,51,51,.25)
-}
-
-.rmp-ext-search__captions {
-   overflow: auto;
-   max-height: 160px;
-}
-
-.rmp-ext-search__input {
-   width: 100%;
-   margin-top: 2px;
-}
-
-.rplayer--mobile .rmp-ext-search__input {
-   height: 40px;
-}
-
-.rmp-ext-search__item--current {
-   font-weight: 600;
-}
-
-.rmp-ext-search__cc-text {
-   font-family: Roboto, "Arial Unicode Ms", Arial, Helvetica, Verdana, sans-serif;
-   overflow: hidden;
-   text-overflow: ellipsis;
-   display: inline-block !important;
-   white-space: nowrap;
-   width: 156px;
-   padding-left: 6px !important;
-   vertical-align: middle;
-}
-
-.rmp-ext-search__cc-time {
-   font-family: Roboto, "Arial Unicode Ms", Arial, Helvetica, Verdana, sans-serif;
-   display: inline-block !important;
-   width: 59px;
-   padding-right: 5px;
-   vertical-align: middle;
-   overflow: hidden;
-   margin-left: -5px;
-}
-
-button.rmp-ext-cc__more {
-   text-align: left;
-   width: 100%;
-   line-height: 32px;
-   padding-left: 20px;
-}
-
-.rmp-ext-cc__main-step button.rmp-ext-cc__more {
-   border-top: 1px solid #AAA;
-}
-
-.rmp-ext-cc__more .arrow {
-   float: right;
-   width: 20px;
-   margin-top: 4px;
-}
-
-.rmp-ext-cc__more .arrow svg, button.rmp-ext-cc__back svg {
-   fill: ${styles.submenuColor}
-}
-
-.rmp-ext-cc__main-step, .rmp-ext-cc__settings-step, .rmp-ext-cc__additional-step {
-   position: relative;
-   left: 0;
-   width: 100%;
-   overflow: auto;
-   display: block;
-}
-
-.rmp-ext-cc__selector--settings-step .rmp-ext-cc__main-step, .rmp-ext-cc__selector--additional-step .rmp-ext-cc__main-step,
-.rmp-ext-cc__selector--additional-step .rmp-ext-cc__settings-step, .rmp-ext-cc__selector--translate-step .rmp-ext-cc__main-step {
-   display: none;
-   position: absolute;
-   left: -255px;
-}
-
-.rmp-ext-cc__selector--main-step .rmp-ext-cc__settings-step, .rmp-ext-cc__selector--main-step .rmp-ext-cc__additional-step,
-.rmp-ext-cc__selector--settings-step .rmp-ext-cc__additional-step, .rmp-ext-cc__selector--translate-step .rmp-ext-cc__additional-step {
-   display: none;
-   position: absolute;
-   left: 255px;
-}
-
-.rmp-ext-cc__selector--settings-step .rmp-ext-cc__translate-wrapper, .rmp-ext-cc__selector--translate-step .rmp-ext-cc__settings-wrapper {
-   display: none;
-}
-
-.rmp-ext-cc__selector button {
-   text-align: left;
-   width: 100%;
-   line-height: 32px;
-}
-
-button.rmp-ext-cc__back {
-   border-bottom: 1px solid #AAA;
-}
-
-.rmp-ext-cc__back span:first-of-type {
-   float: left;
-   padding: 3px 0;
-}
-
-.rmp-ext-help__button {
-    position: absolute;
-    top: 8px;
-    right: 10px;
-    z-index: 6;
-    width: 32px;
-    height: 32px;
-    padding: 0;
-}
-
-.rmp-ext-help, .rmp-ext-help__canvas {
-   position: absolute;
-   top: 0;
-   right: 0;
-   left: 0;
-   bottom: 0;
-}
-
-.rmp-ext-help__canvas, rmp-ext-help__canvas--visible .rmp-ext-help__button {
-   display: none;
-}
-
-.rmp-ext-help__canvas--visible, .rmp-ext-help__canvas--visible .rmp-ext-help__canvas {
-   display: block;
-   z-index: 999;
-}
-
-.rmp-ext-title {
-   width: 100%;
-   top: 0;
-   z-index: 2
-}
-
-.rmp-ext-title__title {
-   font-size: 20px;
-   padding: 12px 50px 0 12px;
-   opacity: 0.95;
-   display: block;
-
-   max-height: 60px;
-   overflow: hidden;
-
-   display: -webkit-box;
-   -webkit-box-orient: vertical;
-   text-overflow: ellipsis;
-   -webkit-line-clamp: 2;
-}
-
-.rmp-ext-prev, .rmp-ext-next {
-   display: none;
-   position: absolute;
-   top: 50%;
-   margin-top: -34px;
-   cursor: pointer;
-   opacity: 0.75;
-   z-index: 4;
-}
-
-.rplayer--fullscreen .rmp-ext-prev, .rplayer--fullscreen .rmp-ext-next {
-   display: block;
-}
-
-.rmp-ext-prev:hover, .rmp-ext-next:hover {
-   opacity: 1;
-}
-
-.rmp-ext-prev {
-   transition: left 150ms ease
-}
-
-.rmp-ext-next {
-   transition: right 150ms ease
-}
-
-.rmp-ext-prev, .rplayer__inner--light.rplayer__inner--hovering .rmp-ext-prev {
-   left: -120px;
-}
-
-.rplayer__inner--light .rmp-ext-prev,
-.rmp-extensions--hidden > .rmp-ext-prev {
-   left: -175px;
-}
-
-.rmp-ext-next, .rplayer__inner--light.rplayer__inner--hovering .rmp-ext-next {
-   right: -120px;
-}
-
-.rplayer__inner--light .rmp-ext-next,
-.rmp-extensions--hidden > .rmp-ext-next {
-   right: -175px;
-}
-
-@media only screen and (max-device-width: 768px){
-.rplayer__inner .rmp-ext-next:hover {
-   right: -120px !important;
-}
-
-.rplayer__inner .rmp-ext-prev:hover {
-   left: -120px !important;
-}
-}
-
-.rmp-ext-prev__button, .rmp-ext-next__button {
-   background-color: #333;
-   border: 0;
-   height: 67.5px;
-   cursor: pointer
-}
-
-.rmp-ext-prev__button {
-   border-radius: 0 50% 50% 0;
-   float: right;
-   padding-left: 0;
-}
-
-.rmp-ext-next__button {
-   border-radius: 50% 0 0 50%;
-   float: left;
-   padding-right: 0;
-}
-
-.rmp-ext-prev__thumbnail, .rmp-ext-next__thumbnail {
-    width: 120px;
-    height: 67.5px;
-    border: 5px solid #333;
-}
-
-.rmp-ext-prev__button, .rmp-ext-prev__thumbnail {
-   -webkit-box-shadow: -2px 4px 5px 0px rgba(50, 50, 50, 0.75);
-   box-shadow: -2px 4px 5px 0px rgba(50, 50, 50, 0.75);
-}
-
-.rmp-ext-next__button, .rmp-ext-next__thumbnail {
-   -webkit-box-shadow: 2px 4px 5px 0px rgba(50, 50, 50, 0.75);
-   box-shadow: 2px 4px 5px 0px rgba(50, 50, 50, 0.75);
-}
-
-.rmp-ext-next:hover {
-   right: 0 !important;
-}
-
-.rmp-ext-prev:hover {
-   left: 0  !important;
-}
-
-.rmp-ext-prev__button svg, .rmp-ext-next__button svg {
-   fill: ${styles.mainColor};
-}
-
-.rmp-no-video {
-   position: absolute;
-   top: 50%;
-   margin-top: -.5em;
-   display: block;
-   text-align: center;
-   left: 0;
-   right: 0;
-}
-
-.rmp-ext-buffering {
-   position: absolute;
-   top: 0;
-   left: 0;
-   right: 0;
-   bottom: 0;
-   background: rgba(51,51,51,.5);
-   display: none;
-   z-index: 9999;
-}
-
-.rmp-ext-buffering--processing {
-   display: block;
-}
-
-.rmp-ext-buffering__message {
-   padding: 20px;
-   display: inline-block;
-   position: absolute;
-   left: 50%;
-   top: 50%;
-   transform: translate(-50%, -50%);
-}
-
-.rmp-ext-buffering__message svg {
-   fill: #FFF;
-   opacity: .75;
-   width: 50px;
-   height: 50px;
-   animation: spin 1.5s linear infinite;
-   animation-direction: reverse;
-}
-
-.rmp-ext-buffering--processing ~ .rmp-ext-placeholder {
-   opacity: 0;
-}
-
-.rmp-ext-download__main-step {
-   position: relative;
-   left: 0;
-   width: 100%;
-   overflow: auto;
-
-   -webkit-transition: left .25s ease;
-   transition: left .25s ease;
-}
-
-.rmp-ext-download-hidden {
-   position: absolute;
-   opacity: 0;
-}
-
-.rmp-ext-download__selector {
-   position: absolute;
-   bottom: 56px;
-   border-radius: 4px;
-   display: none;
-   z-index: 8;
-   background-color: ${styles.submenuBgColor};
-   width: 200px;
-   right: 5px;
-   overflow: hidden;
-}
-
-.rmp-ext-download__selector--open {
-   display: block
-}
-
-.rmp-ext-download__selector button {
-   width: 100%;
-   text-align: left;
-   padding: 0 6px;
-   line-height: 32px;
-}
-
-.rmp-ext-download__selector button:hover {
-   background-color: rgba(51,51,51,.25)
-}
-
-.rmp-ext-c2pa {
-   display: none;
-   position: absolute;
-   right: 12px;
-   top: 12px;
-   transition: opacity .25s ease;
-}
-
-.rmp-ext-c2pa__items-wrapper {
-   max-height: 250px;
-   overflow-y: auto;
-   overflow-x: hidden;
-}
-
-.rmp-ext-c2pa--visible { 
-   display: block !important;
-}
-
-.rmp-ext-c2pa--no-data > .rmp-ext-c2pa__button > svg {
-   fill: #F7B100;
-}
-
-.rmp-ext-c2pa--invalid > .rmp-ext-c2pa__button > svg {
-   fill: #E62048;
-}
-
-.rplayer__inner--playing .rmp-ext-c2pa {
-   opacity: 0;
-}
-.rplayer__inner--hovering .rmp-ext-c2pa {
-   opacity: 1 !important;
-}
-
-.rmp-ext-c2pa__selector.rmp-ext-c2pa__selector--open {
-   display: block;
-}
-
-.rmp-ext-c2pa__selector {
-   display: none;
-   background-color: #FFFFFF;
-   padding: 16px;
-   position: absolute;
-   min-width: 320px;
-   max-width: 320px;
-   z-index: 100;
-   top: 0;
-   right: 40px;
-   border-radius: 8px;
-   width: max-content;
-}
-
-.rmp-ext-c2pa button {
-   background-color: transparent;
-   border: none;
-   cursor: pointer;
-}
-
-.rmp-ext-c2pa > button > svg {
-   width: 24px;
-   height: 24px;
-   display: block;
-   fill: #fff;
-   z-index: 100;
-   position: relative;
-}
-
-.rmp-ext-c2pa__item {
-   position: relative;
-   min-height: 45px;
-}
-
-.rmp-ext-c2pa__item--collapsed::before {
-   content: "";
-   display: block;
-   position: absolute;
-   top: 5px;
-   left: 0;
-   width: 16px;
-   height: 16px;
-   background-color: #414141;
-   border-radius: 50%;
-}
-
-.rmp-ext-c2pa__item--invalid .rmp-ext-c2pa__item--collapsed::before {
-   background-color: #E62048;
-}
-
-.rmp-ext-c2pa__item--collapsed::after {
-   content: "";
-   display: block;
-   position: absolute;
-   top: 9px;
-   left: 4px;
-   width: 8px;
-   height: 8px;
-   background-color: #A9A9A9;
-   border-radius: 50%;
-}
-
-.rmp-ext-c2pa__item:not(:last-of-type) .rmp-ext-c2pa__item--line {
-   width: 2px;
-   background-color: #414141;
-   height: 100%;
-   position: absolute;
-   left: 7px;
-   top: 21px;
-}
-
-.rmp-ext-c2pa__item--section-title {
-   font-size: 12px;
-   color: #767676;
-   margin-left: 35px;
-   margin-bottom: 5px;
- }
-
- .rmp-ext-c2pa__item--collapsed .rmp-ext-c2pa__item--section-title {
-   margin-left: 0;
- }
-
-.rmp-ext-c2pa__item--wrapper {
-   display: flex;
-   align-items: start;
-   margin-bottom: 12px;
-   position: relative;
-}
-
-.rmp-ext-c2pa__item--toggler {
-   padding: 0;
-   position: absolute;
-   top: -5px;
-   right: 0px;
-   transform: rotate(0deg);
-   transition: transform .2s ease-in-out;
-}
-
-.rmp-ext-c2pa__item--toggler-opened {
-   transform: rotate(-180deg);
-}
-
-.rmp-ext-c2pa__item--thumbnail {
-   min-width: 30px;
-   height: 25px;
-   margin: 0 5px 0 0;
-   display: flex;
-   justify-content: center;
-   align-items: center;
-   overflow: hidden;
-   border-radius: 2px;
-   position: relative;
-}
-
-.rmp-ext-c2pa__item--thumbnail img {
-   object-fit: cover;
-   width: 100%;
-}
-
-.rmp-ext-c2pa__item--thumbnail svg {
-   fill: #000000;
-   width: 20px;
-   opacity: 0.8;
-}
-
-.rmp-ext-c2pa__item--info-wrapper {
-   line-height: 15px;
-   width: 100%;
-}
-
-.rmp-ext-c2pa__item:not(:last-of-type) .rmp-ext-c2pa__item--info-wrapper {
-   border-bottom: 1px solid #E5E5E5;
-   padding-bottom: 12px;
-}
-
-.rmp-ext-c2pa__item--title {
-   word-wrap: anywhere;
-   font-size: 14px;
-   font-weight: 500;
-   max-width: 230px;
-   padding-right: 20px;
-   margin-bottom: 6px;
-}
-
-.rmp-ext-c2pa__item--status-message, .rmp-ext-c2pa__item--status-message-extended {
-   font-size: 12px;
-   color: #767676;
-}
-
-.rmp-ext-c2pa__item--status-message-extended {
-   display: none;
-}
-
-.rmp-ext-c2pa__item-details-visible .rmp-ext-c2pa__item--status-message-extended {
-   display: block;
-}
-
-.rmp-ext-c2pa__item-details-visible .rmp-ext-c2pa__item--status-message {
-   display: none;
-}
-
-.rmp-ext-c2pa__view-more {
-   display: flex;
-   justify-content: center;
-   align-items: center;
-   width: 100%;
-   height: 40px;
-   margin-top: 6px;
-   padding: 5px;
-   border-radius: 100px;
-   background-color: #3665F3 !important;
-   color: #FFFFFF !important;
-   font-weight: 700;
-   font-size: 14px;
-   text-decoration: none;
-}
-
-.rmp-ext-c2pa__item-details {
-   display: none;
-}
-
-.rmp-ext-c2pa__item-details-visible .rmp-ext-c2pa__item-details {
-   display: flex;
-   flex-direction: column;
-   align-items: flex-start;
-   margin-top: 15px;
-}
-
-.rmp-ext-c2pa__item-details-visible .rmp-ext-c2pa__item-details > div {
-   display: flex;
-}
-
-.rmp-ext-c2pa__item--collapsed {
-   padding-left: 20px;
-}
-
-.rmp-ext-c2pa__item--collapsed .rmp-ext-c2pa__item-details-visible .rmp-ext-c2pa__item-details > div:nth-child(2) {
-   flex-direction: column;
-   margin-top: 16px;
-}
-
-.rmp-ext-c2pa__item--collapsed .rmp-ext-c2pa__item-details-visible .rmp-ext-c2pa__item-details > div:nth-child(2) > .rmp-ext-c2pa__item--wrapper {
-   margin: 5px 0px 0 -5px;
-}
-
-.rmp-ext-c2pa__item-details--icon {
-   margin-top: 5px;
-}
-
-.rmp-ext-c2pa__item-details > svg {
-   min-width: 32px;
-}
-
-.rmp-ext-c2pa__item-details--wrapper {
-   margin-left: 10px;
-}
-
-.rmp-ext-c2pa__item-details--issuer {
-   color: #767676;
-   font-size: 12px;
-   display: flex;
-}
-
-.rmp-ext-c2pa__item-details--issuer-title {
-   font-weight: 700;
-   min-width: 65px;
-   margin-bottom: 4px;
-}
-
-.rmp-ext-c2pa__view-more svg {
-   fill: #FFFFFF;
-   margin-left: 5px;
-}
-
-.rmp-ext-progress__c2pa-status {
-   position: absolute;
-   left: 0;
-   top: 0;
-   bottom: 0;
-   width: 100%;
-}
-
-.rmp-ext-c2pa__items-status--wrapper {
-   font-size: 12px;
-   margin-bottom: 24px;
-   color: #767676;
-   display: flex;
-   text-transform: uppercase;
-}
-
-.rmp-ext-c2pa__items-status {
-   padding-left: 5px;
-}
-
-.rmp-ext-c2pa__items-status--success {
-   color: #767676;
-}
-
-.rmp-ext-c2pa__items-status--no-data {
-   color: #F7B100;
-}
-
-.rmp-ext-c2pa__items-status--invalid {
-   color: #E62048;
-}
-
-.rmp-ext-c2pa__items-status--undefined {
-   color: #E62048;
-}
-
-.rmp-ext-c2pa__no-data-message-wrapper {
-   display: flex;
-   align-items: center;
-   margin-bottom: 24px;
-}
-
-.rmp-ext-c2pa__no-data-message-wrapper > svg {
-   fill: #767676;
-}
-
-.rmp-ext-c2pa__no-data-message {
-   max-width: 220px;
-   margin-left: 12px;
-   font-size: 12px;
-   color: #767676;
-   font-weight: 500;
-}
-
-.rmp-ext-progress__c2pa-status--invalid-segment {
-   position: absolute;
-   top: 0;
-   bottom: 0;
-   background-color: orange;
-   z-index: 6;
-   transform: scale(1);
-   transition: all .1s ease-in-out;
-}
-
-.rmp-ext-bottom-next--hidden, .rmp-ext-bottom-prev--hidden {
-   display: none;
-}
-
-.rmp-ext-search__selector > .rmp-ext-search__cc-clear {
-   position: absolute;
-   bottom: 3px;
-   right: 5px;
-   width: 15px;
-   height: 15px;
-   padding: 0;
-}
-
-.rmp-ext-search__selector > .rmp-ext-search__cc-clear:hover {
-   background-color: transparent;
-   opacity: 0.8;
-}
-
-.rmp-ext-search__selector > .rmp-ext-search__cc-clear svg {
-   width: 15px;
-   height: 15px;
-   fill: #707070;
-}
-
-.rmp-ext-live {
-   width: 34px;
-}
-
-.rmp-ext-live .broadcast-off {
-   display: block;
-}
-
-.rmp-ext-live .broadcast-on {
-   display: none;
-}
-
-.rmp-ext-live--live .broadcast-off {
-   display: none;
-}
-
-.rmp-ext-live--live .broadcast-on {
-   display: block;
-   fill: #ff1111;
-}
-
-.rmp-ext-progress__hidden > span{
-   visibility: hidden;
-}
-
-@media only screen and (max-width: 1224px) {
-   .rmp-ext-progress__hidden > .rmp-ext-progress__current {
-      visibility: visible !important;
-   }
-}
-
-.rmp-ext-error {
-   padding: 20px;
-   text-align: center;
-   z-index: 9999;
-   position: absolute;
-   width: 100%;
-   height: 100%;
-   background-color: black;
-   color: #FFFFFF;
-   display: flex;
-   justify-content: center;
-   align-items: center;
-   flex-direction: column;
-}
-
-.rmp-ext-error > svg {
-   width: 50px;
-   height: 50px;
-   fill: #FFFFFF;
-   margin-bottom: 20px;
-}
-    
-.rmp-ext-error--hidden {
-   display: none;
-}
-
-
-
-   `;
-}
-
-export default function appendStyles(options, rect) {
-   const css = _getStyles(options, rect) + ' ' + getPlaylistStyles(options, rect);
-   const head = document.head || first(document.getElementsByTagName('head'));
-
-   const style = createElement('style', { type: 'text/css' });
-
-   if (style.styleSheet) {
-      if (window.$) {
-         window.$('<style type="text/css">' + css + '</style>').appendTo('head');
-      } else {
-         style.styleSheet.cssText = css;
-      }
-   } else {
-      style.appendChild(document.createTextNode(css));
-   }
-   head.appendChild(style);
-}