From cbc731c581070b61e8f13960f999d09684038822 Mon Sep 17 00:00:00 2001
From: Heckyel <heckyel@openmailbox.org>
Date: Fri, 10 Feb 2017 15:14:47 -0500
Subject: new version compatible with hotkeys

---
 librevideojs/css/librevideojs-material/master.css | 3069 ---------------------
 1 file changed, 3069 deletions(-)
 delete mode 100644 librevideojs/css/librevideojs-material/master.css

(limited to 'librevideojs/css/librevideojs-material/master.css')

diff --git a/librevideojs/css/librevideojs-material/master.css b/librevideojs/css/librevideojs-material/master.css
deleted file mode 100644
index 8aaa213..0000000
--- a/librevideojs/css/librevideojs-material/master.css
+++ /dev/null
@@ -1,3069 +0,0 @@
-/*!
-LibreVideoJS Estilos personalizados
-Version 1.4
-Escrito por Jesús Eduardo
-*/
-/* SKIN
-================================================================================
-The main class name for all skin-specific styles. To make your own skin,
-replace all occurances of 'librevjs-default-skin' with a new name. Then add your new
-skin name to your video tag instead of the default skin.
-e.g. <video class="librevideo-js my-skin-name">
-*/
-/* Custom Icon Font
---------------------------------------------------------------------------------
-The control icons are from a custom font. Each icon corresponds to a character
-(e.g. "\e002"). Font icons allow for easy scaling and coloring of icons.
-*/
-/* Universal fonts */
-@font-face {
-font-family:"LibreVideoJS";
-src: url("../../fonts/libre-material/libre-icons.eot") format("embedded-opentype");
-src: local('?'),
-     url("../../fonts/libre-material/libre-icons.woff") format("woff"),
-     url("../../fonts/libre-material/libre-icons.ttf") format("truetype"),
-     url("../../fonts/libre-material/libre-icons.svg") format("svg");
-}
-/* Skins
-=========================================================================================================================*/
-/* Skin-Blue ------------------------------------------------------------------------------------------------------------*/
-.librevjs-libre-materialblue-skin {
-color:#ccc;
-background-color: inherit;
-}
-
-/* Base UI Component Classes
-------------------------------------------------------------------------------*/
-/* Slider - used for Volume bar and Seek bar */
-.librevjs-libre-materialblue-skin .librevjs-slider {
-/* Replace browser focus highlight with handle highlight */
-outline: 0;
-position: relative;
-cursor: pointer;
-padding: 0;
-/* background-color-with-alpha */
-background-color: #000000;
-background-color: rgba(0, 0, 0, 0.5);
-}
-.librevjs-libre-materialblue-skin .librevjs-slider:focus {
--webkit-box-shadow:0 0 2em #fff;
--moz-box-shadow:0 0 2em #fff;
-box-shadow:0 0 2em #fff;
-}
-
-/*Eliminación de botón de barra de progreso*/
-.librevjs-libre-materialblue-skin .librevjs-slider-handle {
-width: 0;
-height: 0;
-}
-.librevjs-libre-materialblue-skin .librevjs-slider-handle:before {
-text-shadow: 0em 0em 1em #fff;
-position: absolute;
-top: 0;
-left: 0;
-}
-
-/* Control Bar
---------------------------------------------------------------------------------
-The default control bar that is a container for most of the controls.
-*/
-.librevjs-libre-materialblue-skin .librevjs-control-bar {
-/* Start hidden */
-display: none;
-position: absolute;
-/* Place control bar at the bottom of the player box/video.
-   If you want more margin below the control bar, add more height. */
-bottom: 0;
-/* Use left/right to stretch to 100% width of player div */
-left: 0;
-right: 0;
-/* Height includes any margin you want above or below control items */
-height: 3.0em;
-/* background-color-with-alpha */
-background-color: #232323;
-background-color: rgba(35, 35, 35, 0.8);
-}
-/* Show the control bar only once the video has started playing */
-.librevjs-libre-materialblue-skin.librevjs-has-started .librevjs-control-bar {
-display:block;
-visibility:visible;
-opacity:1;
--webkit-transition:visibility .1s,opacity .1s;
--moz-transition:visibility .1s,opacity .1s;
--o-transition:visibility .1s,opacity .1s;
-transition:visibility .1s,opacity .1s
-}
-/* Hide the control bar when the video is playing and the user is inactive */
-.librevjs-libre-materialblue-skin.librevjs-has-started.librevjs-user-inactive.librevjs-playing .librevjs-control-bar {
-display:block;
-visibility:hidden;
-opacity:0;
--webkit-transition:visibility 1s,opacity 1s;
--moz-transition:visibility 1s,opacity 1s;
--o-transition:visibility 1s,opacity 1s;
-transition:visibility 1s,opacity 1s
-}
-.librevjs-libre-materialblue-skin.librevjs-controls-disabled .librevjs-control-bar {
-display:none
-}
-.librevjs-libre-materialblue-skin.librevjs-using-native-controls .librevjs-control-bar {
-display:none
-}
-@media \0screen {
- .librevjs-libre-materialblue-skin.librevjs-user-inactive.librevjs-playing .librevjs-control-bar :before {
- content:""
- }
-}
-/* General styles for individual controls. */
-.librevjs-libre-materialblue-skin .librevjs-control {
-outline:0;
-position:relative;
-float:left;
-text-align:center;
-margin:0;
-padding:0;
-height:3em;
-width:4em
-}
-/* FreeArt button icons: http://artlibre.org/licence/lal */
-.librevjs-libre-materialblue-skin .librevjs-control:before {
-font-family:LibreVideoJS;
-font-size:1.5em;
-line-height:2;
-position:absolute;
-top:0;
-left:0;
-width:100%;
-height:100%;
-text-align:center;
-text-shadow:1px 1px 1px rgba(0,0,0,.5)
-}
-/* Replacement for focus outline */
-.librevjs-libre-materialblue-skin .librevjs-control:focus:before,.librevjs-libre-materialblue-skin .librevjs-control:hover:before {
-color: #2196F3;
-}
-.librevjs-libre-materialblue-skin .librevjs-control:focus {
-  /*  outline: 0; */
-  /* keyboard-only users cannot see the focus on several of the UI elements when this is set to 0 */
-}
-/* Hide control text visually, but have it available for screenreaders */
-.librevjs-libre-materialblue-skin .librevjs-control-text {
-border:0;
-clip:rect(0 0 0 0);
-height:1px;
-margin:-1px;
-overflow:hidden;
-padding:0;
-position:absolute;
-width:1px
-}
-
-/* Play/Pause
---------------------------------------------------------------------------------
-*/
-.librevjs-libre-materialblue-skin .librevjs-play-control {
-width:5em;
-cursor:pointer;
-color:rgb(33, 150, 244);
-}
-.librevjs-libre-materialblue-skin .librevjs-play-control:before {
-content:"\e001"
-}
-.librevjs-libre-materialblue-skin .librevjs-play-control:hover:before {
-color:#2980b9; /*color de play control al pasar el cursor*/
-}
-.librevjs-libre-materialblue-skin.librevjs-playing .librevjs-play-control:before {
-content:"\e002"
-}
-/* Volume/Mute
--------------------------------------------------------------------------------- */
-.librevjs-libre-materialblue-skin .librevjs-mute-control,.librevjs-libre-materialblue-skin .librevjs-volume-menu-button {
-cursor:pointer;
-float:right
-}
-.librevjs-libre-materialblue-skin .librevjs-mute-control:before,.librevjs-libre-materialblue-skin .librevjs-volume-menu-button:before {
-content:"\e006"
-}
-.librevjs-libre-materialblue-skin .librevjs-mute-control.librevjs-vol-0:before,.librevjs-libre-materialblue-skin .librevjs-volume-menu-button.librevjs-vol-0:before {
-content:"\e003"
-}
-.librevjs-libre-materialblue-skin .librevjs-mute-control.librevjs-vol-1:before,.librevjs-libre-materialblue-skin .librevjs-volume-menu-button.librevjs-vol-1:before {
-content:"\e004"
-}
-.librevjs-libre-materialblue-skin .librevjs-mute-control.librevjs-vol-2:before,.librevjs-libre-materialblue-skin .librevjs-volume-menu-button.librevjs-vol-2:before {
-content:"\e005"
-}
-.librevjs-libre-materialblue-skin .librevjs-volume-control {
-width:5em;
-float:right
-}
-.librevjs-libre-materialblue-skin .librevjs-volume-bar {
-width:5em;
-height:.6em;
-margin:1.1em auto 0
-}
-.librevjs-libre-materialblue-skin .librevjs-volume-menu-button .librevjs-menu-content {
-height:2.9em
-}
-
-/*Personalización del nivel de volumen*/
-.librevjs-libre-materialblue-skin .librevjs-volume-level {
-position: absolute;
-top: 0;
-left: 0;
-height: 0.5em;
-/* assuming volume starts at 1.0 */
-
-width: 100%;
-background: #2196F3 url() -50% 0 repeat;
-}
-.librevjs-libre-materialblue-skin .librevjs-volume-bar .librevjs-volume-handle {
-width:.5em;
-height:.5em
-}
-.librevjs-libre-materialblue-skin .librevjs-volume-handle:before {
-font-size:.9em;
-top:-.2em;
-left:-.2em;
-width:1em;
-height:1em;
-}
-.librevjs-libre-materialblue-skin .librevjs-volume-menu-button .librevjs-menu .librevjs-menu-content {
-width:6em;
-left:-4em;
-}
-
-/* Progress
---------------------------------------------------------------------------------
-*/
-.librevjs-libre-materialblue-skin .librevjs-progress-control {
-position:absolute;
-left:0;
-right:0;
-width:auto;
-font-size:.3em;
-height:1em;
-top:-1em;
--webkit-transition:all .4s;
--moz-transition:all .4s;
--o-transition:all .4s;
-transition:all .4s;
-}
-.librevjs-libre-materialblue-skin:hover .librevjs-progress-control {
-font-size:.9em;
--webkit-transition:all .2s;
--moz-transition:all .2s;
--o-transition:all .2s;
-transition:all .2s;
-}
-/* Box containing play and load progress. Also acts as seek scrubber. */
-.librevjs-libre-materialblue-skin .librevjs-progress-holder {
-height:100%;
-}
-/* Progress Bars */
-.librevjs-libre-materialblue-skin .librevjs-progress-holder .librevjs-play-progress,.librevjs-libre-materialblue-skin .librevjs-progress-holder .librevjs-load-progress {
-position:absolute;
-display:block;
-height:100%;
-margin:0;
-padding:0;
-left:0;
-top:0
-}
-.librevjs-libre-materialblue-skin .librevjs-play-progress {
-background: #2196F3 url() -50% 0 repeat;
-}
-.librevjs-libre-materialblue-skin .librevjs-load-progress {
-background:#646464;
-background:rgba(255,255,255,.4)
-}
-.librevjs-libre-materialblue-skin .librevjs-seek-handle {
-width:1.5em;
-height:100%
-}
-.librevjs-libre-materialblue-skin .librevjs-seek-handle:before {
-padding-top:.1em
-}
-
-/* Time Display
---------------------------------------------------------------------------------
-*/
-.librevjs-libre-materialblue-skin .librevjs-time-controls {
-font-size:1em;
-font-weight: 700;/*mayor visibilidad*/
-line-height:3em
-}
-.librevjs-libre-materialblue-skin .librevjs-current-time {
-float:left
-}
-.librevjs-libre-materialblue-skin .librevjs-duration {
-float:left
-}
-.librevjs-libre-materialblue-skin .librevjs-remaining-time {
-display:none;
-float:left
-}
-
-/* Fullscreen
---------------------------------------------------------------------------------
-*/
-.librevjs-libre-materialblue-skin .librevjs-fullscreen-control {
-width:3.8em;
-cursor:pointer;
-float:right
-}
-.librevjs-libre-materialblue-skin .librevjs-fullscreen-control:before {
-content:"\e000"
-}
-/* Switch to the exit icon when the player is in fullscreen */
-.librevjs-libre-materialblue-skin.librevjs-fullscreen .librevjs-fullscreen-control:before {
-content:"\e00b"
-}
-
-/* Big Play Button (play button at start)
---------------------------------------------------------------------------------
-Positioning of the play button in the center or other corners can be done more
-easily in the skin designer by LibreVideoJS FreeArts.
-*/
-.librevjs-libre-materialblue-skin .librevjs-big-play-button {
-  left: 50%;
-  top: 40%;
-  font-size: 10em;
-  display: block;
-  z-index: 2;
-  position: absolute;
-  width: 1em;
-  height: 1em;
-  margin-left: -0.5em;
-  margin-top: -0.5em;
-  text-align: center;
-  vertical-align: middle;
-  cursor: pointer;
-  opacity: 1;
-  color: #2196F3;
-}
-/* Hide if controls are disabled */
-.librevjs-libre-materialblue-skin.librevjs-controls-disabled .librevjs-big-play-button {
-display: none;
-}
-/* Hide when video starts playing */
-.librevjs-libre-materialblue-skin.librevjs-has-started .librevjs-big-play-button {
-display: none;
-}
-/* Hide on mobile devices. Remove when we stop using native controls
-   by default on mobile  */
-.librevjs-libre-materialblue-skin.librevjs-using-native-controls .librevjs-big-play-button {
-display: none;
-}
-.librevjs-libre-materialblue-skin:hover .librevjs-big-play-button,
-.librevjs-libre-materialblue-skin .librevjs-big-play-button:focus {
-color: #0289f4; /*color boton focus*/
-}
-.librevjs-libre-materialblue-skin .librevjs-big-play-button:before {
-content: "\e007";
-font-family: LibreVideoJS;
-/* In order to center the play icon vertically we need to set the line height
-   to the same as the button height */
-text-align: center /* Needed for IE8 */;
-position: absolute;
-left: 0;
-width: 100%;
-height: 100%;
-}
-/* Menu Buttons (Captions/Subtitles/etc.)
---------------------------------------------------------------------------------
-*/
-.librevjs-libre-materialblue-skin .librevjs-menu-button {
-float:right;
-cursor:pointer;
-}
-.librevjs-libre-materialblue-skin .librevjs-menu {
-display:none;
-position:absolute;
-bottom:0;
-left:0;
-width:0;
-height:0;
-margin-bottom:3em;
-border-left:2em solid transparent;
-border-right:2em solid transparent;
-border-top:1.55em solid #000;
-border-top-color:rgba(7,40,50,.5);
-}
-/* Button Pop-up Menu */
-.librevjs-libre-materialblue-skin .librevjs-menu-button .librevjs-menu .librevjs-menu-content {
-display:block;
-padding:0;
-margin:0;
-position:absolute;
-width:10em;
-bottom:1.5em;
-/* Same bottom as librevjs-menu border-top */
-max-height:15em;
-overflow:auto;
-left:-5em;
-/* Width of menu - width of button / 2 */
-/* background-color-with-alpha */
-background-color:#07141e;
-background-color:rgba(7,20,30,.7);
--webkit-box-shadow:-.2em -.2em .3em rgba(255,255,255,.2);
--moz-box-shadow:-.2em -.2em .3em rgba(255,255,255,.2);
-box-shadow:-.2em -.2em .3em rgba(255,255,255,.2);
-}
-.librevjs-libre-materialblue-skin .librevjs-menu-button:hover .librevjs-menu {
-display:block;
-}
-.librevjs-libre-materialblue-skin .librevjs-menu-button ul li {
-list-style:none;
-margin:0;
-padding:.3em 0;
-line-height:1.4em;
-font-size:1.2em;
-text-align:center;
-text-transform:lowercase;
-color:#ccc;
-}
-
-/* Select color menu subtitles/captions */
-.librevjs-libre-materialblue-skin .librevjs-menu-button ul li.librevjs-selected {
-color: rgb(11, 21, 42);
-background-color: rgb(33, 150, 244);
-}
-.librevjs-libre-materialblue-skin .librevjs-menu-button ul li:focus,.librevjs-libre-materialblue-skin .librevjs-menu-button ul li:hover,.librevjs-libre-materialblue-skin .librevjs-menu-button ul li.librevjs-selected:focus,.librevjs-libre-materialblue-skin .librevjs-menu-button ul li.librevjs-selected:hover {
-outline: 0;
-color: rgb(11, 21, 42);
-background-color: #2196F3;
-}
-/*End Select color menu subtitles/caption */
-.librevjs-libre-materialblue-skin .librevjs-menu-button ul li.librevjs-menu-title {
-text-align:center;
-text-transform:uppercase;
-font-size:1em;
-line-height:2em;
-padding:0;
-margin:0 0 .3em;
-font-weight:700;
-cursor:default;
-}
-/* Subtitles Button */
-.librevjs-libre-materialblue-skin .librevjs-subtitles-button:before {
-content:"\e00c"
-}
-/* Captions Button */
-.librevjs-libre-materialblue-skin .librevjs-captions-button:before {
-content:"\e008"
-}
-/* Replacement for focus outline */
-.librevjs-libre-materialblue-skin .librevjs-captions-button:focus .librevjs-control-content:before,.librevjs-libre-materialblue-skin .librevjs-captions-button:hover .librevjs-control-content:before {
--webkit-box-shadow:0 0 1em #fff;
--moz-box-shadow:0 0 1em #fff;
-box-shadow:0 0 1em #fff;
-}
-/* Hide disabled or unsupported controls */
-.librevjs-libre-materialblue-skin .librevjs-hidden {
-display:none
-}
-
-/*Title Resolution | subtitles and Caption*/
-.librevjs-libre-materialblue-skin ul li.librevjs-menu-title.librevjs-res-menu-title{
-color:rgb(33, 150, 244);
-background-color: inherit;
-}
-.librevjs-libre-materialblue-skin ul li.librevjs-menu-title.librevjs-res-menu-title:hover{
-color: rgb(11, 137, 237);
-background-color: inherit;
-}
-
-@media screen and (max-width: 400px){
- .librevjs-libre-materialblue-skin .librevjs-big-play-button{
- font-size: 5em;
- top: 45%;
- }
-}
-@media screen and (max-width: 200px){
- .librevjs-libre-materialblue-skin .librevjs-big-play-button	{
- top:35%;
- }
-}
-@media screen and (max-width: 150px){
- .librevjs-libre-materialblue-skin .librevjs-big-play-button{
- font-size: 3em;
- }
-}
-@media screen and (max-width: 90px){
- .librevjs-libre-materialblue-skin .librevjs-big-play-button{
- font-size: 2em;
- }
-}
-
-/* Skin-Grey -------------------------------------------------------------------------------------------------------*/
-.librevjs-libre-materialgrey-skin {
-color:#ccc;
-background-color: inherit;
-}
-/* Base UI Component Classes
---------------------------------------------------------------------------------
-/* Slider - used for Volume bar and Seek bar */
-.librevjs-libre-materialgrey-skin .librevjs-slider {
-/* Replace browser focus highlight with handle highlight */
-outline: 0;
-position: relative;
-cursor: pointer;
-padding: 0;
-/* background-color-with-alpha */
-background-color: #000000;
-background-color: rgba(0, 0, 0, 0.5);
-}
-.librevjs-libre-materialgrey-skin .librevjs-slider:focus {
--webkit-box-shadow:0 0 2em #fff;
--moz-box-shadow:0 0 2em #fff;
-box-shadow:0 0 2em #fff;
-}
-
-/*Eliminación de botón de barra de progreso*/
-.librevjs-libre-materialgrey-skin .librevjs-slider-handle {
-width: 0;
-height: 0;
-}
-.librevjs-libre-materialgrey-skin .librevjs-slider-handle:before {
-text-shadow: 0em 0em 1em #fff;
-position: absolute;
-top: 0;
-left: 0;
-}
-
-/* Control Bar
---------------------------------------------------------------------------------
-The default control bar that is a container for most of the controls.
-*/
-.librevjs-libre-materialgrey-skin .librevjs-control-bar {
-/* Start hidden */
-display: none;
-position: absolute;
-/* Place control bar at the bottom of the player box/video.
-   If you want more margin below the control bar, add more height. */
-bottom: 0;
-/* Use left/right to stretch to 100% width of player div */
-left: 0;
-right: 0;
-/* Height includes any margin you want above or below control items */
-height: 3.0em;
-/* background-color-with-alpha */
-background-color: #232323;
-background-color: rgba(35, 35, 35, 0.8);
-}
-/* Show the control bar only once the video has started playing */
-.librevjs-libre-materialgrey-skin.librevjs-has-started .librevjs-control-bar {
-display:block;
-visibility:visible;
-opacity:1;
--webkit-transition:visibility .1s,opacity .1s;
--moz-transition:visibility .1s,opacity .1s;
--o-transition:visibility .1s,opacity .1s;
-transition:visibility .1s,opacity .1s
-}
-/* Hide the control bar when the video is playing and the user is inactive */
-.librevjs-libre-materialgrey-skin.librevjs-has-started.librevjs-user-inactive.librevjs-playing .librevjs-control-bar {
-display:block;
-visibility:hidden;
-opacity:0;
--webkit-transition:visibility 1s,opacity 1s;
--moz-transition:visibility 1s,opacity 1s;
--o-transition:visibility 1s,opacity 1s;
-transition:visibility 1s,opacity 1s
-}
-.librevjs-libre-materialgrey-skin.librevjs-controls-disabled .librevjs-control-bar {
-display:none
-}
-.librevjs-libre-materialgrey-skin.librevjs-using-native-controls .librevjs-control-bar {
-display:none
-}
-@media \0screen {
- .librevjs-libre-materialgrey-skin.librevjs-user-inactive.librevjs-playing .librevjs-control-bar :before {
- content:""
- }
-}
-/* General styles for individual controls. */
-.librevjs-libre-materialgrey-skin .librevjs-control {
-outline:0;
-position:relative;
-float:left;
-text-align:center;
-margin:0;
-padding:0;
-height:3em;
-width:4em
-}
-/* FreeArt button icons: http://artlibre.org/licence/lal */
-.librevjs-libre-materialgrey-skin .librevjs-control:before {
-font-family:LibreVideoJS;
-font-size:1.5em;
-line-height:2;
-position:absolute;
-top:0;
-left:0;
-width:100%;
-height:100%;
-text-align:center;
-text-shadow:1px 1px 1px rgba(0,0,0,.5)
-}
-/* Replacement for focus outline */
-.librevjs-libre-materialgrey-skin .librevjs-control:focus:before,.librevjs-libre-materialgrey-skin .librevjs-control:hover:before {
-color: #9e9e9e;
-}
-.librevjs-libre-materialgrey-skin .librevjs-control:focus {
-  /*  outline: 0; */
-  /* keyboard-only users cannot see the focus on several of the UI elements when this is set to 0 */
-}
-/* Hide control text visually, but have it available for screenreaders */
-.librevjs-libre-materialgrey-skin .librevjs-control-text {
-border:0;
-clip:rect(0 0 0 0);
-height:1px;
-margin:-1px;
-overflow:hidden;
-padding:0;
-position:absolute;
-width:1px
-}
-/* Play/Pause
---------------------------------------------------------------------------------
-*/
-.librevjs-libre-materialgrey-skin .librevjs-play-control {
-width:5em;
-cursor:pointer;
-color:rgb(158, 158, 158);
-}
-.librevjs-libre-materialgrey-skin .librevjs-play-control:before {
-content:"\e001"
-}
-.librevjs-libre-materialgrey-skin .librevjs-play-control:hover:before {
-color:#7c7c7c; /*color de play control al pasar el cursor*/
-}
-.librevjs-libre-materialgrey-skin.librevjs-playing .librevjs-play-control:before {
-content:"\e002"
-}
-/* Volume/Mute
--------------------------------------------------------------------------------- */
-.librevjs-libre-materialgrey-skin .librevjs-mute-control,.librevjs-libre-materialgrey-skin .librevjs-volume-menu-button {
-cursor:pointer;
-float:right
-}
-.librevjs-libre-materialgrey-skin .librevjs-mute-control:before,.librevjs-libre-materialgrey-skin .librevjs-volume-menu-button:before {
-content:"\e006"
-}
-.librevjs-libre-materialgrey-skin .librevjs-mute-control.librevjs-vol-0:before,.librevjs-libre-materialgrey-skin .librevjs-volume-menu-button.librevjs-vol-0:before {
-content:"\e003"
-}
-.librevjs-libre-materialgrey-skin .librevjs-mute-control.librevjs-vol-1:before,.librevjs-libre-materialgrey-skin .librevjs-volume-menu-button.librevjs-vol-1:before {
-content:"\e004"
-}
-.librevjs-libre-materialgrey-skin .librevjs-mute-control.librevjs-vol-2:before,.librevjs-libre-materialgrey-skin .librevjs-volume-menu-button.librevjs-vol-2:before {
-content:"\e005"
-}
-.librevjs-libre-materialgrey-skin .librevjs-volume-control {
-width:5em;
-float:right
-}
-.librevjs-libre-materialgrey-skin .librevjs-volume-bar {
-width:5em;
-height:.6em;
-margin:1.1em auto 0
-}
-.librevjs-libre-materialgrey-skin .librevjs-volume-menu-button .librevjs-menu-content {
-height:2.9em
-}
-
-/*Personalización del nivel de volumen*/
-.librevjs-libre-materialgrey-skin .librevjs-volume-level {
-position: absolute;
-top: 0;
-left: 0;
-height: 0.5em;
-/* assuming volume starts at 1.0 */
-
-width: 100%;
-background: #9e9e9e url() -50% 0 repeat;
-}
-.librevjs-libre-materialgrey-skin .librevjs-volume-bar .librevjs-volume-handle {
-width:.5em;
-height:.5em
-}
-.librevjs-libre-materialgrey-skin .librevjs-volume-handle:before {
-font-size:.9em;
-top:-.2em;
-left:-.2em;
-width:1em;
-height:1em;
-}
-.librevjs-libre-materialgrey-skin .librevjs-volume-menu-button .librevjs-menu .librevjs-menu-content {
-width:6em;
-left:-4em;
-}
-/* Progress
---------------------------------------------------------------------------------
-*/
-.librevjs-libre-materialgrey-skin .librevjs-progress-control {
-position:absolute;
-left:0;
-right:0;
-width:auto;
-font-size:.3em;
-height:1em;
-top:-1em;
--webkit-transition:all .4s;
--moz-transition:all .4s;
--o-transition:all .4s;
-transition:all .4s;
-}
-.librevjs-libre-materialgrey-skin:hover .librevjs-progress-control {
-font-size:.9em;
--webkit-transition:all .2s;
--moz-transition:all .2s;
--o-transition:all .2s;
-transition:all .2s;
-}
-/* Box containing play and load progress. Also acts as seek scrubber. */
-.librevjs-libre-materialgrey-skin .librevjs-progress-holder {
-height:100%;
-}
-/* Progress Bars */
-.librevjs-libre-materialgrey-skin .librevjs-progress-holder .librevjs-play-progress,.librevjs-libre-materialgrey-skin .librevjs-progress-holder .librevjs-load-progress {
-position:absolute;
-display:block;
-height:100%;
-margin:0;
-padding:0;
-left:0;
-top:0
-}
-.librevjs-libre-materialgrey-skin .librevjs-play-progress {
-background: #9e9e9e url() -50% 0 repeat;
-}
-.librevjs-libre-materialgrey-skin .librevjs-load-progress {
-background:#646464;
-background:rgba(255,255,255,.4)
-}
-.librevjs-libre-materialgrey-skin .librevjs-seek-handle {
-width:1.5em;
-height:100%
-}
-.librevjs-libre-materialgrey-skin .librevjs-seek-handle:before {
-padding-top:.1em
-}
-/* Time Display
---------------------------------------------------------------------------------
-*/
-.librevjs-libre-materialgrey-skin .librevjs-time-controls {
-font-size:1em;
-font-weight: 700;/*mayor visibilidad*/
-line-height:3em
-}
-.librevjs-libre-materialgrey-skin .librevjs-current-time {
-float:left
-}
-.librevjs-libre-materialgrey-skin .librevjs-duration {
-float:left
-}
-.librevjs-libre-materialgrey-skin .librevjs-remaining-time {
-display:none;
-float:left
-}
-/* Fullscreen
---------------------------------------------------------------------------------
-*/
-.librevjs-libre-materialgrey-skin .librevjs-fullscreen-control {
-width:3.8em;
-cursor:pointer;
-float:right
-}
-.librevjs-libre-materialgrey-skin .librevjs-fullscreen-control:before {
-content:"\e000"
-}
-/* Switch to the exit icon when the player is in fullscreen */
-.librevjs-libre-materialgrey-skin.librevjs-fullscreen .librevjs-fullscreen-control:before {
-content:"\e00b"
-}
-
-/* Big Play Button (play button at start)
---------------------------------------------------------------------------------
-Positioning of the play button in the center or other corners can be done more
-easily in the skin designer by LibreVideoJS FreeArts.
-*/
-.librevjs-libre-materialgrey-skin .librevjs-big-play-button {
-  left: 50%;
-  top: 40%;
-  font-size: 10em;
-  display: block;
-  z-index: 2;
-  position: absolute;
-  width: 1em;
-  height: 1em;
-  margin-left: -0.5em;
-  margin-top: -0.5em;
-  text-align: center;
-  vertical-align: middle;
-  cursor: pointer;
-  opacity: 1;
-  color: #9e9e9e;
-}
-/* Hide if controls are disabled */
-.librevjs-libre-materialgrey-skin.librevjs-controls-disabled .librevjs-big-play-button {
-display: none;
-}
-/* Hide when video starts playing */
-.librevjs-libre-materialgrey-skin.librevjs-has-started .librevjs-big-play-button {
-display: none;
-}
-/* Hide on mobile devices. Remove when we stop using native controls
-   by default on mobile  */
-.librevjs-libre-materialgrey-skin.librevjs-using-native-controls .librevjs-big-play-button {
-display: none;
-}
-.librevjs-libre-materialgrey-skin:hover .librevjs-big-play-button,
-.librevjs-libre-materialgrey-skin .librevjs-big-play-button:focus {
-color: rgb(115, 115, 115); /*color boton focus grey oscuro*/
-}
-.librevjs-libre-materialgrey-skin .librevjs-big-play-button:before {
-content: "\e007";
-font-family: LibreVideoJS;
-/* In order to center the play icon vertically we need to set the line height
-   to the same as the button height */
-text-align: center /* Needed for IE8 */;
-position: absolute;
-left: 0;
-width: 100%;
-height: 100%;
-}
-/* Menu Buttons (Captions/Subtitles/etc.)
---------------------------------------------------------------------------------
-*/
-.librevjs-libre-materialgrey-skin .librevjs-menu-button {
-float:right;
-cursor:pointer;
-}
-.librevjs-libre-materialgrey-skin .librevjs-menu {
-display:none;
-position:absolute;
-bottom:0;
-left:0;
-width:0;
-height:0;
-margin-bottom:3em;
-border-left:2em solid transparent;
-border-right:2em solid transparent;
-border-top:1.55em solid #000;
-border-top-color:rgba(7,40,50,.5);
-}
-/* Button Pop-up Menu */
-.librevjs-libre-materialgrey-skin .librevjs-menu-button .librevjs-menu .librevjs-menu-content {
-display:block;
-padding:0;
-margin:0;
-position:absolute;
-width:10em;
-bottom:1.5em;
-/* Same bottom as librevjs-menu border-top */
-max-height:15em;
-overflow:auto;
-left:-5em;
-/* Width of menu - width of button / 2 */
-/* background-color-with-alpha */
-background-color:#07141e;
-background-color:rgba(7,20,30,.7);
--webkit-box-shadow:-.2em -.2em .3em rgba(255,255,255,.2);
--moz-box-shadow:-.2em -.2em .3em rgba(255,255,255,.2);
-box-shadow:-.2em -.2em .3em rgba(255,255,255,.2);
-}
-.librevjs-libre-materialgrey-skin .librevjs-menu-button:hover .librevjs-menu {
-display:block;
-}
-.librevjs-libre-materialgrey-skin .librevjs-menu-button ul li {
-list-style:none;
-margin:0;
-padding:.3em 0;
-line-height:1.4em;
-font-size:1.2em;
-text-align:center;
-text-transform:lowercase;
-color:#ccc;
-}
-
-/* Select color menu subtitles/captions */
-.librevjs-libre-materialgrey-skin .librevjs-menu-button ul li.librevjs-selected {
-color: #fff;
-background-color: rgb(158, 158, 158);
-}
-.librevjs-libre-materialgrey-skin .librevjs-menu-button ul li:focus,.librevjs-libre-materialgrey-skin .librevjs-menu-button ul li:hover,.librevjs-libre-materialgrey-skin .librevjs-menu-button ul li.librevjs-selected:focus,.librevjs-libre-materialgrey-skin .librevjs-menu-button ul li.librevjs-selected:hover {
-outline: 0;
-color: #fff;
-background-color: #9e9e9e;
-}
-/*End Select color menu subtitles/caption */
-.librevjs-libre-materialgrey-skin .librevjs-menu-button ul li.librevjs-menu-title {
-text-align:center;
-text-transform:uppercase;
-font-size:1em;
-line-height:2em;
-padding:0;
-margin:0 0 .3em;
-font-weight:700;
-cursor:default;
-}
-/* Subtitles Button */
-.librevjs-libre-materialgrey-skin .librevjs-subtitles-button:before {
-content:"\e00c"
-}
-/* Captions Button */
-.librevjs-libre-materialgrey-skin .librevjs-captions-button:before {
-content:"\e008"
-}
-/* Replacement for focus outline */
-.librevjs-libre-materialgrey-skin .librevjs-captions-button:focus .librevjs-control-content:before,.librevjs-libre-materialgrey-skin .librevjs-captions-button:hover .librevjs-control-content:before {
--webkit-box-shadow:0 0 1em #fff;
--moz-box-shadow:0 0 1em #fff;
-box-shadow:0 0 1em #fff;
-}
-/* Hide disabled or unsupported controls */
-.librevjs-libre-materialgrey-skin .librevjs-hidden {
-display:none
-}
-/*Title Resolution | subtitles and Caption*/
-.librevjs-libre-materialgrey-skin ul li.librevjs-menu-title.librevjs-res-menu-title{
-color: #737373;
-background-color: inherit;
-}
-.librevjs-libre-materialgrey-skin ul li.librevjs-menu-title.librevjs-res-menu-title:hover{
-color: #9e9e9e;
-background-color: inherit;
-}
-
-@media screen and (max-width: 400px){
- .librevjs-libre-materialgrey-skin .librevjs-big-play-button{
- font-size: 5em;
- top: 45%;
- }
-}
-@media screen and (max-width: 200px){
- .librevjs-libre-materialgrey-skin .librevjs-big-play-button	{
- top:35%;
- }
-}
-@media screen and (max-width: 150px){
- .librevjs-libre-materialgrey-skin .librevjs-big-play-button{
- font-size: 3em;
- }
-}
-@media screen and (max-width: 90px){
- .librevjs-libre-materialgrey-skin .librevjs-big-play-button{
- font-size: 2em;
- }
-}
-
-/* Skin-Purple -----------------------------------------------------------------------------------------------------*/
-.librevjs-libre-materialpurple-skin {
-color:#ccc;
-background-color: inherit;
-}
-/* Base UI Component Classes
---------------------------------------------------------------------------------
-/* Slider - used for Volume bar and Seek bar */
-.librevjs-libre-materialpurple-skin .librevjs-slider {
-/* Replace browser focus highlight with handle highlight */
-outline: 0;
-position: relative;
-cursor: pointer;
-padding: 0;
-/* background-color-with-alpha */
-background-color: #000000;
-background-color: rgba(0, 0, 0, 0.5);
-}
-.librevjs-libre-materialpurple-skin .librevjs-slider:focus {
--webkit-box-shadow:0 0 2em #fff;
--moz-box-shadow:0 0 2em #fff;
-box-shadow:0 0 2em #fff;
-}
-
-/*Eliminación de botón de barra de progreso*/
-.librevjs-libre-materialpurple-skin .librevjs-slider-handle {
-width: 0;
-height: 0;
-}
-.librevjs-libre-materialpurple-skin .librevjs-slider-handle:before {
-text-shadow: 0em 0em 1em #fff;
-position: absolute;
-top: 0;
-left: 0;
-}
-
-/* Control Bar
---------------------------------------------------------------------------------
-The default control bar that is a container for most of the controls.
-*/
-.librevjs-libre-materialpurple-skin .librevjs-control-bar {
-/* Start hidden */
-display: none;
-position: absolute;
-/* Place control bar at the bottom of the player box/video.
-   If you want more margin below the control bar, add more height. */
-bottom: 0;
-/* Use left/right to stretch to 100% width of player div */
-left: 0;
-right: 0;
-/* Height includes any margin you want above or below control items */
-height: 3.0em;
-/* background-color-with-alpha */
-background-color: #232323;
-background-color: rgba(35, 35, 35, 0.8);
-}
-/* Show the control bar only once the video has started playing */
-.librevjs-libre-materialpurple-skin.librevjs-has-started .librevjs-control-bar {
-display:block;
-visibility:visible;
-opacity:1;
--webkit-transition:visibility .1s,opacity .1s;
--moz-transition:visibility .1s,opacity .1s;
--o-transition:visibility .1s,opacity .1s;
-transition:visibility .1s,opacity .1s
-}
-/* Hide the control bar when the video is playing and the user is inactive */
-.librevjs-libre-materialpurple-skin.librevjs-has-started.librevjs-user-inactive.librevjs-playing .librevjs-control-bar {
-display:block;
-visibility:hidden;
-opacity:0;
--webkit-transition:visibility 1s,opacity 1s;
--moz-transition:visibility 1s,opacity 1s;
--o-transition:visibility 1s,opacity 1s;
-transition:visibility 1s,opacity 1s
-}
-.librevjs-libre-materialpurple-skin.librevjs-controls-disabled .librevjs-control-bar {
-display:none
-}
-.librevjs-libre-materialpurple-skin.librevjs-using-native-controls .librevjs-control-bar {
-display:none
-}
-@media \0screen {
- .librevjs-libre-materialpurple-skin.librevjs-user-inactive.librevjs-playing .librevjs-control-bar :before {
- content:""
- }
-}
-/* General styles for individual controls. */
-.librevjs-libre-materialpurple-skin .librevjs-control {
-outline:0;
-position:relative;
-float:left;
-text-align:center;
-margin:0;
-padding:0;
-height:3em;
-width:4em
-}
-/* FreeArt button icons: http://artlibre.org/licence/lal */
-.librevjs-libre-materialpurple-skin .librevjs-control:before {
-font-family:LibreVideoJS;
-font-size:1.5em;
-line-height:2;
-position:absolute;
-top:0;
-left:0;
-width:100%;
-height:100%;
-text-align:center;
-text-shadow:1px 1px 1px rgba(0,0,0,.5)
-}
-/* Replacement for focus outline */
-.librevjs-libre-materialpurple-skin .librevjs-control:focus:before,.librevjs-libre-materialpurple-skin .librevjs-control:hover:before {
-color: #9c27b0;
-}
-.librevjs-libre-materialpurple-skin .librevjs-control:focus {
-  /*  outline: 0; */
-  /* keyboard-only users cannot see the focus on several of the UI elements when this is set to 0 */
-}
-/* Hide control text visually, but have it available for screenreaders */
-.librevjs-libre-materialpurple-skin .librevjs-control-text {
-border:0;
-clip:rect(0 0 0 0);
-height:1px;
-margin:-1px;
-overflow:hidden;
-padding:0;
-position:absolute;
-width:1px
-}
-/* Play/Pause
---------------------------------------------------------------------------------
-*/
-.librevjs-libre-materialpurple-skin .librevjs-play-control {
-width:5em;
-cursor:pointer;
-color:rgb(156, 39, 176);
-}
-.librevjs-libre-materialpurple-skin .librevjs-play-control:before {
-content:"\e001"
-}
-.librevjs-libre-materialpurple-skin .librevjs-play-control:hover:before {
-color:#8e44ad; /*color de play control al pasar el cursor*/
-}
-.librevjs-libre-materialpurple-skin.librevjs-playing .librevjs-play-control:before {
-content:"\e002"
-}
-/* Volume/Mute
--------------------------------------------------------------------------------- */
-.librevjs-libre-materialpurple-skin .librevjs-mute-control,.librevjs-libre-materialpurple-skin .librevjs-volume-menu-button {
-cursor:pointer;
-float:right
-}
-.librevjs-libre-materialpurple-skin .librevjs-mute-control:before,.librevjs-libre-materialpurple-skin .librevjs-volume-menu-button:before {
-content:"\e006"
-}
-.librevjs-libre-materialpurple-skin .librevjs-mute-control.librevjs-vol-0:before,.librevjs-libre-materialpurple-skin .librevjs-volume-menu-button.librevjs-vol-0:before {
-content:"\e003"
-}
-.librevjs-libre-materialpurple-skin .librevjs-mute-control.librevjs-vol-1:before,.librevjs-libre-materialpurple-skin .librevjs-volume-menu-button.librevjs-vol-1:before {
-content:"\e004"
-}
-.librevjs-libre-materialpurple-skin .librevjs-mute-control.librevjs-vol-2:before,.librevjs-libre-materialpurple-skin .librevjs-volume-menu-button.librevjs-vol-2:before {
-content:"\e005"
-}
-.librevjs-libre-materialpurple-skin .librevjs-volume-control {
-width:5em;
-float:right
-}
-.librevjs-libre-materialpurple-skin .librevjs-volume-bar {
-width:5em;
-height:.6em;
-margin:1.1em auto 0
-}
-.librevjs-libre-materialpurple-skin .librevjs-volume-menu-button .librevjs-menu-content {
-height:2.9em
-}
-
-/*Personalización del nivel de volumen*/
-.librevjs-libre-materialpurple-skin .librevjs-volume-level {
-position: absolute;
-top: 0;
-left: 0;
-height: 0.5em;
-/* assuming volume starts at 1.0 */
-
-width: 100%;
-background: #9c27b0 url() -50% 0 repeat;
-}
-.librevjs-libre-materialpurple-skin .librevjs-volume-bar .librevjs-volume-handle {
-width:.5em;
-height:.5em
-}
-.librevjs-libre-materialpurple-skin .librevjs-volume-handle:before {
-font-size:.9em;
-top:-.2em;
-left:-.2em;
-width:1em;
-height:1em;
-}
-.librevjs-libre-materialpurple-skin .librevjs-volume-menu-button .librevjs-menu .librevjs-menu-content {
-width:6em;
-left:-4em;
-}
-/* Progress
---------------------------------------------------------------------------------
-*/
-.librevjs-libre-materialpurple-skin .librevjs-progress-control {
-position:absolute;
-left:0;
-right:0;
-width:auto;
-font-size:.3em;
-height:1em;
-top:-1em;
--webkit-transition:all .4s;
--moz-transition:all .4s;
--o-transition:all .4s;
-transition:all .4s;
-}
-.librevjs-libre-materialpurple-skin:hover .librevjs-progress-control {
-font-size:.9em;
--webkit-transition:all .2s;
--moz-transition:all .2s;
--o-transition:all .2s;
-transition:all .2s;
-}
-/* Box containing play and load progress. Also acts as seek scrubber. */
-.librevjs-libre-materialpurple-skin .librevjs-progress-holder {
-height:100%;
-}
-/* Progress Bars */
-.librevjs-libre-materialpurple-skin .librevjs-progress-holder .librevjs-play-progress,.librevjs-libre-materialpurple-skin .librevjs-progress-holder .librevjs-load-progress {
-position:absolute;
-display:block;
-height:100%;
-margin:0;
-padding:0;
-left:0;
-top:0
-}
-.librevjs-libre-materialpurple-skin .librevjs-play-progress {
-background: #9c27b0 url() -50% 0 repeat;
-}
-.librevjs-libre-materialpurple-skin .librevjs-load-progress {
-background:#646464;
-background:rgba(255,255,255,.4)
-}
-.librevjs-libre-materialpurple-skin .librevjs-seek-handle {
-width:1.5em;
-height:100%
-}
-.librevjs-libre-materialpurple-skin .librevjs-seek-handle:before {
-padding-top:.1em
-}
-/* Time Display
---------------------------------------------------------------------------------
-*/
-.librevjs-libre-materialpurple-skin .librevjs-time-controls {
-font-size:1em;
-font-weight: 700;/*mayor visibilidad*/
-line-height:3em
-}
-.librevjs-libre-materialpurple-skin .librevjs-current-time {
-float:left
-}
-.librevjs-libre-materialpurple-skin .librevjs-duration {
-float:left
-}
-.librevjs-libre-materialpurple-skin .librevjs-remaining-time {
-display:none;
-float:left
-}
-
-/* Fullscreen
---------------------------------------------------------------------------------
-*/
-.librevjs-libre-materialpurple-skin .librevjs-fullscreen-control {
-width:3.8em;
-cursor:pointer;
-float:right
-}
-.librevjs-libre-materialpurple-skin .librevjs-fullscreen-control:before {
-content:"\e000"
-}
-/* Switch to the exit icon when the player is in fullscreen */
-.librevjs-libre-materialpurple-skin.librevjs-fullscreen .librevjs-fullscreen-control:before {
-content:"\e00b"
-}
-
-/* Big Play Button (play button at start)
---------------------------------------------------------------------------------
-Positioning of the play button in the center or other corners can be done more
-easily in the skin designer by LibreVideoJS FreeArts.
-*/
-.librevjs-libre-materialpurple-skin .librevjs-big-play-button {
-  left: 50%;
-  top: 40%;
-  font-size: 10em;
-  display: block;
-  z-index: 2;
-  position: absolute;
-  width: 1em;
-  height: 1em;
-  margin-left: -0.5em;
-  margin-top: -0.5em;
-  text-align: center;
-  vertical-align: middle;
-  cursor: pointer;
-  opacity: 1;
-  color: #9c27b0;
-}
-/* Hide if controls are disabled */
-.librevjs-libre-materialpurple-skin.librevjs-controls-disabled .librevjs-big-play-button {
-display: none;
-}
-/* Hide when video starts playing */
-.librevjs-libre-materialpurple-skin.librevjs-has-started .librevjs-big-play-button {
-display: none;
-}
-/* Hide on mobile devices. Remove when we stop using native controls
-   by default on mobile  */
-.librevjs-libre-materialpurple-skin.librevjs-using-native-controls .librevjs-big-play-button {
-display: none;
-}
-.librevjs-libre-materialpurple-skin:hover .librevjs-big-play-button,
-.librevjs-libre-materialpurple-skin .librevjs-big-play-button:focus {
-color: rgb(142, 68, 173); /*color boton focus purpura oscuro*/
-}
-.librevjs-libre-materialpurple-skin .librevjs-big-play-button:before {
-content: "\e007";
-font-family: LibreVideoJS;
-/* In order to center the play icon vertically we need to set the line height
-   to the same as the button height */
-text-align: center /* Needed for IE8 */;
-position: absolute;
-left: 0;
-width: 100%;
-height: 100%;
-}
-/* Menu Buttons (Captions/Subtitles/etc.)
---------------------------------------------------------------------------------
-*/
-.librevjs-libre-materialpurple-skin .librevjs-menu-button {
-float:right;
-cursor:pointer;
-}
-.librevjs-libre-materialpurple-skin .librevjs-menu {
-display:none;
-position:absolute;
-bottom:0;
-left:0;
-width:0;
-height:0;
-margin-bottom:3em;
-border-left:2em solid transparent;
-border-right:2em solid transparent;
-border-top:1.55em solid #000;
-border-top-color:rgba(7,40,50,.5);
-}
-/* Button Pop-up Menu */
-.librevjs-libre-materialpurple-skin .librevjs-menu-button .librevjs-menu .librevjs-menu-content {
-display:block;
-padding:0;
-margin:0;
-position:absolute;
-width:10em;
-bottom:1.5em;
-/* Same bottom as librevjs-menu border-top */
-max-height:15em;
-overflow:auto;
-left:-5em;
-/* Width of menu - width of button / 2 */
-/* background-color-with-alpha */
-background-color:#07141e;
-background-color:rgba(7,20,30,.7);
--webkit-box-shadow:-.2em -.2em .3em rgba(255,255,255,.2);
--moz-box-shadow:-.2em -.2em .3em rgba(255,255,255,.2);
-box-shadow:-.2em -.2em .3em rgba(255,255,255,.2);
-}
-.librevjs-libre-materialpurple-skin .librevjs-menu-button:hover .librevjs-menu {
-display:block;
-}
-.librevjs-libre-materialpurple-skin .librevjs-menu-button ul li {
-list-style:none;
-margin:0;
-padding:.3em 0;
-line-height:1.4em;
-font-size:1.2em;
-text-align:center;
-text-transform:lowercase;
-color:#ccc;
-}
-
-/* Select color menu subtitles/captions */
-.librevjs-libre-materialpurple-skin .librevjs-menu-button ul li.librevjs-selected {
-color: #fff;
-background-color: rgb(156, 39, 176);
-}
-.librevjs-libre-materialpurple-skin .librevjs-menu-button ul li:focus,.librevjs-libre-materialpurple-skin .librevjs-menu-button ul li:hover,.librevjs-libre-materialpurple-skin .librevjs-menu-button ul li.librevjs-selected:focus,.librevjs-libre-materialpurple-skin .librevjs-menu-button ul li.librevjs-selected:hover {
-outline: 0;
-color: #fff;
-background-color: #9c27b0;
-}
-/*End Select color menu subtitles/caption */
-.librevjs-libre-materialpurple-skin .librevjs-menu-button ul li.librevjs-menu-title {
-text-align:center;
-text-transform:uppercase;
-font-size:1em;
-line-height:2em;
-padding:0;
-margin:0 0 .3em;
-font-weight:700;
-cursor:default;
-}
-/* Subtitles Button */
-.librevjs-libre-materialpurple-skin .librevjs-subtitles-button:before {
-content:"\e00c"
-}
-/* Captions Button */
-.librevjs-libre-materialpurple-skin .librevjs-captions-button:before {
-content:"\e008"
-}
-/* Replacement for focus outline */
-.librevjs-libre-materialpurple-skin .librevjs-captions-button:focus .librevjs-control-content:before,.librevjs-libre-materialpurple-skin .librevjs-captions-button:hover .librevjs-control-content:before {
--webkit-box-shadow:0 0 1em #fff;
--moz-box-shadow:0 0 1em #fff;
-box-shadow:0 0 1em #fff;
-}
-/* Hide disabled or unsupported controls */
-.librevjs-libre-materialpurple-skin .librevjs-hidden {
-display:none
-}
-/*Title Resolution | subtitles and Caption*/
-.librevjs-libre-materialpurple-skin ul li.librevjs-menu-title.librevjs-res-menu-title{
-color: #9c27b0;
-background-color: inherit;
-}
-.librevjs-libre-materialpurple-skin ul li.librevjs-menu-title.librevjs-res-menu-title:hover{
-color: #8e44ad;
-background-color: inherit;
-}
-
-@media screen and (max-width: 400px){
- .librevjs-libre-materialpurple-skin .librevjs-big-play-button{
- font-size: 5em;
- top: 45%;
- }
-}
-@media screen and (max-width: 200px){
- .librevjs-libre-materialpurple-skin .librevjs-big-play-button	{
- top:35%;
- }
-}
-@media screen and (max-width: 150px){
- .librevjs-libre-materialpurple-skin .librevjs-big-play-button{
- font-size: 3em;
- }
-}
-@media screen and (max-width: 90px){
- .librevjs-libre-materialpurple-skin .librevjs-big-play-button{
- font-size: 2em;
- }
-}
-
-/* Skin-Red --------------------------------------------------------------------------------------------------------*/
-.librevjs-libre-materialred-skin {
-color:#ccc;
-background-color: inherit;
-}
-
-/* Base UI Component Classes
---------------------------------------------------------------------------------
-/* Slider - used for Volume bar and Seek bar */
-.librevjs-libre-materialred-skin .librevjs-slider {
-/* Replace browser focus highlight with handle highlight */
-outline: 0;
-position: relative;
-cursor: pointer;
-padding: 0;
-/* background-color-with-alpha */
-background-color: #000000;
-background-color: rgba(0, 0, 0, 0.5);
-}
-.librevjs-libre-materialred-skin .librevjs-slider:focus {
--webkit-box-shadow:0 0 2em #fff;
--moz-box-shadow:0 0 2em #fff;
-box-shadow:0 0 2em #fff;
-}
-
-/*Eliminación de botón de barra de progreso*/
-.librevjs-libre-materialred-skin .librevjs-slider-handle {
-width: 0;
-height: 0;
-}
-.librevjs-libre-materialred-skin .librevjs-slider-handle:before {
-text-shadow: 0em 0em 1em #fff;
-position: absolute;
-top: 0;
-left: 0;
-}
-
-/* Control Bar
---------------------------------------------------------------------------------
-The default control bar that is a container for most of the controls.
-*/
-.librevjs-libre-materialred-skin .librevjs-control-bar {
-/* Start hidden */
-display: none;
-position: absolute;
-/* Place control bar at the bottom of the player box/video.
-   If you want more margin below the control bar, add more height. */
-bottom: 0;
-/* Use left/right to stretch to 100% width of player div */
-left: 0;
-right: 0;
-/* Height includes any margin you want above or below control items */
-height: 3.0em;
-/* background-color-with-alpha */
-background-color: #232323;
-background-color: rgba(35, 35, 35, 0.8);
-}
-/* Show the control bar only once the video has started playing */
-.librevjs-libre-materialred-skin.librevjs-has-started .librevjs-control-bar {
-display:block;
-visibility:visible;
-opacity:1;
--webkit-transition:visibility .1s,opacity .1s;
--moz-transition:visibility .1s,opacity .1s;
--o-transition:visibility .1s,opacity .1s;
-transition:visibility .1s,opacity .1s
-}
-/* Hide the control bar when the video is playing and the user is inactive */
-.librevjs-libre-materialred-skin.librevjs-has-started.librevjs-user-inactive.librevjs-playing .librevjs-control-bar {
-display:block;
-visibility:hidden;
-opacity:0;
--webkit-transition:visibility 1s,opacity 1s;
--moz-transition:visibility 1s,opacity 1s;
--o-transition:visibility 1s,opacity 1s;
-transition:visibility 1s,opacity 1s
-}
-.librevjs-libre-materialred-skin.librevjs-controls-disabled .librevjs-control-bar {
-display:none
-}
-.librevjs-libre-materialred-skin.librevjs-using-native-controls .librevjs-control-bar {
-display:none
-}
-@media \0screen {
- .librevjs-libre-materialred-skin.librevjs-user-inactive.librevjs-playing .librevjs-control-bar :before {
- content:""
- }
-}
-/* General styles for individual controls. */
-.librevjs-libre-materialred-skin .librevjs-control {
-outline:0;
-position:relative;
-float:left;
-text-align:center;
-margin:0;
-padding:0;
-height:3em;
-width:4em
-}
-/* FreeArt button icons: http://artlibre.org/licence/lal */
-.librevjs-libre-materialred-skin .librevjs-control:before {
-font-family:LibreVideoJS;
-font-size:1.5em;
-line-height:2;
-position:absolute;
-top:0;
-left:0;
-width:100%;
-height:100%;
-text-align:center;
-text-shadow:1px 1px 1px rgba(0,0,0,.5)
-}
-/* Replacement for focus outline */
-.librevjs-libre-materialred-skin .librevjs-control:focus:before,.librevjs-libre-materialred-skin .librevjs-control:hover:before {
-color: #f44336;
-}
-.librevjs-libre-materialred-skin .librevjs-control:focus {
-  /*  outline: 0; */
-  /* keyboard-only users cannot see the focus on several of the UI elements when this is set to 0 */
-}
-/* Hide control text visually, but have it available for screenreaders */
-.librevjs-libre-materialred-skin .librevjs-control-text {
-border:0;
-clip:rect(0 0 0 0);
-height:1px;
-margin:-1px;
-overflow:hidden;
-padding:0;
-position:absolute;
-width:1px
-}
-/* Play/Pause
---------------------------------------------------------------------------------
-*/
-.librevjs-libre-materialred-skin .librevjs-play-control {
-width:5em;
-cursor:pointer;
-color:rgb(244, 67, 54);
-}
-.librevjs-libre-materialred-skin .librevjs-play-control:before {
-content:"\e001"
-}
-.librevjs-libre-materialred-skin .librevjs-play-control:hover:before {
-color:#f22e1f; /*color de play control al pasar el cursor*/
-}
-.librevjs-libre-materialred-skin.librevjs-playing .librevjs-play-control:before {
-content:"\e002"
-}
-/* Volume/Mute
--------------------------------------------------------------------------------- */
-.librevjs-libre-materialred-skin .librevjs-mute-control,.librevjs-libre-materialred-skin .librevjs-volume-menu-button {
-cursor:pointer;
-float:right
-}
-.librevjs-libre-materialred-skin .librevjs-mute-control:before,.librevjs-libre-materialred-skin .librevjs-volume-menu-button:before {
-content:"\e006"
-}
-.librevjs-libre-materialred-skin .librevjs-mute-control.librevjs-vol-0:before,.librevjs-libre-materialred-skin .librevjs-volume-menu-button.librevjs-vol-0:before {
-content:"\e003"
-}
-.librevjs-libre-materialred-skin .librevjs-mute-control.librevjs-vol-1:before,.librevjs-libre-materialred-skin .librevjs-volume-menu-button.librevjs-vol-1:before {
-content:"\e004"
-}
-.librevjs-libre-materialred-skin .librevjs-mute-control.librevjs-vol-2:before,.librevjs-libre-materialred-skin .librevjs-volume-menu-button.librevjs-vol-2:before {
-content:"\e005"
-}
-.librevjs-libre-materialred-skin .librevjs-volume-control {
-width:5em;
-float:right
-}
-.librevjs-libre-materialred-skin .librevjs-volume-bar {
-width:5em;
-height:.6em;
-margin:1.1em auto 0
-}
-.librevjs-libre-materialred-skin .librevjs-volume-menu-button .librevjs-menu-content {
-height:2.9em
-}
-
-/*Personalización del nivel de volumen*/
-.librevjs-libre-materialred-skin .librevjs-volume-level {
-position: absolute;
-top: 0;
-left: 0;
-height: 0.5em;
-/* assuming volume starts at 1.0 */
-
-width: 100%;
-background: #f44336 url() -50% 0 repeat;
-}
-.librevjs-libre-materialred-skin .librevjs-volume-bar .librevjs-volume-handle {
-width:.5em;
-height:.5em
-}
-.librevjs-libre-materialred-skin .librevjs-volume-handle:before {
-font-size:.9em;
-top:-.2em;
-left:-.2em;
-width:1em;
-height:1em;
-}
-.librevjs-libre-materialred-skin .librevjs-volume-menu-button .librevjs-menu .librevjs-menu-content {
-width:6em;
-left:-4em;
-}
-/* Progress
---------------------------------------------------------------------------------
-*/
-.librevjs-libre-materialred-skin .librevjs-progress-control {
-position:absolute;
-left:0;
-right:0;
-width:auto;
-font-size:.3em;
-height:1em;
-top:-1em;
--webkit-transition:all .4s;
--moz-transition:all .4s;
--o-transition:all .4s;
-transition:all .4s;
-}
-.librevjs-libre-materialred-skin:hover .librevjs-progress-control {
-font-size:.9em;
--webkit-transition:all .2s;
--moz-transition:all .2s;
--o-transition:all .2s;
-transition:all .2s;
-}
-/* Box containing play and load progress. Also acts as seek scrubber. */
-.librevjs-libre-materialred-skin .librevjs-progress-holder {
-height:100%;
-}
-/* Progress Bars */
-.librevjs-libre-materialred-skin .librevjs-progress-holder .librevjs-play-progress,.librevjs-libre-materialred-skin .librevjs-progress-holder .librevjs-load-progress {
-position:absolute;
-display:block;
-height:100%;
-margin:0;
-padding:0;
-left:0;
-top:0
-}
-.librevjs-libre-materialred-skin .librevjs-play-progress {
-background: #f44336 url() -50% 0 repeat;
-}
-.librevjs-libre-materialred-skin .librevjs-load-progress {
-background:#646464;
-background:rgba(255,255,255,.4)
-}
-.librevjs-libre-materialred-skin .librevjs-seek-handle {
-width:1.5em;
-height:100%
-}
-.librevjs-libre-materialred-skin .librevjs-seek-handle:before {
-padding-top:.1em
-}
-/* Time Display
---------------------------------------------------------------------------------
-*/
-.librevjs-libre-materialred-skin .librevjs-time-controls {
-font-size:1em;
-font-weight: 700;/*mayor visibilidad*/
-line-height:3em
-}
-.librevjs-libre-materialred-skin .librevjs-current-time {
-float:left
-}
-.librevjs-libre-materialred-skin .librevjs-duration {
-float:left
-}
-.librevjs-libre-materialred-skin .librevjs-remaining-time {
-display:none;
-float:left
-}
-/* Fullscreen
---------------------------------------------------------------------------------
-*/
-.librevjs-libre-materialred-skin .librevjs-fullscreen-control {
-width:3.8em;
-cursor:pointer;
-float:right
-}
-.librevjs-libre-materialred-skin .librevjs-fullscreen-control:before {
-content:"\e000"
-}
-/* Switch to the exit icon when the player is in fullscreen */
-.librevjs-libre-materialred-skin.librevjs-fullscreen .librevjs-fullscreen-control:before {
-content:"\e00b"
-}
-
-/* Big Play Button (play button at start)
---------------------------------------------------------------------------------
-Positioning of the play button in the center or other corners can be done more
-easily in the skin designer by LibreVideoJS FreeArts.
-*/
-.librevjs-libre-materialred-skin .librevjs-big-play-button {
-  left: 50%;
-  top: 40%;
-  font-size: 10em;
-  display: block;
-  z-index: 2;
-  position: absolute;
-  width: 1em;
-  height: 1em;
-  margin-left: -0.5em;
-  margin-top: -0.5em;
-  text-align: center;
-  vertical-align: middle;
-  cursor: pointer;
-  opacity: 1;
-  color: #f44336;
-}
-/* Hide if controls are disabled */
-.librevjs-libre-materialred-skin.librevjs-controls-disabled .librevjs-big-play-button {
-display: none;
-}
-/* Hide when video starts playing */
-.librevjs-libre-materialred-skin.librevjs-has-started .librevjs-big-play-button {
-display: none;
-}
-/* Hide on mobile devices. Remove when we stop using native controls
-   by default on mobile  */
-.librevjs-libre-materialred-skin.librevjs-using-native-controls .librevjs-big-play-button {
-display: none;
-}
-.librevjs-libre-materialred-skin:hover .librevjs-big-play-button,
-.librevjs-libre-materialred-skin .librevjs-big-play-button:focus {
-color: rgba(244, 67, 54, 0.89); /*color boton focus*/
-}
-.librevjs-libre-materialred-skin .librevjs-big-play-button:before {
-content: "\e007";
-font-family: LibreVideoJS;
-/* In order to center the play icon vertically we need to set the line height
-   to the same as the button height */
-text-align: center /* Needed for IE8 */;
-position: absolute;
-left: 0;
-width: 100%;
-height: 100%;
-}
-/* Menu Buttons (Captions/Subtitles/etc.)
---------------------------------------------------------------------------------
-*/
-.librevjs-libre-materialred-skin .librevjs-menu-button {
-float:right;
-cursor:pointer;
-}
-.librevjs-libre-materialred-skin .librevjs-menu {
-display:none;
-position:absolute;
-bottom:0;
-left:0;
-width:0;
-height:0;
-margin-bottom:3em;
-border-left:2em solid transparent;
-border-right:2em solid transparent;
-border-top:1.55em solid #000;
-border-top-color:rgba(7,40,50,.5);
-}
-/* Button Pop-up Menu */
-.librevjs-libre-materialred-skin .librevjs-menu-button .librevjs-menu .librevjs-menu-content {
-display:block;
-padding:0;
-margin:0;
-position:absolute;
-width:10em;
-bottom:1.5em;
-max-height:15em;
-/* Same bottom as librevjs-menu border-top */
-overflow:auto;
-left:-5em;
-/* Width of menu - width of button / 2 */
-/* background-color-with-alpha */
-background-color:#07141e;
-background-color:rgba(7,20,30,.7);
--webkit-box-shadow:-.2em -.2em .3em rgba(255,255,255,.2);
--moz-box-shadow:-.2em -.2em .3em rgba(255,255,255,.2);
-box-shadow:-.2em -.2em .3em rgba(255,255,255,.2);
-}
-.librevjs-libre-materialred-skin .librevjs-menu-button:hover .librevjs-menu {
-display:block;
-}
-.librevjs-libre-materialred-skin .librevjs-menu-button ul li {
-list-style:none;
-margin:0;
-padding:.3em 0;
-line-height:1.4em;
-font-size:1.2em;
-text-align:center;
-text-transform:lowercase;
-color:#ccc;
-}
-
-/* Select color menu subtitles/captions */
-.librevjs-libre-materialred-skin .librevjs-menu-button ul li.librevjs-selected {
-color: #fff;
-background-color: rgb(244, 67, 54);
-}
-.librevjs-libre-materialred-skin .librevjs-menu-button ul li:focus,.librevjs-libre-materialred-skin .librevjs-menu-button ul li:hover,.librevjs-libre-materialred-skin .librevjs-menu-button ul li.librevjs-selected:focus,.librevjs-libre-materialred-skin .librevjs-menu-button ul li.librevjs-selected:hover {
-outline: 0;
-color: #fff;
-background-color: #f44336;
-}
-/*End Select color menu subtitles/caption */
-.librevjs-libre-materialred-skin .librevjs-menu-button ul li.librevjs-menu-title {
-text-align:center;
-text-transform:uppercase;
-font-size:1em;
-line-height:2em;
-padding:0;
-margin:0 0 .3em;
-font-weight:700;
-cursor:default;
-}
-/* Subtitles Button */
-.librevjs-libre-materialred-skin .librevjs-subtitles-button:before {
-content:"\e00c"
-}
-/* Captions Button */
-.librevjs-libre-materialred-skin .librevjs-captions-button:before {
-content:"\e008"
-}
-/* Replacement for focus outline */
-.librevjs-libre-materialred-skin .librevjs-captions-button:focus .librevjs-control-content:before,.librevjs-libre-materialred-skin .librevjs-captions-button:hover .librevjs-control-content:before {
--webkit-box-shadow:0 0 1em #fff;
--moz-box-shadow:0 0 1em #fff;
-box-shadow:0 0 1em #fff;
-}
-/* Hide disabled or unsupported controls */
-.librevjs-libre-materialred-skin .librevjs-hidden {
-display:none
-}
-/*Title Resolution | subtitles and Caption*/
-.librevjs-libre-materialred-skin ul li.librevjs-menu-title.librevjs-res-menu-title{
-color: rgb(246, 44, 30);
-background-color: inherit;
-}
-.librevjs-libre-materialred-skin ul li.librevjs-menu-title.librevjs-res-menu-title:hover{
-color: rgb(244, 67, 54);
-background-color: inherit;
-}
-
-@media screen and (max-width: 400px){
- .librevjs-libre-materialred-skin .librevjs-big-play-button{
- font-size: 5em;
- top: 45%;
- }
-}
-@media screen and (max-width: 200px){
- .librevjs-libre-materialred-skin .librevjs-big-play-button	{
- top:35%;
- }
-}
-@media screen and (max-width: 150px){
- .librevjs-libre-materialred-skin .librevjs-big-play-button{
- font-size: 3em;
- }
-}
-@media screen and (max-width: 90px){
- .librevjs-libre-materialred-skin .librevjs-big-play-button{
- font-size: 2em;
- }
-}
-
-/* Skin-Teal -------------------------------------------------------------------------------------------------------*/
-.librevjs-libre-materialteal-skin {
-color:#ccc;
-background-color: inherit;
-}
-/* Base UI Component Classes
---------------------------------------------------------------------------------
-/* Slider - used for Volume bar and Seek bar */
-.librevjs-libre-materialteal-skin .librevjs-slider {
-/* Replace browser focus highlight with handle highlight */
-outline: 0;
-position: relative;
-cursor: pointer;
-padding: 0;
-/* background-color-with-alpha */
-background-color: #000000;
-background-color: rgba(0, 0, 0, 0.5);
-}
-.librevjs-libre-materialteal-skin .librevjs-slider:focus {
--webkit-box-shadow:0 0 2em #fff;
--moz-box-shadow:0 0 2em #fff;
-box-shadow:0 0 2em #fff;
-}
-
-/*Eliminación de botón de barra de progreso*/
-.librevjs-libre-materialteal-skin .librevjs-slider-handle {
-width: 0;
-height: 0;
-}
-.librevjs-libre-materialteal-skin .librevjs-slider-handle:before {
-text-shadow: 0em 0em 1em #fff;
-position: absolute;
-top: 0;
-left: 0;
-}
-
-/* Control Bar
---------------------------------------------------------------------------------
-The default control bar that is a container for most of the controls.
-*/
-.librevjs-libre-materialteal-skin .librevjs-control-bar {
-/* Start hidden */
-display: none;
-position: absolute;
-/* Place control bar at the bottom of the player box/video.
-   If you want more margin below the control bar, add more height. */
-bottom: 0;
-/* Use left/right to stretch to 100% width of player div */
-left: 0;
-right: 0;
-/* Height includes any margin you want above or below control items */
-height: 3.0em;
-/* background-color-with-alpha */
-background-color: #232323;
-background-color: rgba(35, 35, 35, 0.8);
-}
-/* Show the control bar only once the video has started playing */
-.librevjs-libre-materialteal-skin.librevjs-has-started .librevjs-control-bar {
-display:block;
-visibility:visible;
-opacity:1;
--webkit-transition:visibility .1s,opacity .1s;
--moz-transition:visibility .1s,opacity .1s;
--o-transition:visibility .1s,opacity .1s;
-transition:visibility .1s,opacity .1s
-}
-/* Hide the control bar when the video is playing and the user is inactive */
-.librevjs-libre-materialteal-skin.librevjs-has-started.librevjs-user-inactive.librevjs-playing .librevjs-control-bar {
-display:block;
-visibility:hidden;
-opacity:0;
--webkit-transition:visibility 1s,opacity 1s;
--moz-transition:visibility 1s,opacity 1s;
--o-transition:visibility 1s,opacity 1s;
-transition:visibility 1s,opacity 1s
-}
-.librevjs-libre-materialteal-skin.librevjs-controls-disabled .librevjs-control-bar {
-display:none
-}
-.librevjs-libre-materialteal-skin.librevjs-using-native-controls .librevjs-control-bar {
-display:none
-}
-@media \0screen {
- .librevjs-libre-materialteal-skin.librevjs-user-inactive.librevjs-playing .librevjs-control-bar :before {
- content:""
- }
-}
-/* General styles for individual controls. */
-.librevjs-libre-materialteal-skin .librevjs-control {
-outline:0;
-position:relative;
-float:left;
-text-align:center;
-margin:0;
-padding:0;
-height:3em;
-width:4em
-}
-/* FreeArt button icons: http://artlibre.org/licence/lal */
-.librevjs-libre-materialteal-skin .librevjs-control:before {
-font-family:LibreVideoJS;
-font-size:1.5em;
-line-height:2;
-position:absolute;
-top:0;
-left:0;
-width:100%;
-height:100%;
-text-align:center;
-text-shadow:1px 1px 1px rgba(0,0,0,.5)
-}
-/* Replacement for focus outline */
-.librevjs-libre-materialteal-skin .librevjs-control:focus:before,.librevjs-libre-materialteal-skin .librevjs-control:hover:before {
-color: #1de9b6;
-}
-.librevjs-libre-materialteal-skin .librevjs-control:focus {
-  /*  outline: 0; */
-  /* keyboard-only users cannot see the focus on several of the UI elements when this is set to 0 */
-}
-/* Hide control text visually, but have it available for screenreaders */
-.librevjs-libre-materialteal-skin .librevjs-control-text {
-border:0;
-clip:rect(0 0 0 0);
-height:1px;
-margin:-1px;
-overflow:hidden;
-padding:0;
-position:absolute;
-width:1px
-}
-/* Play/Pause
---------------------------------------------------------------------------------
-*/
-.librevjs-libre-materialteal-skin .librevjs-play-control {
-width:5em;
-cursor:pointer;
-color:rgb(29, 233, 182);
-}
-.librevjs-libre-materialteal-skin .librevjs-play-control:before {
-content:"\e001"
-}
-.librevjs-libre-materialteal-skin .librevjs-play-control:hover:before {
-color:#007c5d; /*color de play control al pasar el cursor*/
-}
-.librevjs-libre-materialteal-skin.librevjs-playing .librevjs-play-control:before {
-content:"\e002"
-}
-/* Volume/Mute
--------------------------------------------------------------------------------- */
-.librevjs-libre-materialteal-skin .librevjs-mute-control,.librevjs-libre-materialteal-skin .librevjs-volume-menu-button {
-cursor:pointer;
-float:right
-}
-.librevjs-libre-materialteal-skin .librevjs-mute-control:before,.librevjs-libre-materialteal-skin .librevjs-volume-menu-button:before {
-content:"\e006"
-}
-.librevjs-libre-materialteal-skin .librevjs-mute-control.librevjs-vol-0:before,.librevjs-libre-materialteal-skin .librevjs-volume-menu-button.librevjs-vol-0:before {
-content:"\e003"
-}
-.librevjs-libre-materialteal-skin .librevjs-mute-control.librevjs-vol-1:before,.librevjs-libre-materialteal-skin .librevjs-volume-menu-button.librevjs-vol-1:before {
-content:"\e004"
-}
-.librevjs-libre-materialteal-skin .librevjs-mute-control.librevjs-vol-2:before,.librevjs-libre-materialteal-skin .librevjs-volume-menu-button.librevjs-vol-2:before {
-content:"\e005"
-}
-.librevjs-libre-materialteal-skin .librevjs-volume-control {
-width:5em;
-float:right
-}
-.librevjs-libre-materialteal-skin .librevjs-volume-bar {
-width:5em;
-height:.6em;
-margin:1.1em auto 0
-}
-.librevjs-libre-materialteal-skin .librevjs-volume-menu-button .librevjs-menu-content {
-height:2.9em
-}
-
-/*Personalización del nivel de volumen*/
-.librevjs-libre-materialteal-skin .librevjs-volume-level {
-position: absolute;
-top: 0;
-left: 0;
-height: 0.5em;
-/* assuming volume starts at 1.0 */
-
-width: 100%;
-background: #1de9b6 url() -50% 0 repeat;
-}
-.librevjs-libre-materialteal-skin .librevjs-volume-bar .librevjs-volume-handle {
-width:.5em;
-height:.5em
-}
-.librevjs-libre-materialteal-skin .librevjs-volume-handle:before {
-font-size:.9em;
-top:-.2em;
-left:-.2em;
-width:1em;
-height:1em;
-}
-.librevjs-libre-materialteal-skin .librevjs-volume-menu-button .librevjs-menu .librevjs-menu-content {
-width:6em;
-left:-4em;
-}
-/* Progress
---------------------------------------------------------------------------------
-*/
-.librevjs-libre-materialteal-skin .librevjs-progress-control {
-position:absolute;
-left:0;
-right:0;
-width:auto;
-font-size:.3em;
-height:1em;
-top:-1em;
--webkit-transition:all .4s;
--moz-transition:all .4s;
--o-transition:all .4s;
-transition:all .4s;
-}
-.librevjs-libre-materialteal-skin:hover .librevjs-progress-control {
-font-size:.9em;
--webkit-transition:all .2s;
--moz-transition:all .2s;
--o-transition:all .2s;
-transition:all .2s;
-}
-/* Box containing play and load progress. Also acts as seek scrubber. */
-.librevjs-libre-materialteal-skin .librevjs-progress-holder {
-height:100%;
-}
-/* Progress Bars */
-.librevjs-libre-materialteal-skin .librevjs-progress-holder .librevjs-play-progress,.librevjs-libre-materialteal-skin .librevjs-progress-holder .librevjs-load-progress {
-position:absolute;
-display:block;
-height:100%;
-margin:0;
-padding:0;
-left:0;
-top:0
-}
-.librevjs-libre-materialteal-skin .librevjs-play-progress {
-background: #1de9b6 url() -50% 0 repeat;
-}
-.librevjs-libre-materialteal-skin .librevjs-load-progress {
-background:#646464;
-background:rgba(255,255,255,.4)
-}
-.librevjs-libre-materialteal-skin .librevjs-seek-handle {
-width:1.5em;
-height:100%
-}
-.librevjs-libre-materialteal-skin .librevjs-seek-handle:before {
-padding-top:.1em
-}
-/* Time Display
---------------------------------------------------------------------------------
-*/
-.librevjs-libre-materialteal-skin .librevjs-time-controls {
-font-size:1em;
-font-weight: 700;/*mayor visibilidad*/
-line-height:3em
-}
-.librevjs-libre-materialteal-skin .librevjs-current-time {
-float:left
-}
-.librevjs-libre-materialteal-skin .librevjs-duration {
-float:left
-}
-.librevjs-libre-materialteal-skin .librevjs-remaining-time {
-display:none;
-float:left
-}
-
-/* Fullscreen
---------------------------------------------------------------------------------
-*/
-.librevjs-libre-materialteal-skin .librevjs-fullscreen-control {
-width:3.8em;
-cursor:pointer;
-float:right
-}
-.librevjs-libre-materialteal-skin .librevjs-fullscreen-control:before {
-content:"\e000"
-}
-/* Switch to the exit icon when the player is in fullscreen */
-.librevjs-libre-materialteal-skin.librevjs-fullscreen .librevjs-fullscreen-control:before {
-content:"\e00b"
-}
-
-/* Big Play Button (play button at start)
---------------------------------------------------------------------------------
-Positioning of the play button in the center or other corners can be done more
-easily in the skin designer by LibreVideoJS FreeArts.
-*/
-.librevjs-libre-materialteal-skin .librevjs-big-play-button {
-left: 50%;
-top: 40%;
-font-size: 10em;
-display: block;
-z-index: 2;
-position: absolute;
-width: 1em;
-height: 1em;
-margin-left: -0.5em;
-margin-top: -0.5em;
-text-align: center;
-vertical-align: middle;
-cursor: pointer;
-opacity: 1;
-color: #1abc9c;
-}
-/* Hide if controls are disabled */
-.librevjs-libre-materialteal-skin.librevjs-controls-disabled .librevjs-big-play-button {
-display: none;
-}
-/* Hide when video starts playing */
-.librevjs-libre-materialteal-skin.librevjs-has-started .librevjs-big-play-button {
-display: none;
-}
-/* Hide on mobile devices. Remove when we stop using native controls
-   by default on mobile  */
-.librevjs-libre-materialteal-skin.librevjs-using-native-controls .librevjs-big-play-button {
-display: none;
-}
-.librevjs-libre-materialteal-skin:hover .librevjs-big-play-button,
-.librevjs-libre-materialteal-skin .librevjs-big-play-button:focus {
-color: #16a085;
-}
-.librevjs-libre-materialteal-skin .librevjs-big-play-button:before {
-content: "\e007";
-font-family: LibreVideoJS;
-/* In order to center the play icon vertically we need to set the line height
-   to the same as the button height */
-text-align: center /* Needed for IE8 */;
-position: absolute;
-left: 0;
-width: 100%;
-height: 100%;
-}
-
-/* Menu Buttons (Captions/Subtitles/etc.)
---------------------------------------------------------------------------------
-*/
-.librevjs-libre-materialteal-skin .librevjs-menu-button {
-float:right;
-cursor:pointer;
-}
-.librevjs-libre-materialteal-skin .librevjs-menu {
-display:none;
-position:absolute;
-bottom:0;
-left:0;
-width:0;
-height:0;
-margin-bottom:3em;
-border-left:2em solid transparent;
-border-right:2em solid transparent;
-border-top:1.55em solid #000;
-border-top-color:rgba(7,40,50,.5);
-}
-/* Button Pop-up Menu */
-.librevjs-libre-materialteal-skin .librevjs-menu-button .librevjs-menu .librevjs-menu-content {
-display:block;
-padding:0;
-margin:0;
-position:absolute;
-width:10em;
-bottom:1.5em;
-/* Same bottom as librevjs-menu border-top */
-max-height:15em;
-overflow:auto;
-left:-5em;
-/* Width of menu - width of button / 2 */
-/* background-color-with-alpha */
-background-color:#07141e;
-background-color:rgba(7,20,30,.7);
--webkit-box-shadow:-.2em -.2em .3em rgba(255,255,255,.2);
--moz-box-shadow:-.2em -.2em .3em rgba(255,255,255,.2);
-box-shadow:-.2em -.2em .3em rgba(255,255,255,.2);
-}
-.librevjs-libre-materialteal-skin .librevjs-menu-button:hover .librevjs-menu {
-display:block;
-}
-.librevjs-libre-materialteal-skin .librevjs-menu-button ul li {
-list-style:none;
-margin:0;
-padding:.3em 0;
-line-height:1.4em;
-font-size:1.2em;
-text-align:center;
-text-transform:lowercase;
-color:#ccc;
-}
-
-/* Select color menu subtitles/captions */
-.librevjs-libre-materialteal-skin .librevjs-menu-button ul li.librevjs-selected {
-color: rgb(1, 56, 47);
-background-color: rgb(29, 233, 182);
-}
-.librevjs-libre-materialteal-skin .librevjs-menu-button ul li:focus,.librevjs-libre-materialteal-skin .librevjs-menu-button ul li:hover,.librevjs-libre-materialteal-skin .librevjs-menu-button ul li.librevjs-selected:focus,.librevjs-libre-materialteal-skin .librevjs-menu-button ul li.librevjs-selected:hover {
-outline: 0;
-color: #004d40;
-background-color: #1de9b6;
-}
-/*End Select color menu subtitles/caption */
-.librevjs-libre-materialteal-skin .librevjs-menu-button ul li.librevjs-menu-title {
-text-align:center;
-text-transform:uppercase;
-font-size:1em;
-line-height:2em;
-padding:0;
-margin:0 0 .3em;
-font-weight:700;
-cursor:default;
-}
-/* Subtitles Button */
-.librevjs-libre-materialteal-skin .librevjs-subtitles-button:before {
-content:"\e00c"
-}
-/* Captions Button */
-.librevjs-libre-materialteal-skin .librevjs-captions-button:before {
-content:"\e008"
-}
-/* Replacement for focus outline */
-.librevjs-libre-materialteal-skin .librevjs-captions-button:focus .librevjs-control-content:before,.librevjs-libre-materialteal-skin .librevjs-captions-button:hover .librevjs-control-content:before {
--webkit-box-shadow:0 0 1em #fff;
--moz-box-shadow:0 0 1em #fff;
-box-shadow:0 0 1em #fff;
-}
-/* Hide disabled or unsupported controls */
-.librevjs-libre-materialteal-skin .librevjs-hidden {
-display:none
-}
-/*Title Resolution | subtitles and Caption*/
-.librevjs-libre-materialteal-skin ul li.librevjs-menu-title.librevjs-res-menu-title{
-color:rgb(26, 187, 156);
-background-color: inherit;
-}
-.librevjs-libre-materialteal-skin ul li.librevjs-menu-title.librevjs-res-menu-title:hover{
-color: rgb(29, 233, 182);
-background-color: inherit;
-}
-
-@media screen and (max-width: 400px){
- .librevjs-libre-materialteal-skin .librevjs-big-play-button{
- font-size: 5em;
- top: 45%;
- }
-}
-@media screen and (max-width: 200px){
- .librevjs-libre-materialteal-skin .librevjs-big-play-button	{
- top:35%;
- }
-}
-@media screen and (max-width: 150px){
- .librevjs-libre-materialteal-skin .librevjs-big-play-button{
- font-size: 3em;
- }
-}
-@media screen and (max-width: 90px){
- .librevjs-libre-materialteal-skin .librevjs-big-play-button{
- font-size: 2em;
- }
-}
-
-/* Skin-Yellow -----------------------------------------------------------------------------------------------------*/
-.librevjs-libre-materialyellow-skin {
-color:#ccc;
-background-color: inherit;
-}
-/* Base UI Component Classes
---------------------------------------------------------------------------------
-/* Slider - used for Volume bar and Seek bar */
-.librevjs-libre-materialyellow-skin .librevjs-slider {
-/* Replace browser focus highlight with handle highlight */
-outline: 0;
-position: relative;
-cursor: pointer;
-padding: 0;
-/* background-color-with-alpha */
-background-color: #000000;
-background-color: rgba(0, 0, 0, 0.5);
-}
-.librevjs-libre-materialyellow-skin .librevjs-slider:focus {
--webkit-box-shadow:0 0 2em #fff;
--moz-box-shadow:0 0 2em #fff;
-box-shadow:0 0 2em #fff;
-}
-
-/*Eliminación de botón de barra de progreso*/
-.librevjs-libre-materialyellow-skin .librevjs-slider-handle {
-width: 0;
-height: 0;
-}
-.librevjs-libre-materialyellow-skin .librevjs-slider-handle:before {
-text-shadow: 0em 0em 1em #fff;
-position: absolute;
-top: 0;
-left: 0;
-}
-
-/* Control Bar
---------------------------------------------------------------------------------
-The default control bar that is a container for most of the controls.
-*/
-.librevjs-libre-materialyellow-skin .librevjs-control-bar {
-/* Start hidden */
-display: none;
-position: absolute;
-/* Place control bar at the bottom of the player box/video.
-   If you want more margin below the control bar, add more height. */
-bottom: 0;
-/* Use left/right to stretch to 100% width of player div */
-left: 0;
-right: 0;
-/* Height includes any margin you want above or below control items */
-height: 3.0em;
-/* background-color-with-alpha */
-background-color: #232323;
-background-color: rgba(35, 35, 35, 0.8);
-}
-/* Show the control bar only once the video has started playing */
-.librevjs-libre-materialyellow-skin.librevjs-has-started .librevjs-control-bar {
-display:block;
-visibility:visible;
-opacity:1;
--webkit-transition:visibility .1s,opacity .1s;
--moz-transition:visibility .1s,opacity .1s;
--o-transition:visibility .1s,opacity .1s;
-transition:visibility .1s,opacity .1s
-}
-/* Hide the control bar when the video is playing and the user is inactive */
-.librevjs-libre-materialyellow-skin.librevjs-has-started.librevjs-user-inactive.librevjs-playing .librevjs-control-bar {
-display:block;
-visibility:hidden;
-opacity:0;
--webkit-transition:visibility 1s,opacity 1s;
--moz-transition:visibility 1s,opacity 1s;
--o-transition:visibility 1s,opacity 1s;
-transition:visibility 1s,opacity 1s
-}
-.librevjs-libre-materialyellow-skin.librevjs-controls-disabled .librevjs-control-bar {
-display:none
-}
-.librevjs-libre-materialyellow-skin.librevjs-using-native-controls .librevjs-control-bar {
-display:none
-}
-@media \0screen {
- .librevjs-libre-materialyellow-skin.librevjs-user-inactive.librevjs-playing .librevjs-control-bar :before {
- content:""
- }
-}
-/* General styles for individual controls. */
-.librevjs-libre-materialyellow-skin .librevjs-control {
-outline:0;
-position:relative;
-float:left;
-text-align:center;
-margin:0;
-padding:0;
-height:3em;
-width:4em
-}
-/* FreeArt button icons: http://artlibre.org/licence/lal */
-.librevjs-libre-materialyellow-skin .librevjs-control:before {
-font-family:LibreVideoJS;
-font-size:1.5em;
-line-height:2;
-position:absolute;
-top:0;
-left:0;
-width:100%;
-height:100%;
-text-align:center;
-text-shadow:1px 1px 1px rgba(0,0,0,.5)
-}
-/* Replacement for focus outline */
-.librevjs-libre-materialyellow-skin .librevjs-control:focus:before,.librevjs-libre-materialyellow-skin .librevjs-control:hover:before {
-color: #f1c40f;
-}
-.librevjs-libre-materialyellow-skin .librevjs-control:focus {
-  /*  outline: 0; */
-  /* keyboard-only users cannot see the focus on several of the UI elements when this is set to 0 */
-}
-/* Hide control text visually, but have it available for screenreaders */
-.librevjs-libre-materialyellow-skin .librevjs-control-text {
-border:0;
-clip:rect(0 0 0 0);
-height:1px;
-margin:-1px;
-overflow:hidden;
-padding:0;
-position:absolute;
-width:1px
-}
-/* Play/Pause
---------------------------------------------------------------------------------
-*/
-.librevjs-libre-materialyellow-skin .librevjs-play-control {
-width:5em;
-cursor:pointer;
-color:rgb(241, 196, 14);
-}
-.librevjs-libre-materialyellow-skin .librevjs-play-control:before {
-content:"\e001"
-}
-.librevjs-libre-materialyellow-skin .librevjs-play-control:hover:before {
-color:#f39c12; /*color de play control al pasar el cursor*/
-}
-.librevjs-libre-materialyellow-skin.librevjs-playing .librevjs-play-control:before {
-content:"\e002"
-}
-/* Volume/Mute
--------------------------------------------------------------------------------- */
-.librevjs-libre-materialyellow-skin .librevjs-mute-control,.librevjs-libre-materialyellow-skin .librevjs-volume-menu-button {
-cursor:pointer;
-float:right
-}
-.librevjs-libre-materialyellow-skin .librevjs-mute-control:before,.librevjs-libre-materialyellow-skin .librevjs-volume-menu-button:before {
-content:"\e006"
-}
-.librevjs-libre-materialyellow-skin .librevjs-mute-control.librevjs-vol-0:before,.librevjs-libre-materialyellow-skin .librevjs-volume-menu-button.librevjs-vol-0:before {
-content:"\e003"
-}
-.librevjs-libre-materialyellow-skin .librevjs-mute-control.librevjs-vol-1:before,.librevjs-libre-materialyellow-skin .librevjs-volume-menu-button.librevjs-vol-1:before {
-content:"\e004"
-}
-.librevjs-libre-materialyellow-skin .librevjs-mute-control.librevjs-vol-2:before,.librevjs-libre-materialyellow-skin .librevjs-volume-menu-button.librevjs-vol-2:before {
-content:"\e005"
-}
-.librevjs-libre-materialyellow-skin .librevjs-volume-control {
-width:5em;
-float:right
-}
-.librevjs-libre-materialyellow-skin .librevjs-volume-bar {
-width:5em;
-height:.6em;
-margin:1.1em auto 0
-}
-.librevjs-libre-materialyellow-skin .librevjs-volume-menu-button .librevjs-menu-content {
-height:2.9em
-}
-
-/*Personalización del nivel de volumen*/
-.librevjs-libre-materialyellow-skin .librevjs-volume-level {
-position: absolute;
-top: 0;
-left: 0;
-height: 0.5em;
-/* assuming volume starts at 1.0 */
-
-width: 100%;
-background: #f1c40f url() -50% 0 repeat;
-}
-.librevjs-libre-materialyellow-skin .librevjs-volume-bar .librevjs-volume-handle {
-width:.5em;
-height:.5em
-}
-.librevjs-libre-materialyellow-skin .librevjs-volume-handle:before {
-font-size:.9em;
-top:-.2em;
-left:-.2em;
-width:1em;
-height:1em;
-}
-.librevjs-libre-materialyellow-skin .librevjs-volume-menu-button .librevjs-menu .librevjs-menu-content {
-width:6em;
-left:-4em;
-}
-/* Progress
---------------------------------------------------------------------------------
-*/
-.librevjs-libre-materialyellow-skin .librevjs-progress-control {
-position:absolute;
-left:0;
-right:0;
-width:auto;
-font-size:.3em;
-height:1em;
-top:-1em;
--webkit-transition:all .4s;
--moz-transition:all .4s;
--o-transition:all .4s;
-transition:all .4s;
-}
-.librevjs-libre-materialyellow-skin:hover .librevjs-progress-control {
-font-size:.9em;
--webkit-transition:all .2s;
--moz-transition:all .2s;
--o-transition:all .2s;
-transition:all .2s;
-}
-/* Box containing play and load progress. Also acts as seek scrubber. */
-.librevjs-libre-materialyellow-skin .librevjs-progress-holder {
-height:100%;
-}
-/* Progress Bars */
-.librevjs-libre-materialyellow-skin .librevjs-progress-holder .librevjs-play-progress,.librevjs-libre-materialyellow-skin .librevjs-progress-holder .librevjs-load-progress {
-position:absolute;
-display:block;
-height:100%;
-margin:0;
-padding:0;
-left:0;
-top:0
-}
-.librevjs-libre-materialyellow-skin .librevjs-play-progress {
-background: #f1c40f url() -50% 0 repeat;
-}
-.librevjs-libre-materialyellow-skin .librevjs-load-progress {
-background:#646464;
-background:rgba(255,255,255,.4)
-}
-.librevjs-libre-materialyellow-skin .librevjs-seek-handle {
-width:1.5em;
-height:100%
-}
-.librevjs-libre-materialyellow-skin .librevjs-seek-handle:before {
-padding-top:.1em
-}
-/* Time Display
---------------------------------------------------------------------------------
-*/
-.librevjs-libre-materialyellow-skin .librevjs-time-controls {
-font-size:1em;
-font-weight: 700;/*mayor visibilidad*/
-line-height:3em
-}
-.librevjs-libre-materialyellow-skin .librevjs-current-time {
-float:left
-}
-.librevjs-libre-materialyellow-skin .librevjs-duration {
-float:left
-}
-.librevjs-libre-materialyellow-skin .librevjs-remaining-time {
-display:none;
-float:left
-}
-
-/* Fullscreen
---------------------------------------------------------------------------------
-*/
-.librevjs-libre-materialyellow-skin .librevjs-fullscreen-control {
-width:3.8em;
-cursor:pointer;
-float:right
-}
-.librevjs-libre-materialyellow-skin .librevjs-fullscreen-control:before {
-content:"\e000"
-}
-/* Switch to the exit icon when the player is in fullscreen */
-.librevjs-libre-materialyellow-skin.librevjs-fullscreen .librevjs-fullscreen-control:before {
-content:"\e00b"
-}
-
-/* Big Play Button (play button at start)
---------------------------------------------------------------------------------
-Positioning of the play button in the center or other corners can be done more
-easily in the skin designer by LibreVideoJS FreeArts.
-*/
-.librevjs-libre-materialyellow-skin .librevjs-big-play-button {
-  left: 50%;
-  top: 40%;
-  font-size: 10em;
-  display: block;
-  z-index: 2;
-  position: absolute;
-  width: 1em;
-  height: 1em;
-  margin-left: -0.5em;
-  margin-top: -0.5em;
-  text-align: center;
-  vertical-align: middle;
-  cursor: pointer;
-  opacity: 1;
-  color: #f1c40f;
-}
-/* Hide if controls are disabled */
-.librevjs-libre-materialyellow-skin.librevjs-controls-disabled .librevjs-big-play-button {
-display: none;
-}
-/* Hide when video starts playing */
-.librevjs-libre-materialyellow-skin.librevjs-has-started .librevjs-big-play-button {
-display: none;
-}
-/* Hide on mobile devices. Remove when we stop using native controls
-   by default on mobile  */
-.librevjs-libre-materialyellow-skin.librevjs-using-native-controls .librevjs-big-play-button {
-display: none;
-}
-.librevjs-libre-materialyellow-skin:hover .librevjs-big-play-button,
-.librevjs-libre-materialyellow-skin .librevjs-big-play-button:focus {
-color: rgb(244, 156, 18); /*color boton focus amarillo oscuro*/
-}
-.librevjs-libre-materialyellow-skin .librevjs-big-play-button:before {
-content: "\e007";
-font-family: LibreVideoJS;
-/* In order to center the play icon vertically we need to set the line height
-   to the same as the button height */
-text-align: center /* Needed for IE8 */;
-position: absolute;
-left: 0;
-width: 100%;
-height: 100%;
-}
-
-/* Menu Buttons (Captions/Subtitles/etc.)
---------------------------------------------------------------------------------
-*/
-.librevjs-libre-materialyellow-skin .librevjs-menu-button {
-float:right;
-cursor:pointer;
-}
-.librevjs-libre-materialyellow-skin .librevjs-menu {
-display:none;
-position:absolute;
-bottom:0;
-left:0;
-width:0;
-height:0;
-margin-bottom:3em;
-border-left:2em solid transparent;
-border-right:2em solid transparent;
-border-top:1.55em solid #000;
-border-top-color:rgba(7,40,50,.5);
-}
-/* Button Pop-up Menu */
-.librevjs-libre-materialyellow-skin .librevjs-menu-button .librevjs-menu .librevjs-menu-content {
-display:block;
-padding:0;
-margin:0;
-position:absolute;
-width:10em;
-bottom:1.5em;
-/* Same bottom as librevjs-menu border-top */
-max-height:15em;
-overflow:auto;
-left:-5em;
-/* Width of menu - width of button / 2 */
-/* background-color-with-alpha */
-background-color:#07141e;
-background-color:rgba(7,20,30,.7);
--webkit-box-shadow:-.2em -.2em .3em rgba(255,255,255,.2);
--moz-box-shadow:-.2em -.2em .3em rgba(255,255,255,.2);
-box-shadow:-.2em -.2em .3em rgba(255,255,255,.2);
-}
-.librevjs-libre-materialyellow-skin .librevjs-menu-button:hover .librevjs-menu {
-display:block;
-}
-.librevjs-libre-materialyellow-skin .librevjs-menu-button ul li {
-list-style:none;
-margin:0;
-padding:.3em 0;
-line-height:1.4em;
-font-size:1.2em;
-text-align:center;
-text-transform:lowercase;
-color:#ccc;
-}
-
-/* Select color menu subtitles/captions */
-.librevjs-libre-materialyellow-skin .librevjs-menu-button ul li.librevjs-selected {
-color: #fff;
-background-color: rgb(241, 196, 14);
-}
-.librevjs-libre-materialyellow-skin .librevjs-menu-button ul li:focus,.librevjs-libre-materialyellow-skin .librevjs-menu-button ul li:hover,.librevjs-libre-materialyellow-skin .librevjs-menu-button ul li.librevjs-selected:focus,.librevjs-libre-materialyellow-skin .librevjs-menu-button ul li.librevjs-selected:hover {
-outline: 0;
-color: #fff;
-background-color: #f1c40f;
-}
-/*End Select color menu subtitles/caption */
-.librevjs-libre-materialyellow-skin .librevjs-menu-button ul li.librevjs-menu-title {
-text-align:center;
-text-transform:uppercase;
-font-size:1em;
-line-height:2em;
-padding:0;
-margin:0 0 .3em;
-font-weight:700;
-cursor:default;
-}
-/* Subtitles Button */
-.librevjs-libre-materialyellow-skin .librevjs-subtitles-button:before {
-content:"\e00c"
-}
-/* Captions Button */
-.librevjs-libre-materialyellow-skin .librevjs-captions-button:before {
-content:"\e008"
-}
-/* Replacement for focus outline */
-.librevjs-libre-materialyellow-skin .librevjs-captions-button:focus .librevjs-control-content:before,.librevjs-libre-materialyellow-skin .librevjs-captions-button:hover .librevjs-control-content:before {
--webkit-box-shadow:0 0 1em #fff;
--moz-box-shadow:0 0 1em #fff;
-box-shadow:0 0 1em #fff;
-}
-/* Hide disabled or unsupported controls */
-.librevjs-libre-materialyellow-skin .librevjs-hidden {
-display:none
-}
-/*Title Resolution | subtitles and Caption*/
-.librevjs-libre-materialyellow-skin ul li.librevjs-menu-title.librevjs-res-menu-title{
-color: #f1c40f;
-background-color: inherit;
-}
-.librevjs-libre-materialyellow-skin ul li.librevjs-menu-title.librevjs-res-menu-title:hover{
-color: #f39c12;
-background-color: inherit;
-}
-
-@media screen and (max-width: 400px){
- .librevjs-libre-materialyellow-skin .librevjs-big-play-button{
- font-size: 5em;
- top: 45%;
- }
-}
-@media screen and (max-width: 200px){
- .librevjs-libre-materialyellow-skin .librevjs-big-play-button	{
- top:35%;
- }
-}
-@media screen and (max-width: 150px){
- .librevjs-libre-materialyellow-skin .librevjs-big-play-button{
- font-size: 3em;
- }
-}
-@media screen and (max-width: 90px){
- .librevjs-libre-materialyellow-skin .librevjs-big-play-button{
- font-size: 2em;
- }
-}
-
-/* Global Styles
-==============================================================================*/
-/* Global Time-Display */
-.librevjs-time-divider {
-float:left;
-line-height:3em
-}
-/* Global Big-Play-Button-(play-button-at-start) */
-.librevjs-error .librevjs-big-play-button {
-display: none;
-}
-/* Global Loading Spinner */
-.librevjs-loading-spinner {
-display:none;
-position:absolute;
-top:50%;
-left:50%;
-font-size:4em;
-line-height:1;
-width:1em;
-height:1em;
-margin-left:-.5em;
-margin-top:-.5em;
-opacity:.75;
--webkit-animation:spin 1.5s infinite linear;
--moz-animation:spin 1.5s infinite linear;
--o-animation:spin 1.5s infinite linear;
-animation:spin 1.5s infinite linear
-}
-.librevjs-loading-spinner:before {
-content:"\e01e";
-font-family:LibreVideoJS;
-position:absolute;
-top:0;
-left:0;
-width:1em;
-height:1em;
-text-align:center;
-text-shadow:0 0 .1em #000
-}
-@-moz-keyframes spin {
-0% {
-   -moz-transform:rotate(0deg)
-   }
-100% {
-   -moz-transform:rotate(359deg)
-   }
-}
-@-webkit-keyframes spin {
-0% {
-   -webkit-transform:rotate(0deg)
-   }
-100% {
-   -webkit-transform:rotate(359deg)
-   }
-}
-@-o-keyframes spin {
-0% {
-   -o-transform:rotate(0deg)
-   }
-100% {
-   -o-transform:rotate(359deg)
-   }
-}
-@keyframes spin {
-0% {
-   transform:rotate(0deg)
-   }
-100% {
-   transform:rotate(359deg)
-   }
-}
-/*
-REQUIRED STYLES (be careful overriding)
-================================================================================
-When loading the player, the video tag is replaced with a DIV,
-that will hold the video tag or object tag for other playback methods.
-The div contains the video playback element (HTML5) and controls,
-and sets the width and height of the video.
-** If you want to add some kind of border/padding (e.g. a frame), or special
-positioning, use another containing element. Otherwise you risk messing up
-control positioning and full window mode. **
-*/
-.cliplibre-js {
-background-color:#000;
-position:relative;
-padding:0;
-font-size:10px;
-vertical-align:middle;
-font-weight:500;
-font-style:normal;
-font-family:Arial,sans-serif;
--webkit-user-select:none;
--moz-user-select:none;
--ms-user-select:none;
-user-select:none
-}
-/* Playback technology elements expand to the width/height of the containing div <video> */
-.cliplibre-js .librevjs-tech {
-position:absolute;
-top:0;
-left:0;
-width:100%;
-height:100%
-}
-.cliplibre-js:-moz-full-screen {
-position:absolute
-}
-/* Fullscreen Styles */
-body.librevjs-full-window {
-padding:0;
-margin:0;
-height:100%;
-overflow-y:auto;
-}
-.cliplibre-js.librevjs-fullscreen {
-position:fixed;
-overflow:hidden;
-z-index:1000;
-left:0;
-top:0;
-bottom:0;
-right:0;
-width:100%!important;
-height:100%!important;
-position:absolute;
-}
-.cliplibre-js:-webkit-full-screen {
-width:100%!important;
-height:100%!important
-}
-.cliplibre-js.librevjs-fullscreen.librevjs-user-inactive {
-cursor:none
-}
-/* Poster Styles */
-.librevjs-poster {
-background-repeat:no-repeat;
-background-position:50% 50%;
-background-size:contain;
-cursor:pointer;
-height:100%;
-margin:0;
-padding:0;
-position:relative;
-width:100%
-}
-.librevjs-poster img {
-display:block;
-margin:0 auto;
-max-height:100%;
-padding:0;
-width:100%
-}
-/* Hide the poster when native controls are used otherwise it covers them */
-.cliplibre-js.librevjs-using-native-controls .librevjs-poster {
-display:none
-}
-/* Text Track Styles */
-/* Overall track holder for both captions and subtitles */
-.cliplibre-js .librevjs-text-track-display {
-text-align:center;
-position:absolute;
-bottom:4em;
-left:1em;
-right:1em
-}
-/* Individual tracks */
-.cliplibre-js .librevjs-text-track {
-display:none;
-font-size:1.7em;
-text-align:center;
-margin-bottom:.1em;
-/* Transparent black background, or fallback to all black (oldIE) */
-background-color:#000;
-background-color:rgba(0,0,0,.6)
-}
-.cliplibre-js .librevjs-subtitles {
-color:#fff
-}
-.cliplibre-js .librevjs-captions {
-color:rgb(255, 237, 0);
-background-color: rgba(2, 7, 11, 0.7);
-}
-.librevjs-tt-cue {
-display:block
-}
-/* Global Hide disabled or unsupported controls */
-.librevjs-lock-showing {
-display:block!important;
-opacity:1;
-visibility:visible
-}
-/* Opctional Styles No support HTML5*/
-.no_html5 {
-background: black none repeat scroll 0 0;
-color: white;
-height: 160px;
-padding: 130px 10px 20px;
-text-align: center;
-}
-/* Global Responsive
-------------------------------------------------------------------------------*/
-.cliplibre-js-responsive-container.librevjs-hd {
-padding-top: 56.25%;
-}
-.cliplibre-js-responsive-container.librevjs-sd {
-padding-top: 75%;
-}
-.cliplibre-js-responsive-container {
-width: 100%;
-position: relative;
-}
-.cliplibre-js-responsive-container .cliplibre-js {
-height: 100% !important;
-width: 100% !important;
-position: absolute;
-top: 0;
-left: 0;
-}
-@media screen and (max-width: 600px){
- .cliplibre-js .librevjs-text-track{
- font-size: 1.2em;
- }
- .cliplibre-js .librevjs-text-track-display{
- bottom: 2em;
- }
-}
-@media screen and (max-width: 413px){
-  .cliplibre-js {
-    font-size:8px;
-  }
-}
-@media screen and (max-width: 400px){
- .cliplibre-js .librevjs-text-track{
- font-size: 0.9em;
- }
- .cliplibre-js .librevjs-text-track-display{
- bottom: 1em;
- }
-}
-@media screen and (max-width: 335px){
-  .cliplibre-js {
-    font-size:6px;
-  }
-}
-- 
cgit v1.2.3