.divz-item{display:block;position:absolute;width:100%;height:100%;background:transparent;-webkit-user-select:none;user-select:none;opacity:.2;transition:opacity .4s}.divz-item.selected{opacity:.9}.divz-item.selected.expanded{opacity:1}.divz-item.dark-mode>*{border:.5px solid rgba(250,250,250,.1)}.divz-item>*{position:absolute;margin:0;display:flex;justify-content:center;align-items:center;width:45%;height:45%;top:50%;left:50%;transform:translate(-50%,-50%) scale(.44);backface-visibility:hidden;transition:transform .3s;border-radius:20px;background-color:#0a0a0a33;background-size:cover;background-repeat:no-repeat;background-position:center;overflow:hidden;object-fit:cover}.divz-item>* img,.divz-item>* video{height:100%;width:100%;object-fit:cover}.divz-item>* .divz-video-item img,.divz-item>* .divz-video-item video,.divz-item>*.divz-video-item img,.divz-item>*.divz-video-item video{position:absolute;top:0;left:0}.divz-item>* .divz-video-item video,.divz-item>*.divz-video-item video{transition:opacity .5s}.divz-item>* .divz-video-item video.show,.divz-item>*.divz-video-item video.show{opacity:1}.divz-item>* .divz-video-item video.hide,.divz-item>*.divz-video-item video.hide{opacity:0}.divz-item.expanded>*{transform:translate(-50%,-50%) scale(.88)}.divz-button{position:absolute;display:flex;align-items:center;padding:10px;border-radius:50%;border-style:solid;border-width:2px;border-color:#0a0a0a4d;background-color:#fafafa80;bottom:25px;width:25px;height:25px;cursor:pointer}.divz-button.left-align{left:30px}.divz-button.right-align{right:30px}.divz-button svg{fill:#0a0a0aa6;z-index:20;width:100%;height:100%;transform:scale(.8)}@media (hover: hover){.divz-button:hover svg{fill:#0a0a0ae6}}.divz-button.dark-mode{border-color:#fafafa4d;background-color:#0a0a0a99}.divz-button.dark-mode svg{fill:#fafafa99}.divz-button.dark-mode:hover svg{fill:#fafafacc}@media (max-height: 480px){.divz-button{bottom:10px;transform:scale(.8)}}.divz-nav-buttons-viewport,.divz-nav-buttons{height:150px;position:absolute;color:#000}.divz-nav-buttons-viewport{perspective:150px;top:calc(100% - 120px);left:50%}@media (max-height: 480px){.divz-nav-buttons-viewport{top:calc(100% - 100px);transform:scale(.65)}}.divz-nav-buttons{transform:rotateX(45deg) translate(-50%,-40%);display:flex;align-items:center;justify-content:space-between;flex-direction:column;border-style:solid;border-width:2px;border-color:#0a0a0a4d;background-color:#fafafa80;border-radius:12px;width:90px;padding:10px 5px 0;z-index:2;gap:10px;transition:transform .3s}.divz-nav-buttons.expanded{transform:rotateX(45deg) translate(-50%,130%)}.divz-nav-buttons.dark-mode{border-color:#fafafa4d;background-color:#0a0a0a80}.divz-nav-buttons.dark-mode .divz-nav-button,.divz-nav-buttons.dark-mode .divz-nav-label{color:#fafafa;opacity:.6}.divz-nav-buttons .divz-nav-label{position:absolute;pointer-events:none;-webkit-user-select:none;user-select:none;display:flex;height:100%;width:200%;align-items:center;justify-content:center;font-size:22px;font-weight:400;opacity:1;font-family:Arial,Helvetica,sans-serif}.divz-nav-buttons .divz-nav-button{display:flex;justify-content:center;align-items:center;width:80%;font-size:50px;opacity:.5;color:#0a0a0a;-webkit-user-select:none;user-select:none;transform:scaleX(1.3)}.divz-nav-buttons .divz-nav-button.disabled{opacity:.15;pointer-events:none}.divz-nav-buttons .divz-nav-button:not(.disabled):hover{opacity:.8;cursor:pointer}body{overflow:hidden;padding:0;margin:0}.divz{position:absolute;width:100%;height:100%;overflow:hidden}.divz.scroll-page-enabled{position:relative;height:80vh}.divz-viewport{width:100%;height:100%;left:0;perspective:800px;perspective-origin:center}.divz-list{width:100%;height:100%;transform-style:preserve-3d;transform:translateZ(500px)}.app{font-family:Cabal;height:100vh}.app.dark-mode{background:#000}.app-header{position:absolute;box-sizing:border-box;top:10px;width:100%;padding:20px;display:flex;flex-direction:column;align-items:center;border-radius:6px}.app-header div,.app-header h1,.app-header small,.app-header a{text-align:center;-webkit-user-select:none;user-select:none;z-index:1;pointer-events:none}.app-header .demo-list{-webkit-backdrop-filter:invert(30%);backdrop-filter:invert(30%);padding:8px;border-radius:16px;position:absolute;top:5px;left:20px;display:flex;gap:10px;font-size:16px}.app-header .demo-list a{color:#fff;text-decoration:none;cursor:pointer;pointer-events:all}.app-header .demo-list a.active{font-weight:800;pointer-events:none}@media (min-width: 1280px){.app-header .demo-list{-webkit-backdrop-filter:invert(30%);backdrop-filter:invert(30%);position:absolute;top:15px;left:20px;display:flex;gap:15px;font-size:16px;padding:6px;background-color:#000;opacity:.4;border-radius:10px}.app-header .demo-list a{color:#fff;text-decoration:none;cursor:pointer;pointer-events:all}.app-header .demo-list a.active{font-weight:800;pointer-events:none}}@media (min-width: 1280px){.app-header .github{position:absolute;width:121px;height:auto;top:5px;right:20px;font-size:16px;pointer-events:all}}.github{position:absolute;width:65px;height:auto;top:2px;right:15px;font-size:16px;pointer-events:all}h1{font-family:Cabal;font-size:48px;color:#fff;font-weight:bolder;margin-top:40px;margin-bottom:5px}@media (min-width: 1280px){h1{font-family:Cabal;font-weight:bolder;font-size:72px;color:#fff;margin-top:26px;margin-bottom:5px}}a{text-decoration:none}small{line-height:normal}.fa{font-size:25px;padding-right:3px;width:25px;text-align:center;text-decoration:none;opacity:.6}@media (min-width: 1280px){.fa{font-size:35px;padding-right:5px;width:35px;text-align:center;text-decoration:none;opacity:.6}}.fa:hover{opacity:.8}.divz.demo1{color:#fafafacc}.divz.demo1 .divz-item>*{font-size:50px}.divz.demo4 figure{aspect-ratio:1 / 1}.divz.demo4 .divz-item>*{border-radius:10px;width:auto;align-items:flex-end;justify-content:end}.divz.demo4 .divz-item>* img{height:100%;width:auto}@media (orientation: portrait){.divz.demo4 .divz-item>*{transform:translate(-50%,-50%) scale(.35)}}.divz.demo4 .divz-item.selected figcaption{display:flex;animation:fade-in-full .5s .5s forwards}@media (max-height: 480px){.divz.demo4 .divz-item.selected figcaption{margin:5px;transform:translate(25%,20%) scale(.5)}}.divz.demo4 .divz-item.expanded>*{transform:translate(-50%,-50%) scale(.8)}.divz.demo4 .divz-item.expanded>* figcaption{transform:translate(25%,25%) scale(.55)}@media (orientation: portrait){.divz.demo4 .divz-item.expanded>*{transform:translate(-50%,-50%) scale(.85)}.divz.demo4 .divz-item.expanded>* figcaption{transform:translate(50%,25%) scale(.5)}}.divz figcaption{display:none;opacity:0;position:absolute;padding:10px;margin:10px;flex-direction:column;align-items:flex-end;justify-content:space-between;gap:10px;transition:transform .3s,opacity .3s}.divz figcaption div{-webkit-user-select:none;user-select:none;pointer-events:none}.divz figcaption div:first-child{font-size:50px;line-height:1;font-family:monospace}@media (max-height: 480px){.divz figcaption div:first-child{font-size:30px}}.divz figcaption div:last-child{font-size:12px}@media (max-height: 480px){.divz figcaption div:last-child{font-size:10px}}.background{position:fixed;width:100%;height:100%;object-fit:cover;-webkit-user-select:none;user-select:none;opacity:0}img.background{animation:fade-in-full .5s .2s forwards}video.background{animation:fade-in 2s .2s forwards}@keyframes fade-in{0%{opacity:0}to{opacity:.5}}@keyframes fade-in-full{0%{opacity:0}to{opacity:1}}@font-face{font-family:Aquila;src:url(/fonts/Aquila.ttf) format("truetype")}@font-face{font-family:Cabal;src:url(/fonts/Cabal.ttf) format("truetype")}@font-face{font-family:Confessions;src:url(/fonts/Confessions.ttf) format("truetype")}@font-face{font-family:Maria-Christmas;src:url(/fonts/Maria-Christmas.ttf) format("truetype")}@font-face{font-family:To The Point;src:url("/fonts/To The Point.ttf") format("truetype")}.line-1{position:fixed;color:#fff;font-family:Cabal;font-weight:700;top:100px;width:15em;z-index:1;margin:0 auto;font-size:150%;text-align:center;white-space:nowrap;word-wrap:break-word;overflow:hidden;transform:translateY(0)}@media (min-width: 1280px){.line-1{position:fixed;color:#fff;font-family:Cabal;font-weight:700;top:8%;width:300px;z-index:1;margin:0 auto;font-size:250%;text-align:center;white-space:nowrap;word-wrap:break-word;overflow:hidden;transform:translateY(0)}}.anim-typewriter{animation:typewriter 4s steps(44) 1s 1 normal both}@keyframes typewriter{0%{width:0}to{width:40em}}.spiel{position:fixed;width:300px;white-space:nowrap;word-wrap:normal;overflow:hidden}@media (min-width: 1280px){.spiel{position:relative;height:50%}}@media (min-width: 1280px){.menubar{border-radius:8px;position:fixed;top:10px;left:70px;width:130px;background-color:#333;opacity:.5;color:#fff;padding:10px 8px;display:flex;gap:15px;align-items:center;z-index:1}}@media (min-width: 1280px){.menubar a{color:#fff;text-decoration:none;font-size:32px;cursor:pointer;pointer-events:auto}}.menubar a{color:#fff;text-decoration:none;font-size:24px;cursor:pointer;pointer-events:auto}.text-fader-container{max-width:500px;margin:0 auto;text-align:left;font-family:Cabal;font-weight:700;font-size:1.2rem;height:8em;display:flex;align-items:center;justify-content:center;overflow:hidden;position:relative}.text-fader-line{font-family:Cabal;font-size:1.2rem;color:#fff;font-weight:700;line-height:1.2;word-wrap:break-word;white-space:normal;display:inline-block;max-width:100%}@media (min-width: 1280px){.text-fader-container{max-width:550px;padding:1rem;margin:0 auto;text-align:left;font-family:Cabal;font-weight:700;height:8em;display:flex;align-items:center;justify-content:center;overflow:hidden;position:relative}.text-fader-line{padding:.75rem 1.25rem;font-family:Cabal;font-size:1.5rem;color:#fff;font-weight:700;line-height:1.2;word-wrap:break-word;white-space:normal;display:inline-block;max-width:100%}}.toggle-button{position:fixed;opacity:.5;top:10px;left:10px;padding:5px 10px;font-size:24px;cursor:pointer;z-index:1000;background-color:#444;color:#fff;border:none;border-radius:4px;pointer-events:auto;width:auto;height:auto}.menubar{border-radius:8px;position:fixed;top:10px;left:60px;width:100px;background-color:#333;opacity:.5;color:#fff;padding:10px;display:flex;gap:15px;align-items:center;z-index:1}@media (min-width: 1280px){.toggle-button{position:fixed;opacity:.5;top:10px;left:10px;padding:4px 8px;font-size:32px;cursor:pointer;z-index:1000;background-color:#444;color:#fff;border:none;border-radius:4px;pointer-events:auto;width:auto;height:auto}}:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-text-size-adjust:100%}