:root {
  --np-mask-svg: url('data:image/svg+xml;utf8, <svg width="10" height="10" viewBox="0 0 10 10" fill="none" xmlns="http://www.w3.org/2000/svg"></svg>');
  --np-mask-width: 100px;
  --np-mask-height: 100px;
}

body {
  margin: 0px;
  padding: 0px;
  overflow: hidden;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-x: none;
  overscroll-behavior-y: none;
  touch-action: pan-y, pan-x;
}

#main-window {
  position: absolute;
  top: 0px;
  left: 0px;
  right: 0px;
  bottom: 0px;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  -webkit-user-drag: none;
}

/*
* Cannot directly apply to div and iframe as the audio view also containts div, it would make it error
*/
#main-window,
#audio-view,
.core-view .ebook-toolbar,
.visible-view,
.visible-view div {
  display: inline;
  visibility: visible;
  z-index: 0;
}

#main-window[data-visible=false],
#audio-view[data-visible=false],
.core-view .ebook-toolbar[data-visible=false],
.visible-view[data-visible=false],
.visible-view div[data-visible=false] {
  display: none;
  visibility: hidden;
  z-index: -50;
}

#window-dialog[data-visible=true] {
  z-index: 1200;
}

#window-dialog[data-visible=false] {
  z-index: -50;
}

.core-view .ebook-main-frame,
.core-view .ebook-split-main-frame,
.core-view .ebook-text-search-frame,
.core-view .ebook-split-text-search-frame,
.core-view .ebook-tools-frame,
.core-view .ebook-split-tools-frame {
  display: inline;
  visibility: visible;
  z-index: 0;
}

.core-view .ebook-main-frame[data-visible=false],
.core-view .ebook-split-main-frame[data-visible=false],
.core-view .ebook-text-search-frame[data-visible=false],
.core-view .ebook-split-text-search-frame[data-visible=false],
.core-view .ebook-tools-frame[data-visible=false],
.core-view .ebook-split-tools-frame[data-visible=false] {
  display: inline;
  visibility: hidden;
  z-index: -50;
}

.full-screen {
  position: absolute;
  top: 0px;
  left: 0px;
  right: 0px;
  bottom: 0px;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  -webkit-user-drag: none;
}

.full-screen iframe {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  border: 0px;
  margin: 0px;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  -webkit-user-drag: none;
}

#nativeRequest,
#nativeRespond {
  position: absolute;
  display: none;
}

.ebook-frame {
  background-color: #CCCCCC;
  overflow: hidden;
}

.ebook-frame[data-whiteBg=true] {
  background-color: #FFFFFF;
}

.white-bg {
  background-color: #FFFFFF;
}

.core-view .ebook-toolbar-bg {
  position: absolute;
  top: auto;
  left: auto;
  bottom: 0px;
  right: 0px;
  width: 100%;
  height: 36px;
  background-color: #FFFFFF;
}

.core-view .ebook-toolbar {
  position: absolute;
  top: auto;
  left: auto;
  bottom: 0px;
  right: 0px;
  width: 100%;
  height: 36px;
  background-color: transparent;
}

.core-view .ebook-split-main-frame {
  position: absolute;
  top: auto;
  left: auto;
  bottom: 36px;
  right: 0px;
  width: 100%;
  height: 100%;
}

