diff options
Diffstat (limited to 'librevideojs/css/default/cliplibre-js.dev.css')
| -rw-r--r-- | librevideojs/css/default/cliplibre-js.dev.css | 576 |
1 files changed, 576 insertions, 0 deletions
diff --git a/librevideojs/css/default/cliplibre-js.dev.css b/librevideojs/css/default/cliplibre-js.dev.css new file mode 100644 index 0000000..70a4a5a --- /dev/null +++ b/librevideojs/css/default/cliplibre-js.dev.css @@ -0,0 +1,576 @@ +/*! +Video.js Default Styles (http://videojs.com) +Version 4.3.0 +Create your own skin at http://designer.videojs.com +*/.librevjs-default-skin { + color:#ccc; + background-color: inherit; +} +@font-face { + font-family:VideoJS; + src: url('../../fonts/default/vjs.eot'); + src: url('../../fonts/default/vjs.eot?#iefix') format('embedded-opentype'), url('../../fonts/default/vjs.woff') format('woff'), url('../../fonts/default/vjs.ttf') format('truetype'), url('../../fonts/default/vjs.svg#icomoon') format('svg'); + fontº-weight:400; + font-style:normal +} +.librevjs-default-skin .librevjs-slider { + outline:0; + position:relative; + cursor:pointer; + padding:0; + background-color:#333; + background-color:rgba(51,51,51,.9) +} +.librevjs-default-skin .librevjs-slider:focus { + -webkit-box-shadow:0 0 2em #fff; + -moz-box-shadow:0 0 2em #fff; + box-shadow:0 0 2em #fff +} +.librevjs-default-skin .librevjs-slider-handle { + position:absolute; + left:0; + top:0 +} +.librevjs-default-skin .librevjs-slider-handle:before { + content:"\e009"; + font-family:VideoJS; + font-size:1em; + line-height:1; + text-align:center; + text-shadow:0 0 1em #fff; + position:absolute; + top:0; + left:0; + -webkit-transform:rotate(-45deg); + -moz-transform:rotate(-45deg); + -ms-transform:rotate(-45deg); + -o-transform:rotate(-45deg); + transform:rotate(-45deg) +} +.librevjs-default-skin .librevjs-control-bar { + display:none; + position:absolute; + bottom:0; + left:0; + right:0; + height:3em; + background-color:#07141e; + background-color:rgba(7,20,30,.7) +} +.librevjs-default-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 +} +.librevjs-default-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-default-skin.librevjs-controls-disabled .librevjs-control-bar { + display:none +} +.librevjs-default-skin.librevjs-using-native-controls .librevjs-control-bar { + display:none +} +@media \0screen { + .librevjs-default-skin.librevjs-user-inactive.librevjs-playing .librevjs-control-bar :before { + content:"" + } +} +.librevjs-default-skin .librevjs-control { + outline:0; + position:relative; + float:left; + text-align:center; + margin:0; + padding:0; + height:3em; + width:4em +} +.librevjs-default-skin .librevjs-control:before { + font-family:VideoJS; + 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) +} +.librevjs-default-skin .librevjs-control:focus:before,.librevjs-default-skin .librevjs-control:hover:before { + text-shadow:0 0 1em #fff +} +.librevjs-default-skin .librevjs-control:focus { +} +.librevjs-default-skin .librevjs-control-text { + border:0; + clip:rect(0 0 0 0); + height:1px; + margin:-1px; + overflow:hidden; + padding:0; + position:absolute; + width:1px +} +.librevjs-default-skin .librevjs-play-control { + width:5em; + cursor:pointer +} +.librevjs-default-skin .librevjs-play-control:before { + content:"\e001" +} +.librevjs-default-skin.librevjs-playing .librevjs-play-control:before { + content:"\e002" +} +.librevjs-default-skin .librevjs-mute-control,.librevjs-default-skin .librevjs-volume-menu-button { + cursor:pointer; + float:right +} +.librevjs-default-skin .librevjs-mute-control:before,.librevjs-default-skin .librevjs-volume-menu-button:before { + content:"\e006" +} +.librevjs-default-skin .librevjs-mute-control.librevjs-vol-0:before,.librevjs-default-skin .librevjs-volume-menu-button.librevjs-vol-0:before { + content:"\e003" +} +.librevjs-default-skin .librevjs-mute-control.librevjs-vol-1:before,.librevjs-default-skin .librevjs-volume-menu-button.librevjs-vol-1:before { + content:"\e004" +} +.librevjs-default-skin .librevjs-mute-control.librevjs-vol-2:before,.librevjs-default-skin .librevjs-volume-menu-button.librevjs-vol-2:before { + content:"\e005" +} +.librevjs-default-skin .librevjs-volume-control { + width:5em; + float:right +} +.librevjs-default-skin .librevjs-volume-bar { + width:5em; + height:.6em; + margin:1.1em auto 0 +} +.librevjs-default-skin .librevjs-volume-menu-button .librevjs-menu-content { + height:2.9em +} +.librevjs-default-skin .librevjs-volume-level { + position:absolute; + top:0; + left:0; + height:.5em; + background:#66a8cc url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAYAAAAGCAYAAADgzO9IAAAAP0lEQVQIHWWMAQoAIAgDR/QJ/Ub//04+w7ZICBwcOg5FZi5iBB82AGzixEglJrd4TVK5XUJpskSTEvpdFzX9AB2pGziSQcvAAAAAAElFTkSuQmCC) -50% 0 repeat +} +.librevjs-default-skin .librevjs-volume-bar .librevjs-volume-handle { + width:.5em; + height:.5em +} +.librevjs-default-skin .librevjs-volume-handle:before { + font-size:.9em; + top:-.2em; + left:-.2em; + width:1em; + height:1em +} +.librevjs-default-skin .librevjs-volume-menu-button .librevjs-menu .librevjs-menu-content { + width:6em; + left:-4em +} +.librevjs-default-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-default-skin:hover .librevjs-progress-control { + font-size:.9em; + -webkit-transition:all .2s; + -moz-transition:all .2s; + -o-transition:all .2s; + transition:all .2s +} +.librevjs-default-skin .librevjs-progress-holder { + height:100% +} +.librevjs-default-skin .librevjs-progress-holder .librevjs-play-progress,.librevjs-default-skin .librevjs-progress-holder .librevjs-load-progress { + position:absolute; + display:block; + height:100%; + margin:0; + padding:0; + left:0; + top:0 +} +.librevjs-default-skin .librevjs-play-progress { + background:#66a8cc url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAYAAAAGCAYAAADgzO9IAAAAP0lEQVQIHWWMAQoAIAgDR/QJ/Ub//04+w7ZICBwcOg5FZi5iBB82AGzixEglJrd4TVK5XUJpskSTEvpdFzX9AB2pGziSQcvAAAAAAElFTkSuQmCC) -50% 0 repeat +} +.librevjs-default-skin .librevjs-load-progress { + background:#646464; + background:rgba(255,255,255,.4) +} +.librevjs-default-skin .librevjs-seek-handle { + width:1.5em; + height:100% +} +.librevjs-default-skin .librevjs-seek-handle:before { + padding-top:.1em +} +.librevjs-default-skin .librevjs-time-controls { + font-size:1em; + line-height:3em +} +.librevjs-default-skin .librevjs-current-time { + float:left +} +.librevjs-default-skin .librevjs-duration { + float:left +} +.librevjs-default-skin .librevjs-remaining-time { + display:none; + float:left +} +.librevjs-time-divider { + float:left; + line-height:3em +} +.librevjs-default-skin .librevjs-fullscreen-control { + width:3.8em; + cursor:pointer; + float:right +} +.librevjs-default-skin .librevjs-fullscreen-control:before { + content:"\e000" +} +.librevjs-default-skin.librevjs-fullscreen .librevjs-fullscreen-control:before { + content:"\e00b" +} + +/*Centrado del button Play*/ +.librevjs-default-skin .librevjs-big-play-button { + left: 50%; /*por defecto left:.5em;*/ + top: 50%; /*por defecto top:.5em;*/ + margin: -1.5em auto auto -2em; /*por defecto esta linea no existe*/ + font-size:3em; + display:block; + z-index:2; + position:absolute; + width:4em; + height:2.6em; + text-align:center; + vertical-align:middle; + cursor:pointer; + opacity:1; + background-color:#07141e; + background-color:rgba(7,20,30,.7); + border:.1em solid #3b4249; + -webkit-border-radius:.8em; + -moz-border-radius:.8em; + border-radius:.8em; + -webkit-box-shadow:0 0 1em rgba(255,255,255,.25); + -moz-box-shadow:0 0 1em rgba(255,255,255,.25); + box-shadow:0 0 1em rgba(255,255,255,.25); + -webkit-transition:all .4s; + -moz-transition:all .4s; + -o-transition:all .4s; + transition:all .4s +} +.librevjs-default-skin.librevjs-big-play-centered .librevjs-big-play-button { + left:50%; + margin-left:-2.1em; + top:50%; + margin-top:-1.4000000000000001em +} +.librevjs-default-skin.librevjs-controls-disabled .librevjs-big-play-button { + display:none +} +.librevjs-default-skin.librevjs-has-started .librevjs-big-play-button { + display:none +} +.librevjs-default-skin.librevjs-using-native-controls .librevjs-big-play-button { + display:none +} +.librevjs-default-skin:hover .librevjs-big-play-button,.librevjs-default-skin .librevjs-big-play-button:focus { + outline:0; + border-color:#fff; + background-color:#505050; + background-color:rgba(50,50,50,.75); + -webkit-box-shadow:0 0 3em #fff; + -moz-box-shadow:0 0 3em #fff; + box-shadow:0 0 3em #fff; + -webkit-transition:all 0s; + -moz-transition:all 0s; + -o-transition:all 0s; + transition:all 0s +} +.librevjs-default-skin .librevjs-big-play-button:before { + content:"\e001"; + font-family:VideoJS; + line-height:2.6em; + text-shadow:.05em .05em .1em #000; + text-align:center; + position:absolute; + left:0; + width:100%; + height:100% +} +.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-default-skin .librevjs-loading-spinner:before { + content:"\e01e"; + font-family:VideoJS; + 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) + } +} +.librevjs-default-skin .librevjs-menu-button { + float:right; + cursor:pointer +} +.librevjs-default-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) +} +.librevjs-default-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; + overflow:auto; + left:-5em; + 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-default-skin .librevjs-menu-button:hover .librevjs-menu { + display:block +} +.librevjs-default-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 +} +.librevjs-default-skin .librevjs-menu-button ul li.librevjs-selected { + background-color:#000 +} +.librevjs-default-skin .librevjs-menu-button ul li:focus,.librevjs-default-skin .librevjs-menu-button ul li:hover,.librevjs-default-skin .librevjs-menu-button ul li.librevjs-selected:focus,.librevjs-default-skin .librevjs-menu-button ul li.librevjs-selected:hover { + outline:0; + color:#111; + background-color:#fff; + background-color:rgba(255,255,255,.75); + -webkit-box-shadow:0 0 1em #fff; + -moz-box-shadow:0 0 1em #fff; + box-shadow:0 0 1em #fff +} +.librevjs-default-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 +} +.librevjs-default-skin .librevjs-subtitles-button:before { + content:"\e00c" +} +.librevjs-default-skin .librevjs-captions-button:before { + content:"\e008" +} +.librevjs-default-skin .librevjs-captions-button:focus .librevjs-control-content:before,.librevjs-default-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 +} +.cliplibre-js { + background-color:#000; + position:relative; + padding:0; + font-size:10px; + vertical-align:middle; + font-weight:400; + font-style:normal; + font-family:Arial,sans-serif; + -webkit-user-select:none; + -moz-user-select:none; + -ms-user-select:none; + user-select:none +} +.cliplibre-js .librevjs-tech { + position:absolute; + top:0; + left:0; + width:100%; + height:100% +} +.cliplibre-js:-moz-full-screen { + position:absolute +} +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 +} +.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% +} +.cliplibre-js.librevjs-using-native-controls .librevjs-poster { + display:none +} +.cliplibre-js .librevjs-text-track-display { + text-align:center; + position:absolute; + bottom:4em; + left:1em; + right:1em +} +.cliplibre-js .librevjs-text-track { + display:none; + font-size:1.5em; + text-align:center; + margin-bottom:.1em; + 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 +} +.librevjs-default-skin .librevjs-hidden { + display:none +} +.librevjs-lock-showing { + display:block!important; + opacity:1; + visibility:visible +} +ul li.librevjs-menu-title.librevjs-res-menu-title{ + color: #fff; +} +ul li.librevjs-menu-title.librevjs-res-menu-title:hover{ + color: #fff; +} |