/* 
 * 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-zoom-image{
  --zoom-factor-min:0.85;
  --zoom-factor-max:1;
  --zoom-factor-wrapper:var(--zoom-factor-min);
  --zoom-factor-img:calc(var(--zoom-factor-wrapper)*1.4);
  --transition-duration:0ms;
}

.awx-zoom-image.is-active{
    --zoom-factor-wrapper:var(--zoom-factor-max);
    --zoom-factor-img:var(--zoom-factor-max);
    --transition-duration:2000ms;
  }

.awx-zoom-image__inner{
  position:relative;
  box-sizing:border-box;
  width:100%;
  max-width:var(--awx-view-max-width);
  margin:0 auto;
}

.awx-zoom-image__inner > .awx-fullscreen .awx-image,.awx-zoom-image__inner > .awx-fullscreen picture,.awx-zoom-image__inner > .awx-fullscreen picture > img{
    will-change:transform;
    transition:transform var(--transition-duration) var(--awx-ease-in-out);
  }

.awx-zoom-image__inner > .awx-fullscreen .awx-image,.awx-zoom-image__inner > .awx-fullscreen picture{
    overflow:hidden;
    transform:scale3d(var(--zoom-factor-wrapper), var(--zoom-factor-wrapper), var(--zoom-factor-wrapper));
  }

.awx-zoom-image__inner > .awx-fullscreen picture > img{
    transform:scale3d(var(--zoom-factor-img), var(--zoom-factor-img), var(--zoom-factor-img));
  }

.awx-zoom-image__content{
  position:absolute;
  right:var(--awx-sp-v1-5);
  bottom:var(--awx-sp-v1-5);
  left:var(--awx-sp-v1-5);
  margin-bottom:var(--awx-sp-v1-5);
  padding:var(--awx-sp-v1-5) var(--awx-sp-h1-5);
  color:var(--awx-color-text);
  border-radius:var(--awx-border-radius);
  background:var(--awx-white);
  box-shadow:0 0 3em -0.2em var(--awx-color-dominant-shadow);
}

.awx-zoom-image__content  > *:last-child{
    margin-bottom:0;
  }

.awx-zoom-image__title{
  color:var(--awx-color-accent);
}

.awx-zoom-image--light-gray{
  background-color:var(--awx-color-dominant-lighter);
}

.awx-zoom-image--dark{
  color:var(--awx-color-text-light);
  border-top:1px solid var(--awx-color-light-line);
  background-color:var(--awx-color-dominant);
}

@media (min-width: 48em){
  .awx-zoom-image{
    --zoom-factor-min:0.8;
  }

    .awx-zoom-image.is-active{
      --transition-duration:3000ms;
    }

  .awx-zoom-image__content{
    top:var(--awx-sp-v1-5);
    right:auto;
    bottom:auto;
    left:var(--awx-sp-h1-5);
    max-width:28rem;
  }

  .awx-zoom-image__content--right{
    right:var(--awx-sp-h1-5);
    left:auto;
  }
}

@media (min-width: 64em){
  .awx-zoom-image__content{
    top:var(--awx-sp-v3);
    left:var(--awx-sp-h3);
    padding:var(--awx-sp-v3) var(--awx-sp-h3);
  }

  .awx-zoom-image__content--right{
    right:var(--awx-sp-h3);
    left:auto;
  }
}

@media (min-width: 80em){
  .awx-zoom-image__content{
    top:var(--awx-sp-v4);
    left:var(--awx-sp-h5);
  }

  .awx-zoom-image__content--right{
    right:var(--awx-sp-h5);
    left:auto;
  }
}