/*
  New Video Player
 */

#stream-container #playercontainer {
  opacity: 0;
}

#stream-container #playercontainer.pl-hold {
  opacity: 1;
}

#stream-container.limit-layover #playercontainer,
#stream-container.layover-enabled #playercontainer,
#stream-container.stream-status-away #playercontainer,
#stream-container.stream-status-offline #playercontainer {
  display: none;
}

.chatFullscreen.open-panel #playercontainer {
  right: 300px;
}

.chatFullscreen.close-panel #playercontainer {
  right: 24px;
}

#stream-container video {
  object-fit: cover;
}

.video_poster,
.video_poster .frame_next {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
}

/*
  Player Container
*/

.zmax #playercontainer,
.zmax .player-hints-container {
  display: none;
}

#playercontainer {
  font-family: "Open Sans", Verdana, sans-serif;
  position: absolute;
  overflow: hidden;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  z-index: 25;
  transition: opacity .25s cubic-bezier(0.0, 0.0, 0.2, 1);
  user-select: none;
  pointer-events: none;
}

#controls {
  pointer-events: auto;
  user-select: none;

  display: flex;
}

/*
  Progress Holder
*/

.progressholder {
  flex: 1;
  cursor: pointer;
  position: relative;
}

.progressholder .progress_caption {
  display: flex;
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  align-items: center;
}

.progress_caption .progress_time {
  padding-left: 15px;
  font-weight: bold;
  font-size: 13px;
  color: #d1d1d1;
}

.progress_caption .progress_tv_stream {
  padding-left: 10px;
  font-weight: bold;
  font-size: 13px;
  color: #d1d1d1;
}

.progress_caption .progress_tv_stream svg {
  position: relative;
  top: 2px;
  margin-right: 10px;
  fill: #fff;
}

.progressholder .buffered {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  background: rgba(255, 255, 255, 0.5);
  width: 0;
}

/*
  Time shift
*/

.progressholder:hover ~ .time_shift_preview {
  /*  display: block; !! disabled */
}

.time_shift_preview {
  position: absolute;
  left: 0;
  bottom: 100%;
  width: 100%;
  margin-bottom: 10px;
  display: none;
}

.tsp_window {
  width: 162px;
  padding: 1px;
  box-sizing: border-box;
  overflow: hidden;
  background-color: rgba(255, 255, 255, .2);
}

.time_shift_preview_image {
  width: 100%;
}

/*
  Buttons
*/

.player-icon {
  cursor: pointer;
}

.player-icon:before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
}

.player-icon .state-default {
  opacity: 1;
}

.player-icon:hover .state-default {
  opacity: 0;
}

.player-icon:hover .state-hover {
  opacity: 1;
}

.player-icon .state-hover {
  opacity: 0;
}

.button-settings.hidden {
  display: none;
}

.button-sound:hover .sound-tooltip,
.stream-cast:hover .cast-tooltip,
.button-settings:hover .settings-tooltip,
.button-fullscreen:hover .fullscreen-tooltip {
  opacity: 1;
}

.player-rightbar .stream-cast {
  display: none;
  margin: 0;
}

#cast-info {
  display: none;
  position: absolute;
  bottom: 40px;
  left: 20px;
  max-width: calc(100% - 40px);
  padding: 7px 10px;
  color: #fff;
  background: rgba(0, 0, 0, 0.5);
  border-radius: 4px;
  box-sizing: border-box;
  word-wrap: break-word;
  overflow: hidden;
  z-index: 5;
}

.logged_in .player-rightbar .stream-cast {
  display: flex;
}

.cast-button {
  width: 20px;
  height: 20px;
  padding: 0 6px 0 10px;
  vertical-align: bottom;
  border: none;
  outline: none;
  background: none;
  box-sizing: content-box;
  cursor: pointer;
}

.chrome-cast-wrapper {
  position: absolute;
  left: 0;
  top: 0;
}

.cast-launcher {
  position: absolute;
  left: 6px;
  width: 30px;
  height: 30px;
  padding: 0;
  opacity: 0;
}

#cast-button {
  --disconnected-color: #fff;
  --connected-color: #fff;
}

#cast-button:hover {
  --disconnected-color: #e1e1e1;
  --connected-color: #e1e1e1;
}

#cast-button-fs {
  --disconnected-color: #c5c5c5;
  --connected-color: #c5c5c5;
}

#cast-button-fs:hover {
  --disconnected-color: #e1e1e1;
  --connected-color: #e1e1e1;
}

.tooltip-gray {
  display: inline-block;
  position: absolute;
  background: #2f2f2f;
  opacity: 0.8;

  color: #c8c8c9;
  padding: 5px 8px;
  text-align: center;
  pointer-events: none;
  font-size: 12px;
  white-space: nowrap;
}

.tooltip-gray:before {
  content: "";
  border-color: #2f2f2f transparent transparent transparent;
  border-style: solid;
  border-width: 3px;
  height: 0;
  width: 0;
  position: absolute;
  bottom: -6px;
  left: 50%;
}

.tooltip-gray.icon-right:before {
  left: auto;
  right: 20px;
}

.settings-tooltip {
  opacity: 0;
}

.cast-tooltip {
  opacity: 0;
}

.fullscreen-tooltip {
  opacity: 0;
  right: -6px;
  min-width: 300px;
  white-space: normal;
}

.sound-tooltip {
  opacity: 0;
}

