
@font-face{font-family:Telegraf;src:url('/assets/fonts/Telegraf-Regular.eot');src:url('/assets/fonts/Telegraf-Regular.eot?#iefix') format('embedded-opentype'),url('/assets/fonts/Telegraf-Regular.woff2') format('woff2'),url('/assets/fonts/Telegraf-Regular.woff') format('woff'),url('/assets/fonts/Telegraf-Regular.ttf') format('truetype');font-weight:300}*{margin:0;padding:0;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box}html{height:100%;padding:env(safe-area-inset)}body{background:#9f9f9f;color:#fff;height:100vh;overflow-x:hidden;font-family:Telegraf,sans-serif;font-weight:300;font-size:1.75em;overflow:hidden;text-rendering:optimizeSpeed;text-align:center}h1{font-weight:300;font-size:2em;line-height:.9em}a{color:#fff;transition:filter .5s ease-out;cursor:none}a:hover{filter:blur(2px)}.super_container{position:absolute;top:0;left:0;width:100%;height:100vh;overflow:hidden;scrollbar-color:white transparent;scrollbar-width:thin;-webkit-overflow-scrolling:touch}.super_container::-webkit-scrollbar{width:.25em}.super_container::-webkit-scrollbar-thumb{background-color:#fff;border-radius:.125em}.super_container .scroller{position:relative;top:0;left:0;width:100%;height:100vh;perspective:none;overflow:visible}.super_container .scroller .scroller-holder{position:sticky;position:-webkit-sticky;top:0;left:0;width:100%;height:100vh;overflow:hidden}.scroller-content{top:0;width:100%;height:100vh;-moz-user-select:none;-webkit-user-select:none}.container{position:fixed;top:0;left:0;width:100%;height:100vh;overflow:hidden;user-select:none;opacity:0;will-change:opacity;transition:opacity .5s ease-out}.container canvas{position:absolute;top:0;left:0;width:100vw;height:100vh}section{position:relative;width:100%;min-height:100vh}section.intro,section.sfeatured{will-change:transform}.intro .content,.sfeatured .content,.welcome .content{position:absolute;top:50%;left:50%;max-width:90%;transform:translate(-50%,-50%);transition:opacity 1s ease-out,filter 1s ease-out}.welcome .content{opacity:0}.intro .content,.sfeatured .content{width:40%;min-width:300px;max-width:600px}.welcome .loading{text-align:center;width:300px;z-index:2}.loading-bar,.loading-base{position:absolute;top:0;left:0;width:100%;height:2px;background:#fff;border-radius:1px}.loading-bar{background:linear-gradient(.25turn,#5cc9f5,#f78ae0);width:0%;transition:width .1s ease-out}.scroll-helper{animation:pulsate 2s infinite;visibility:hidden}.unfocused{opacity:.25}.welcome .loading{opacity:1}section .project{width:90%;max-width:900px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.titles{position:fixed;top:0;left:50%;transform:translateX(-50%);width:100%;height:100vh;-moz-user-select:none;-webkit-user-select:none;user-select:none;pointer-events:none}.titles section{position:absolute;top:0;left:0;width:100%;height:100vh;opacity:0;visibility:hidden;transition:opacity .3s ease-out,visibility .3s ease-out}.titles section div{transform-origin:50% 50%}.titles section div.title{margin:0 auto;margin-bottom:8px}.titles section div.title div{position:relative;float:left;margin-right:.6em}.project{font-size:.8em}.project a,.project a:hover,.project a:visited{text-decoration:none}.project .credits,.project .tags,.project .title{max-width:900px}.project .info{width:100%;margin-top:16px;border-top:1px #fff solid;border-bottom:1px #fff solid;padding:16px 0 16px 0;display:grid;grid-template-columns:50% 50%;font-size:.9em}.project .credits,.project .tags{width:100%;padding:0 8px 0 8px}.project .credits{border-right:1px #fff solid}.project .credits a,.project .credits a:visited{pointer-events:all;text-decoration:underline}section.contact{font-size:1em}.contact .content{width:90%;max-width:800px;padding:64px 0 64px 0;margin:0 auto}.contact .content p{margin-bottom:24px}.contact hr{border:1px solid #fff;margin:32px 0 32px 0}.backTop{width:fit-content;width:-moz-fit-content;margin:0 auto;margin-top:10px;padding-top:6px;font-size:2.5em;will-change:filter;transition:filter 1s ease-out}.backTop:hover{filter:blur(2px);color:#9f9f9f}.mobile{color:#fff}.mobile:hover{color:#fff!important}.mobile:active{color:#ccc!important}.footer{font-size:.5em}.menu{position:fixed;top:24px;left:50%;font-size:.9em;will-change:transform,opacity;transition:opacity .6s ease-out,transform .6s ease-out;-moz-user-select:none;-webkit-user-select:none;user-select:none}.hidden{transform:translateY(-100px);opacity:0}.menu .option{transform:translateX(-50%);will-change:filter;transition:filter 1s ease-out}.menu .option:hover{filter:blur(2px)}.menu .selected{pointer-events:none;filter:blur(4px)}.project .link{position:relative;margin:0 auto;margin-top:16px;width:100px;height:100px;user-select:none;-moz-user-select:none;background:rgba(255,255,255,0);will-change:filter;transition:filter 1s ease-out}.project a.btn:hover{filter:none}.st0{fill:#ffffff}.link:hover{filter:blur(2px)}.link:hover .st0{fill:#ffffff}.st0:active{fill:#ccc}@media only screen and (min-width:768px){body{color:#9f9f9f}a{color:#9f9f9f}section.contact{color:#fff}section.contact a{color:#fff}section.contact a:hover{color:#9f9f9f}.st0{fill:#9F9F9F}.project .info{border-top:1px #9f9f9f solid;border-bottom:1px #9f9f9f solid;font-size:1em}.project .credits{border-right:1px #9f9f9f solid}.project .credits,.project .tags{padding:0 32px 0 32px}}@media (min-width:1024px){body{font-size:1.9em}h1{font-size:3.75em;line-height:.75em}.contact .content{max-width:700px}.project .credits,.project .tags,.project .title{max-width:700px}.project{font-size:.75em}.st0{fill:#9F9F9F}}@media (min-width:1300px){body{font-size:2.15em}h1{font-size:4em;line-height:.85em}.project .link{width:128px;height:128px}.contact .content{max-width:800px}.st0{fill:#9F9F9F}.project .credits,.project .tags,.project .title{max-width:800px}}.winvideo,video{pointer-events:none;opacity:0;position:absolute;top:0;left:0;width:100%;overflow:hidden}.iosfix{position:absolute;top:0;left:0;width:100%;height:100vh;pointer-events:none}@keyframes happy{0%{transform:translate3d(0,-.25em,0) rotateZ(-10deg);opacity:.35}50%{transform:translate3d(0,.25em,0) rotateZ(10deg);opacity:1}100%{transform:translate3d(0,-.25em,0) rotateZ(-10deg);opacity:.35}}@keyframes pulsate{0%{opacity:.35}50%{opacity:1}100%{opacity:.35}}