#app{font-family:Avenir,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-align:center;color:#8399af;margin:.5em;user-select:none}img{-webkit-user-drag:none;-khtml-user-drag:none;-moz-user-drag:none;-o-user-drag:none;user-drag:none}a{color:#1f68ac}a:hover{color:#1883e7}h1{color:#fff;text-align:left;font-size:4rem;text-align:center;margin:auto}.page{position:relative;transform-style:preserve-3d;width:min(var(--max-page-height) / var(--page-ratio),var(--max-page-width));height:min(var(--max-page-height),var(--page-ratio) * var(--max-page-width));user-select:none;--shadow-size: 3vw;--shadow-blur: 3vw;--shadow--color: rgba(0, 0, 0, .8)}.front,.back{position:absolute;-webkit-backface-visibility:hidden;backface-visibility:hidden;-ms-transform:translateZ(0);-webkit-transform:translateZ(0);transform:translateZ(0);width:100%;height:100%;box-sizing:border-box;background-color:#fff}.front{border-radius:0 5px 5px 0}.back{transform:rotateY(180deg);border-radius:5px 0 0 5px}.page:not(.first) .front,.page:not(.first) .front .full-page{box-shadow:inset var(--shadow-size) 0 var(--shadow-blur) calc(-1 * var(--shadow-size)) var(--shadow--color)}.page:not(.last) .back,.page:not(.last) .back .full-page{box-shadow:inset calc(-1 * var(--shadow-size)) 0 var(--shadow-blur) calc(-1 * var(--shadow-size)) var(--shadow--color)}.flipped{transform:rotateY(-180deg)}.page-number{position:absolute;bottom:.2em;left:0;right:0;text-align:center;font-size:.8em}.full-page{width:100%;height:100%;background-size:cover;background-position:center;background-repeat:no-repeat;box-sizing:border-box;padding:1em}.full-page-margin{--full-page-margin: 5%;width:calc(100% - 2 * var(--full-page-margin));height:calc(100% - 2 * var(--full-page-margin));background-size:cover;background-position:center;background-repeat:no-repeat;box-sizing:border-box;padding:1em;margin:var(--full-page-margin)}.front .full-page{border-radius:0 4px 4px 0}.back .full-page{border-radius:4px 0 0 4px}.double-page{position:relative;width:100%;padding:3vh;box-sizing:border-box;display:flex;flex-direction:column;justify-content:space-evenly;height:100%}.double-page .first-old{position:absolute;top:5%;left:5%}.double-page .second-old{position:absolute;bottom:5%;right:5%;clip-path:polygon(44% 0,100% 0,100% 100%,0 100%,0 50%)}.double-page h1{filter:drop-shadow(0 0 2px #00000080)}.double-page img{max-height:60%}.price{font-family:sans-serif;text-align:left;font-size:2rem;text-align:right;margin:auto}@media only screen and (max-width: 600px){h1{font-size:3rem}.price{font-size:1.5rem}}.inner-page{width:100%;height:100%;margin:1em}body{--bg-color: #17212b;--max-page-width: 95vw;--max-page-height: 90vh;--page-ratio: 1.414;margin:0;background-color:var(--bg-color);overflow:hidden}.disabled{pointer-events:none;filter:brightness(.5)}.clickable{cursor:pointer;user-select:none}.content{display:flex;justify-content:space-around;justify-items:center;align-items:center}.controls{margin:.25em}.controls a{padding:.5em}.nav{background:#ffffff08;width:100%;align-self:stretch;margin:1em}.nav-edges{position:absolute;right:0;top:0;bottom:0;width:4em;z-index:99}.book{position:relative;width:min-content;height:min(var(--max-page-height),var(--page-ratio) * var(--max-page-width));margin:auto;perspective:250vh;transition:transform .5s ease}.page{position:absolute;transform-origin:left center;transition:transform 1s;cursor:grab}@media (orientation: portrait){html,body{max-width:100%;overflow-x:hidden}.page{left:max(-1 * var(--max-page-height) / var(--page-ratio) / 2,-1 * var(--max-page-width) / 2)}.book.end{transform:translate(min(var(--max-page-height) / var(--page-ratio),var(--max-page-width)))}}.flipping{z-index:10}.flipping .front{transition:all 1s}.flipping .front{filter:brightness(1)}.flipping.flipped .front{filter:brightness(0)}.page .corner{position:absolute;top:0;right:0;border-style:solid;box-shadow:-2px 2px 3px #0006;width:0;border-width:0px;border-color:var(--bg-color) var(--bg-color) rgb(180,180,180) rgb(180,180,180);border-radius:0 0 0 5px;transition:border-width .2s}.page:hover .corner{border-width:8vh}a{transition:all .2s}a.clickable:hover{color:#fff}.ribbon[data-v-7f4f6280]{width:15vh;height:15vh;overflow:hidden;position:absolute}.ribbon[data-v-7f4f6280]:before,.ribbon[data-v-7f4f6280]:after{position:absolute;z-index:-1;content:"";display:block;border:.526vh solid #d35a5a}.ribbon div[data-v-7f4f6280]{position:absolute;display:block;width:21.2vh;padding:1.5vh 0;background-color:#d43636;box-shadow:0 5px 10px #0000001a;color:#fff;font:700 1.6vh/1 Lato,sans-serif;text-shadow:0 1px 1px rgba(0,0,0,.2);text-transform:uppercase;text-align:center}.ribbon-top-left[data-v-7f4f6280]{top:-10px;left:-10px}.ribbon-top-left[data-v-7f4f6280]:before,.ribbon-top-left[data-v-7f4f6280]:after{border-top-color:transparent;border-left-color:transparent}.ribbon-top-left[data-v-7f4f6280]:before{top:0;right:0}.ribbon-top-left[data-v-7f4f6280]:after{bottom:0;left:0}.ribbon-top-left div[data-v-7f4f6280]{right:-15px;top:36px;transform:rotate(-45deg)}.ribbon-top-right[data-v-7f4f6280]{top:-10px;right:-10px}.ribbon-top-right[data-v-7f4f6280]:before,.ribbon-top-right[data-v-7f4f6280]:after{border-top-color:transparent;border-right-color:transparent}.ribbon-top-right[data-v-7f4f6280]:before{top:0;left:0}.ribbon-top-right[data-v-7f4f6280]:after{bottom:0;right:0}.ribbon-top-right div[data-v-7f4f6280]{left:-25px;top:30px;transform:rotate(45deg)}.ribbon-bottom-left[data-v-7f4f6280]{bottom:-1vh;left:-1vh}.ribbon-bottom-left[data-v-7f4f6280]:before,.ribbon-bottom-left[data-v-7f4f6280]:after{border-bottom-color:transparent;border-left-color:transparent}.ribbon-bottom-left[data-v-7f4f6280]:before{bottom:0;right:0}.ribbon-bottom-left[data-v-7f4f6280]:after{top:0;left:0}.ribbon-bottom-left div[data-v-7f4f6280]{right:-1.5vh;bottom:3.6vh;transform:rotate(225deg)}.ribbon-bottom-left span[data-v-7f4f6280]{display:inline-block;transform:rotate(180deg)}.ribbon-bottom-right[data-v-7f4f6280]{bottom:-10px;right:-10px}.ribbon-bottom-right[data-v-7f4f6280]:before,.ribbon-bottom-right[data-v-7f4f6280]:after{border-bottom-color:transparent;border-right-color:transparent}.ribbon-bottom-right[data-v-7f4f6280]:before{bottom:0;left:0}.ribbon-bottom-right[data-v-7f4f6280]:after{top:0;right:0}.ribbon-bottom-right div[data-v-7f4f6280]{left:-25px;bottom:30px;transform:rotate(-225deg)}