.page.ThemePageLightbox {
  position: fixed;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 7;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  --modalHeight: 100vh;
  --modalWidth: 100vw;
}
.page.ThemePageLightbox > .pageSidebar {
  background-color: var(--colorTextAlt);
  height: var(--modalHeight);
  width: var(--modalWidth);
  transition: var(--speedFF) width ease, var(--speedFF) padding-left ease, var(--speedFF) padding-right ease;
  padding: var(--sizeXL) var(--sizeL);
  overflow: auto;
  border-radius: var(--sizeS) 0 0 var(--sizeS);
}
.page.ThemePageLightbox > .pageSidebar:empty {
  width: 0px;
  padding: 0px;
}
.page.ThemePageLightbox > .pageSidebar:not(:empty) + .pageWrapper {
  border-radius: 0 var(--sizeS) var(--sizeS) 0;
  width: calc(var(--modalWidth) * 1.4);
  border-left: var(--sizeXXS) solid var(--colorShadow);
}
.page.ThemePageLightbox > .pageWrapper {
  background-color: var(--colorShadowDarker);
  height: var(--modalHeight);
  display: flex;
  flex-direction: column;
  width: var(--modalWidth);
  max-width: 100vw;
  transition: var(--speedFF) width ease;
  overflow: hidden;
  font-size: var(--fontM);
  animation-duration: var(--speedFF, 200ms);
  animation-fill-mode: both;
  animation-duration: var(--speedFF, 200ms);
  animation-fill-mode: both;
}
.page.ThemePageLightbox > .pageWrapper[data-animation=in] {
  animation-name: zoomIn;
}
.page.ThemePageLightbox > .pageWrapper[data-animation=out] {
  animation-name: zoomOut;
}
.page.ThemePageLightbox > .pageWrapper > .pageHeader {
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: var(--colorPrimaryAlt);
  padding: var(--sizeM) var(--sizeL);
}
.page.ThemePageLightbox > .pageWrapper > .pageHeader > .button:first-child:last-child {
  margin-left: auto;
}
.page.ThemePageLightbox > .pageWrapper > .pageSubHeader {
  display: flex;
  background-color: var(--colorPrimary);
  padding: 0 var(--sizeM);
}
.page.ThemePageLightbox > .pageWrapper > .pageContent {
  overflow: hidden;
  height: 100%;
}
.page.ThemePageLightbox > .pageWrapper > .pageContent > embed, .page.ThemePageLightbox > .pageWrapper > .pageContent > iframe {
  width: 100%;
  height: 100%;
  border: none;
}
.page.ThemePageLightbox > .pageWrapper > .pageFooter {
  display: flex;
  padding: var(--sizeM) var(--sizeL);
  align-items: center;
  justify-content: flex-end;
  border-top: var(--sizeXXS) solid var(--colorShadow);
}