From d46d40fa1769bc6521c98a5bc75a2212c6174a0b Mon Sep 17 00:00:00 2001 From: Sam Potts Date: Thu, 19 Feb 2015 12:21:37 +1100 Subject: [PATCH] Font size fix for examples, tidied up variables --- assets/less/docs.less | 4 ++-- assets/less/docs/mixins.less | 5 +++-- assets/less/plyr.less | 29 ++++++++++++++++------------- dist/css/docs.css | 2 +- dist/css/plyr.css | 2 +- 5 files changed, 23 insertions(+), 19 deletions(-) diff --git a/assets/less/docs.less b/assets/less/docs.less index 8369fce3..7559f420 100644 --- a/assets/less/docs.less +++ b/assets/less/docs.less @@ -30,12 +30,12 @@ // Base html { - font-size: 62.5%; + //font-size: 62.5%; } body { font-family: "Avenir", "Helvetica Neue", Helvetica, Arial, sans-serif; background: #fff; - .font-size(16); + //.font-size(16); line-height: 1.5; text-align: center; color: #6D797F; diff --git a/assets/less/docs/mixins.less b/assets/less/docs/mixins.less index 02f44d55..b3a1f63b 100644 --- a/assets/less/docs/mixins.less +++ b/assets/less/docs/mixins.less @@ -22,10 +22,11 @@ } // Use rems for font sizing +// Leave at 100%/16px // --------------------------------------- .font-size(@font-size: 16){ - @rem: (@font-size / 10); - font-size: @font-size * 1px; + @rem: round((@font-size / 16), 1); + font-size: (@font-size * 1px); font-size: ~"@{rem}rem"; } diff --git a/assets/less/plyr.less b/assets/less/plyr.less index 659be8b4..9a35a0a3 100644 --- a/assets/less/plyr.less +++ b/assets/less/plyr.less @@ -23,11 +23,16 @@ // Range @range-track-height: 6px; +@range-track-bg: @gray; @range-thumb-height: (@range-track-height * 2); @range-thumb-width: (@range-track-height * 2); @range-thumb-bg: @control-color; @range-thumb-bg-focus: @control-color-active; +// Breakpoints +@bp-control-split: 560px; // When controls split into left/right +@bg-captions-large: 768px; // When captions jump to the larger font size + // Utility classes & mixins // ------------------------------- // Screen reader only @@ -67,7 +72,7 @@ } .range-track() { height: @range-track-height; - background: @gray; + background: @range-track-bg; border: 0; border-radius: (@range-track-height / 2); } @@ -132,7 +137,7 @@ text-align: center; .font-smoothing(); - @media (min-width: 560px) { + @media (min-width: @bg-captions-large) { font-size: 24px; } } @@ -155,7 +160,7 @@ display: block; margin: @control-spacing auto 0; } - @media (min-width: 560px) { + @media (min-width: @bp-control-split) { &-playback { float: left; } @@ -198,17 +203,17 @@ background: transparent; overflow: hidden; } - button:hover, - label:hover { - background: @control-color-active; + input:focus + label, + button:focus { + .tab-focus(); svg { fill: #fff; } } - input:focus + label, - button:focus { - .tab-focus(); + button:hover, + input + label:hover { + background: @control-color-active; svg { fill: #fff; @@ -365,15 +370,13 @@ top: auto; bottom: 90px; - @media (min-width: 560px) and (max-width: 767px) { + @media (min-width: @bp-control-split) and (max-width: (@bg-captions-large - 1)) { bottom: 60px; } - - @media (min-width: 768px) { + @media (min-width: @bg-captions-large) { bottom: 80px; } } - } .player-controls { position: absolute; diff --git a/dist/css/docs.css b/dist/css/docs.css index 58a87d24..78b3c1a7 100644 --- a/dist/css/docs.css +++ b/dist/css/docs.css @@ -1 +1 @@ -/*! normalize.css v2.1.3 | MIT License | git.io/normalize */article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary{display:block}audio,canvas,video{display:inline-block}audio:not([controls]){display:none;height:0}[hidden],template{display:none}html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}a{background:0 0}a:active,a:hover{outline:0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:700}dfn{font-style:italic}hr{box-sizing:content-box;height:0}mark{background:#ff0;color:#000}code,kbd,pre,samp{font-family:monospace,serif;font-size:1em}pre{white-space:pre-wrap}q{quotes:"\201C" "\201D" "\2018" "\2019"}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}img{border:0}svg:not(:root){overflow:hidden}figure{margin:0}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}legend{border:0;padding:0}button,input,select,textarea{font-family:inherit;font-size:100%;margin:0}button,input{line-height:normal}button,select{text-transform:none}button,html input[type=button],input[type=reset],input[type=submit]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0}input[type=search]{-webkit-appearance:textfield;box-sizing:content-box}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}textarea{overflow:auto;vertical-align:top}table{border-collapse:collapse;border-spacing:0}*,::after,::before{box-sizing:border-box}html{font-size:62.5%}body{font-family:Avenir,"Helvetica Neue",Helvetica,Arial,sans-serif;background:#fff;font-size:16px;font-size:1.6rem;line-height:1.5;text-align:center;color:#6D797F}h1,h2{letter-spacing:-.025em;color:#2E3C44;margin:0 0 10px;line-height:1.2;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}h1{font-size:64px;font-size:6.4rem;color:#3498DB}p,small{margin:0 0 20px}small{display:block;padding:0 10px;font-size:14px;font-size:1.4rem}header{padding:20px;margin-bottom:20px}header p{font-size:18px;font-size:1.8rem}@media (min-width:560px){header{padding-top:60px;padding-bottom:60px}}section{padding-bottom:20px}@media (min-width:560px){section{padding-bottom:40px}}a{text-decoration:none;color:#3498db;border-bottom:1px solid currentColor;transition:all .3s ease}a:focus,a:hover{color:#000}a:focus{outline:#343f4a dotted thin;outline-offset:1px}.btn{display:inline-block;padding:10px 30px;background:#3498db;border:0;color:#fff;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-weight:600;border-radius:3px}.btn:focus,.btn:hover{color:#fff;background:#258cd1}.example-audio .player{max-width:480px}.example-video .player{max-width:1200px}.example-audio .player,.example-video .player{margin:0 auto 20px}.example-audio .player-fullscreen,.example-audio .player:-webkit-full-screen,.example-video .player-fullscreen,.example-video .player:-webkit-full-screen{max-width:none}.example-audio .player-fullscreen,.example-audio .player:-moz-full-screen,.example-video .player-fullscreen,.example-video .player:-moz-full-screen{max-width:none}.example-audio .player-fullscreen,.example-audio .player:-ms-fullscreen,.example-video .player-fullscreen,.example-video .player:-ms-fullscreen{max-width:none}.example-audio .player-fullscreen,.example-audio .player:fullscreen,.example-video .player-fullscreen,.example-video .player:fullscreen{max-width:none}@font-face{font-family:Avenir;src:url(../../assets/fonts/AvenirLTStd-Medium.woff2) format("woff2"),url(../../assets/fonts/AvenirLTStd-Medium.woff) format("woff"),url(../../assets/fonts/AvenirLTStd-Medium.ttf) format("truetype");font-style:normal;font-weight:400}@font-face{font-family:Avenir;src:url(../../assets/fonts/AvenirLTStd-Heavy.woff2) format("woff2"),url(../../assets/fonts/AvenirLTStd-Heavy.woff) format("woff"),url(../../assets/fonts/AvenirLTStd-Heavy.ttf) format("truetype");font-style:normal;font-weight:600} \ No newline at end of file +/*! normalize.css v2.1.3 | MIT License | git.io/normalize */article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary{display:block}audio,canvas,video{display:inline-block}audio:not([controls]){display:none;height:0}[hidden],template{display:none}html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}a{background:0 0}a:active,a:hover{outline:0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:700}dfn{font-style:italic}hr{box-sizing:content-box;height:0}mark{background:#ff0;color:#000}code,kbd,pre,samp{font-family:monospace,serif;font-size:1em}pre{white-space:pre-wrap}q{quotes:"\201C" "\201D" "\2018" "\2019"}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}img{border:0}svg:not(:root){overflow:hidden}figure{margin:0}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}legend{border:0;padding:0}button,input,select,textarea{font-family:inherit;font-size:100%;margin:0}button,input{line-height:normal}button,select{text-transform:none}button,html input[type=button],input[type=reset],input[type=submit]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0}input[type=search]{-webkit-appearance:textfield;box-sizing:content-box}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}textarea{overflow:auto;vertical-align:top}table{border-collapse:collapse;border-spacing:0}*,::after,::before{box-sizing:border-box}body{font-family:Avenir,"Helvetica Neue",Helvetica,Arial,sans-serif;background:#fff;line-height:1.5;text-align:center;color:#6D797F}h1,h2{letter-spacing:-.025em;color:#2E3C44;margin:0 0 10px;line-height:1.2;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}h1{font-size:64px;font-size:4rem;color:#3498DB}p,small{margin:0 0 20px}small{display:block;padding:0 10px;font-size:14px;font-size:.9rem}header{padding:20px;margin-bottom:20px}header p{font-size:18px;font-size:1.1rem}@media (min-width:560px){header{padding-top:60px;padding-bottom:60px}}section{padding-bottom:20px}@media (min-width:560px){section{padding-bottom:40px}}a{text-decoration:none;color:#3498db;border-bottom:1px solid currentColor;transition:all .3s ease}a:focus,a:hover{color:#000}a:focus{outline:#343f4a dotted thin;outline-offset:1px}.btn{display:inline-block;padding:10px 30px;background:#3498db;border:0;color:#fff;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-weight:600;border-radius:3px}.btn:focus,.btn:hover{color:#fff;background:#258cd1}.example-audio .player{max-width:480px}.example-video .player{max-width:1200px}.example-audio .player,.example-video .player{margin:0 auto 20px}.example-audio .player-fullscreen,.example-audio .player:-webkit-full-screen,.example-video .player-fullscreen,.example-video .player:-webkit-full-screen{max-width:none}.example-audio .player-fullscreen,.example-audio .player:-moz-full-screen,.example-video .player-fullscreen,.example-video .player:-moz-full-screen{max-width:none}.example-audio .player-fullscreen,.example-audio .player:-ms-fullscreen,.example-video .player-fullscreen,.example-video .player:-ms-fullscreen{max-width:none}.example-audio .player-fullscreen,.example-audio .player:fullscreen,.example-video .player-fullscreen,.example-video .player:fullscreen{max-width:none}@font-face{font-family:Avenir;src:url(../../assets/fonts/AvenirLTStd-Medium.woff2) format("woff2"),url(../../assets/fonts/AvenirLTStd-Medium.woff) format("woff"),url(../../assets/fonts/AvenirLTStd-Medium.ttf) format("truetype");font-style:normal;font-weight:400}@font-face{font-family:Avenir;src:url(../../assets/fonts/AvenirLTStd-Heavy.woff2) format("woff2"),url(../../assets/fonts/AvenirLTStd-Heavy.woff) format("woff"),url(../../assets/fonts/AvenirLTStd-Heavy.ttf) format("truetype");font-style:normal;font-weight:600} \ No newline at end of file diff --git a/dist/css/plyr.css b/dist/css/plyr.css index e96819ad..e972d869 100644 --- a/dist/css/plyr.css +++ b/dist/css/plyr.css @@ -1 +1 @@ -.sr-only{position:absolute!important;clip:rect(1px,1px,1px,1px);padding:0!important;border:0!important;height:1px!important;width:1px!important;overflow:hidden}.player{position:relative;max-width:100%;min-width:290px;overflow:hidden;background:#000}.player,.player *,.player ::after,.player ::before{box-sizing:border-box}.player-video-wrapper{position:relative}.player video{width:100%;height:auto;vertical-align:middle}.player-captions{display:none;position:absolute;bottom:0;left:0;width:100%;padding:20px;min-height:2.5em;color:#fff;font-size:16px;font-weight:600;text-shadow:-1px -1px 0 rgba(52,63,74,.5),1px -1px 0 rgba(52,63,74,.5),-1px 1px 0 rgba(52,63,74,.5),1px 1px 0 rgba(52,63,74,.5);text-align:center;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}@media (min-width:560px){.player-captions{font-size:24px}}.player.captions-active .player-captions{display:block}.player-controls{zoom:1;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;position:relative;padding:20px 10px 10px;background:#343f4a;line-height:1;text-align:center}.player-controls:after,.player-controls:before{content:"";display:table}.player-controls:after{clear:both}.player-controls-sound{display:block;margin:10px auto 0}@media (min-width:560px){.player-controls-playback{float:left}.player-controls-sound{float:right;margin-top:0}}.player-controls button,.player-controls input+label{display:inline-block;vertical-align:middle;margin:0 2px;padding:5px 10px;transition:background .3s ease;border-radius:3px;cursor:pointer}.player-controls button svg,.player-controls input+label svg{width:18px;height:18px;display:block;fill:currentColor;transition:fill .3s ease}.player-controls input+label,.player-controls input.inverted:checked+label{color:#565d64}.player-controls button,.player-controls input.inverted+label,.player-controls input:checked+label{color:#cbd0d3}.player-controls button{border:0;background:0 0;overflow:hidden}.player-controls button:hover,.player-controls label:hover{background:#3498db}.player-controls button:hover svg,.player-controls label:hover svg{fill:#fff}.player-controls button:focus,.player-controls input:focus+label{outline:#000 dotted thin;outline-offset:1px}.player-controls button:focus svg,.player-controls input:focus+label svg{fill:#fff}.player-controls .icon-exit-fullscreen,.player-controls .icon-muted{display:none}.player-controls .player-time{display:inline-block;vertical-align:middle;margin-left:10px;color:#fff;font-weight:600;font-size:14px;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}.player-progress{position:absolute;top:0;left:0;right:0;width:100%;height:10px;margin:0;vertical-align:top}.player-progress[value]{-webkit-appearance:none;border:none;background:#565d64;cursor:pointer;color:#3498db}.player-progress[value]::-webkit-progress-bar{background:#565d64}.player-progress[value]::-webkit-progress-value{background:currentColor}.player-progress[value]::-moz-progress-bar{background:currentColor}.player-controls [data-player=pause],.player.playing .player-controls [data-player=play]{display:none}.player.playing .player-controls [data-player=pause]{display:inline-block}.player.muted .player-controls .icon-muted{display:block}.player.muted .player-controls .icon-muted+svg{display:none}.player-volume{vertical-align:middle;-webkit-appearance:none;-moz-appearance:none;width:100px;margin:0 10px 0 0;padding:0;cursor:pointer;background:0 0}.player-volume::-webkit-slider-runnable-track{height:6px;background:#565d64;border:0;border-radius:3px}.player-volume::-webkit-slider-thumb{-webkit-appearance:none;margin-top:-3px;height:12px;width:12px;background:#cbd0d3;border:0;border-radius:6px;transition:background .3s ease;cursor:ew-resize}.player-volume::-moz-range-track{height:6px;background:#565d64;border:0;border-radius:3px}.player-volume::-moz-range-thumb{height:12px;width:12px;background:#cbd0d3;border:0;border-radius:6px;transition:background .3s ease;cursor:ew-resize}.player-volume::-ms-track{height:6px;background:0 0;border-color:transparent;border-width:3px 0;color:transparent}.player-volume::-ms-fill-lower,.player-volume::-ms-fill-upper{height:6px;background:#565d64;border:0;border-radius:3px}.player-volume::-ms-thumb{height:12px;width:12px;background:#cbd0d3;border:0;border-radius:6px;transition:background .3s ease;cursor:ew-resize}.player-volume:focus{outline:0}.player-volume:focus::-webkit-slider-thumb{background:#3498db}.player-volume:focus::-moz-range-thumb{background:#3498db}.player-volume:focus::-ms-thumb{background:#3498db}.player-fullscreen,.player:-webkit-full-screen{position:absolute;top:0;left:0;right:0;bottom:0;height:100%;width:100%;z-index:999999}.player-fullscreen,.player:-moz-full-screen{position:absolute;top:0;left:0;right:0;bottom:0;height:100%;width:100%;z-index:999999}.player-fullscreen,.player:-ms-fullscreen{position:absolute;top:0;left:0;right:0;bottom:0;height:100%;width:100%;z-index:999999}.player-fullscreen,.player:fullscreen{position:absolute;top:0;left:0;right:0;bottom:0;height:100%;width:100%;z-index:999999}.player-fullscreen .player-video-wrapper,.player:-webkit-full-screen .player-video-wrapper{height:100%;width:100%}.player-fullscreen .player-video-wrapper,.player:-moz-full-screen .player-video-wrapper{height:100%;width:100%}.player-fullscreen .player-video-wrapper,.player:-ms-fullscreen .player-video-wrapper{height:100%;width:100%}.player-fullscreen .player-video-wrapper,.player:fullscreen .player-video-wrapper{height:100%;width:100%}.player-fullscreen .player-video-wrapper video,.player:-webkit-full-screen .player-video-wrapper video{height:100%}.player-fullscreen .player-video-wrapper video,.player:-moz-full-screen .player-video-wrapper video{height:100%}.player-fullscreen .player-video-wrapper video,.player:-ms-fullscreen .player-video-wrapper video{height:100%}.player-fullscreen .player-video-wrapper video,.player:fullscreen .player-video-wrapper video{height:100%}.player-fullscreen .player-video-wrapper .player-captions,.player:-webkit-full-screen .player-video-wrapper .player-captions{top:auto;bottom:90px}.player-fullscreen .player-video-wrapper .player-captions,.player:-moz-full-screen .player-video-wrapper .player-captions{top:auto;bottom:90px}.player-fullscreen .player-video-wrapper .player-captions,.player:-ms-fullscreen .player-video-wrapper .player-captions{top:auto;bottom:90px}.player-fullscreen .player-video-wrapper .player-captions,.player:fullscreen .player-video-wrapper .player-captions{top:auto;bottom:90px}@media (min-width:560px) and (max-width:767px){.player-fullscreen .player-video-wrapper .player-captions,.player:-webkit-full-screen .player-video-wrapper .player-captions{bottom:60px}.player-fullscreen .player-video-wrapper .player-captions,.player:-moz-full-screen .player-video-wrapper .player-captions{bottom:60px}.player-fullscreen .player-video-wrapper .player-captions,.player:-ms-fullscreen .player-video-wrapper .player-captions{bottom:60px}.player-fullscreen .player-video-wrapper .player-captions,.player:fullscreen .player-video-wrapper .player-captions{bottom:60px}}@media (min-width:768px){.player-fullscreen .player-video-wrapper .player-captions,.player:-webkit-full-screen .player-video-wrapper .player-captions{bottom:80px}.player-fullscreen .player-video-wrapper .player-captions,.player:-moz-full-screen .player-video-wrapper .player-captions{bottom:80px}.player-fullscreen .player-video-wrapper .player-captions,.player:-ms-fullscreen .player-video-wrapper .player-captions{bottom:80px}.player-fullscreen .player-video-wrapper .player-captions,.player:fullscreen .player-video-wrapper .player-captions{bottom:80px}}.player-fullscreen .player-controls,.player:-webkit-full-screen .player-controls{position:absolute;bottom:0;left:0;right:0}.player-fullscreen .player-controls,.player:-moz-full-screen .player-controls{position:absolute;bottom:0;left:0;right:0}.player-fullscreen .player-controls,.player:-ms-fullscreen .player-controls{position:absolute;bottom:0;left:0;right:0}.player-fullscreen .player-controls,.player:fullscreen .player-controls{position:absolute;bottom:0;left:0;right:0}.player-fullscreen .player-controls .icon-exit-fullscreen,.player:-webkit-full-screen .player-controls .icon-exit-fullscreen{display:block}.player-fullscreen .player-controls .icon-exit-fullscreen,.player:-moz-full-screen .player-controls .icon-exit-fullscreen{display:block}.player-fullscreen .player-controls .icon-exit-fullscreen,.player:-ms-fullscreen .player-controls .icon-exit-fullscreen{display:block}.player-fullscreen .player-controls .icon-exit-fullscreen,.player:fullscreen .player-controls .icon-exit-fullscreen{display:block}.player-fullscreen .player-controls .icon-exit-fullscreen+svg,.player:-webkit-full-screen .player-controls .icon-exit-fullscreen+svg{display:none}.player-fullscreen .player-controls .icon-exit-fullscreen+svg,.player:-moz-full-screen .player-controls .icon-exit-fullscreen+svg{display:none}.player-fullscreen .player-controls .icon-exit-fullscreen+svg,.player:-ms-fullscreen .player-controls .icon-exit-fullscreen+svg{display:none}.player-fullscreen .player-controls .icon-exit-fullscreen+svg,.player:fullscreen .player-controls .icon-exit-fullscreen+svg{display:none}.player [data-player=captions],.player [data-player=captions]+label,.player [data-player=fullscreen],.player [data-player=fullscreen]+label{display:none}.player.captions-enabled [data-player=captions],.player.captions-enabled [data-player=captions]+label,.player.fullscreen-enabled [data-player=fullscreen],.player.fullscreen-enabled [data-player=fullscreen]+label{display:inline-block}.player-fullscreen [data-player=fullscreen],.player-fullscreen [data-player=fullscreen]+label{display:none!important} \ No newline at end of file +.sr-only{position:absolute!important;clip:rect(1px,1px,1px,1px);padding:0!important;border:0!important;height:1px!important;width:1px!important;overflow:hidden}.player{position:relative;max-width:100%;min-width:290px;overflow:hidden;background:#000}.player,.player *,.player ::after,.player ::before{box-sizing:border-box}.player-video-wrapper{position:relative}.player video{width:100%;height:auto;vertical-align:middle}.player-captions{display:none;position:absolute;bottom:0;left:0;width:100%;padding:20px;min-height:2.5em;color:#fff;font-size:16px;font-weight:600;text-shadow:-1px -1px 0 rgba(52,63,74,.5),1px -1px 0 rgba(52,63,74,.5),-1px 1px 0 rgba(52,63,74,.5),1px 1px 0 rgba(52,63,74,.5);text-align:center;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}@media (min-width:768px){.player-captions{font-size:24px}}.player.captions-active .player-captions{display:block}.player-controls{zoom:1;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;position:relative;padding:20px 10px 10px;background:#343f4a;line-height:1;text-align:center}.player-controls:after,.player-controls:before{content:"";display:table}.player-controls:after{clear:both}.player-controls-sound{display:block;margin:10px auto 0}@media (min-width:560px){.player-controls-playback{float:left}.player-controls-sound{float:right;margin-top:0}}.player-controls button,.player-controls input+label{display:inline-block;vertical-align:middle;margin:0 2px;padding:5px 10px;transition:background .3s ease;border-radius:3px;cursor:pointer}.player-controls button svg,.player-controls input+label svg{width:18px;height:18px;display:block;fill:currentColor;transition:fill .3s ease}.player-controls input+label,.player-controls input.inverted:checked+label{color:#565d64}.player-controls button,.player-controls input.inverted+label,.player-controls input:checked+label{color:#cbd0d3}.player-controls button{border:0;background:0 0;overflow:hidden}.player-controls button:focus,.player-controls input:focus+label{outline:#000 dotted thin;outline-offset:1px}.player-controls button:focus svg,.player-controls input:focus+label svg{fill:#fff}.player-controls button:hover,.player-controls input+label:hover{background:#3498db}.player-controls button:hover svg,.player-controls input+label:hover svg{fill:#fff}.player-controls .icon-exit-fullscreen,.player-controls .icon-muted{display:none}.player-controls .player-time{display:inline-block;vertical-align:middle;margin-left:10px;color:#fff;font-weight:600;font-size:14px;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}.player-progress{position:absolute;top:0;left:0;right:0;width:100%;height:10px;margin:0;vertical-align:top}.player-progress[value]{-webkit-appearance:none;border:none;background:#565d64;cursor:pointer;color:#3498db}.player-progress[value]::-webkit-progress-bar{background:#565d64}.player-progress[value]::-webkit-progress-value{background:currentColor}.player-progress[value]::-moz-progress-bar{background:currentColor}.player-controls [data-player=pause],.player.playing .player-controls [data-player=play]{display:none}.player.playing .player-controls [data-player=pause]{display:inline-block}.player.muted .player-controls .icon-muted{display:block}.player.muted .player-controls .icon-muted+svg{display:none}.player-volume{vertical-align:middle;-webkit-appearance:none;-moz-appearance:none;width:100px;margin:0 10px 0 0;padding:0;cursor:pointer;background:0 0}.player-volume::-webkit-slider-runnable-track{height:6px;background:#565d64;border:0;border-radius:3px}.player-volume::-webkit-slider-thumb{-webkit-appearance:none;margin-top:-3px;height:12px;width:12px;background:#cbd0d3;border:0;border-radius:6px;transition:background .3s ease;cursor:ew-resize}.player-volume::-moz-range-track{height:6px;background:#565d64;border:0;border-radius:3px}.player-volume::-moz-range-thumb{height:12px;width:12px;background:#cbd0d3;border:0;border-radius:6px;transition:background .3s ease;cursor:ew-resize}.player-volume::-ms-track{height:6px;background:0 0;border-color:transparent;border-width:3px 0;color:transparent}.player-volume::-ms-fill-lower,.player-volume::-ms-fill-upper{height:6px;background:#565d64;border:0;border-radius:3px}.player-volume::-ms-thumb{height:12px;width:12px;background:#cbd0d3;border:0;border-radius:6px;transition:background .3s ease;cursor:ew-resize}.player-volume:focus{outline:0}.player-volume:focus::-webkit-slider-thumb{background:#3498db}.player-volume:focus::-moz-range-thumb{background:#3498db}.player-volume:focus::-ms-thumb{background:#3498db}.player-fullscreen,.player:-webkit-full-screen{position:absolute;top:0;left:0;right:0;bottom:0;height:100%;width:100%;z-index:999999}.player-fullscreen,.player:-moz-full-screen{position:absolute;top:0;left:0;right:0;bottom:0;height:100%;width:100%;z-index:999999}.player-fullscreen,.player:-ms-fullscreen{position:absolute;top:0;left:0;right:0;bottom:0;height:100%;width:100%;z-index:999999}.player-fullscreen,.player:fullscreen{position:absolute;top:0;left:0;right:0;bottom:0;height:100%;width:100%;z-index:999999}.player-fullscreen .player-video-wrapper,.player:-webkit-full-screen .player-video-wrapper{height:100%;width:100%}.player-fullscreen .player-video-wrapper,.player:-moz-full-screen .player-video-wrapper{height:100%;width:100%}.player-fullscreen .player-video-wrapper,.player:-ms-fullscreen .player-video-wrapper{height:100%;width:100%}.player-fullscreen .player-video-wrapper,.player:fullscreen .player-video-wrapper{height:100%;width:100%}.player-fullscreen .player-video-wrapper video,.player:-webkit-full-screen .player-video-wrapper video{height:100%}.player-fullscreen .player-video-wrapper video,.player:-moz-full-screen .player-video-wrapper video{height:100%}.player-fullscreen .player-video-wrapper video,.player:-ms-fullscreen .player-video-wrapper video{height:100%}.player-fullscreen .player-video-wrapper video,.player:fullscreen .player-video-wrapper video{height:100%}.player-fullscreen .player-video-wrapper .player-captions,.player:-webkit-full-screen .player-video-wrapper .player-captions{top:auto;bottom:90px}.player-fullscreen .player-video-wrapper .player-captions,.player:-moz-full-screen .player-video-wrapper .player-captions{top:auto;bottom:90px}.player-fullscreen .player-video-wrapper .player-captions,.player:-ms-fullscreen .player-video-wrapper .player-captions{top:auto;bottom:90px}.player-fullscreen .player-video-wrapper .player-captions,.player:fullscreen .player-video-wrapper .player-captions{top:auto;bottom:90px}@media (min-width:560px) and (max-width:767px){.player-fullscreen .player-video-wrapper .player-captions,.player:-webkit-full-screen .player-video-wrapper .player-captions{bottom:60px}.player-fullscreen .player-video-wrapper .player-captions,.player:-moz-full-screen .player-video-wrapper .player-captions{bottom:60px}.player-fullscreen .player-video-wrapper .player-captions,.player:-ms-fullscreen .player-video-wrapper .player-captions{bottom:60px}.player-fullscreen .player-video-wrapper .player-captions,.player:fullscreen .player-video-wrapper .player-captions{bottom:60px}}@media (min-width:768px){.player-fullscreen .player-video-wrapper .player-captions,.player:-webkit-full-screen .player-video-wrapper .player-captions{bottom:80px}.player-fullscreen .player-video-wrapper .player-captions,.player:-moz-full-screen .player-video-wrapper .player-captions{bottom:80px}.player-fullscreen .player-video-wrapper .player-captions,.player:-ms-fullscreen .player-video-wrapper .player-captions{bottom:80px}.player-fullscreen .player-video-wrapper .player-captions,.player:fullscreen .player-video-wrapper .player-captions{bottom:80px}}.player-fullscreen .player-controls,.player:-webkit-full-screen .player-controls{position:absolute;bottom:0;left:0;right:0}.player-fullscreen .player-controls,.player:-moz-full-screen .player-controls{position:absolute;bottom:0;left:0;right:0}.player-fullscreen .player-controls,.player:-ms-fullscreen .player-controls{position:absolute;bottom:0;left:0;right:0}.player-fullscreen .player-controls,.player:fullscreen .player-controls{position:absolute;bottom:0;left:0;right:0}.player-fullscreen .player-controls .icon-exit-fullscreen,.player:-webkit-full-screen .player-controls .icon-exit-fullscreen{display:block}.player-fullscreen .player-controls .icon-exit-fullscreen,.player:-moz-full-screen .player-controls .icon-exit-fullscreen{display:block}.player-fullscreen .player-controls .icon-exit-fullscreen,.player:-ms-fullscreen .player-controls .icon-exit-fullscreen{display:block}.player-fullscreen .player-controls .icon-exit-fullscreen,.player:fullscreen .player-controls .icon-exit-fullscreen{display:block}.player-fullscreen .player-controls .icon-exit-fullscreen+svg,.player:-webkit-full-screen .player-controls .icon-exit-fullscreen+svg{display:none}.player-fullscreen .player-controls .icon-exit-fullscreen+svg,.player:-moz-full-screen .player-controls .icon-exit-fullscreen+svg{display:none}.player-fullscreen .player-controls .icon-exit-fullscreen+svg,.player:-ms-fullscreen .player-controls .icon-exit-fullscreen+svg{display:none}.player-fullscreen .player-controls .icon-exit-fullscreen+svg,.player:fullscreen .player-controls .icon-exit-fullscreen+svg{display:none}.player [data-player=captions],.player [data-player=captions]+label,.player [data-player=fullscreen],.player [data-player=fullscreen]+label{display:none}.player.captions-enabled [data-player=captions],.player.captions-enabled [data-player=captions]+label,.player.fullscreen-enabled [data-player=fullscreen],.player.fullscreen-enabled [data-player=fullscreen]+label{display:inline-block}.player-fullscreen [data-player=fullscreen],.player-fullscreen [data-player=fullscreen]+label{display:none!important} \ No newline at end of file