.flex { display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; }

.justify-center { justify-content: center; }

.align-center { -ms-align-items: center; align-items: center; }

.align-end { -ms-align-items: flex-end; align-items: flex-end; }

button { background-color: transparent; border: none; cursor: pointer; }

/* components end */
.vid-wrapper { position: relative; height: 100%; cursor: none; }
.vid-wrapper.is-fullscreen .vid-toggle-layer { z-index: 999999999998; }
.vid-wrapper.is-fullscreen .vid-controls-bottom, .vid-wrapper.is-fullscreen .vid-shadow-layer, .vid-wrapper.is-fullscreen .vid-info-layer, .vid-wrapper.is-fullscreen .vid-quality-selector { z-index: 999999999999; }
.vid-wrapper.is-fullscreen .vid-bottom-progress-bar { z-index: 999999999999; opacity: 0.2; }
.vid-wrapper.mouse-entered, .vid-wrapper.paused { cursor: default; }
.vid-wrapper.mouse-entered .vid-bottom-progress-bar, .vid-wrapper.paused .vid-bottom-progress-bar { opacity: 0; }
.vid-wrapper.mouse-entered .vid-controls-bottom, .vid-wrapper.paused .vid-controls-bottom { opacity: 1; }
.vid-wrapper.mouse-entered .vid-shadow-layer, .vid-wrapper.paused .vid-shadow-layer { opacity: 0.8; }
.vid-wrapper.mouse-entered .vid-info-layer .vid-info-wrapper h1, .vid-wrapper.mouse-entered .vid-info-layer .vid-info-wrapper p, .vid-wrapper.mouse-entered .vid-info-layer .vid-info-wrapper h2, .vid-wrapper.paused .vid-info-layer .vid-info-wrapper h1, .vid-wrapper.paused .vid-info-layer .vid-info-wrapper p, .vid-wrapper.paused .vid-info-layer .vid-info-wrapper h2 { opacity: 1; }
.vid-wrapper.mouse-entered .vid-quality-selector, .vid-wrapper.paused .vid-quality-selector { opacity: 1; }
.vid-wrapper .vid-html5 { position: relative; z-index: 1; }
.vid-wrapper .vid-html5 video { display: block; background-color: black; }
.vid-wrapper .vid-controls-bottom { z-index: 2; position: absolute; bottom: 20px; left: 0; width: 100%; height: 60px; opacity: 0; transition: all 550ms cubic-bezier(0.23, 1, 0.32, 1) 0ms; }
.vid-wrapper .vid-controls-wrapper { margin: 0 -20px; width: 100%; }
.vid-wrapper .vid-toggle-layer, .vid-wrapper .vid-shadow-layer { position: absolute; bottom: 0; left: 0; width: 100%; height: 100%; z-index: 1; }
.vid-wrapper .vid-bottom-progress-bar { position: absolute; width: 100%; height: 2px; z-index: 2; bottom: 0; left: 0; transition: all 550ms cubic-bezier(0.23, 1, 0.32, 1) 0ms; }
.vid-wrapper .vid-bottom-progress-bar .progress-bg, .vid-wrapper .vid-bottom-progress-bar .progress-fg { height: 100%; position: absolute; top: 0; left: 0; }
.vid-wrapper .vid-bottom-progress-bar .progress-bg { width: 100%; background-color: rgba(255, 255, 255, 0.4); z-index: 1; }
.vid-wrapper .vid-bottom-progress-bar .progress-fg { width: 0%; background-color: white; }
.vid-wrapper .vid-info-layer { position: absolute; bottom: 80px; left: 0; z-index: 3; width: 100%; }
.vid-wrapper .vid-info-layer .vid-info-wrapper { width: 90%; margin: 0 auto; padding: 0 20px; }
.vid-wrapper .vid-info-layer .vid-info-wrapper h1 { color: white; opacity: 0; transition: all 550ms cubic-bezier(0.23, 1, 0.32, 1) 0ms; }
.vid-wrapper .vid-info-layer .vid-info-wrapper h2 { color: white; opacity: 0; transition: all 550ms cubic-bezier(0.23, 1, 0.32, 1) 0ms; }
.vid-wrapper .vid-info-layer .vid-info-wrapper p { color: rgba(255, 255, 255, 0.6); opacity: 0; transition: all 550ms cubic-bezier(0.23, 1, 0.32, 1) 0ms; }
.vid-wrapper .vid-info-layer .vid-info-wrapper .view-count { margin-left: auto; }
.vid-wrapper .vid-shadow-layer { pointer-events: none; z-index: 2; opacity: 0; /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#7db9e8+0,000000+100 */ background: transparent; background: -moz-linear-gradient(top, transparent 50%, #000000 90%); background: -webkit-linear-gradient(top, transparent 50%, #000000 90%); background: linear-gradient(to bottom, transparent 50%, #000000 90%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7db9e8', endColorstr='#000000',GradientType=0 ); transition: all 550ms cubic-bezier(0.23, 1, 0.32, 1) 0ms; }
.vid-wrapper .vid-quality-selector { position: absolute; top: 40%; right: 30px; z-index: 3; flex-direction: column; border-radius: 5px; overflow: hidden; opacity: 0; transition: all 550ms cubic-bezier(0.23, 1, 0.32, 1) 0ms; }
.vid-wrapper .vid-quality-selector button { background-color: rgba(34, 34, 34, 0.5); padding: 13px 20px; font-weight: 700; font-size: 16px; color: white; }
.vid-wrapper .vid-quality-selector button.active { background-color: white; color: #222; }
.vid-wrapper .vid-controls-contents { width: 90%; margin: 0 auto; }
.vid-wrapper .vid-controls-contents span { margin: 0 10px; font-size: 13px; min-width: 45px; display: flex; justify-content: center; color: rgba(255, 255, 255, 0.7); }
.vid-wrapper .vid-controls-contents button { color: rgba(255, 255, 255, 0.7); transition: all 550ms cubic-bezier(0.23, 1, 0.32, 1) 0ms; }
.vid-wrapper .vid-controls-contents button:hover { color: white; }
.vid-wrapper .vid-controls-contents button i { font-size: 28px; }
.vid-wrapper .vid-controls-contents .vid-progress { position: relative; width: 100%; height: 5px; margin: 0 20px; margin-top: -2px; transition: all 550ms cubic-bezier(0.23, 1, 0.32, 1) 0ms; cursor: pointer; }
.vid-wrapper .vid-controls-contents .vid-progress:hover { height: 13px; }
.vid-wrapper .vid-controls-contents .vid-progress .progress-bg, .vid-wrapper .vid-controls-contents .vid-progress .progress-fg, .vid-wrapper .vid-controls-contents .vid-progress .progress-loaded { height: 100%; position: absolute; top: 0; left: 0; }
.vid-wrapper .vid-controls-contents .vid-progress .progress-bg { width: 100%; background-color: rgba(255, 255, 255, 0.4); z-index: 1; }
.vid-wrapper .vid-controls-contents .vid-progress .progress-loaded { pointer-events: none; width: 0%; background-color: rgba(255, 255, 255, 0.3); z-index: 2; }
.vid-wrapper .vid-controls-contents .vid-progress .progress-fg { width: 0%; background-color: white; }
.vid-wrapper .vid-controls-contents .vid-progress .progress-hovertime { position: absolute; top: -35px; padding: 5px 10px; font-size: 12px; transform: translateX(-50%); color: white; background-color: #333; opacity: 0; pointer-events: none; }
.vid-wrapper .vid-controls-contents .vid-progress .progress-hovertime.hover { opacity: 1; pointer-events: auto; }
.vid-wrapper .vid-controls-contents .item { padding: 0 10px; margin: 0 10px; }
.vid-wrapper .vid-volume-control { min-width: 45px; }
.vid-wrapper .vid-volume-slider { width: 0; height: 5px; margin-top: -2px; background-color: rgba(255, 255, 255, 0.6); cursor: pointer; transition: all 550ms cubic-bezier(0.23, 1, 0.32, 1) 0ms; transform-origin: left; }
.vid-wrapper .vid-volume-slider .ui-slider-range { height: 100%; background-color: white; }

video::-webkit-media-controls { display: none !important; }

/*# sourceMappingURL=videre.css.map */