:root {

  --photo: url('/i/ib-2018-90-bw-posterised@2x.png');

  --backgroundColor: rgb(175, 184, 189);
  --backgroundHalfOpacityColor: rgba(175, 184, 189, .5);
  --backgroundZeroOpacityColor: rgba(175, 184, 189, 0);

  --linkColor: white;
  --linkUnderlineColor: rgba(255, 255, 255, var(--thinAlpha));
  --linkColorSelected: var(--crimsonColor);
  --linkColorHover: black;
  --linkUnderlineColorHover: rgba(0, 0, 0, var(--thinAlpha));
  --linkLanguageColor: black;
  --linkLanguageColorHover: white;

  --hamburgerColor: black;
  --hamburgerColorHover: white;

  --pageTitleColor: var(--crimsonColor);
  --pageTitleBorderColor: var(--crimsonColor);
  --pageTitleBorderHeight: 4px;

  --actionButtonColor: var(--crimsonColor);
  --actionButtonColorHover: white;

  --imgOutlineColor: var(--backgroundColor);
  --imgOutlineColorHover: black;

}

.jouele-progress-line-bar_base:after { /* Control 'timeline' */
    background-color: rgba(0,0,0,.2);
}
.jouele-progress-line-bar_play:after { /* Control 'elapsed' */
    background-color: currentColor;
}
.jouele-progress-line-bar_play.jouele-is-playing:after { /* Control 'elapsed' when playing */
    background-color: var(--actionButtonColor);
}
.jouele-progress-line:hover .jouele-progress-line-bar_play:after { /* Control 'elapsed' on hover */
    background-color: #fff;
}
.jouele-progress-line-lift { /* Control 'position' */
    background-color: currentColor;
}
.jouele-progress-line-lift.jouele-is-playing { /* Control 'position' when playing */
    background-color: var(--actionButtonColor);
}
.jouele-progress-line:hover .jouele-progress-line-lift { /* Control 'position' on hover */
    background-color: #fff;
}
.jouele-progress-line-lift:before { /* Preloader animation in control 'position' */
    border-color: currentColor;
}
.jouele-progress-line-lift.jouele-is-playing:before { /* Preloader animation in control 'position' when playing */
    border-color: var(--actionButtonColor);
}
.jouele-progress-line:hover .jouele-progress-line-lift:before { /* Preloader animation in control 'position' on hover */
    border-color: #fff;
}

.jouele-info-control-button-icon_unavailable .jouele-svg-color,
.jouele-info-control-button-icon_play .jouele-svg-color { /* Control 'play-pause' */
    fill: currentColor;
}
.jouele-info-control-button-icon_play.jouele-is-playing .jouele-svg-color { /* Control 'play-pause' when playing */
    fill: var(--actionButtonColor);
}
.jouele-info-control-button:hover .jouele-info-control-button-icon_play .jouele-svg-color { /* Control 'play-pause' on hover */
    fill: #fff;
}
.jouele-info-time { /* Control 'time-elapsed' and 'time-total' */
    color: inherit;
}