body{min-height:-webkit-fill-available}html{height:-webkit-fill-available}body,*{box-sizing:border-box;margin:0}body{width:100vw;min-height:100vh}body header{padding:8vh 2vh 4vh 2vh;z-index:66}body main{padding:8vh 2vh}body footer{position:relative;z-index:33;padding:4vh;display:flex;flex-wrap:nowrap;align-items:baseline;justify-content:space-between}body footer .version{text-align:right}body.page-chapter{overflow:hidden}body.page-chapter header{position:fixed;top:0;right:0;bottom:auto;left:0;padding:2vh 2vh}body.page-chapter header h1 br{display:none}body.page-chapter header .hat{max-width:7vh}body.page-chapter main{padding:0;padding-left:0}body.page-chapter main article{padding-bottom:0}body.page-chapter footer{padding:2vh;position:absolute;top:auto;right:2vh;bottom:2vh;left:2vh}body.page-login main{padding-left:calc(20vh + 2vw)}header{display:flex}header .hat{margin-left:2vh;width:20vh}header .hat img{max-width:100%}header h1{width:60vw}#frame{width:100vw;height:100vh;overflow-x:scroll;overflow-y:hidden;scrollbar-color:#6752a1 #fff;scrollbar-width:default;position:relative;display:flex;align-items:center}#frame::-webkit-scrollbar{width:2vh;height:2vh}#frame::-webkit-scrollbar-thumb{background:#6752a1}#frame::-webkit-scrollbar-track{background:#fff}#frame{scrollbar-face-color:#6752a1;scrollbar-track-color:#fff}#frame #comic{display:flex;flex-wrap:nowrap}#frame #comic article{display:flex;flex-wrap:nowrap;width:fit-content}#frame #comic .panel{background:#fff;display:block;position:relative;height:45vw;max-height:100vh;width:fit-content}#frame #comic .panel img{max-height:100%;width:auto}#frame #comic .panel .inner{position:absolute;top:0;left:0;width:100%;height:100%}#frame #comic .panel.transparent{background:transparent}#frame #comic .panel.transparent img{mix-blend-mode:multiply}#frame #comic .flaw{width:50vw;padding:10vh;text-align:center}#frame #comic aside{width:33vw;position:relative;overflow:hidden}#frame #comic aside a{padding:12vh 4vh;position:absolute;top:0;right:0;bottom:0;left:0;z-index:20}#frame #comic aside a:hover::before{display:block}#frame #comic aside a:hover .opener{opacity:1}#frame #comic aside .opener{height:calc(100% - 8vh);z-index:-1;background:#fff;opacity:0;transition:1s opacity ease}#frame #comic aside.beginning,#frame #comic aside.end{background:transparent}#frame #comic aside.previous .opener{position:absolute;top:4vh;right:4vh;bottom:4vh;left:auto}#frame #comic aside.next .opener{position:absolute;top:4vh;right:auto;bottom:4vh;left:4vh}#frame #browse{display:none}#frame #browse a{position:fixed;bottom:10%;z-index:30}#frame #browse .next{right:0;bottom:0%}#frame #browse .prev{left:0;bottom:0%}figure{position:relative}figure figcaption{position:absolute;top:auto;right:2vh;bottom:2vh;left:auto}body.page-front .list article{padding-left:19vh;padding-bottom:2vh}body.page-front .list article:last-child{padding-bottom:0}body.page-front .list article .number{width:3vh;display:inline-block}body.page-front .list article figure.opener{padding-left:2vh;width:33vw;position:relative}@media screen and (max-width: 960px){body.page-front .list article figure.opener{width:100%}}body.page-front .list article figure.opener img{max-width:100%;display:block;margin-bottom:2vh}body{background:#ffe700}body main{background:#000}body.page-chapter{background:#000}body.page-chapter main{background:transparent}html,body{font-family:Arial;font-size:24pt;font-size:2vh;font-size:calc(10pt + 2vh)}h1,h2,h3,h4,h5,h6{font-weight:bold}h1,h2,h3{font-size:1rem;line-height:1rem;color:#6752a1}h2{text-transform:uppercase}h2 em{font-size:0.8rem;opacity:0.6;text-transform:none;font-style:normal}h2 .grey{color:#7e7e7e}strong{text-transform:uppercase;font-weight:normal}em{font-style:normal}.number{color:#7e7e7e;font-size:0.6rem;line-height:1em}figcaption{font-size:0.6rem;color:#6752a1}header,footer{color:#7e7e7e}aside{color:#7e7e7e;font-size:1rem;text-transform:uppercase}aside a{line-height:1.2rem}.debug{font-size:0.5rem;line-height:0.6rem;color:#7e7e7e}.version{font-size:0.5rem;text-align:right}.version em{opacity:0.6}a{color:inherit;text-decoration:underline}h1 a{text-transform:uppercase;text-decoration:none}h1 a:hover{color:#6752a1;text-shadow:#000 0.14em 0em}#browse a{color:white;text-decoration:none;font-size:5vw}.list article a{color:#fff;font-weight:bold;text-decoration:none;text-transform:uppercase}.list article a:hover{color:#fff;text-shadow:#6752a1 0.14em 0em}aside a{text-decoration:none;background:#fff;color:#7e7e7e}aside a strong{color:inherit;font-weight:bold}aside a:hover{color:#000;text-shadow:0 0 0.3em #fff}aside a:hover::before{font-size:3rem;line-height:2rem}aside.previous{text-align:right}aside.next{text-align:left}aside.previous a:hover::before{content:"←"}aside.next a:hover::before{content:"→"}aside p{margin-top:1vh}a.logout{text-decoration:none;color:#7e7e7e}a.logout:hover{color:#6752a1}a.logout:hover::after{content:" bye bye!"}#login{padding:4vh 0}#login input{padding:.66667vh;font-size:14pt;border:0.2em solid #6752a1;border-radius:0;width:20ex}#login input:focus{outline:none}#login input[type=submit]{background:#6752a1;color:#fff;font-size:14pt;width:4rem}#comic #bgs{display:none;position:absolute;top:0;right:auto;bottom:0;left:0;z-index:-1;flex-wrap:nowrap;height:100vh}#comic #bgs .bg{width:100%;height:100%;overflow:hidden}#comic #bgs .bg1{background:url("../assets/panels/2-auftrag/_backgrounds/bg-01.jpg");background-attachment:fixed;background-size:cover;background-position:center center;width:200vw}#comic #bgs .bg2{background:url("../assets/panels/2-auftrag/_backgrounds/bg-02.jpg");background-attachment:fixed;background-size:cover;background-position:center center;width:200vw}