.sound-volume {
  cursor: pointer;
  width: 48px;
  margin-right: 10px;
}

#playpause {
  font-size: 14pt;
  color: #fff;
  margin-left: 10px;
  display: inline-block;
}

#playpause:hover {
  color: #d3d3d3;
}

#progresstime {
  font-size: 10pt;
  color: #fff;
  font-weight: bold;
}

.button-fullscreen {
  font-size: 14pt;
}

.size-normal {
  display: none;
}

.on .size-fullscreen {
  display: none;
}

.on .size-normal {
  display: inline-block;
}

.player-leftbar {
  text-align: left;
  direction: ltr;
}

.player-rightbar {
  text-align: right;
  direction: ltr;
  white-space: nowrap;
}

.player-rightbar .button-fullscreen {
  padding: 0 10px;
}

.player-leftbar > div,
.player-rightbar > div {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  float: left;

  box-sizing: border-box;
}

.player-leftbar > div {
  padding-right: 12px;
}

.player-rightbar > div {
  padding: 0 10px;
  height: 30px;
}

.player-rightbar .button-sound {
  padding-left: 15px;
  font-weight: bold;
}

.player-button {
  display: inline;
}

/* DISABLED SEE TASK BNG-3083 */
#player-livestatus {
  pointer-events: none;
  cursor: default;
}

/*
  Dialogs
*/

.player-dialogs {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  pointer-events: none;
  font-size: 14px;
}

.dialog_position_center {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

.dialog_position_at_settings {
  right: 136px;
  bottom: 36px;
}

.static-dialog {
  max-width: 380px;
  min-height: 200px;
  background: #fff;
  border: 1px solid #ccc;
  pointer-events: auto;
  font-size: 13px;
}

.static-dialog > div {
  padding: 6px;
  margin: 4px;
}

.static-dialog .static-text {
  color: #3b3b3b;
}

.static-dialog .hr {
  border-top: 1px solid #eaeaea;
  margin: 8px 0;
  height: 3px;
}

.static-dialog-content {
  background-color: #f9f9f9;
  color: #5d5d5d;
}

.static-dialog-content h4 {
  font-weight: bold;
  font-size: 16px;
  margin: 6px 0;
  padding: 0;
  color: #232323;
}

.static-dialog svg.icon {
  max-width: 37px;
  max-height: 22px;
  position: relative;
  vertical-align: top;
  margin-right: 16px;
}

/*
  Flash Toggle
*/

.tgl {
  display: none;
}

.tgl, .tgl:after, .tgl:before, .tgl *, .tgl *:after, .tgl *:before, .tgl + .tgl-btn {
  box-sizing: border-box;
  direction: ltr;
}

.tgl::selection, .tgl:after::selection, .tgl:before::selection, .tgl *::selection, .tgl *:after::selection, .tgl *:before::selection, .tgl + .tgl-btn::selection {
  background: none;
}

.tgl + .tgl-btn {
  outline: 0;
  display: inline-block;
  width: 37px;
  height: 20px;
  position: relative;
  cursor: pointer;
  user-select: none;
  top: 6px;
  margin-top: -8px;
}

.tgl + .tgl-btn:after, .tgl + .tgl-btn:before {
  position: relative;
  display: block;
  content: "";
  width: 50%;
  height: 100%;
}

.tgl + .tgl-btn:after {
  left: 0;
}

.tgl + .tgl-btn:before {
  display: none;
}

.tgl:checked + .tgl-btn:after {
  left: 50%;
}

.tgl-flat + .tgl-btn {
  padding: 1px;
  transition: all .2s ease;
  background: #fff;
  border: 1px solid #ddd;
  border-radius: 4px;
}

.tgl-flat + .tgl-btn:after {
  transition: all .2s ease;
  background: #ddd;
  content: "";
  border-radius: 2px;
}

.tgl-flat:checked + .tgl-btn {
  border: 1px solid #009b26;
  background: #009b26;
}

.tgl-flat:checked + .tgl-btn:after {
  left: 50%;
  background: #fcfcfc;
}

/*
  Balloon
*/

.balloon-dialog {
  display: inline-block;
  background: #fff;
  border: 1px solid #ccc;
  padding: 4px;
  position: absolute;
  text-align: center;
  min-width: 200px;
  pointer-events: auto;
}

.castAvailable .balloon-dialog {
  right: 174px;
}

.balloon-content {
  background-color: #f9f9f9;
  padding: 6px;
  color: #333;
}

.balloon-arrow {
  border-color: #fff transparent transparent transparent;
  border-style: solid;
  border-width: 8px;
  height: 0;
  width: 0;
  position: absolute;
  bottom: -15px;
  right: 13px;
}

.balloon-arrow-border {
  border-color: #ccc transparent transparent transparent;
  border-style: solid;
  border-width: 8px;
  height: 0;
  width: 0;
  position: absolute;
  bottom: -16px;
  right: 13px;
}

#flash-toggle-dialog-2 {
  min-width: 380px;
  box-sizing: border-box;
}

#flash-toggle-dialog-2 p {
  display: inline-block;
  width: 380px;
}

#flash-toggle-dialog-2 svg.icon {
  max-width: 42px;
  max-height: 42px;
  margin-bottom: 16px;
}

#flash-toggle-dialog-2 .balloon-content {
  font-size: 16px;
  color: #999;
  padding: 13px 0;
}

