.duet-overlay {
  position: fixed;
  top: 0;
  left: 0;
  display: block;
  visibility: visible;
  width: 100%;
  height: 100%;
  background: rgb(8, 42, 77);
  opacity: 0.3;
}
.duet-overlay.duet-theme-turva {
  background: rgb(23, 28, 58);
}
.duet-overlay.keep-stacking-context {
  position: absolute;
  top: unset;
  left: unset;
  z-index: unset !important;
}
.duet-overlay.modal-overlay {
  z-index: -1;
}
.duet-overlay.hidden {
  visibility: hidden;
  opacity: 0;
}
.duet-overlay.dark {
  opacity: 0.85;
}
.duet-overlay.white {
  background: rgb(255, 255, 255);
  opacity: 0.9;
}
.duet-overlay.white.duet-theme-turva {
  background: rgb(255, 255, 255);
}
.duet-overlay.display-x-small {
  display: none;
}
@media (max-width: 35.9375em) {
  .duet-overlay.display-x-small {
    display: block;
  }
}
.duet-overlay.display-x-small.not {
  display: block;
}
@media (max-width: 35.9375em) {
  .duet-overlay.display-x-small.not {
    display: none;
  }
}
.duet-overlay.display-small {
  display: none;
}
@media (min-width: 36em) {
  .duet-overlay.display-small {
    display: block;
  }
}
.duet-overlay.display-small.not {
  display: block;
}
@media (min-width: 36em) {
  .duet-overlay.display-small.not {
    display: none;
  }
}
.duet-overlay.display-medium {
  display: none;
}
@media (min-width: 48em) {
  .duet-overlay.display-medium {
    display: block;
  }
}
.duet-overlay.display-medium.not {
  display: block;
}
@media (min-width: 48em) {
  .duet-overlay.display-medium.not {
    display: none;
  }
}
.duet-overlay.display-large {
  display: none;
}
@media (min-width: 62em) {
  .duet-overlay.display-large {
    display: block;
  }
}
.duet-overlay.display-large.not {
  display: block;
}
@media (min-width: 62em) {
  .duet-overlay.display-large.not {
    display: none;
  }
}
.duet-overlay.transition-slowly {
  transition: 600ms ease;
}
.duet-overlay.transition-quickly {
  transition: 300ms ease;
}

:host(.duet-theme-turva2) .duet-overlay.duet-theme-turva {
  background: rgb(23, 42, 59);
}