.oonmedia-offscreen {
  position: absolute;
  left: -999em; }

.oonmedia-audio {
  position: relative;
  max-width: 400px;
  background-color: #edeef0;
  color: black; }
  .oonmedia-audio * {
    box-sizing: border-box; }
  .oonmedia-audio audio {
    display: none; }
  .oonmedia-audio .oonmedia-audio-container {
    width: 100%;
    height: 100%;
    overflow: hidden; }
    .oonmedia-audio .oonmedia-audio-container.oonmedia-shoutcast .oonmedia-controls .oonmedia-timecontainer {
      display: none; }
    .oonmedia-audio .oonmedia-audio-container.oonmedia-shoutcast .oonmedia-controls .oonmedia-live-disclaimer {
      display: block; }
    .oonmedia-audio .oonmedia-audio-container.oonmedia-shoutcast .oonmedia-controls .oonmedia-playpause[data-state="play"] svg use.pause {
      display: none; }
    .oonmedia-audio .oonmedia-audio-container.oonmedia-shoutcast .oonmedia-controls .oonmedia-playpause[data-state="play"] svg use.play {
      display: none; }
    .oonmedia-audio .oonmedia-audio-container.oonmedia-shoutcast .oonmedia-controls .oonmedia-playpause[data-state="play"] svg use.stop {
      display: block; }
    .oonmedia-audio .oonmedia-audio-container .oonmedia-controls {
      font-family: 'ORF ON TF',Arial,Helvetica,'Lucida Sans Unicode','Lucida Grande',sans-serif;
      display: flex;
      align-items: center;
      height: 40px;
      padding: 5px;
      /**
       * progress
       */
      /* Chrome requires its own rule for this, otherwise it ignores it */
      /**
       * hide time with volume prgoress is visible
       */
      /**
* buttons
*/ }
      .oonmedia-audio .oonmedia-audio-container .oonmedia-controls progress {
        position: relative;
        height: 100%;
        width: 100%;
        border: none;
        overflow: hidden;
        display: block;
        /* Internet Explorer uses this value as the progress bar's value colour */
        color: #8297BD;
        -webkit-appearance: none; }
      .oonmedia-audio .oonmedia-audio-container .oonmedia-controls progress::-moz-progress-bar {
        background-color: #8297BD; }
      .oonmedia-audio .oonmedia-audio-container .oonmedia-controls progress::-webkit-progress-value {
        background-color: #8297BD; }
      .oonmedia-audio .oonmedia-audio-container .oonmedia-controls progress::-webkit-progress-bar {
        background-color: white; }
      .oonmedia-audio .oonmedia-audio-container .oonmedia-controls .oonmedia-progress {
        cursor: pointer;
        width: 100%;
        margin: 0px;
        height: 20px;
        display: flex;
        align-items: center;
        padding: 0px 3px; }
        .oonmedia-audio .oonmedia-audio-container .oonmedia-controls .oonmedia-progress progress {
          height: 5px; }
      .oonmedia-audio .oonmedia-audio-container .oonmedia-controls.oonmedia-show-volume-progress .oonmedia-volume-progress {
        cursor: pointer;
        width: 125px;
        padding: 0 2px; }
      .oonmedia-audio .oonmedia-audio-container .oonmedia-controls .oonmedia-live-disclaimer {
        display: none;
        font-size: 12px;
        margin: 5px; }
      .oonmedia-audio .oonmedia-audio-container .oonmedia-controls.oonmedia-show-volume-progress .oonmedia-timecontainer {
        width: 0px;
        overflow: hidden;
        padding: 0; }
      .oonmedia-audio .oonmedia-audio-container .oonmedia-controls button {
        text-align: center;
        white-space: nowrap;
        text-overflow: ellipsis;
        border: none;
        cursor: pointer;
        background: transparent;
        width: 45px;
        padding: 0;
        margin: 0;
        color: #8297BD; }
      .oonmedia-audio .oonmedia-audio-container .oonmedia-controls > button > svg {
        width: 100%;
        height: 20px;
        display: block; }
      .oonmedia-audio .oonmedia-audio-container .oonmedia-controls button:hover > svg, .oonmedia-audio .oonmedia-audio-container .oonmedia-controls button:focus > svg {
        color: #B5CEFF; }
      .oonmedia-audio .oonmedia-audio-container .oonmedia-controls button[data-state="play"] svg use.pause {
        display: block; }
      .oonmedia-audio .oonmedia-audio-container .oonmedia-controls button[data-state="play"] svg use.play {
        display: none; }
      .oonmedia-audio .oonmedia-audio-container .oonmedia-controls button[data-state="play"] svg use.stop {
        display: none; }
      .oonmedia-audio .oonmedia-audio-container .oonmedia-controls button[data-state="pause"] svg use.pause, .oonmedia-audio .oonmedia-audio-container .oonmedia-controls button[data-state="stop"] svg use.pause {
        display: none; }
      .oonmedia-audio .oonmedia-audio-container .oonmedia-controls button[data-state="pause"] svg use.play, .oonmedia-audio .oonmedia-audio-container .oonmedia-controls button[data-state="stop"] svg use.play {
        display: block; }
      .oonmedia-audio .oonmedia-audio-container .oonmedia-controls button[data-state="pause"] svg use.stop, .oonmedia-audio .oonmedia-audio-container .oonmedia-controls button[data-state="stop"] svg use.stop {
        display: none; }
      .oonmedia-audio .oonmedia-audio-container .oonmedia-controls .oonmedia-timecontainer {
        white-space: nowrap;
        font-size: 12px;
        text-transform: uppercase;
        padding: 0 10px;
        transition: width 250ms;
        margin-right: auto; }
        .oonmedia-audio .oonmedia-audio-container .oonmedia-controls .oonmedia-timecontainer > * {
          display: inline-block; }
      .oonmedia-audio .oonmedia-audio-container .oonmedia-controls .oonmedia-volume-progress {
        height: 20px;
        display: flex;
        align-items: center;
        width: 0px;
        transition: width 250ms; }
        .oonmedia-audio .oonmedia-audio-container .oonmedia-controls .oonmedia-volume-progress progress {
          height: 5px; }
      .oonmedia-audio .oonmedia-audio-container .oonmedia-controls .oonmedia-playpause {
        flex-shrink: 0; }
      .oonmedia-audio .oonmedia-audio-container .oonmedia-controls .oonmedia-volume-indicator {
        max-width: 20px;
        height: 100%;
        margin: 0px 10px 0px 0px;
        flex-shrink: 0; }
        .oonmedia-audio .oonmedia-audio-container .oonmedia-controls .oonmedia-volume-indicator.oonmedia-hidden {
          display: none; }
        .oonmedia-audio .oonmedia-audio-container .oonmedia-controls .oonmedia-volume-indicator .oonmedia-current-volume {
          position: relative;
          width: 100%;
          height: 100%;
          display: flex;
          align-items: center;
          justify-content: space-around; }
          .oonmedia-audio .oonmedia-audio-container .oonmedia-controls .oonmedia-volume-indicator .oonmedia-current-volume > span {
            display: block;
            width: 2px;
            background-color: #ccc; }
          .oonmedia-audio .oonmedia-audio-container .oonmedia-controls .oonmedia-volume-indicator .oonmedia-current-volume > .volume-bar-25 {
            height: 8px; }
          .oonmedia-audio .oonmedia-audio-container .oonmedia-controls .oonmedia-volume-indicator .oonmedia-current-volume > .volume-bar-50 {
            height: 12px; }
          .oonmedia-audio .oonmedia-audio-container .oonmedia-controls .oonmedia-volume-indicator .oonmedia-current-volume > .volume-bar-75 {
            height: 16px; }
          .oonmedia-audio .oonmedia-audio-container .oonmedia-controls .oonmedia-volume-indicator .oonmedia-current-volume > .volume-bar-100 {
            height: 20px; }
        .oonmedia-audio .oonmedia-audio-container .oonmedia-controls .oonmedia-volume-indicator:focus:not(:hover) .oonmedia-current-volume > .volume-bar-25 {
          left: 8px; }
        .oonmedia-audio .oonmedia-audio-container .oonmedia-controls .oonmedia-volume-indicator:focus:not(:hover) .oonmedia-current-volume > .volume-bar-50 {
          left: 12px; }
        .oonmedia-audio .oonmedia-audio-container .oonmedia-controls .oonmedia-volume-indicator:focus:not(:hover) .oonmedia-current-volume > .volume-bar-75 {
          left: 16px; }
        .oonmedia-audio .oonmedia-audio-container .oonmedia-controls .oonmedia-volume-indicator:focus:not(:hover) .oonmedia-current-volume > .volume-bar-100 {
          left: 20px; }
        .oonmedia-audio .oonmedia-audio-container .oonmedia-controls .oonmedia-volume-indicator[data-state="volume-25"] .volume-bar-25 {
          background: #8297BD; }
        .oonmedia-audio .oonmedia-audio-container .oonmedia-controls .oonmedia-volume-indicator[data-state="volume-50"] .volume-bar-25 {
          background: #8297BD; }
        .oonmedia-audio .oonmedia-audio-container .oonmedia-controls .oonmedia-volume-indicator[data-state="volume-50"] .volume-bar-50 {
          background: #8297BD; }
        .oonmedia-audio .oonmedia-audio-container .oonmedia-controls .oonmedia-volume-indicator[data-state="volume-75"] .volume-bar-25 {
          background: #8297BD; }
        .oonmedia-audio .oonmedia-audio-container .oonmedia-controls .oonmedia-volume-indicator[data-state="volume-75"] .volume-bar-50 {
          background: #8297BD; }
        .oonmedia-audio .oonmedia-audio-container .oonmedia-controls .oonmedia-volume-indicator[data-state="volume-75"] .volume-bar-75 {
          background: #8297BD; }
        .oonmedia-audio .oonmedia-audio-container .oonmedia-controls .oonmedia-volume-indicator[data-state="volume-100"] .volume-bar-25 {
          background: #8297BD; }
        .oonmedia-audio .oonmedia-audio-container .oonmedia-controls .oonmedia-volume-indicator[data-state="volume-100"] .volume-bar-50 {
          background: #8297BD; }
        .oonmedia-audio .oonmedia-audio-container .oonmedia-controls .oonmedia-volume-indicator[data-state="volume-100"] .volume-bar-75 {
          background: #8297BD; }
        .oonmedia-audio .oonmedia-audio-container .oonmedia-controls .oonmedia-volume-indicator[data-state="volume-100"] .volume-bar-100 {
          background: #8297BD; }
      .oonmedia-audio .oonmedia-audio-container .oonmedia-controls .oonmedia-control-alttext {
        position: absolute;
        top: -300rem;
        left: -300 rem;
        width: 1px;
        height: 1px;
        overflow: hidden; }

.oonmedia-video {
  position: relative; }
  .oonmedia-video > .oonmedia-video-container * {
    box-sizing: border-box; }
  .oonmedia-video.oonmedia-placeholder {
    cursor: pointer;
    background-color: #000000;
    background-repeat: no-repeat;
    background-size: 100% 100%; }
  .oonmedia-video .oonmedia-playbutton {
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    text-indent: -300rem;
    border: none;
    border-radius: 0;
    background-color: #323232;
    background-color: rgba(50, 50, 50, 0.6);
    margin: auto;
    width: 8%;
    height: 12%;
    position: absolute;
    right: 5%;
    bottom: 5%;
    padding: 3% 1% 1% 3%;
    background-size: 50% 50%;
    background-repeat: no-repeat;
    background-position: center center;
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEgAAABNCAYAAAAFICL0AAAABmJLR0QA/wD2AACCbnORAAAACXBIWXMAAA3XAAAN1wFCKJt4AAAAB3RJTUUH3ggECR4J+b63nQAAAzFJREFUeNrtnFurFWUch5+fWRR5EYQXCaGUFIQXIRpdiuhHyI/gByjxAHkMT2lkeQDB07V2VZftQBHUQttWKIIIZiZtz23dqXu7/Xmx3gG1NbN1r70OM/N/btfMvPCsF9bDf80Mtr+3PYugOW7wyPZB2++FkeaCMkZs77Y9Lcw0F5QxZHuT7TdCUDE3bC+z/VoIKuay7cW2J4egYs7Z/sS2QlAxv9ieH4LG5kfbs0NQMVlDzQxBxQynhnorBBVzt1IN5faRNdSrIaiYv1JDvRSCijlbyoZy5zlhe15Z/Mi2u7R2H7BUUn8vC5rUxbUXACdTQ70bO6iYEWA/sFrSPyEonyFgB7BR0r8hKJ8bwBbgG0n3Q1A+l4D1wF5JoyEon7PAGkmHQlAxx4EVko6EoLEbaomk36rcQa021K+pod6JHVTMMHAAWCVpIATlcxfYCWyQNBiC8rkObAW2SXoQgvL5E9jQakNVWVDGGWDteBuqDoIyjgHLJR0NQWM31GeSfq9yB7XaUP2poWbEDnq+hlop6WoIyucOsAtYL+lOCMrnGvAV8LWk4RCUz0VgI7AnBBWzeVI4aMpJYKGk5SHoac4Di4CPJPUBTA4nAFwB1gL7JY08+UHdBd0GNgHbJf3X7IC6CroHfAt8Kelm0YF1E/QQ2Ad8Ieny85xQF0EGvqMxlj33IifWQdDhNOb4eTwnV1lQP43ba/pauUgVO+hCapk5rcqp2g4aAFY1a5m6CxqkMZzfIWlooi9eZkEPgG3AVknX27VIGQWNAntpDLcutXuxsgk6ROMvnDOdWrAsgo6mljnW6YV7XdAfwKcT8XNdtQ66mFrmw27K6cUddA34HDiQDc27Ta8IysYPmyXd6qVvrNuCsvHDOkl/9+YcoDtkj3G+3/uDks7zk+25pSmvDoo5ZXtB6bq9A2LOl/plBG0UcyU9ivlyqWcFbRBzOz3M+3olpkwTKOZeehz8TarEBIh5mF4o8DZVpEU5B21/QJUZp5jDtj+mDrygmNOlbJkOCLqQWqZ+t8uMIWYgtcwr1JUcMYOpZaZQd54Rcz+1zFSCpwSNppaZHkb+L+iHeJdrPo8BFRlCtLybEEYAAAAASUVORK5CYII=");
    background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI3MiIgaGVpZ2h0PSI3NyIgcHJlc2VydmVBc3BlY3RSYXRpbz0ieE1pZFlNaWQgbWVldCIgdmlld0JveD0iMCAwIDcyIDc3Ij4KICA8cG9seWdvbiBwb2ludHM9IjAgMCAwIDc3IDcyIDM4LjUiIGZpbGw9JyNmZmZmZmYnIC8+Cjwvc3ZnPgoK"), linear-gradient(transparent, transparent); }
    .oonmedia-video .oonmedia-playbutton::-moz-focus-inner {
      border: 0;
      padding: 0; }
    .oonmedia-video .oonmedia-playbutton:hover {
      outline: none !important;
      cursor: pointer; }
    .oonmedia-video .oonmedia-playbutton:focus {
      background-color: rgba(85, 85, 85, 0.9); }
  .oonmedia-video .oonmedia-geoprotected-message,
  .oonmedia-video .oonmedia-past-message,
  .oonmedia-video .oonmedia-future-message {
    background-color: #323232;
    background-color: rgba(50, 50, 50, 0.6);
    left: 0px;
    bottom: 0px;
    padding: 10px 6px 6px 10px;
    width: calc(100% - 16px);
    position: absolute;
    color: white;
    display: none;
    line-height: 16px; }
    .oonmedia-video .oonmedia-geoprotected-message .oonmedia-geoprotected-info,
    .oonmedia-video .oonmedia-past-message .oonmedia-geoprotected-info,
    .oonmedia-video .oonmedia-future-message .oonmedia-geoprotected-info {
      font-size: 9px;
      letter-spacing: 0px; }
  .oonmedia-video.oonmedia-in-future .oonmedia-future-message {
    display: block; }
  .oonmedia-video.oonmedia-in-future .oonmedia-playbutton {
    display: none; }
  .oonmedia-video.oonmedia-in-past .oonmedia-past-message {
    display: block; }
  .oonmedia-video.oonmedia-in-past .oonmedia-playbutton {
    display: none; }
  .oonmedia-video.oonmedia-is-geoprotected.oonmedia-client-not-austria .oonmedia-geoprotected-message {
    display: block; }
  .oonmedia-video.oonmedia-is-geoprotected.oonmedia-client-not-austria .oonmedia-playbutton {
    display: none; }
  .oonmedia-video video {
    width: 100%;
    height: 100%;
    display: block; }
    .oonmedia-video video::cue {
      font-family: 'ORF ON', Arial, Helvetica, 'Lucida Sans Unicode', 'Lucida Grande', sans-serif;
      padding: 0.125rem 0.5rem;
      box-decoration-break: clone;
      line-height: 1.25; }
  .oonmedia-video .oonmedia-video-container {
    width: 100%;
    height: 100%;
    position: relative;
    overflow: hidden;
    /* fullscreen fixes */
    /* on touch devices do not hide control bar during ad */ }
    .oonmedia-video .oonmedia-video-container :-webkit-full-screen {
      background-color: transparent; }
    .oonmedia-video .oonmedia-video-container[data-fullscreen=true] {
      max-width: 100%;
      width: 100% !important;
      height: auto !important;
      margin: 0;
      padding: 0;
      max-height: 100%;
      /** control sizing if fullscreen **/ }
      .oonmedia-video .oonmedia-video-container[data-fullscreen=true] video::-webkit-media-controls {
        display: none !important; }
      .oonmedia-video .oonmedia-video-container[data-fullscreen=true] video:-webkit-full-screen + .controls {
        background: #ccc; }
      .oonmedia-video .oonmedia-video-container[data-fullscreen=true] video:-webkit-full-screen + .controls progress {
        margin-top: 0.5rem; }
      .oonmedia-video .oonmedia-video-container[data-fullscreen=true] .oonmedia-controls {
        position: absolute;
        bottom: 0px;
        left: 0px;
        z-index: 3; }
    .oonmedia-video .oonmedia-video-container.is-touch-device.is-advertising .oonmedia-controls {
      opacity: 1; }
    .oonmedia-video .oonmedia-video-container.is-advertising .oonmedia-progress {
      pointer-events: none; }
    .oonmedia-video .oonmedia-video-container.is-advertising .oonmedia-controls-wrapper .oonmedia-timecontainer {
      display: none; }
    .oonmedia-video .oonmedia-video-container.is-advertising .oonmedia-controls-wrapper .oonmedia-ad-disclaimer {
      display: block; }
    .oonmedia-video .oonmedia-video-container.is-advertising .oonmedia-controls-wrapper .oonmedia-qualityselect {
      display: none; }
    .oonmedia-video .oonmedia-video-container.is-advertising .oonmedia-segment-markers {
      display: none; }
    .oonmedia-video .oonmedia-video-container.oonmedia-livestream .oonmedia-progress {
      pointer-events: none; }
    .oonmedia-video .oonmedia-video-container.oonmedia-livestream .oonmedia-controls-wrapper .oonmedia-timecontainer {
      display: none; }
    .oonmedia-video .oonmedia-video-container.oonmedia-livestream .oonmedia-controls-wrapper .oonmedia-live-disclaimer {
      display: block; }
    .oonmedia-video .oonmedia-video-container.oonmedia-is-loading .oonmedia-controls-wrapper * {
      display: none; }
    .oonmedia-video .oonmedia-video-container.oonmedia-is-loading .oonmedia-controls-wrapper .oonmedia-loading-disclaimer {
      display: block; }
    .oonmedia-video .oonmedia-video-container.oonmedia-is-error .oonmedia-controls-wrapper *, .oonmedia-video .oonmedia-video-container.oonmedia-is-error.oonmedia-is-loading .oonmedia-controls-wrapper * {
      display: none; }
    .oonmedia-video .oonmedia-video-container.oonmedia-is-error .oonmedia-controls-wrapper .oonmedia-error-disclaimer, .oonmedia-video .oonmedia-video-container.oonmedia-is-error.oonmedia-is-loading .oonmedia-controls-wrapper .oonmedia-error-disclaimer {
      display: block; }
  .oonmedia-video .oonmedia-controls {
    font-family: 'ORF ON TF',Arial,Helvetica,'Lucida Sans Unicode','Lucida Grande',sans-serif;
    background: transparent;
    width: 100%;
    height: 45px;
    position: absolute;
    bottom: 0px;
    background-color: rgba(0, 0, 0, 0.7);
    transition: opacity 250ms;
    margin: 0;
    /* Chrome requires its own rule for this, otherwise it ignores it */ }
    .oonmedia-video .oonmedia-controls[data-state=hidden] {
      opacity: 0;
      pointer-events: none; }
    .oonmedia-video .oonmedia-controls[data-state=visible], .oonmedia-video .oonmedia-controls:focus-within {
      opacity: 1;
      pointer-events: auto; }
    .oonmedia-video .oonmedia-controls.oonmedia-show-volume-progress .oonmedia-controls-wrapper .oonmedia-volume-progress {
      cursor: pointer;
      width: 80px;
      padding: 0px 5px; }
    .oonmedia-video .oonmedia-controls .oonmedia-controls-wrapper.oonmedia-controls-no-audio .oonmedia-volume-indicator {
      display: none; }
    .oonmedia-video .oonmedia-controls .oonmedia-controls-wrapper.oonmedia-controls-no-audio .oonmedia-volume-progress {
      display: none; }
    .oonmedia-video .oonmedia-controls progress {
      position: relative;
      height: 100%;
      width: 100%;
      border: none;
      overflow: hidden;
      display: block;
      /* Internet Explorer uses this value as the progress bar's value colour */
      color: #8297BD;
      -webkit-appearance: none; }
    .oonmedia-video .oonmedia-controls progress::-moz-progress-bar {
      background-color: #8297BD; }
    .oonmedia-video .oonmedia-controls progress::-webkit-progress-value {
      background-color: #8297BD; }
    .oonmedia-video .oonmedia-controls progress::-webkit-progress-bar {
      background-color: white; }
    .oonmedia-video .oonmedia-controls .oonmedia-progress {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      cursor: pointer;
      width: 100%;
      margin: -5px 0px -10px 0px;
      height: 15px;
      padding: 0; }
      .oonmedia-video .oonmedia-controls .oonmedia-progress progress {
        flex: 0 0 100%;
        height: 5px; }
      .oonmedia-video .oonmedia-controls .oonmedia-progress .oonmedia-segment-markers {
        position: absolute;
        width: 100%;
        height: 11px; }
        .oonmedia-video .oonmedia-controls .oonmedia-progress .oonmedia-segment-markers .dot {
          align-items: center;
          width: 11px;
          height: 11px;
          border-radius: 50%;
          background-color: white;
          display: inline-block;
          position: absolute;
          pointer-events: none; }
    .oonmedia-video .oonmedia-controls .oonmedia-qualities {
      display: none;
      position: absolute;
      top: -110px;
      right: 3px;
      font-size: 15px;
      text-align: left;
      padding: 5px;
      color: #8297BD;
      cursor: pointer;
      background-color: rgba(0, 0, 0, 0.7);
      text-align: right; }
      .oonmedia-video .oonmedia-controls .oonmedia-qualities.oonmedia-visible {
        display: block; }
      .oonmedia-video .oonmedia-controls .oonmedia-qualities div[data-oonmedia-quality] {
        clear: both;
        height: 20px;
        margin-bottom: 5px;
        display: none; }
        .oonmedia-video .oonmedia-controls .oonmedia-qualities div[data-oonmedia-quality] .oonmedia-quality-description {
          float: left;
          margin-right: 3px;
          padding-right: 3px; }
        .oonmedia-video .oonmedia-controls .oonmedia-qualities div[data-oonmedia-quality] .oonmedia-quality-datause {
          float: right;
          font-size: 12px;
          line-height: 20px;
          width: 70px;
          color: rgba(255, 255, 255, 0.7);
          text-shadow: 0 1px 0 rgba(0, 0, 0, 0.5); }
        .oonmedia-video .oonmedia-controls .oonmedia-qualities div[data-oonmedia-quality].oonmedia-visible {
          display: block; }
        .oonmedia-video .oonmedia-controls .oonmedia-qualities div[data-oonmedia-quality].oonmedia-active {
          color: white;
          background-color: rgba(100, 100, 100, 0.4); }
        .oonmedia-video .oonmedia-controls .oonmedia-qualities div[data-oonmedia-quality]:hover, .oonmedia-video .oonmedia-controls .oonmedia-qualities div[data-oonmedia-quality]:focus {
          color: white; }
        .oonmedia-video .oonmedia-controls .oonmedia-qualities div[data-oonmedia-quality]:focus {
          outline: 2px solid #f7a207; }
        .oonmedia-video .oonmedia-controls .oonmedia-qualities div[data-oonmedia-quality]:hover:focus, .oonmedia-video .oonmedia-controls .oonmedia-qualities div[data-oonmedia-quality]:active {
          outline: none; }
    .oonmedia-video .oonmedia-controls .oonmedia-controls-wrapper {
      display: flex;
      align-items: center;
      justify-content: flex-start;
      height: 100%;
      padding-top: 5px;
      /**
* buttons
*/ }
      .oonmedia-video .oonmedia-controls .oonmedia-controls-wrapper > * {
        width: 45px;
        height: 100%;
        padding: 0px 5px;
        margin: 0;
        color: #8297BD; }
        .oonmedia-video .oonmedia-controls .oonmedia-controls-wrapper > *:hover {
          color: #B5CEFF; }
        .oonmedia-video .oonmedia-controls .oonmedia-controls-wrapper > *.oonmedia-hidden {
          display: none; }
        .oonmedia-video .oonmedia-controls .oonmedia-controls-wrapper > *.oonmedia-active {
          color: white;
          background-color: rgba(80, 80, 80, 0.8); }
      .oonmedia-video .oonmedia-controls .oonmedia-controls-wrapper > *.oonmedia-controls-right {
        justify-items: flex-end; }
      .oonmedia-video .oonmedia-controls .oonmedia-controls-wrapper > .oonmedia-textcontainer {
        font-size: 12px;
        line-height: 40px;
        color: white;
        position: relative;
        vertical-align: middle;
        text-transform: uppercase; }
      .oonmedia-video .oonmedia-controls .oonmedia-controls-wrapper .oonmedia-error-disclaimer, .oonmedia-video .oonmedia-controls .oonmedia-controls-wrapper .oonmedia-loading-disclaimer {
        display: none;
        width: 100%; }
      .oonmedia-video .oonmedia-controls .oonmedia-controls-wrapper .oonmedia-closed-captions {
        display: none;
        text-transform: uppercase;
        width: 45px;
        font-size: 1.25rem;
        letter-spacing: 0.5px;
        font-weight: bold;
        cursor: pointer; }
        .oonmedia-video .oonmedia-controls .oonmedia-controls-wrapper .oonmedia-closed-captions.oonmedia-visible {
          display: block; }
      .oonmedia-video .oonmedia-controls .oonmedia-controls-wrapper .oonmedia-qualityselect {
        display: none;
        position: relative;
        text-transform: uppercase;
        width: 45px;
        cursor: pointer; }
        .oonmedia-video .oonmedia-controls .oonmedia-controls-wrapper .oonmedia-qualityselect.oonmedia-visible {
          display: block; }
      .oonmedia-video .oonmedia-controls .oonmedia-controls-wrapper .oonmedia-playpause[data-state=play] svg {
        height: 18px; }
      .oonmedia-video .oonmedia-controls .oonmedia-controls-wrapper .oonmedia-ad-disclaimer {
        display: none;
        width: 64px;
        margin-right: auto; }
      .oonmedia-video .oonmedia-controls .oonmedia-controls-wrapper .oonmedia-live-disclaimer {
        display: none;
        margin-right: auto; }
      .oonmedia-video .oonmedia-controls .oonmedia-controls-wrapper button {
        text-align: center;
        white-space: nowrap;
        text-overflow: ellipsis;
        border: none;
        cursor: pointer;
        background: transparent;
        padding: 2px 0; }
      .oonmedia-video .oonmedia-controls .oonmedia-controls-wrapper button:hover > svg, .oonmedia-video .oonmedia-controls .oonmedia-controls-wrapper button:focus > svg {
        color: #B5CEFF; }
      .oonmedia-video .oonmedia-controls .oonmedia-controls-wrapper button:focus {
        padding: 0;
        border: 2px solid #f7a207;
        outline: none; }
      .oonmedia-video .oonmedia-controls .oonmedia-controls-wrapper button:active,
      .oonmedia-video .oonmedia-controls .oonmedia-controls-wrapper button:hover:focus {
        border: 0;
        padding: 2px 0; }
      .oonmedia-video .oonmedia-controls .oonmedia-controls-wrapper button::-moz-focus-inner {
        border: 0;
        padding: 0; }
      .oonmedia-video .oonmedia-controls .oonmedia-controls-wrapper button {
        text-align: center;
        white-space: nowrap;
        text-overflow: ellipsis;
        border: none;
        cursor: pointer;
        background: transparent;
        width: 45px;
        padding: 0;
        margin: 0;
        color: #8297BD; }
      .oonmedia-video .oonmedia-controls .oonmedia-controls-wrapper > button > svg {
        width: 100%;
        height: 20px;
        display: block; }
      .oonmedia-video .oonmedia-controls .oonmedia-controls-wrapper button:hover > svg, .oonmedia-video .oonmedia-controls .oonmedia-controls-wrapper button:focus > svg {
        color: #B5CEFF; }
      .oonmedia-video .oonmedia-controls .oonmedia-controls-wrapper button[data-state="play"] svg use.pause {
        display: block; }
      .oonmedia-video .oonmedia-controls .oonmedia-controls-wrapper button[data-state="play"] svg use.play {
        display: none; }
      .oonmedia-video .oonmedia-controls .oonmedia-controls-wrapper button[data-state="play"] svg use.stop {
        display: none; }
      .oonmedia-video .oonmedia-controls .oonmedia-controls-wrapper button[data-state="pause"] svg use.pause, .oonmedia-video .oonmedia-controls .oonmedia-controls-wrapper button[data-state="stop"] svg use.pause {
        display: none; }
      .oonmedia-video .oonmedia-controls .oonmedia-controls-wrapper button[data-state="pause"] svg use.play, .oonmedia-video .oonmedia-controls .oonmedia-controls-wrapper button[data-state="stop"] svg use.play {
        display: block; }
      .oonmedia-video .oonmedia-controls .oonmedia-controls-wrapper button[data-state="pause"] svg use.stop, .oonmedia-video .oonmedia-controls .oonmedia-controls-wrapper button[data-state="stop"] svg use.stop {
        display: none; }
      .oonmedia-video .oonmedia-controls .oonmedia-controls-wrapper .oonmedia-timecontainer {
        white-space: nowrap;
        font-size: 12px;
        text-transform: uppercase;
        padding: 0 10px;
        transition: width 250ms;
        margin-right: auto; }
        .oonmedia-video .oonmedia-controls .oonmedia-controls-wrapper .oonmedia-timecontainer > * {
          display: inline-block; }
      .oonmedia-video .oonmedia-controls .oonmedia-controls-wrapper .oonmedia-volume-progress {
        height: 20px;
        display: flex;
        align-items: center;
        width: 0px;
        transition: width 250ms; }
        .oonmedia-video .oonmedia-controls .oonmedia-controls-wrapper .oonmedia-volume-progress progress {
          height: 5px; }
      .oonmedia-video .oonmedia-controls .oonmedia-controls-wrapper .oonmedia-playpause {
        flex-shrink: 0; }
      .oonmedia-video .oonmedia-controls .oonmedia-controls-wrapper .oonmedia-volume-indicator {
        max-width: 20px;
        height: 100%;
        margin: 0px 10px 0px 0px;
        flex-shrink: 0; }
        .oonmedia-video .oonmedia-controls .oonmedia-controls-wrapper .oonmedia-volume-indicator.oonmedia-hidden {
          display: none; }
        .oonmedia-video .oonmedia-controls .oonmedia-controls-wrapper .oonmedia-volume-indicator .oonmedia-current-volume {
          position: relative;
          width: 100%;
          height: 100%;
          display: flex;
          align-items: center;
          justify-content: space-around; }
          .oonmedia-video .oonmedia-controls .oonmedia-controls-wrapper .oonmedia-volume-indicator .oonmedia-current-volume > span {
            display: block;
            width: 2px;
            background-color: #ccc; }
          .oonmedia-video .oonmedia-controls .oonmedia-controls-wrapper .oonmedia-volume-indicator .oonmedia-current-volume > .volume-bar-25 {
            height: 8px; }
          .oonmedia-video .oonmedia-controls .oonmedia-controls-wrapper .oonmedia-volume-indicator .oonmedia-current-volume > .volume-bar-50 {
            height: 12px; }
          .oonmedia-video .oonmedia-controls .oonmedia-controls-wrapper .oonmedia-volume-indicator .oonmedia-current-volume > .volume-bar-75 {
            height: 16px; }
          .oonmedia-video .oonmedia-controls .oonmedia-controls-wrapper .oonmedia-volume-indicator .oonmedia-current-volume > .volume-bar-100 {
            height: 20px; }
        .oonmedia-video .oonmedia-controls .oonmedia-controls-wrapper .oonmedia-volume-indicator:focus:not(:hover) .oonmedia-current-volume > .volume-bar-25 {
          left: 8px; }
        .oonmedia-video .oonmedia-controls .oonmedia-controls-wrapper .oonmedia-volume-indicator:focus:not(:hover) .oonmedia-current-volume > .volume-bar-50 {
          left: 12px; }
        .oonmedia-video .oonmedia-controls .oonmedia-controls-wrapper .oonmedia-volume-indicator:focus:not(:hover) .oonmedia-current-volume > .volume-bar-75 {
          left: 16px; }
        .oonmedia-video .oonmedia-controls .oonmedia-controls-wrapper .oonmedia-volume-indicator:focus:not(:hover) .oonmedia-current-volume > .volume-bar-100 {
          left: 20px; }
        .oonmedia-video .oonmedia-controls .oonmedia-controls-wrapper .oonmedia-volume-indicator[data-state="volume-25"] .volume-bar-25 {
          background: #8297BD; }
        .oonmedia-video .oonmedia-controls .oonmedia-controls-wrapper .oonmedia-volume-indicator[data-state="volume-50"] .volume-bar-25 {
          background: #8297BD; }
        .oonmedia-video .oonmedia-controls .oonmedia-controls-wrapper .oonmedia-volume-indicator[data-state="volume-50"] .volume-bar-50 {
          background: #8297BD; }
        .oonmedia-video .oonmedia-controls .oonmedia-controls-wrapper .oonmedia-volume-indicator[data-state="volume-75"] .volume-bar-25 {
          background: #8297BD; }
        .oonmedia-video .oonmedia-controls .oonmedia-controls-wrapper .oonmedia-volume-indicator[data-state="volume-75"] .volume-bar-50 {
          background: #8297BD; }
        .oonmedia-video .oonmedia-controls .oonmedia-controls-wrapper .oonmedia-volume-indicator[data-state="volume-75"] .volume-bar-75 {
          background: #8297BD; }
        .oonmedia-video .oonmedia-controls .oonmedia-controls-wrapper .oonmedia-volume-indicator[data-state="volume-100"] .volume-bar-25 {
          background: #8297BD; }
        .oonmedia-video .oonmedia-controls .oonmedia-controls-wrapper .oonmedia-volume-indicator[data-state="volume-100"] .volume-bar-50 {
          background: #8297BD; }
        .oonmedia-video .oonmedia-controls .oonmedia-controls-wrapper .oonmedia-volume-indicator[data-state="volume-100"] .volume-bar-75 {
          background: #8297BD; }
        .oonmedia-video .oonmedia-controls .oonmedia-controls-wrapper .oonmedia-volume-indicator[data-state="volume-100"] .volume-bar-100 {
          background: #8297BD; }
      .oonmedia-video .oonmedia-controls .oonmedia-controls-wrapper .oonmedia-control-alttext {
        position: absolute;
        top: -300rem;
        left: -300 rem;
        width: 1px;
        height: 1px;
        overflow: hidden; }
    .oonmedia-video .oonmedia-controls .oonmedia-progress progress:focus {
      outline: 2px solid #f7a207; }
    .oonmedia-video .oonmedia-controls .oonmedia-progress progress:active,
    .oonmedia-video .oonmedia-controls .oonmedia-progress progress:hover:focus {
      outline: none; }