/* Layout Styles */
.idrviewer-page {
  display: block;
  position: relative;
  overflow: hidden;
  background-color: white;
}

.idrviewer-page[data-visible="true"].idrviewer-page[data-state="unloaded"]:after,
.idrviewer-page[data-visible="true"].idrviewer-page[data-state="loading"]:after,
.idrviewer-page[data-visible="true"].idrviewer-page[data-state="hidden"]:after {
  position: absolute;
  top: 50%;
  left: 50%;
  margin: -12px 0 0 -12px;
  border: 4px solid #bbb;
  border-top: 4px solid #3c9fe1;
  border-radius: 50%;
  width: 20px;
  height: 20px;
  animation: spin 1s linear infinite;
  content: "";
}

.idrviewer-page-inner {
  transform-origin: top left;
}

@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

#idrviewer {
  overflow: auto;
  line-height: 0;
  margin: 0;
  padding: 0;
}

#overlay {
  width: 100%;
  height: 100%;
  position: absolute;
  z-index: 10;
  visibility: hidden;
}

#overlay.panning {
  visibility: visible;
  cursor: grab;
}

#overlay.panning.mousedown {
  cursor: grabbing;
}

/* Highlight Style */
.highlight {
  background-color: #ffff0088;
}

.highlight.selected {
  background-color: #ffa50088;
}

/* Presentation Layout */
.layout-presentation .idrviewer-page {
  visibility: hidden;
  position: absolute;
}
.layout-presentation .idrviewer-page.current {
  visibility: visible !important;
  z-index: 1; /* Fix selection in IE/Edge */
}

/* Continuous Layout */
.layout-continuous .idrviewer-page {
  margin: 0 auto 10px;
}
.layout-continuous .idrviewer-page:last-child {
  margin: 0 auto 0;
}

/* Magazine Layout */
.layout-magazine .idrviewer-page {
  visibility: hidden;
  position: absolute;
}
.layout-magazine .idrviewer-page.current {
  visibility: visible !important;
  z-index: 1; /* Fix selection in IE/Edge */
}

/* Slide Transition */
.layout-presentation.transition-slide .idrviewer-page {
  transition: opacity 0.2s, transform 0.4s;
  opacity: 0;
  visibility: visible !important;
}
.layout-presentation.transition-slide .idrviewer-page.current {
  visibility: visible !important;
  opacity: 1;
}
.layout-presentation.transition-slide .idrviewer-page.after {
  visibility: visible !important;
  transform: translateX(130%);
  transition-delay: 0.1s, 0s;
}
.layout-presentation.transition-slide .idrviewer-page.before {
  visibility: visible !important;
  transform: translateX(-130%);
  transition-delay: 0.1s, 0s;
}
.isR2L.layout-presentation.transition-slide .idrviewer-page.after {
  transform: translateX(-130%);
}
.isR2L.layout-presentation.transition-slide .idrviewer-page.before {
  transform: translateX(130%);
}

/* Fade Transition */
.layout-presentation.transition-fade .idrviewer-page {
  transition: visibility 0.5s, opacity 0.5s;
  opacity: 1;
}
.layout-presentation.transition-fade .idrviewer-page.prev,
.layout-presentation.transition-fade .idrviewer-page.next {
  opacity: 0;
  z-index: 2;
}

/* Flip Transition */
.layout-presentation.transition-flip > div > div {
  transform-style: preserve-3d;
  perspective: 1000px;
}
.layout-presentation.transition-flip .idrviewer-page {
  transition: transform 0.5s;
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
}
.layout-presentation.transition-flip .idrviewer-page.before {
  transform: rotateY(-180deg);
}
.layout-presentation.transition-flip .idrviewer-page.after {
  transform: rotateY(180deg);
}
.layout-presentation.transition-flip .next,
.layout-presentation.transition-flip .prev {
  visibility: visible;
}

/* Throw Transition */
.layout-presentation.transition-throw .idrviewer-page {
  opacity: 0;
  transition: transform 0.5s, opacity 0.5s;
  transition-timing-function: ease-out;
}
.layout-presentation.transition-throw .idrviewer-page.current {
  visibility: visible !important;
  z-index: 3;
  opacity: 1;
}
.layout-presentation.transition-throw .idrviewer-page.prev {
  visibility: visible !important;
  opacity: 0;
  z-index: 4;
}
.layout-presentation.transition-throw .idrviewer-page.prev:nth-child(even) {
  transform: translate(100%, -100%) rotate(240deg);
}
.layout-presentation.transition-throw .idrviewer-page.prev:nth-child(odd) {
  transform: translate(-100%, -100%) rotate(-240deg);
}
.layout-presentation.transition-throw .idrviewer-page.next {
  visibility: visible !important;
  transform: none;
  opacity: 1;
  z-index: 2;
}

/* Magazine Transition */
.layout-magazine.transition-magazine > div > div {
  transform-style: preserve-3d;
  perspective: 3000px;
}
.layout-magazine.transition-magazine .idrviewer-page {
  transition: transform 0.5s;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}
:not(.isR2L).layout-magazine.transition-magazine .idrviewer-page:nth-child(odd),
.isR2L.layout-magazine.transition-magazine .idrviewer-page:nth-child(even) {
  transform-origin: left top 0;
}
:not(.isR2L).layout-magazine.transition-magazine
  .idrviewer-page:nth-child(even),
.isR2L.layout-magazine.transition-magazine .idrviewer-page:nth-child(odd) {
  transform-origin: right top 0;
}
.layout-magazine.transition-magazine .idrviewer-page.current,
:not(.isR2L).layout-magazine.transition-magazine
  .idrviewer-page.prev:nth-child(even),
:not(.isR2L).layout-magazine.transition-magazine
  .idrviewer-page.next:nth-child(odd),
:not(.isR2L).layout-magazine.transition-magazine
  .idrviewer-page.before:nth-child(even),
:not(.isR2L).layout-magazine.transition-magazine
  .idrviewer-page.after:nth-child(odd),
.isR2L.layout-magazine.transition-magazine .idrviewer-page.next:nth-child(odd),
.isR2L.layout-magazine.transition-magazine .idrviewer-page.prev:nth-child(even),
.isR2L.layout-magazine.transition-magazine .idrviewer-page.after:nth-child(odd),
.isR2L.layout-magazine.transition-magazine
  .idrviewer-page.before:nth-child(even) {
  transform: none !important;
}

:not(.isR2L).layout-magazine.transition-magazine
  .idrviewer-page.before:nth-child(odd),
:not(.isR2L).layout-magazine.transition-magazine
  .idrviewer-page.prev:nth-child(odd),
.isR2L.layout-magazine.transition-magazine
  .idrviewer-page.after:nth-child(even),
.isR2L.layout-magazine.transition-magazine
  .idrviewer-page.next:nth-child(even) {
  transform: rotateY(-180deg);
  z-index: 3;
}

:not(.isR2L).layout-magazine.transition-magazine
  .idrviewer-page.after:nth-child(even),
:not(.isR2L).layout-magazine.transition-magazine
  .idrviewer-page.next:nth-child(even),
.isR2L.layout-magazine.transition-magazine
  .idrviewer-page.before:nth-child(odd),
.isR2L.layout-magazine.transition-magazine .idrviewer-page.prev:nth-child(odd) {
  transform: rotateY(180deg);
  z-index: 3;
}

.layout-magazine.transition-magazine .idrviewer-page.prev,
.layout-magazine.transition-magazine .idrviewer-page.next {
  visibility: visible;
}
.layout-magazine.transition-magazine .idrviewer-page.current {
  z-index: 2;
}