/* 
 * DO NOT EDIT THIS FILE.
 * The Airbus Web Experience use PostCSS to compile CSS
 * the same way as in the Drupal core except it use the .pcss extension.
 * Therefore, you are supposed to edit the pcss file of the same name.
 */

.awx-media--video,
.awx-media--embed-video,
.awx-media--keepicker-video{
  width:100%;
  max-width:61.75rem;
  margin:0 auto;
}

.awx-video-container{
  margin:0;
  padding:0;
}

.awx-video-container--decoration{
  max-width:100%;
  max-height:100%;
  margin:0;
  padding:0;
}

.awx-video__player{
  --control-bar-height:3rem;
  --play-button-size:4rem;

  position:relative;
  overflow:hidden;
  width:100%;
  height:auto;
  margin:0;
  transition:all 300ms var(--awx-ease-in-out);
  color:var(--awx-white);
  border-radius:var(--awx-border-radius);
  background-color:var(--awx-color-dominant-darker);
  box-shadow:0 0 3em -0.2em var(--awx-color-dominant-shadow);
}

.awx-video__player .vjs-big-play-button{
    z-index:2;
    width:var(--play-button-size);
    height:var(--play-button-size);
    margin-top:calc(var(--play-button-size)/2*-1);
    margin-left:calc(var(--play-button-size)/2*-1);
    transition:all 300ms var(--awx-ease-in-out);
    color:var(--awx-color-accent);
    border:none;
    border-radius:calc(var(--play-button-size)/2);
    background-color:var(--awx-white);
    box-shadow:0 0 0.5em -0.2em var(--awx-color-dominant-shadow);
    font-size:calc(var(--play-button-size)/2);
    line-height:var(--play-button-size);
  }

.awx-video__player:hover .vjs-big-play-button,.awx-video__player .vjs-big-play-button:focus{
    transition:all 300ms var(--awx-ease-in-out);
    transform:scale(1.05);
    background-color:var(--awx-white);
  }

.awx-video__player .vjs-big-play-button:active{
    transform:scale(0.95);
  }

.awx-video__player .vjs-menu-button-popup .vjs-menu .vjs-menu-content{
    background:var(--awx-color-accent-faded);
  }

.awx-video__player .vjs-menu-button-popup .vjs-menu{
    margin-bottom:calc(var(--control-bar-height) - 1rem);
  }

.awx-video__player .vjs-hover.vjs-menu-button-popup{
    background:var(--awx-color-accent-faded);
  }

.awx-video__player .vjs-text-track-display{
    bottom:var(--control-bar-height);
  }

.awx-video__player .vjs-menu li{
    padding:0.4rem;
  }

.awx-video__player .vjs-menu li.vjs-menu-item:focus,.awx-video__player .vjs-menu li.vjs-menu-item:hover,.awx-video__player .js-focus-visible .vjs-menu li.vjs-menu-item:hover{
    background:var(--awx-color-accent-faded);
  }

.awx-video__player .vjs-control-bar{
    height:var(--control-bar-height);
    background:linear-gradient(0deg, var(--awx-color-dominant) 15%, var(--awx-color-dominant-transparent) 100%);
    background-blend-mode:multiply;
  }

.awx-video__player .vjs-volume-bar{
    margin:calc(var(--control-bar-height)/2 - 0.15rem) 0.45em;
  }

.awx-video__player .vjs-button > .vjs-icon-placeholder:before,.awx-video__player .vjs-playback-rate .vjs-playback-rate-value{
    font-size:1.5rem;
    line-height:var(--control-bar-height);
  }

.awx-video__player .vjs-playback-rate .vjs-playback-rate-value{
    text-shadow:0 1px 0 var(--awx-color-dominant);
    font-size:1rem;
  }

.awx-video__player .vjs-volume-level,.awx-video__player .vjs-play-progress,.awx-video__player .vjs-slider-bar{
    background:var(--awx-white-refined);
  }

.awx-video__player .vjs-menu li.vjs-selected,.awx-video__player .vjs-menu li.vjs-selected:focus,.awx-video__player .vjs-menu li.vjs-selected:hover,.awx-video__player .js-focus-visible .vjs-menu li.vjs-selected:hover{
    color:var(--awx-white);
    background-color:var(--awx-color-accent-active);
  }