#flash-toggle-dialog {
  min-width: 332px;
  box-sizing: border-box;
}

#flash-toggle-dialog p {
  display: inline-block;
  width: 332px;
}

#flash-toggle-dialog svg.icon {
  max-width: 42px;
  max-height: 42px;
  margin-bottom: 16px;
}

#flash-toggle-dialog .balloon-content > div {
  display: inline-block;
  max-width: 322px;
}

#flash-toggle-dialog .balloon-content h4 {
  color: #333;
  margin: 2px 0 6px 0;
  font-size: 16px;
  font-weight: bold;
  padding: 0;
}

#flash-toggle-dialog .balloon-content {
  text-align: left;
  font-size: 13px;
  color: #666;
  padding: 6px 6px;
}

#flash-toggle-dialog .balloon-text {
  padding: 13px 8px;
  font-size: 16px;
  color: #888;
}

#flash-toggle-dialog-2 .button-green,
#flash-toggle-dialog .button-green {
  position: relative;
  pointer-events: none;
}

#flash-toggle-dialog-2 .allow-button-holder,
#flash-toggle-dialog .allow-button-holder {
  position: relative;
  display: inline-block;
}

#flash-toggle-dialog-2 .allow-button-holder object,
#flash-toggle-dialog .allow-button-holder object {
  position: absolute;
  width: 100%;
  height: 100%;
  border-radius: 6px;
}

#flash-toggle-tooltip {
  font-size: 13px;
  right: -7px;
  bottom: 28px;
}

#flash-toggle-tooltip .balloon-content {
  white-space: nowrap
}

#flash-toggle-dialog p.download-flash,
#flash-toggle-dialog-2 p.download-flash {
  font-size: 12px;
  margin-top: 16px;
  color: #5d5d5d;
}

.buttons-row {
  white-space: nowrap;
  padding: 0 8px;
}

.button {
  padding: 10px 18px;
  border-radius: 6px;
  font-size: 12px;
  font-weight: bold;
  display: inline-block;
  cursor: pointer;
}

.button-green {
  color: #fff;
  background: #01b22e;
  text-shadow: 1px 1px 0 #666;
}

.button-gray {
  color: #474747;
  background: #d9d9d9;
  text-shadow: 1px 1px 0 #fafafa;
  margin-left: 4px;
}

strong.green {
  color: #01b230;
}

.info-icon {
  display: inline-block;
  margin-left: 20px;
  width: 19px;
  height: 19px;
  padding-top: 1px;
  line-height: 14px;
  font-weight: 700;
  font-size: 14px;
  color: #55afdc;
  border: 2px solid #55afdc;
  border-radius: 50%;
  box-sizing: border-box;
  cursor: pointer;
}

/*
  Close button
*/

.static-dialog .close {
  position: absolute;
  right: 3px;
  top: 7px;
  width: 16px;
  height: 16px;
  cursor: pointer;
  padding: 0;
  margin: 0;
}

.static-dialog .close-button {
  height: 12px;
  width: 12px;
  position: relative;
  box-sizing: border-box;
  line-height: 12px;
  display: inline-block;
}

.static-dialog .close-button:before, .close-button:after {
  transform: rotate(-45deg);
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  margin-top: -0.5px;
  margin-left: -5.5px;
  display: block;
  height: 2px;
  width: 11px;
  background-color: #e00;
  border-radius: 2px;
}

.static-dialog .close-button:after {
  transform: rotate(-135deg);
}

/* Icons */

.cast-control.big_hover,
.button-fullscreen.big_hover {
  fill: #fff;
}

.cast-control.big_hover:hover,
.button-fullscreen.big_hover:hover {
  fill: #4b4b4c;
}

/**
  Theme Player Dark
 */
.player_dark .progress_bar_padding,
.player_dark .player-background {
  display: none;
}

.player_dark #controls {
  position: absolute;
  bottom: 5px;
  left: 5px;
  right: 5px;
  height: 30px;
}

.player_dark .player-leftbar,
.player_dark .player-rightbar {
  background: #2f2f2f;
  opacity: 0.8;
}

.player_dark #player-livestatus {
  position: relative;
  font-size: 13px;
  font-weight: bold;
  color: #fff;
  display: inline-block;
  padding-left: 20px;
  text-transform: uppercase;
  cursor: pointer;
  height: 30px;
  line-height: 30px;
}

.player_dark #player-livestatus:before {
  position: absolute;
  content: " ";
  background-color: rgb(0, 214, 0);
  display: block;
  left: 10px;
  top: 13px;
  width: 5px;
  height: 5px;
  border-radius: 3px;
}

.player_dark #player-livestatus.icon-no_active:before {
  background-color: #d1d1d1;
}

.player_dark .progressholder {
  background: #242424;
  opacity: 0.8;

  margin: 0 5px;
}

.player_dark .progressholder .progress {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  background: #454545;
  width: 0;
}

.player_dark .progressholder .progress:after {
  content: " ";
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  right: -1px;
  width: 2px;
  height: 30px;
  background: #686868;
}