.core-view .ebk-slider-hori {
  position: absolute;
  top: 50%;
  margin-top: -26px;
  left: 0px;
  width: 60px;
  height: 52px;
}
.core-view .ebk-slider-hori .close {
  position: absolute;
  top: 0px;
  left: 50%;
  margin-left: -10px;
  width: 20px;
  height: 20px;
  background-image: url(../images/APP/split-close.svg);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  cursor: pointer;
}
.core-view .ebk-slider-hori .move-indicator {
  position: absolute;
  top: 20px;
  left: 20px;
  width: 20px;
  height: 32px;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  background-image: url(../images/APP/slider-hori.svg);
  cursor: ew-resize;
}
.core-view .ebk-slider-hori .left-indicator {
  position: absolute;
  top: 20px;
  left: 0px;
  width: 20px;
  height: 32px;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  background-image: url(../images/APP/split-inactive-hori.svg);
  cursor: pointer;
}
.core-view .ebk-slider-hori .right-indicator {
  position: absolute;
  top: 20px;
  right: 0px;
  width: 20px;
  height: 32px;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  background-image: url(../images/APP/split-inactive-hori.svg);
  cursor: pointer;
}
.core-view .ebk-slider-hori[data-active=main] .left-indicator {
  background-image: url(../images/APP/split-active-hori.svg);
}
.core-view .ebk-slider-hori[data-active=main] .right-indicator {
  background-image: url(../images/APP/split-inactive-hori.svg);
}
.core-view .ebk-slider-hori[data-active=split] .left-indicator {
  background-image: url(../images/APP/split-inactive-hori.svg);
}
.core-view .ebk-slider-hori[data-active=split] .right-indicator {
  background-image: url(../images/APP/split-active-hori.svg);
}
.core-view .ebk-slider-vert {
  position: absolute;
  top: 0px;
  left: 50%;
  margin-left: -26px;
  width: 52px;
  height: 60px;
}
.core-view .ebk-slider-vert .close {
  position: absolute;
  top: 50%;
  right: 0px;
  margin-top: -10px;
  width: 20px;
  height: 20px;
  background-image: url(../images/APP/split-close.svg);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  cursor: pointer;
}
.core-view .ebk-slider-vert .move-indicator {
  position: absolute;
  top: 20px;
  left: 0px;
  width: 32px;
  height: 20px;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  background-image: url(../images/APP/slider-vert.svg);
  cursor: ns-resize;
}
.core-view .ebk-slider-vert .left-indicator {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 32px;
  height: 20px;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  background-image: url(../images/APP/split-inactive-vert.svg);
  cursor: pointer;
}
.core-view .ebk-slider-vert .right-indicator {
  position: absolute;
  left: 0px;
  bottom: 0px;
  width: 32px;
  height: 20px;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  background-image: url(../images/APP/split-inactive-vert.svg);
  cursor: pointer;
}
.core-view .ebk-slider-vert[data-active=main] .left-indicator {
  background-image: url(../images/APP/split-active-vert.svg);
}
.core-view .ebk-slider-vert[data-active=main] .right-indicator {
  background-image: url(../images/APP/split-inactive-vert.svg);
}
.core-view .ebk-slider-vert[data-active=split] .left-indicator {
  background-image: url(../images/APP/split-inactive-vert.svg);
}
.core-view .ebk-slider-vert[data-active=split] .right-indicator {
  background-image: url(../images/APP/split-active-vert.svg);
}
.core-view .np-save-dialog {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  font-family: "Arial", "Microsoft JhengHei", sans-serif;
  overflow: hidden;
}
.core-view .np-save-dialog div {
  box-sizing: content-box;
}
.core-view .np-save-dialog .shadow {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  background: darkgray;
  opacity: 0.6;
}
.core-view .np-save-dialog .dialog {
  position: absolute;
  top: 50%;
  left: 50%;
  margin-top: -93px;
  margin-left: -300px;
  width: 600px;
  height: 186px;
  border: 1px solid #000000;
  border-radius: 8px;
  background-color: #FFFFFF;
}
.core-view .np-save-dialog .dialog .close {
  position: absolute;
  top: 7px;
  right: 7px;
  width: 30px;
  height: 30px;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  background-image: url(../images/APP/np-close.svg);
  cursor: pointer;
}
.core-view .np-save-dialog .dialog .title {
  position: absolute;
  top: 36px;
  left: 39px;
  right: 39px;
  height: 30px;
  text-align: center;
  font-size: 24px;
  font-weight: bold;
  color: #2E479E;
  line-height: 28px;
}
.core-view .np-save-dialog .dialog .content-block {
  position: absolute;
  top: 65px;
  left: 39px;
  right: 39px;
  height: 60px;
}
.core-view .np-save-dialog .dialog .content-block .title-input {
  position: absolute;
  top: 10px;
  left: 0px;
  width: 100%;
  font-size: 16px;
  line-height: 18px;
  height: 20px;
  color: #323232;
  border: 0;
  padding-left: 5px;
}
.core-view .np-save-dialog .dialog .content-block .separator {
  position: absolute;
  top: 34px;
  left: 0px;
  width: 100%;
  height: 0px;
  border-top: 1px solid #333333;
}
.core-view .np-save-dialog .dialog .content-block .title-hints {
  position: absolute;
  top: 37px;
  left: 0px;
  height: 0px;
  font-size: 14px;
  line-height: 16px;
  color: #1C77AC;
}
.core-view .np-save-dialog .dialog .content-block .char-hints {
  position: absolute;
  top: 38px;
  right: 0px;
  height: 0px;
  font-size: 12px;
  line-height: 14px;
  color: #747474;
}
.core-view .np-save-dialog .dialog .save-on {
  position: absolute;
  top: 132px;
  left: 39px;
  height: 20px;
  font-size: 16px;
  line-height: 18px;
  color: #323232;
}
.core-view .np-save-dialog .dialog .save-on-cb {
  position: absolute;
  top: 128px;
  left: 108px;
  width: 83px;
  height: 24px;
  font-size: 16px;
  line-height: 18px;
  color: #323232;
}
.core-view .np-save-dialog .dialog .button-list {
  position: absolute;
  top: 133px;
  right: 10px;
  text-align: right;
}
.core-view .np-save-dialog .dialog .button-list .button {
  position: relative;
  width: 76px;
  height: 18px;
  border-radius: 8px;
  padding: 6px 0px 6px 0px;
  text-align: center;
  font-size: 16px;
  line-height: 20px;
  display: inline-block;
  cursor: pointer;
}
.core-view .np-save-dialog .dialog .button-list .save-btn {
  background-color: #0262A3;
  color: #FFFFFF;
  border: 1px solid #0262A3;
}
.core-view .np-save-dialog .dialog .button-list .save-as-btn {
  background-color: #04B2D9;
  color: #FFFFFF;
  border: 1px solid #04B2D9;
}
.core-view .np-save-dialog .dialog .button-list .cancel-btn {
  color: #04B2D9;
  border: 1px solid #04B2D9;
}
.core-view .np-save-dialog .dialog .button-list .disable-btn {
  color: #FFFFFF;
  background-color: lightgray;
  border: 1px solid gray;
  cursor: default;
}

