/*!
 * videojs-iplayer-skin-1
 * A Video.JS skin modelled on the new iPlayer theme.
 * 
 * @author Vijay Dubb
 * @version 1.0.0
 * Copyright 2017. MIT licensed.
 */

.skins1 .vjs-loading-spinner,
.vjs-default-skin .vjs-loading-spinner {
  border-color: #bb1919;
}
.skins1 .vjs-loading-spinner:before, .skins1 .vjs-loading-spinner:after,
.vjs-default-skin .vjs-loading-spinner:before,
.vjs-default-skin .vjs-loading-spinner:after {
  border-color: #bb1919;
}
.skins1.vjs-paused .vjs-tech,
.skins1.vjs-paused .vjs-big-play-button,
.vjs-default-skin.vjs-paused .vjs-tech,
.vjs-default-skin.vjs-paused .vjs-big-play-button {
  z-index: 2;
}
.skins1.vjs-paused .vjs-control-bar,
.vjs-default-skin.vjs-paused .vjs-control-bar {
  z-index: -1;
}
.skins1.vjs-has-started .vjs-tech,
.skins1.vjs-has-started .vjs-big-play-button,
.vjs-default-skin.vjs-has-started .vjs-tech,
.vjs-default-skin.vjs-has-started .vjs-big-play-button {
  z-index: 0;
}
.skins1.vjs-has-started .vjs-control-bar,
.vjs-default-skin.vjs-has-started .vjs-control-bar {
  z-index: 2;
}
.skins1 .vjs-menu,
.vjs-default-skin .vjs-menu {
  bottom: 14px;
}
.skins1 .vjs-big-play-button,
.vjs-default-skin .vjs-big-play-button {
  background-color: rgba(0, 0, 0, 0.5);
  position: absolute;
  margin: 0;
  border-radius: 0;
  border: none;
  width: 85px;
  height: 85px;
  bottom: 0;
  left: 0;
  top: auto;
  box-shadow: none;
  transition: background-color .5s ease;
}
.skins1 .vjs-big-play-button .vjs-icon-placeholder:hover, .skins1 .vjs-big-play-button .vjs-icon-placeholder:focus,
.vjs-default-skin .vjs-big-play-button .vjs-icon-placeholder:hover,
.vjs-default-skin .vjs-big-play-button .vjs-icon-placeholder:focus {
  background-color: #bb1919;
}
.skins1 .vjs-big-play-button .vjs-icon-placeholder:before,
.vjs-default-skin .vjs-big-play-button .vjs-icon-placeholder:before {
  font-size: 60px;
  height: auto;
  padding: 0;
  margin: 0;
  line-height: 85px;
}
.skins1:hover .vjs-big-play-button,
.skins1:hover .vjs-big-play-button:focus, .skins1:focus .vjs-big-play-button,
.skins1:focus .vjs-big-play-button:focus,
.vjs-default-skin:hover .vjs-big-play-button,
.vjs-default-skin:hover .vjs-big-play-button:focus,
.vjs-default-skin:focus .vjs-big-play-button,
.vjs-default-skin:focus .vjs-big-play-button:focus {
  border-color: transparent;
  box-shadow: none;
  background-color: #bb1919;
}
.skins1 .vjs-load-progress,
.vjs-default-skin .vjs-load-progress {
  background: #e0e0e0;
}
.skins1 .vjs-progress-holder .vjs-play-progress,
.skins1 .vjs-progress-holder .vjs-load-progress,
.skins1 .vjs-progress-holder .vjs-load-progress div,
.vjs-default-skin .vjs-progress-holder .vjs-play-progress,
.vjs-default-skin .vjs-progress-holder .vjs-load-progress,
.vjs-default-skin .vjs-progress-holder .vjs-load-progress div {
  height: 6px;
  line-height: 44px;
}
.skins1 .vjs-volume-level,
.skins1 .vjs-play-progress,
.vjs-default-skin .vjs-volume-level,
.vjs-default-skin .vjs-play-progress {
  background-color: #bb1919;
}
.skins1 .vjs-volume-level:before,
.skins1 .vjs-play-progress:before,
.vjs-default-skin .vjs-volume-level:before,
.vjs-default-skin .vjs-play-progress:before {
  right: -8px;
  font-size: 0.9em;
  height: 14px;
  width: 9px;
  background: #FFFFFF;
  padding: 0;
  margin: 0;
  position: absolute;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  content: '';
}
.skins1 .vjs-control-bar,
.vjs-default-skin .vjs-control-bar {
  display: -webkit-flex;
  display: flex;
  -webkit-flex-direction: row;
  flex-direction: row;
  -webkit-justify-content: flex-end;
  justify-content: flex-end;
  height: 120px;
  background: -moz-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(0, 0, 0, 0.39) 39%, rgba(0, 0, 0, 0.39) 39%, black 100%);
  background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(255, 255, 255, 0)), color-stop(39%, rgba(0, 0, 0, 0.39)), color-stop(39%, rgba(0, 0, 0, 0.39)), color-stop(100%, black));
  background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(0, 0, 0, 0.39) 39%, rgba(0, 0, 0, 0.39) 39%, black 100%);
  background: -o-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(0, 0, 0, 0.39) 39%, rgba(0, 0, 0, 0.39) 39%, black 100%);
  background: -ms-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(0, 0, 0, 0.39) 39%, rgba(0, 0, 0, 0.39) 39%, black 100%);
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(0, 0, 0, 0.39) 39%, rgba(0, 0, 0, 0.39) 39%, black 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#000000', GradientType=0);
}
.skins1 .vjs-icon-placeholder:before,
.vjs-default-skin .vjs-icon-placeholder:before {
  font-size: 25px;
  height: auto;
  padding: 0;
  margin: 0;
  line-height: 44px;
  width: 44px;
}
.skins1 .vjs-icon-placeholder:focus:before, .skins1 .vjs-icon-placeholder:hover:before,
.vjs-default-skin .vjs-icon-placeholder:focus:before,
.vjs-default-skin .vjs-icon-placeholder:hover:before {
  box-shadow: none;
  text-shadow: none;
}
.skins1 .vjs-live-control,
.vjs-default-skin .vjs-live-control {
  top: -34px;
  left: 0;
  right: 0;
  margin: auto;
  position: absolute;
}
.skins1 .vjs-current-time,
.skins1 .vjs-remaining-time,
.vjs-default-skin .vjs-current-time,
.vjs-default-skin .vjs-remaining-time {
  right: 82px;
}
.skins1 .vjs-duration,
.vjs-default-skin .vjs-duration {
  right: 50px;
}
.skins1 .vjs-time-divider,
.vjs-default-skin .vjs-time-divider {
  right: 75px;
}
.skins1 .vjs-playback-rate .vjs-menu,
.vjs-default-skin .vjs-playback-rate .vjs-menu {
  width: 44px;
  bottom: 14px;
}
.skins1 .vjs-playback-rate .vjs-playback-rate-value,
.vjs-default-skin .vjs-playback-rate .vjs-playback-rate-value {
  line-height: 44px;
}
.skins1 .vjs-current-time,
.skins1 .vjs-duration,
.skins1 .vjs-time-divider,
.vjs-default-skin .vjs-current-time,
.vjs-default-skin .vjs-duration,
.vjs-default-skin .vjs-time-divider {
  position: absolute;
  height: 44px;
  display: block;
  bottom: 0;
}
.skins1 .vjs-current-time > div,
.skins1 .vjs-duration > div,
.skins1 .vjs-time-divider > div,
.vjs-default-skin .vjs-current-time > div,
.vjs-default-skin .vjs-duration > div,
.vjs-default-skin .vjs-time-divider > div {
  line-height: 44px;
  height: 44px;
}
.skins1 .vjs-remaining-time,
.vjs-default-skin .vjs-remaining-time {
  display: none;
}
.skins1 .vjs-control,
.vjs-default-skin .vjs-control {
  width: 44px;
  height: 44px;
  transition: background-color .5s ease;
  bottom: 0;
}
.skins1 .vjs-control.vjs-fullscreen-control, .skins1 .vjs-control.vjs-subs-caps-button, .skins1 .vjs-control.vjs-playback-rate, .skins1 .vjs-control.vjs-captions-button, .skins1 .vjs-control.vjs-chapters-button, .skins1 .vjs-control.vjs-volume-menu-button, .skins1 .vjs-control.vjs-quality-button, .skins1 .vjs-control.vjs-descriptions-button, .skins1 .vjs-control.vjs-audio-button,
.vjs-default-skin .vjs-control.vjs-fullscreen-control,
.vjs-default-skin .vjs-control.vjs-subs-caps-button,
.vjs-default-skin .vjs-control.vjs-playback-rate,
.vjs-default-skin .vjs-control.vjs-captions-button,
.vjs-default-skin .vjs-control.vjs-chapters-button,
.vjs-default-skin .vjs-control.vjs-volume-menu-button,
.vjs-default-skin .vjs-control.vjs-quality-button,
.vjs-default-skin .vjs-control.vjs-descriptions-button,
.vjs-default-skin .vjs-control.vjs-audio-button {
  width: 44px;
  height: 44px;
  transition: background-color .5s ease;
  bottom: -76px;
  position: relative;
}
.skins1 .vjs-control:hover, .skins1 .vjs-control:focus,
.vjs-default-skin .vjs-control:hover,
.vjs-default-skin .vjs-control:focus {
  background-color: #bb1919;
}
.skins1 .vjs-progress-control,
.vjs-default-skin .vjs-progress-control {
  bottom: 40px;
  width: 100%;
  position: absolute;
}
.skins1 .vjs-progress-control .vjs-slider,
.vjs-default-skin .vjs-progress-control .vjs-slider {
  height: 6px;
  margin: 0 10px;
}
.skins1 .vjs-progress-control .vjs-slider-handle,
.vjs-default-skin .vjs-progress-control .vjs-slider-handle {
  top: 40%;
}
.skins1 .vjs-progress-control:hover, .skins1 .vjs-progress-control:focus,
.skins1 .vjs-current-time:hover,
.skins1 .vjs-current-time:focus,
.skins1 .vjs-duration:hover,
.skins1 .vjs-duration:focus,
.skins1 .vjs-time-divider:hover,
.skins1 .vjs-time-divider:focus,
.skins1 .vjs-volume-control:hover,
.skins1 .vjs-volume-control:focus,
.skins1 .vjs-close-button:hover,
.skins1 .vjs-close-button:focus,
.skins1 .vjs-live-control:hover,
.skins1 .vjs-live-control:focus,
.vjs-default-skin .vjs-progress-control:hover,
.vjs-default-skin .vjs-progress-control:focus,
.vjs-default-skin .vjs-current-time:hover,
.vjs-default-skin .vjs-current-time:focus,
.vjs-default-skin .vjs-duration:hover,
.vjs-default-skin .vjs-duration:focus,
.vjs-default-skin .vjs-time-divider:hover,
.vjs-default-skin .vjs-time-divider:focus,
.vjs-default-skin .vjs-volume-control:hover,
.vjs-default-skin .vjs-volume-control:focus,
.vjs-default-skin .vjs-close-button:hover,
.vjs-default-skin .vjs-close-button:focus,
.vjs-default-skin .vjs-live-control:hover,
.vjs-default-skin .vjs-live-control:focus {
  background-color: transparent;
}
.skins1 .vjs-play-control,
.vjs-default-skin .vjs-play-control {
  position: absolute;
  left: 0;
}
.skins1 .vjs-fullscreen-control,
.vjs-default-skin .vjs-fullscreen-control {
  margin-left: 85px !important;
  right: 0;
  position: absolute;
}
.skins1 .vjs-volume-menu-button,
.skins1 .vjs-volume-panel,
.vjs-default-skin .vjs-volume-menu-button,
.vjs-default-skin .vjs-volume-panel {
  position: absolute;
  left: 44px;
}
.skins1 .vjs-volume-menu-button:hover, .skins1 .vjs-volume-menu-button:focus,
.skins1 .vjs-volume-panel:hover,
.skins1 .vjs-volume-panel:focus,
.vjs-default-skin .vjs-volume-menu-button:hover,
.vjs-default-skin .vjs-volume-menu-button:focus,
.vjs-default-skin .vjs-volume-panel:hover,
.vjs-default-skin .vjs-volume-panel:focus {
  background-color: transparent;
}
.skins1 .vjs-volume-menu-button:hover:before, .skins1 .vjs-volume-menu-button:focus:before,
.skins1 .vjs-volume-panel:hover:before,
.skins1 .vjs-volume-panel:focus:before,
.vjs-default-skin .vjs-volume-menu-button:hover:before,
.vjs-default-skin .vjs-volume-menu-button:focus:before,
.vjs-default-skin .vjs-volume-panel:hover:before,
.vjs-default-skin .vjs-volume-panel:focus:before {
  background-color: #bb1919;
}
.skins1 .vjs-volume-menu-button:before,
.skins1 .vjs-volume-panel:before,
.vjs-default-skin .vjs-volume-menu-button:before,
.vjs-default-skin .vjs-volume-panel:before {
  width: 44px;
  left: 0;
  top: 50%;
  -webkit-transform: translate(0%, -50%);
  -ms-transform: translate(0%, -50%);
  transform: translate(0%, -50%);
}
.skins1 .vjs-volume-bar,
.skins1 .vjs-volume-level,
.vjs-default-skin .vjs-volume-bar,
.vjs-default-skin .vjs-volume-level {
  height: 6px;
}
.skins1 .vjs-volume-bar,
.vjs-default-skin .vjs-volume-bar {
  top: 24%;
  margin: 0;
  left: 4px;
  width: 80px;
}
.skins1 .vjs-seek-handle,
.vjs-default-skin .vjs-seek-handle {
  height: auto;
}
.skins1 .vjs-slider-handle:before,
.skins1 .vjs-volume-bar .vjs-volume-handle:before,
.vjs-default-skin .vjs-slider-handle:before,
.vjs-default-skin .vjs-volume-bar .vjs-volume-handle:before {
  width: 10px;
  height: 16px;
  background-color: #FFFFFF;
  position: absolute;
  right: 0;
  top: -5px;
  -webkit-transform: none;
  -ms-transform: none;
  transform: none;
  content: "";
  font-family: none;
}
.skins1 .vjs-live-controls,
.vjs-default-skin .vjs-live-controls {
  display: none;
}
.skins1 .vjs-menu-button-inline:hover, .skins1 .vjs-menu-button-inline:focus, .skins1 .vjs-menu-button-inline.vjs-slider-active,
.vjs-default-skin .vjs-menu-button-inline:hover,
.vjs-default-skin .vjs-menu-button-inline:focus,
.vjs-default-skin .vjs-menu-button-inline.vjs-slider-active {
  width: 14em;
}
.skins1 .vjs-menu-button-inline .vjs-menu,
.vjs-default-skin .vjs-menu-button-inline .vjs-menu {
  left: 97px;
}
.skins1 .vjs-menu-button-inline .vjs-menu .vjs-menu-content,
.vjs-default-skin .vjs-menu-button-inline .vjs-menu .vjs-menu-content {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  overflow: visible;
  height: auto;
  width: 8em;
}
.skins1.vjs-no-flex .vjs-menu-button-inline,
.vjs-default-skin.vjs-no-flex .vjs-menu-button-inline {
  width: 14em;
}
.skins1 .vjs-time-tooltip,
.vjs-default-skin .vjs-time-tooltip {
  line-height: 10px;
  left: 15px;
}
.skins1 .vjs-volume-panel:hover .vjs-volume-control.vjs-volume-horizontal, .skins1 .vjs-volume-panel:active .vjs-volume-control.vjs-volume-horizontal, .skins1 .vjs-volume-panel:focus .vjs-volume-control.vjs-volume-horizontal,
.vjs-default-skin .vjs-volume-panel:hover .vjs-volume-control.vjs-volume-horizontal,
.vjs-default-skin .vjs-volume-panel:active .vjs-volume-control.vjs-volume-horizontal,
.vjs-default-skin .vjs-volume-panel:focus .vjs-volume-control.vjs-volume-horizontal {
  top: 24%;
  margin: 0;
  left: 4px;
  width: 80px;
}
.skins1 .vjs-volume-panel .vjs-volume-control,
.vjs-default-skin .vjs-volume-panel .vjs-volume-control {
  top: 24%;
  margin: 0;
  left: 4px;
  width: 0;
}
.skins1 .vjs-volume-panel .vjs-volume-control:hover.vjs-volume-horizontal, .skins1 .vjs-volume-panel .vjs-volume-control:active.vjs-volume-horizontal, .skins1 .vjs-volume-panel .vjs-volume-control:focus.vjs-volume-horizontal,
.vjs-default-skin .vjs-volume-panel .vjs-volume-control:hover.vjs-volume-horizontal,
.vjs-default-skin .vjs-volume-panel .vjs-volume-control:active.vjs-volume-horizontal,
.vjs-default-skin .vjs-volume-panel .vjs-volume-control:focus.vjs-volume-horizontal {
  top: 24%;
  margin: 0;
  left: 4px;
  width: 80px;
}
.skins1 .vjs-volume-panel .vjs-mute-control:hover ~ .vjs-volume-control.vjs-volume-horizontal, .skins1 .vjs-volume-panel .vjs-mute-control:active ~ .vjs-volume-control.vjs-volume-horizontal, .skins1 .vjs-volume-panel .vjs-mute-control:focus ~ .vjs-volume-control.vjs-volume-horizontal,
.vjs-default-skin .vjs-volume-panel .vjs-mute-control:hover ~ .vjs-volume-control.vjs-volume-horizontal,
.vjs-default-skin .vjs-volume-panel .vjs-mute-control:active ~ .vjs-volume-control.vjs-volume-horizontal,
.vjs-default-skin .vjs-volume-panel .vjs-mute-control:focus ~ .vjs-volume-control.vjs-volume-horizontal {
  top: 24%;
  margin: 0;
  left: 4px;
  width: 80px;
}
.skins1 .vjs-volume-panel .vjs-volume-control.vjs-slider-active.vjs-volume-horizontal,
.vjs-default-skin .vjs-volume-panel .vjs-volume-control.vjs-slider-active.vjs-volume-horizontal {
  top: 24%;
  margin: 0;
  left: 4px;
  width: 80px;
}

/*# sourceMappingURL=videojs-iplayer-theme.css.map */