.player_dark #sound-volume-holder {
  pointer-events: none;
  position: absolute;
  left: 5px;
  top: 7px;
  bottom: 7px;
  right: 5px;
  background: linear-gradient(
    to right,
      /* 1 */ rgba(255, 255, 255, 0.3) 0%,
    rgba(255, 255, 255, 0.3) 3px,
    rgba(255, 255, 255, 0) 3px,
    rgba(255, 255, 255, 0) 7px,
      /* 2 */ rgba(255, 255, 255, 0.3) 7px,
    rgba(255, 255, 255, 0.3) 10px,
    rgba(255, 255, 255, 0) 10px,
    rgba(255, 255, 255, 0) 14px,
      /* 3 */ rgba(255, 255, 255, 0.3) 14px,
    rgba(255, 255, 255, 0.3) 17px,
    rgba(255, 255, 255, 0) 17px,
    rgba(255, 255, 255, 0) 21px,
      /* 4 */ rgba(255, 255, 255, 0.3) 21px,
    rgba(255, 255, 255, 0.3) 24px,
    rgba(255, 255, 255, 0) 24px,
    rgba(255, 255, 255, 0) 28px,
      /* 5 */ rgba(255, 255, 255, 0.3) 28px,
    rgba(255, 255, 255, 0.3) 31px,
    rgba(255, 255, 255, 0) 31px,
    rgba(255, 255, 255, 0) 35px,
      /* 6 */ rgba(255, 255, 255, 0.3) 35px,
    rgba(255, 255, 255, 0.3) 38px
  );
}

.player_dark .sound-volume-position {
  pointer-events: none;
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 0;

  background: linear-gradient(
    to right,
      /* 1 */ rgba(255, 255, 255, 1) 0%,
    rgba(255, 255, 255, 1) 3px,
    rgba(255, 255, 255, 0) 3px,
    rgba(255, 255, 255, 0) 7px,
      /* 2 */ rgba(255, 255, 255, 1) 7px,
    rgba(255, 255, 255, 1) 10px,
    rgba(255, 255, 255, 0) 10px,
    rgba(255, 255, 255, 0) 14px,
      /* 3 */ rgba(255, 255, 255, 1) 14px,
    rgba(255, 255, 255, 1) 17px,
    rgba(255, 255, 255, 0) 17px,
    rgba(255, 255, 255, 0) 21px,
      /* 4 */ rgba(255, 255, 255, 1) 21px,
    rgba(255, 255, 255, 1) 24px,
    rgba(255, 255, 255, 0) 24px,
    rgba(255, 255, 255, 0) 28px,
      /* 5 */ rgba(255, 255, 255, 1) 28px,
    rgba(255, 255, 255, 1) 31px,
    rgba(255, 255, 255, 0) 31px,
    rgba(255, 255, 255, 0) 35px,
      /* 6 */ rgba(255, 255, 255, 1) 35px,
    rgba(255, 255, 255, 1) 38px
  );
}

.player_dark .big_hover {
  cursor: pointer;
  color: #c8c8c9;
}

.player_dark .big_hover:hover {
  color: #4b4b4c;
  background: rgba(255, 255, 255, 0.9);
}

.player_dark .tooltip-gray {
  bottom: 34px;
}

/*
 Quality
 */

.player_dark .quality_settings {
  position: absolute;
  bottom: 34px;
  background: #2f2f2f;
  color: #d3d4d3;
  line-height: 30px;
  font-size: 12px;
  left: 50%;
  transform: translate3d(-50%, 0, 0);
}

.player_dark .quality_settings:after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  height: 9px;
}

.player_dark .quality_settings:before {
  content: "";
  display: block;
  width: 0;
  height: 0;
  border-left: 3px solid transparent;
  border-right: 3px solid transparent;
  border-top: 3px solid #2f2f2f;
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -3px;
}

.player_dark .quality_settings > div {
  position: relative;
  cursor: pointer;
  padding: 0 10px;
  text-align: center;
  font-weight: bold;
  box-sizing: border-box;
  min-width: 78px;
}

.player_dark .quality_settings > div:hover {
  color: #4b4b4c;
  background: rgba(255, 255, 255, 0.9);
}

.player_dark .quality_settings .quality_hd:after {
  position: absolute;
  content: "HD";
  color: #f00;
  font-size: 10px;
  font-weight: bold;
  padding-left: 2px;
}

.player_dark .quality_selected {
  font-weight: bold;
}

.player_dark .controls_current_rendition {
  display: inline-table;
  height: 30px;
  line-height: 30px;
  cursor: pointer;
  font-weight: bold;
  font-size: 12px;
}

/* Player Dark: Icons */

.player_dark .player-icon.sound-volume-muted {
  width: 21px;
  height: 18px;
}

.player_dark .player-icon.size-fullscreen,
.player_dark .player-icon.size-normal {
  width: 17px;
  height: 14px;
}

.player_dark .player-icon.sound-volume-1,
.player_dark .player-icon.sound-volume-2,
.player_dark .player-icon.sound-volume-3,
.player_dark .player-icon.sound-volume-4 {
  width: 21px;
  height: 18px;
}

.player_dark .player-icon.button-stream {
  width: 19px;
  height: 16px;
  pointer-events: none;
}

/**
  Theme PLayer Light
 */
.player_light #controls {
  justify-content: space-between;
  position: absolute;
  bottom: 3px;
  left: 0;
  right: 0;
  height: 30px;
  direction: ltr;
}

.player_light .player-rightbar {
  margin-right: 14px;
}

