/* ON6UHF v4.3.117 - covercontrast, stabiele viewport en zichtbare papierplooi */
html{scrollbar-gutter:stable;overflow-x:clip}
body{overflow-x:clip}
html.book-turning,html.book-turning body{overflow-x:clip}
.book-shell{contain:inline-size;overflow:clip visible}
.book{isolation:isolate;transform:translateZ(0);-webkit-transform:translateZ(0)}
.paper.left.cover{color:#fff;background:linear-gradient(0deg,rgba(1,10,17,.96) 0%,rgba(2,20,31,.82) 50%,rgba(2,15,24,.35) 100%),url('../images/tips-tricks-10/roof-night.png') center/cover!important;text-shadow:0 2px 12px #000,0 1px 2px #000}
.paper.left.cover:before{content:"";position:absolute;z-index:0;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.1),transparent 55%,rgba(0,0,0,.24));pointer-events:none}
.paper.left.cover>*{position:relative;z-index:1}
.paper.left.cover h1,.paper.left.cover h2,.paper.left.cover h3,.paper.left.cover p,.paper.left.cover strong,.paper.left.cover em{color:#fff}
.paper.left.cover blockquote{color:#fff;border-left-color:#ffad4f;background:rgba(2,14,23,.72);box-shadow:inset 0 0 0 1px rgba(255,255,255,.09)}
.paper.left.cover .illustration{border:1px solid rgba(255,255,255,.24);box-shadow:0 14px 30px #000b}
.turn-sheet{will-change:transform,clip-path,filter;border:0!important;-webkit-transform-style:preserve-3d;transform-style:preserve-3d;-webkit-backface-visibility:hidden;backface-visibility:hidden}
.turn-sheet:before{background:linear-gradient(90deg,transparent 42%,rgba(71,45,20,.08) 62%,rgba(255,255,255,.8) 82%,rgba(69,43,18,.46) 96%,rgba(255,255,255,.2));filter:blur(.25px)}
.turn-sheet:after{right:-1px;width:42%;background:radial-gradient(ellipse at 100% 48%,rgba(255,255,255,.92) 0,rgba(235,213,177,.76) 15%,rgba(100,65,27,.25) 38%,transparent 70%)}
.book.flipping-forward .turn-sheet.curl-forward{animation:pageCurlForwardStable .9s cubic-bezier(.42,.02,.16,1) forwards}
.book.flipping-back .turn-sheet.curl-back{animation:pageCurlBackStable .9s cubic-bezier(.42,.02,.16,1) forwards}
@keyframes pageCurlForwardStable{0%{transform:translate3d(0,0,0) rotateY(0);clip-path:polygon(0 0,100% 0,100% 100%,0 100%);filter:brightness(1)}26%{transform:translate3d(-1.5%,0,25px) rotateY(-42deg) skewY(-.5deg);clip-path:polygon(0 0,94% 0,100% 7%,100% 93%,94% 100%,0 100%)}52%{transform:translate3d(-7%,0,42px) rotateY(-92deg) skewY(-1.8deg) scaleX(.9);clip-path:polygon(0 0,84% 2%,100% 16%,100% 84%,84% 98%,0 100%);filter:brightness(.82)}76%{transform:translate3d(-11%,0,24px) rotateY(-142deg) skewY(1deg);clip-path:polygon(0 0,92% 0,100% 8%,100% 92%,92% 100%,0 100%);filter:brightness(.9)}100%{transform:translate3d(-100%,0,0) rotateY(-180deg);clip-path:polygon(0 0,100% 0,100% 100%,0 100%);filter:brightness(1)}}
@keyframes pageCurlBackStable{0%{transform:translate3d(0,0,0) rotateY(0);clip-path:polygon(0 0,100% 0,100% 100%,0 100%);filter:brightness(1)}26%{transform:translate3d(1.5%,0,25px) rotateY(42deg) skewY(.5deg);clip-path:polygon(6% 0,100% 0,100% 100%,6% 100%,0 93%,0 7%)}52%{transform:translate3d(7%,0,42px) rotateY(92deg) skewY(1.8deg) scaleX(.9);clip-path:polygon(16% 2%,100% 0,100% 100%,16% 98%,0 84%,0 16%);filter:brightness(.82)}76%{transform:translate3d(11%,0,24px) rotateY(142deg) skewY(-1deg);clip-path:polygon(8% 0,100% 0,100% 100%,8% 100%,0 92%,0 8%);filter:brightness(.9)}100%{transform:translate3d(100%,0,0) rotateY(180deg);clip-path:polygon(0 0,100% 0,100% 100%,0 100%);filter:brightness(1)}}
@supports not (overflow:clip){html,body{overflow-x:hidden}.book-shell{overflow-x:hidden}}
@media(max-width:820px){.book-shell{overflow:clip}.paper.left.cover{background-position:center!important}}
