.personal-assistant{position:relative;margin-top:100px;display:flex;align-items:center;justify-content:center;flex-direction:column;width:100%}.felix{position:absolute;bottom:50px;width:110px;height:95px;border-radius:45%;border:3px solid #fff;box-shadow:0 0 5px hsla(0,0%,100%,.5);animation:breathe-and-jump 3s linear infinite;cursor:pointer;z-index:1}.felix:before{content:"";position:absolute;top:-1px;left:-1px;width:calc(100% + 3px);height:calc(100% + 2px);background:linear-gradient(180deg,#5fc,#1a8);border-radius:45%;opacity:0;transition:all .3s linear}.felix>.eyes{position:relative}.felix>.eyes>.eye{position:absolute;top:20px;width:20px;height:25px;border-radius:15px;background-color:#fff;box-shadow:0 0 7px hsla(0,0%,100%,.5);animation:blink 5s linear infinite}.felix>.eyes>.eye.left{left:25%}.felix>.eyes>.eye.right{right:25%}.platform{transform:rotateX(70deg);width:100px;height:100px;box-shadow:0 0 100px #fff,inset 0 0 15px #fff;animation:jump-pulse 3s linear infinite;border-radius:50%}.command-list{position:absolute;bottom:35px;list-style-type:none;padding:0;margin:0;width:100%;z-index:0}.command-list>li{display:none;width:45px;height:45px;line-height:37px;font-size:25px;border-radius:50%;border:2px solid #fff;box-shadow:0 0 5px #fff;margin:10px 12px;cursor:pointer;opacity:0}.felix.active~.command-list>li{display:inline-block;animation:fade-in 1s linear forwards}.command-list>li:hover{border-color:#5cf;box-shadow:0 0 5px #5cf}.command-list>li:hover:before{box-shadow:0 0 50px #5cf,inset 0 0 15px #5cf}.hey-felix{position:relative;transform:translateY(50px);margin:0}.hey-felix:after{display:inline-block;position:absolute;text-align:center;white-space:nowrap;background-color:#fff}.hey-felix:after,.response-frame{top:0;left:0;width:100%;height:100%}.response-frame{position:fixed;display:flex;align-items:center;justify-content:center;flex-direction:column;background-color:#000c;z-index:-1;opacity:0;transition:opacity .3s}.response-frame.active{z-index:1000;opacity:1}.response-frame>.lead{padding:10px;margin:10px;border-radius:5px;background-color:#fff;color:#333}.response-frame>.fas{width:50px;height:50px;font-size:25px;line-height:45px;border:2px solid #fff;border-radius:50%;cursor:pointer;box-shadow:0 0 10px #fff,inset 0 0 5px #fff;transition:all .3s linear}.response-frame>.fas:hover{border:2px solid #f55;box-shadow:0 0 15px #f55,inset 0 0 5px #f55;color:#f55}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes breathe-and-jump{0%,40%,80%,to{height:95px;transform:translateY(0)}20%,60%,70%,90%{height:100px;transform:translateY(-5px)}85%{height:85px;transform:translateY(-20px)}}@keyframes jump-pulse{0%,40%,80%,to{box-shadow:0 0 30px #fff,inset 0 0 45px #fff}20%,60%,70%,90%{box-shadow:0 0 70px #fff,inset 0 0 25px #fff}85%{box-shadow:0 0 100px #fff,inset 0 0 15px #fff}}@keyframes blink{0%,to{transform:scaleY(.05)}5%,95%{transform:scale(1)}}