.player_light .player-background {
  position: absolute;
  background-repeat: repeat-x;
  background-position: bottom;
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAADGCAYAAAAT+OqFAAAAdklEQVQoz42QQQ7AIAgEF/T/D+kbq/RWAlnQyyazA4aoAB4FsBSA/bFjuF1EOL7VbrIrBuusmrt4ZZORfb6ehbWdnRHEIiITaEUKa5EJqUakRSaEYBJSCY2dEstQY7AuxahwXFrvZmWl2rh4JZ07z9dLtesfNj5q0FU3A5ObbwAAAABJRU5ErkJggg==);
  transition: opacity .25s cubic-bezier(0.0, 0.0, 0.2, 1);
  pointer-events: none;
  left: 0;
  right: 0;
  height: 49px;
  bottom: 0;
  padding-top: 49px;
}

.player_light .progress_bar_padding {
  height: 8px;
}

.player_light #player-livestatus {
  position: relative;
  font-size: 13px;
  font-family: Arial, Verdana, Tahoma, sans-serif;
  font-weight: bold;
  color: #fff;
  display: inline-block;
  padding-left: 20px;
  text-transform: uppercase;
  cursor: pointer;
  height: 30px;
  line-height: 30px;
  margin-left: 10px;
  margin-top: 1px;
}

.player_light #player-livestatus:before {
  position: absolute;
  content: " ";
  background-color: rgb(0, 214, 0);
  display: block;
  left: 10px;
  top: 12px;
  width: 5px;
  height: 5px;
  border-radius: 3px;
}

.player_light #player-livestatus.icon-no_active:before {
  background-color: #d1d1d1;
}

.player_light .progressholder {
  display: none;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 32px;
  margin: 0 10px;
}

.player_light .progressholder .progress_bar_padding {
  height: 12px;
}

.player_light .progressholder .progress_list {
  position: relative;
  bottom: 0;
  height: 3px;
  background: rgba(255, 255, 255, 0.2);
  transition: all .1s cubic-bezier(0.0, 0.0, 0.2, 1);
}

.player_light .progressholder:hover .progress_list {
  bottom: -2px;
  height: 6px;
}

.player_light .progressholder .buffered {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  background: rgba(255, 255, 255, 0.5);
  width: 0;
}

.player_light .progressholder .progress {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  background: #8bdf8a;
  width: 0;
}

.player_light .progressholder:hover .progress:before {
  content: " ";
  display: block;
  position: absolute;
  top: -3px;
  right: -6px;
  width: 12px;
  height: 12px;
  border-radius: 10px;
  background: #8bdf8a;
}

.player_light #sound-volume-holder {
  pointer-events: none;
  position: absolute;
  background-color: rgba(255, 255, 255, 0.4);
  left: 0;
  top: 14px;
  right: 0;
  height: 3px;
}

.player_light .sound-volume {
  width: 52px;
  margin-right: 8px;
}

.player_light .sound-volume-position {
  pointer-events: none;
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  background-color: #fff;
  width: 0;
}

.player_light .sound-volume-position:before {
  content: " ";
  display: block;
  position: absolute;
  top: -3px;
  right: -4px;
  width: 9px;
  height: 9px;
  border-radius: 5px;
  background: #fff;
}

.player_light .big_hover {
  cursor: pointer;
  color: #e9e8e7;
}

.player_light .big_hover:hover {
  color: #fff;
}

.player_light .tooltip-gray {
  bottom: 52px;
  font-weight: bold;
  color: #d3d4d3;
}

.player_light .player-rightbar .stream-cast {
  margin-right: 5px;
}

.player_light .tooltip-gray:before {
  display: none;
}

.player_light .hover_block .tooltip-gray {
  bottom: 30px;
}

/*
 Quality
 */

.player_light .quality_settings {
  position: absolute;
  bottom: 52px;
  background: #2f2f2f;
  color: #d3d4d3;
  line-height: 30px;
  font-size: 12px;
  left: 50%;
  transform: translate3d(-50%, 0, 0);
}

.player_light .quality_settings:after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  height: 29px;
}

.player_light .quality_settings > div {
  position: relative;
  cursor: pointer;
  padding: 0 36px;
  text-align: center;
  font-weight: bold;
  box-sizing: border-box;
  min-width: 78px;
}

.player_light .quality_settings > div:hover {
  color: #4b4b4c;
  background: rgba(255, 255, 255, 0.9);
}

.player_light .quality_settings .quality_hd:after {
  position: absolute;
  content: "HD";
  color: #f00;
  font-size: 10px;
  font-weight: bold;
  padding-left: 2px;
}

.player_light .quality_selected {
  font-weight: bold;
}

.player_light .controls_current_rendition {
  display: inline-table;
  height: 30px;
  line-height: 30px;
  cursor: pointer;
  font-weight: bold;
  font-size: 12px;
}

.player_light .controls_current_rendition.quality_hd:after {
  position: relative;
  content: "HD";
  color: #f00;
  font-size: 10px;
  font-weight: bold;
  padding-left: 2px;
}

.player_light .settings_visible .tooltip-gray {
  display: none;
}

/* Player Light: Icons */

.player_light .player-icon {
  margin-top: 1px;
}

.player_light .player-icon.size-fullscreen {
  width: 19px;
  height: 19px;
  margin-top: 2px;
}

.player_light .player-icon.size-normal {
  width: 17px;
  height: 19px;
}

.player_light .player-icon.sound-volume-muted,
.player_light .player-icon.sound-volume-1,
.player_light .player-icon.sound-volume-2 {
  width: 23px;
  height: 16px;
}