.core-view .ebk-snipping-view {
  position: fixed;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.core-view .ebk-snipping-view .snip-area {
  position: absolute;
  background-color: darkgray;
  opacity: 0.7;
  top: 0px;
  left: 0px;
  width: var(--np-mask-width);
  height: var(--np-mask-height);
  -webkit-mask: var(--np-mask-svg) 0 0/100% 100%, linear-gradient(#fff, #fff);
          mask: var(--np-mask-svg) 0 0/100% 100%, linear-gradient(#fff, #fff);
  -webkit-mask-composite: xor;
          mask-composite: exclude;
}

.visually-hidden {
  position: absolute !important;
  height: 1px;
  width: 1px;
  overflow: hidden;
  clip: rect(1px, 1px, 1px, 1px);
}

#media-save-btn {
  position: absolute;
  top: 18px;
  left: 15px;
  right: auto;
  width: 40px;
  height: 40px;
  background-image: url(../images/APP/save.png);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  cursor: pointer;
}

#media-close-btn {
  position: absolute;
  top: 18px;
  left: auto;
  right: 15px;
  width: 40px;
  height: 40px;
  background-image: url(../images/APP/close.png);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  cursor: pointer;
}

.rotate-warning {
  position: fixed;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  background: black;
  font-family: Arial, Helvetica, sans-serif;
  display: none;
}
.rotate-warning .phone {
  position: fixed;
  top: 50%;
  left: 50%;
  margin-top: -55px;
  margin-left: -50px;
  height: 50px;
  width: 100px;
  border: 3px solid white;
  border-radius: 10px;
  animation: mobile-rotate 1.5s ease-in-out infinite alternate;
}
.rotate-warning .message {
  position: fixed;
  top: 50%;
  left: 50%;
  margin-top: -10px;
  margin-left: -100px;
  height: 30px;
  line-height: 28px;
  width: 200px;
  color: white;
  font-size: 1em;
  margin-top: 40px;
  text-align: center;
}

@keyframes mobile-rotate {
  0% {
    transform: rotate(0deg);
  }
  50% {
    transform: rotate(-90deg);
  }
  100% {
    transform: rotate(-90deg);
  }
}/*# sourceMappingURL=iframe.css.map */