:root {
  --navbar-height: 49px;
  --page-padding: 24px;
}

html,
body,
#root {
  font-family: 'Atlas Grotesk';
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100%;
}

/**
 * This file includes font declarations that are used in DIG 2.0.
 *
 * Desktop client only requires TrueType fonts so we don't need to include alternative file types
 */

/**
 * Font: Atlas Grotesk
 * Consumed by: dig-components, spectrum-cl
 */
@font-face {
  font-family: 'Atlas Grotesk';
  src: url('/fonts/atlas_grotesk/AtlasGrotesk-Regular-Web.ttf') format('truetype');
  font-weight: 300 400;
  font-style: normal;
}

@font-face {
  font-family: 'Atlas Grotesk';
  src: url('/fonts/atlas_grotesk/AtlasGrotesk-RegularItalic-Web.ttf') format('truetype');
  font-weight: 300 400;
  font-style: italic;
}

/*
 * Supply range for Medium font declarations to avoid the browser's
 * synthetic bold, and thus preventing misusage.
 */

@font-face {
  font-family: 'Atlas Grotesk';
  src: url('/fonts/atlas_grotesk/AtlasGrotesk-Medium-Web.ttf') format('truetype');
  font-weight: 500 700;
  font-style: normal;
}

@font-face {
  font-family: 'Atlas Grotesk';
  src: url('/fonts/atlas_grotesk/AtlasGrotesk-MediumItalic-Web.ttf') format('truetype');
  font-weight: 500 700;
  font-style: italic;
}

/**
 * Font: Sharp Grotesk
 * Consumed by: dig-components, spectrum-cl
 */
@font-face {
  font-family: 'Sharp Grotesk';
  src: url('/fonts/sharp_grotesk_db/SharpGroteskDBBook20.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: 'Sharp Grotesk';
  src: url('/fonts/sharp_grotesk_db/SharpGroteskDBBookItalic20.ttf') format('truetype');
  font-weight: 400;
  font-style: italic;
}

@font-face {
  font-family: 'Sharp Grotesk';
  src: url('/fonts/sharp_grotesk_db/SharpGroteskDBMedium20.ttf') format('truetype');
  font-weight: 500;
  font-style: normal;
}

@font-face {
  font-family: 'Sharp Grotesk';
  src: url('/fonts/sharp_grotesk_db/SharpGroteskDBMediumItalic20.ttf') format('truetype');
  font-weight: 500;
  font-style: italic;
}

/**
 * Sharp Grotesk 23 is not a sanctioned DIG font. Usage is solely approved for logged out web. If you find
 * yourself needing Sharp Grotesk 23 for any other purpose, please consult #design-systems.
 */

/**
 * Font: Sharp Grotesk 23 (Cyrillic supported)
 */
@font-face {
  font-family: 'Sharp Grotesk 23';
  src: url('/fonts/sharp_grotesk_23/SharpGroteskDBCyrBook23.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
}
@font-face {
  font-family: 'Sharp Grotesk 23';
  src: url('/fonts/sharp_grotesk_23/SharpGroteskDBCyrBookItalic23.ttf') format('truetype');
  font-weight: 400;
  font-style: italic;
}

.Ux\+r9lSwg18Av\+fRxiFk2w\=\= {
  background: var(--dig-color__background__base);
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
  width: 100%;
}

/* 
    This file is to overide default stiles from video-js
    read more here: https://videojs.com/guides/skins/
    styles should be prefixed by '.vjs-capture'
*/

/* Dont show captions when big play button is showing */
.vjs-capture:not(.vjs-has-started) .vjs-text-track-display {
  display: none;
}

.vjs-capture .vjs-text-track-display > div {
  /* cc holder covers whole screen with space at the bottom */
  position: absolute;
  width: 100%;
  height: 100%;
  display: table;
  margin: 0 !important;
  padding-bottom: 15px;
}

.vjs-capture .vjs-text-track-display > div > div {
  /* lock cc to bottom */
  display: table-cell;
  vertical-align: bottom;
  position: static !important;
  height: auto !important;
}

.vjs-capture .vjs-text-track-display > div > div > div {
  /* Closed Captions */
  /* selectors used because of vjs https://github.com/videojs/video.js/issues/4852#issuecomment-419723313 */
  font: 18px 'Atlas Grotesk';
  display: inline !important;
  color: var(--dig-color__secondary__surface) !important;
  background: var(--dig-color__text__subtle) !important;
  max-height: 74px;
  line-height: 38px;
  position: relative !important;
  padding: 10px 10px;
  height: auto;
  z-index: 1;
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
}