.player_light .player-icon.button-stream {
  width: 22px;
  height: 19px;
  pointer-events: none;
}

/**
  Theme PLayer promo livestream
 */
.player_livestream #controls {
  justify-content: start;
  position: absolute;
  bottom: 3px;
  left: 0;
  right: 0;
  height: 30px;
  direction: ltr;
}

.player_livestream .player-rightbar {
  margin-right: 14px;
}

.player_livestream .player-background {
  position: absolute;
  background-repeat: repeat-x;
  background-position: bottom;
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAADGCAYAAAAT+OqFAAAAdklEQVQoz42QQQ7AIAgEF/T/D+kbq/RWAlnQyyazA4aoAB4FsBSA/bFjuF1EOL7VbrIrBuusmrt4ZZORfb6ehbWdnRHEIiITaEUKa5EJqUakRSaEYBJSCY2dEstQY7AuxahwXFrvZmWl2rh4JZ07z9dLtesfNj5q0FU3A5ObbwAAAABJRU5ErkJggg==);
  transition: opacity .25s cubic-bezier(0.0, 0.0, 0.2, 1);
  pointer-events: none;
  left: 0;
  right: 0;
  height: 49px;
  bottom: 0;
  padding-top: 49px;
}

.player_livestream .progress_bar_padding {
  height: 8px;
}

.player_livestream #player-livestatus {
  position: relative;
  font-size: 13px;
  font-family: Arial, Verdana, Tahoma, sans-serif;
  font-weight: bold;
  color: #fff;
  display: inline-block;
  padding-left: 20px;
  text-transform: uppercase;
  cursor: pointer;
  height: 30px;
  line-height: 30px;
  margin-left: 10px;
  margin-top: 1px;
}

.player_livestream #player-livestatus:before {
  position: absolute;
  content: " ";
  background-color: rgb(0, 214, 0);
  display: block;
  left: 10px;
  top: 12px;
  width: 5px;
  height: 5px;
  border-radius: 3px;
}

.player_livestream #player-livestatus.icon-no_active:before {
  background-color: #d1d1d1;
}

.player_livestream .progressholder {
  display: none;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 32px;
  margin: 0 10px;
}

.player_livestream .progressholder .progress_bar_padding {
  height: 12px;
}

.player_livestream .progressholder .progress_list {
  position: relative;
  bottom: 0;
  height: 3px;
  background: rgba(255, 255, 255, 0.2);
  transition: all .1s cubic-bezier(0.0, 0.0, 0.2, 1);
}

.player_livestream .progressholder:hover .progress_list {
  bottom: -2px;
  height: 6px;
}

.player_livestream .progressholder .buffered {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  background: rgba(255, 255, 255, 0.5);
  width: 0;
}

.player_livestream .progressholder .progress {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  background: #8bdf8a;
  width: 0;
}

.player_livestream .progressholder:hover .progress:before {
  content: " ";
  display: block;
  position: absolute;
  top: -3px;
  right: -6px;
  width: 12px;
  height: 12px;
  border-radius: 10px;
  background: #8bdf8a;
}

.player_livestream #sound-volume-holder {
  pointer-events: none;
  position: absolute;
  background-color: rgba(255, 255, 255, 0.4);
  left: 0;
  top: 14px;
  right: 0;
  height: 3px;
}

.player_livestream .sound-volume {
  width: 52px;
  margin-right: 8px;
}

.player_livestream .sound-volume-position {
  pointer-events: none;
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  background-color: #fff;
  width: 0;
}

.player_livestream .sound-volume-position:before {
  content: " ";
  display: block;
  position: absolute;
  top: -3px;
  right: -4px;
  width: 9px;
  height: 9px;
  border-radius: 5px;
  background: #fff;
}

.player_livestream .big_hover {
  cursor: pointer;
  color: #e9e8e7;
}

.player_livestream .big_hover:hover {
  color: #fff;
}

.player_livestream .tooltip-gray {
  bottom: 52px;
  font-weight: bold;
  color: #d3d4d3;
}

.player_livestream .player-rightbar .stream-cast {
  margin-right: 5px;
}

.player_livestream .tooltip-gray:before {
  display: none;
}

.player_livestream .hover_block .tooltip-gray {
  bottom: 30px;
}

/*
 Quality
 */

.player_livestream .quality_settings {
  position: absolute;
  bottom: 52px;
  background: #2f2f2f;
  color: #d3d4d3;
  line-height: 30px;
  font-size: 12px;
  left: 50%;
  transform: translate3d(-50%, 0, 0);
}

.player_livestream .quality_settings:after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  height: 29px;
}

.player_livestream .quality_settings > div {
  position: relative;
  cursor: pointer;
  padding: 0 36px;
  text-align: center;
  font-weight: bold;
  box-sizing: border-box;
  min-width: 78px;
}

.player_livestream .quality_settings > div:hover {
  color: #4b4b4c;
  background: rgba(255, 255, 255, 0.9);
}

.player_livestream .quality_settings .quality_hd:after {
  position: absolute;
  content: "HD";
  color: #f00;
  font-size: 10px;
  font-weight: bold;
  padding-left: 2px;
}

.player_livestream .quality_selected {
  font-weight: bold;
}

