/*
 MATRIXALIGNER MAIN
 ECOSYSTEM STACKED BANNER DECK

 Approved geometry:
 - full viewport width
 - 8:3 ratio
 - full image
 - one slide visible
 - no counter
*/

.matrixaligner-main-deck{
  position:relative !important;

  width:100vw !important;
  max-width:none !important;

  aspect-ratio:8 / 3 !important;

  height:auto !important;
  min-height:0 !important;
  max-height:none !important;

  margin:0 0 10px
    calc(50% - 50vw) !important;

  padding:0 !important;

  overflow:hidden !important;

  background:#050505 !important;

  border:0 !important;
  border-radius:0 !important;
}


.matrixaligner-main-deck-slide{
  position:absolute !important;

  inset:0 !important;

  width:100% !important;
  height:100% !important;

  margin:0 !important;
  padding:0 !important;

  opacity:0;

  pointer-events:none;

  transition:
    opacity .55s ease;

  background:#050505;
}


.matrixaligner-main-deck-slide.is-active{
  opacity:1 !important;
  pointer-events:auto;

  z-index:2;
}


.matrixaligner-main-deck-slide img{
  position:absolute !important;

  inset:0 !important;

  width:100% !important;
  height:100% !important;

  max-width:none !important;
  max-height:none !important;

  object-fit:contain !important;
  object-position:center center !important;

  display:block !important;

  margin:0 !important;
  padding:0 !important;

  border:0 !important;
  border-radius:0 !important;

  background:#050505 !important;
}


@media (max-width:900px){

  .matrixaligner-main-deck{
    aspect-ratio:8 / 3 !important;
  }

}


@media (max-width:520px){

  .matrixaligner-main-deck{
    aspect-ratio:8 / 3 !important;
  }

}


@media (prefers-reduced-motion:reduce){

  .matrixaligner-main-deck-slide{
    transition:none !important;
  }

}