html,body{margin:0;padding:0;background-color:#d6cecc}main{height:100vh;width:100%}::-webkit-scrollbar{display:none}#canvas{display:block}#root{width:100%;box-sizing:border-box;padding:120px 10px}.navigation{display:grid;margin-top:120px;grid-template-columns:repeat(2,minmax(0,600px));justify-content:center;gap:20px;width:100%}.navigation_item{width:100%;height:100%;max-width:600px;border-radius:5px;background-color:transparent;perspective:1000px;aspect-ratio:5.33 / 3}.navigation_item_inner{position:relative;width:100%;height:100%;text-align:center;transition:transform .8s;transform-style:preserve-3d;box-shadow:0 0 10px 5px #0000005e;border-radius:5px}.navigation_item_video{max-width:600px;width:100%;height:100%;border-radius:5px}.link_thumbnail{width:100%;height:100%;border-radius:5px}.navigation_item:hover .navigation_item_inner{transform:rotateX(180deg)}.link_front,.link_back{position:absolute;width:100%;height:100%;backface-visibility:hidden}.link_back{transform:rotateX(180deg)}.background{width:100%;height:100%;background:#fefefe;display:flex;justify-content:center;align-items:center}.frame{width:600px;height:800px;border-image:linear-gradient(115deg,#3a3a3b,#000) 70;border-width:20px;border-style:solid;box-shadow:0 3px 50px #000}