.player_livestream .controls_current_rendition {
  display: inline-table;
  height: 30px;
  line-height: 30px;
  cursor: pointer;
  font-weight: bold;
  font-size: 12px;
}

.player_livestream .settings_visible .tooltip-gray {
  display: none;
}

/* Player Light: Icons */

.chatFullscreen.ads_fullwindow .player_livestream .player-rightbar .button-sound .player-icon {
  position: relative;
}

.player_livestream .player-icon.size-fullscreen {
  width: 19px;
  height: 19px;
  margin-top: 2px;
}

.player_livestream .player-icon.size-normal {
  width: 17px;
  height: 19px;
}

.player_livestream .player-icon.sound-volume-muted,
.player_livestream .player-icon.sound-volume-1,
.player_livestream .player-icon.sound-volume-2,
.player_livestream .player-icon.sound-volume-3,
.player_livestream .player-icon.sound-volume-4 {
  width: 23px;
  height: 16px;
}

.player_livestream .player-icon.button-stream {
  width: 22px;
  height: 19px;
  pointer-events: none;
}

/* DISABLE PROGRESS BAR @see BNG-3083 */
.progressholder {
  pointer-events: none;
  cursor: default;
}

/**
  Hints
 */

.player-hints-container {
  position: absolute;
  right: 6px;
  bottom: 6px;
  left: 6px;
  z-index: 50;
  width: 100%;
  max-width: 592px;
  min-height: 40px;
  margin: 0 auto;
  padding: 14px;
}

.player-hints-container .player-hints-content {

}

.player-hint-close {
  position: absolute;
  top: 8px;
  right: 8px;
  width: 24px;
  height: 24px;
  cursor: pointer;
  opacity: 0.8;
}

.player-hint-close-button {
  position: absolute;
  top: 8px;
  right: 8px;
  width: 10px;
  height: 10px;
  cursor: pointer;
}

.player-hint-close-button:before,
.player-hint-close-button:after {
  content: " ";
  position: absolute;
  left: 4px;
  width: 2px;
  height: 10px;
  background-color: #828282;
}

.player-hint-close-button:before {
  transform: rotate(45deg);
}

.player-hint-close-button:after {
  transform: rotate(-45deg);
}

.player-hints-container .player-hint-item {
  color: #434343;
  font-weight: normal;
  font-size: 15px;
  font-family: "Open Sans", sans-serif;
  font-style: normal;
  line-height: 1.47em;
}