.awx-video__player .vjs-remaining-time-display{
    line-height:var(--control-bar-height);
  }

.awx-video__player .vjs-modal-dialog-content select{
      height:auto;
      padding:4px 20px 4px 6px;
      border-radius:var(--awx-border-radius);
      background-position-x:98%;
    }

.awx-video__player .vjs-track-settings-controls button{
    padding:0 var(--awx-sp-h) var(--awx-sp-v0-25);
    cursor:pointer;
    transition:color 200ms, background-color 200ms;
    color:var(--awx-button-color-text) !important;
    border-radius:var(--awx-border-radius);
    background-color:var(--awx-button-color);
    background-image:none;
    font-size:0.875rem;
    font-weight:700;
    line-height:var(--awx-sp-v2);
    -webkit-appearance:none;
    -moz-appearance:none;
    appearance:none;
    -webkit-font-smoothing:antialiased;
  }

.awx-video__player .vjs-track-settings-controls button:focus-visible{
      color:var(--awx-button-color-text-hover);
      background-color:var(--awx-button-color-hover);
    }

.awx-video__player .vjs-track-settings-controls button:hover,.awx-video__player .vjs-track-settings-controls button:focus{
      color:var(--awx-button-color-text-hover);
      background-color:var(--awx-button-color-hover);
    }

.awx-video__player .vjs-track-settings-controls button:active{
      color:var(--awx-button-color-text-active);
      border-color:var(--awx-button-color-border-active);
    }

.awx-video__player div.vjs-poster::after{
    position:absolute;
    z-index:1;
    top:0;
    right:0;
    bottom:0;
    left:0;
    display:block;
    content:"";
    opacity:0.5;
    background-color:var(--awx-color-dominant);
    background-image:none;
  }

.awx-video__player .vjs-poster img{
    transition:transform 1s var(--awx-ease-in-out);
    animation:fade-in 200ms var(--awx-ease-in-out);
  }

.awx-video__player:active .vjs-poster img{
      transform:scale3d(1.1, 1.1, 1.1);
    }

.awx-video__player:hover .vjs-poster img,.awx-video__player:focus .vjs-poster img{
      transform:scale3d(1.1, 1.1, 1.1);
    }

.awx-video__player .vjs-tech{
    max-height:100%;
  }

.awx-video__player .vjs-tech[poster]{
    -o-object-fit:contain;
    object-fit:contain;
  }

.awx-video__player--16-9{
  aspect-ratio:16/9;
}

.awx-video__player--4-3{
  aspect-ratio:4/3;
}

.awx-video__player--3-2{
  aspect-ratio:3/2;
}
.awx-video__player--decoration{
  height:100%;
  margin:0;
}
.awx-video__player--decoration .vjs-tech[poster]{
    -o-object-fit:cover;
    object-fit:cover;
  }
.awx-video__player--decoration .vjs-poster{
    display:none !important;
  }

.awx-video__player--controls{
  position:absolute;
  z-index:12;
  right:var(--awx-sp-h2);
  bottom:var(--awx-sp-v);
  width:auto !important;
  height:auto !important;
}

.awx-video__player--controls .is-hidden{
    display:none;
  }

@media (min-width: 48em){
  .awx-video__player{
    padding-top:56.25% !important;
  }

  .awx-video__player--decoration{
    padding-top:0 !important;
  }
}

@media (min-width: 64em){
  .awx-video__player--controls{
    right:auto;
    left:var(--awx-sp-h2);
  }
}

.media-oembed-content{
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:16/9;
}

.awx-video__player--full{
  border-bottom-right-radius:0;
  border-bottom-left-radius:0;
}
.js video:not(.vjs-tech){
  transition:opacity 1s var(--awx-ease-in-out);
  pointer-events:none;
  opacity:0.1;
}
.js video.awx-video__player--decoration:not(.vjs-tech){
    opacity:1;
  }

.js video.vjs-tech{
  pointer-events:auto;
  opacity:1;
}

