* {
  -webkit-tap-highlight-color: transparent;
  -moz-osx-tap-highlight-color: transparent;
}

html, body {
  /*margin:0;
  padding:0;*/
  overflow: hidden;
  background-color: #23201e;
}

/*.flipbook-viewport{
    width: 100%;
    height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
}
.flipbook{
    div{
        background-size: contain;
        background-repeat: no-repeat;
        background-position: center center;
    }
}*/
.content-controls {
  top: 0;
  left: 0;
  display: flex;
}
.content-controls .content-button {
  position: absolute;
  width: auto;
  height: auto;
  display: flex;
  justify-content: space-between;
  z-index: 99;
  top: 35%;
}
@media (max-width: 600px) {
  .content-controls .content-button {
    top: 32%;
  }
}
.content-controls .content-button .next, .content-controls .content-button .previous {
  padding-top: 100%;
  width: 40px;
  -webkit-mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center center;
  mask-size: contain;
  mask-repeat: no-repeat;
  mask-position: center center;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
  /*background-color: #fff;*/
}
.content-controls .content-button.button-previous {
  position: absolute;
  left: 20%;
  cursor: pointer;
  opacity: 0.5;
  transition: 500ms ease opacity, 500ms ease left;
  -webkit-filter: drop-shadow(0 0 1px black) !important;
  filter: drop-shadow(0 0 1px black) !important;
}
.content-controls .content-button.button-previous.junto {
  left: 20%;
}
.content-controls .content-button.button-previous:hover {
  opacity: 1;
}
.content-controls .content-button.button-previous.disabled {
  display: none;
}
@media (max-width: 500px) {
  .content-controls .content-button.button-previous {
    left: 10px;
  }
}
.content-controls .content-button.button-next {
  position: absolute;
  right: 20%;
  cursor: pointer;
  opacity: 0.5;
  transition: 500ms ease opacity, 500ms ease right;
  -webkit-filter: drop-shadow(0 0 1px black) !important;
  filter: drop-shadow(0 0 1px black) !important;
}
.content-controls .content-button.button-next.junto {
  right: 20%;
}
.content-controls .content-button.button-next:hover {
  opacity: 1;
}
.content-controls .content-button.button-next.disabled {
  display: none;
}
@media (max-width: 500px) {
  .content-controls .content-button.button-next {
    right: 10px;
  }
}
.content-controls .content-toolbar {
  width: 100%;
  height: 100px;
  margin: auto;
  position: absolute;
  top: 78vh;
  display: flex;
  justify-content: center;
  align-items: center;
  overflow-x: auto;
  overflow-y: hidden;
}
@media (max-width: 900px) {
  .content-controls .content-toolbar {
    width: 92%;
    top: 135vw;
    left: 2%;
    padding-left: 25px;
    max-width: 90%;
  }
}
.content-controls .content-toolbar .content-contain {
  position: relative;
  display: flex;
  margin: 2px;
  height: 56px;
  cursor: pointer;
  transition: 300ms ease transform, 300ms ease box-shadow;
}
@media (max-width: 500px) {
  .content-controls .content-toolbar .content-contain {
    margin: 0;
  }
  .content-controls .content-toolbar .content-contain .image {
    margin: 2px;
    transition: 300ms ease transform, 300ms ease box-shadow;
  }
  .content-controls .content-toolbar .content-contain .image:hover {
    -webkit-transform: scale3d(1.3, 1.3, 1);
    -moz-transform: scale3d(1.3, 1.3, 1);
    -o-transform: scale3d(1.3, 1.3, 1);
    -ms-transform: scale3d(1.3, 1.3, 1);
    transform: scale3d(1.3, 1.3, 1);
    -webkit-box-shadow: 0 0 10px #000;
    -moz-box-shadow: 0 0 10px #000;
    -ms-box-shadow: 0 0 10px #000;
    -o-box-shadow: 0 0 10px #000;
    box-shadow: 0 0 10px #000;
    z-index: 2;
  }
  .content-controls .content-toolbar .content-contain .image.active {
    -webkit-box-shadow: 0 0 10px red;
    -moz-box-shadow: 0 0 10px red;
    -ms-box-shadow: 0 0 10px red;
    -o-box-shadow: 0 0 10px red;
    box-shadow: 0 0 10px red;
  }
}
@media (min-width: 500px) {
  .content-controls .content-toolbar .content-contain:hover {
    -webkit-transform: scale3d(1.3, 1.3, 1);
    -moz-transform: scale3d(1.3, 1.3, 1);
    -o-transform: scale3d(1.3, 1.3, 1);
    -ms-transform: scale3d(1.3, 1.3, 1);
    transform: scale3d(1.3, 1.3, 1);
    -webkit-box-shadow: 0 0 10px #000;
    -moz-box-shadow: 0 0 10px #000;
    -ms-box-shadow: 0 0 10px #000;
    -o-box-shadow: 0 0 10px #000;
    box-shadow: 0 0 10px #000;
    z-index: 2;
  }
  .content-controls .content-toolbar .content-contain.active {
    -webkit-box-shadow: 0 0 10px red;
    -moz-box-shadow: 0 0 10px red;
    -ms-box-shadow: 0 0 10px red;
    -o-box-shadow: 0 0 10px red;
    box-shadow: 0 0 10px red;
  }
}
.content-controls .content-toolbar .content-contain .image {
  padding-left: 40px;
  padding-top: 58px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
}
.content-controls .content-indicator {
  color: #fff;
  position: absolute;
  width: 100%;
  text-align: center;
  font-family: Arial, Helvetica, sans-serif;
  top: 92vh;
}

@media (max-width: 900px) {
  .content-controls .content-indicator {
    top: 165vw;
  }
}
/*# sourceMappingURL=book.css.map */