.player-hints-container .player-hint-item .hint-with-colour-message {
  display: inline-block;
  padding: 0 5px;
  color: #eefb80;
  font-weight: 700;
  background: linear-gradient(90deg, #e50050, #8a3f90);
}

.player-hints-container .player-hint-item .hint-text-categories {
  display: inline-block;
  padding: 0 5px;
  color: #fff;
  font-weight: 700;
  background: #f58f00;
  border-radius: 5px;
}

.player-hints-icon {
  display: inline-block;
  width: 1.47em;
  height: 1.47em;
  background: center center no-repeat;
  background-size: auto 100%;
  transform: translateY(.4em);
}

.player-hints-icon.icon-247 {
  background-image: url("/images/svg/bc/stream_message/sm_247.svg");
}

.player-hints-icon.icon-aa {
  width: 3.33em;
  background-image: url("/images/svg/bc/stream_message/sm_aa.svg");
}

.player-hints-icon.icon-ads {
  background-image: url("/images/svg/bc/stream_message/sm_ads.svg");
}

.player-hints-icon.icon-ava {
  background-image: url("/images/vip_avatars/116/avatars.jpg");
}

.player-hints-icon.icon-b {
  background-image: url("/images/svg/bc/stream_message/sm_b.svg");
}

.player-hints-icon.icon-bc {
  background-image: url("/images/svg/bc/stream_message/sm_bc.svg");
}

.player-hints-icon.icon-cam {
  background-image: url("/images/svg/bc/stream_message/sm_cam.svg");
}

.player-hints-icon.icon-cashback {
  background-image: url("/images/svg/bc/stream_message/sm_cashback.svg");
}

.player-hints-icon.icon-cons {
  background-image: url("/images/svg/bc/stream_message/sm_cons.svg");
}

.player-hints-icon.icon-diamond {
  background-image: url("/images/svg/bc/stream_message/sm_diamond.svg");
}

.player-hints-icon.icon-dice {
  background-image: url("/images/svg/bc/stream_message/sm_dice.svg");
}

.player-hints-icon.icon-dj {
  background-image: url("/images/svg/bc/stream_message/sm_dj.svg");
}

.player-hints-icon.icon-exclusive {
  background-image: url("/images/svg/bc/stream_message/sm_exclusive.svg");
}

.player-hints-icon.icon-fanboost {
  background-image: url("/images/svg/bc/stream_message/sm_fanboost.svg");
}

.player-hints-icon.icon-full {
  background-image: url("/images/svg/bc/stream_message/sm_full.svg");
}

.player-hints-icon.icon-gift {
  background-image: url("/images/svg/bc/stream_message/sm_gift.svg");
}

.player-hints-icon.icon-gold {
  background-image: url("/images/svg/bc/stream_message/sm_gold.svg");
}

.player-hints-icon.icon-group {
  background-image: url("/images/svg/bc/stream_message/sm_group.svg");
}

.player-hints-icon.icon-hd {
  background-image: url("/images/svg/bc/stream_message/sm_hd.svg");
}

.player-hints-icon.icon-hd_p {
  width: 1.87em;
  background-image: url("/images/svg/bc/stream_message/sm_hd_p.svg");
}

.player-hints-icon.icon-insta {
  background-image: url("/images/svg/bc/stream_message/sm_insta.svg");
}

.player-hints-icon.icon-invis {
  background-image: url("/images/svg/bc/stream_message/sm_invis.svg");
}

.player-hints-icon.icon-jewels {
  background-image: url("/images/svg/bc/stream_message/sm_jewels.svg");
}

.player-hints-icon.icon-king {
  background-image: url("/images/svg/bc/stream_message/sm_king.svg");
}

.player-hints-icon.icon-lovence {
  background-image: url("/images/svg/bc/stream_message/sm_lovence.svg");
}

.player-hints-icon.icon-message {
  background-image: url("/images/svg/bc/stream_message/sm_message.svg");
}

.player-hints-icon.icon-moderator {
  background-image: url("/images/svg/bc/stream_message/sm_moderator.svg");
}

.player-hints-icon.icon-mus {
  background-image: url("/images/svg/bc/stream_message/sm_mus.svg");
}

.player-hints-icon.icon-notification {
  background-image: url("/images/svg/bc/stream_message/sm_notification.svg");
}

.player-hints-icon.icon-phonepay {
  background-image: url("/images/svg/bc/stream_message/sm_phonepay.svg");
}

.player-hints-icon.icon-platinum {
  background-image: url("/images/svg/bc/stream_message/sm_platinum.svg");
}

.player-hints-icon.icon-play {
  background-image: url("/images/svg/bc/stream_message/sm_play.svg");
}

.player-hints-icon.icon-private {
  background-image: url("/images/svg/bc/stream_message/sm_private.svg");
}

.player-hints-icon.icon-protect {
  background-image: url("/images/svg/bc/stream_message/sm_protect.svg");
}

.player-hints-icon.icon-ring {
  background-image: url("/images/svg/bc/stream_message/sm_ring.svg");
}

.player-hints-icon.icon-sc {
  background-image: url("/images/svg/bc/stream_message/sm_sc.svg");
}

.player-hints-icon.icon-search {
  background-image: url("/images/svg/bc/stream_message/sm_search.svg");
}

.player-hints-icon.icon-silecustom {
  background-image: url("/images/svg/bc/stream_message/sm_silecustom.svg");
}

.player-hints-icon.icon-smile {
  background-image: url("/images/svg/bc/stream_message/sm_smile.svg");
}

.player-hints-icon.icon-smilecool {
  background-image: url("/images/svg/bc/stream_message/sm_smilecool.svg");
}

.player-hints-icon.icon-smilehappy {
  background-image: url("/images/svg/bc/stream_message/sm_smilehappy.svg");
}

.player-hints-icon.icon-smilewink {
  background-image: url("/images/svg/bc/stream_message/sm_smilewink.svg");
}

.player-hints-icon.icon-sort {
  background-image: url("/images/svg/bc/stream_message/sm_sort.svg");
}

.player-hints-icon.icon-star {
  background-image: url("/images/svg/bc/stream_message/sm_star.svg");
}

.player-hints-icon.icon-tag {
  background-image: url("/images/svg/bc/stream_message/sm_tag.svg");
}

.player-hints-icon.icon-telegram {
  background-image: url("/images/svg/bc/stream_message/sm_telegram.svg");
}

.player-hints-icon.icon-ten {
  background-image: url("/images/svg/bc/stream_message/sm_ten.svg");
}

.player-hints-icon.icon-tiktok {
  background-image: url("/images/svg/bc/stream_message/sm_tiktok.svg");
}

.player-hints-icon.icon-token {
  background-image: url("/images/svg/bc/stream_message/sm_token.svg");
}

.player-hints-icon.icon-tv {
  background-image: url("/images/svg/bc/stream_message/sm_tv.svg");
}

.player-hints-icon.icon-twitter {
  background-image: url("/images/svg/bc/stream_message/sm_twitter.svg");
}

.player-hints-icon.icon-unlimited {
  background-image: url("/images/svg/bc/stream_message/sm_unlimited.svg");
}

.player-hints-icon.icon-user {
  background-image: url("/images/svg/bc/stream_message/sm_user.svg");
}

.player-hints-icon.icon-vip {
  background-image: url("/images/svg/bc/stream_message/sm_vip.svg");
}

.player-hints-icon.icon-vis {
  background-image: url("/images/svg/bc/stream_message/sm_vis.svg");
}

/**
  Hints - Primary Skin
 */

.player-primary-hints {
  box-sizing: border-box;
  max-width: 592px;
  padding: 15px 40px 15px 119px;
  overflow: hidden;
  background: rgba(255, 255, 255, 0.6);
  border-radius: 10px;
}

.player-primary-hints .player-hints-idea {
  position: absolute;
  top: 50%;
  left: 15px;
  width: 96px;
  height: 96px;
  background: rgba(255, 255, 255, .5);
  border-radius: 50%;
  transform: translateY(-50%);
}

.player-primary-hints .player-hints-idea:before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 62px;
  height: 62px;
  background: #fff url("/images/svg/bc/stream_message/sm_idea.svg") center center no-repeat;
  background-size: 30px 33px;
  border-radius: 50%;
  transform: translate(-50%, -50%);
}