html,body{height:100%;margin:0;padding:0;font-family:sans-serif;overflow:hidden}#viewport{background:#ccc;position:fixed;inset:0;overflow:hidden}.nav{z-index:20;background:0 0;justify-content:space-between;align-items:center;width:100%;height:80px;padding:0 30px;display:flex;position:fixed;top:0;left:0}.main{position:absolute;inset:0;overflow:hidden}.canvas{cursor:grab;will-change:transform;background:#eee;width:auto;height:auto;position:absolute;top:0;left:0}.item{cursor:grab;border-radius:3px;position:absolute;overflow:visible}.logo{margin-left:30px;font-size:2rem;font-weight:700}.navIcon{cursor:pointer;margin-right:60px}.plate{width:100%;height:100%}.itemInner{transform-origin:50%;will-change:transform;border-radius:3px;width:100%;height:100%;transition:transform 1.6s cubic-bezier(.19,1,.22,1);overflow:hidden;transform:scale(.9)}.itemInner:hover{cursor:pointer}.itemInner.is-near{transform:scale(1.05)}.itemReveal{opacity:0;transform-origin:50%;will-change:transform,opacity;transition:transform .7s cubic-bezier(.2,.8,.2,1),opacity .7s;transform:scale(0)}.itemReveal.is-visible{opacity:1;transform:scale(.9)}