.infinite-menu-container{width:100%;height:600px;position:relative;overflow:hidden;background:black}#infinite-grid-menu-canvas{cursor:grab;width:100%;height:100%;display:block;outline:none}#infinite-grid-menu-canvas:active{cursor:grabbing}.action-button{position:absolute;left:50%;z-index:10;width:60px;height:60px;display:grid;place-items:center;background:#00BFFF;border-radius:50%;cursor:pointer;border:2px solid #000;color:black;transition:all .3s ease}.action-button:hover{transform:translateX(-50%) scale(1.1);box-shadow:0 0 20px rgba(0,191,255,.5)}.face-title{user-select:none;font-weight:900;font-size:3rem;left:1.6em;color:white;text-transform:uppercase;letter-spacing:-.05em;text-shadow:0 4px 20px rgba(0,0,0,.5)}.action-button-icon{user-select:none;position:relative;color:black;top:0;font-size:24px;line-height:1}.face-title{position:absolute;top:50%;transform:translate(20%,-50%)}.face-title.active{opacity:1;transform:translate(20%,-50%);pointer-events:auto;transition:.5s ease}.face-title.inactive{pointer-events:none;opacity:0;transition:.1s ease}.face-description{user-select:none;position:absolute;max-width:250px;top:50%;font-size:1rem;right:15%;transform:translateY(-50%);color:rgba(255,255,255,.7);font-weight:500;line-height:1.5;text-align:right}.face-description.active{opacity:1;transform:translateY(-50%);pointer-events:auto;transition:.5s ease}.face-description.inactive{pointer-events:none;transform:translate(20px,-50%);opacity:0;transition:.1s ease}.action-button.active{bottom:15%;transform:translateX(-50%) scale(1);opacity:1;pointer-events:auto;transition:.5s ease}.action-button.inactive{bottom:-80px;transform:translateX(-50%) scale(0);opacity:0;pointer-events:none;transition:.1s ease}@media (max-width:1024px){.face-title{font-size:2rem;left:5%}.face-title,.face-title.active{transform:translateY(-50%)}.face-description{right:5%;font-size:.9rem;max-width:200px}}@media (max-width:768px){.face-description,.face-title{display:none}.infinite-menu-container{height:400px}}