:root{--base-grid: 8px;--colour-white: #fff;--colour-black: #1a1a1a}.assistant-menu{position:fixed;left:50%;margin-left:0;pointer-events:all;top:0}.assistant-menu .links{--link-size: calc(var(--base-grid) * 20);color:var(--colour-black);display:flex;justify-content:center;align-items:center;width:100%;min-height:100vh}.assistant-menu .links__list{position:relative;list-style:none}.assistant-menu .link-item{background:transparent;border-radius:50%;color:#454242;font-size:3rem;box-shadow:0 4px 6px #0000001a;width:var(--link-size);height:var(--link-size);position:absolute;top:0;left:0;margin-top:calc(var(--link-size) / -2);margin-left:calc(var(--link-size) / -2);--angle: calc(360deg / var(--item-total));--rotation: calc(140deg + var(--angle) * var(--item-count));transform:rotate(var(--rotation)) translate(calc(var(--link-size) + var(--base-grid) * 2)) rotate(calc(var(--rotation) * -1))}.assistant-menu .links__link{opacity:0;animation:on-load .3s ease-in-out forwards;animation-delay:calc(var(--item-count) * .15s);width:100%;height:100%;border-radius:50%;position:relative;background-color:var(--colour-white);display:flex;flex-direction:column;justify-content:center;align-items:center;text-decoration:none;color:inherit}.assistant-menu .links__icon{width:calc(var(--base-grid) * 8);height:calc(var(--base-grid) * 8);transition:all .3s ease-in-out;fill:var(--colour-black)}.assistant-menu .links__text{position:absolute;width:100%;left:0;text-align:center;height:calc(var(--base-grid) * 2);font-size:1rem;display:none;bottom:calc(var(--base-grid) * 8.5);animation:text .3s ease-in-out forwards}.assistant-menu .links__link:after{content:"";background-color:transparent;width:var(--link-size);height:var(--link-size);border:2px dashed var(--colour-white);display:block;border-radius:50%;position:absolute;top:0;left:0;transition:all .3s cubic-bezier(.53,-.67,.73,.74);transform:none;opacity:0}.assistant-menu .links__link:hover .links__icon{transition:all .3s ease-in-out;transform:translateY(calc(var(--base-grid) * -1))}.assistant-menu .links__link:hover .links__text{display:block}.assistant-menu .links__link:hover:after{transition:all .3s cubic-bezier(.37,.74,.15,1.65);transform:scale(1.1);opacity:1}@keyframes on-load{0%{opacity:0;transform:scale(.3)}70%{opacity:.7;transform:scale(1.1)}to{opacity:1;transform:scale(1)}}@keyframes text{0%{opacity:0;transform:scale(.3) translateY(0)}to{opacity:1;transform:scale(1) translateY(calc(var(--base-grid) * 5))}}