.chat-bubble{position:fixed;top:20%;right:calc(25% - 100px);transform:translateY(-50%);background-color:#efefef;border:3px solid #fff;border-radius:15px;padding:20px;color:#5a5a5a;font-family:DotGothic16,sans-serif;font-size:1.2rem;max-width:300px;box-shadow:0 0 15px #ffffff80,0 0 5px #00000080 inset;animation:fadeIn .5s ease-out;z-index:1000}.chat-bubble:after{content:"";position:absolute;top:50%;right:-23px;transform:translateY(-50%);width:0;height:0;border-top:15px solid transparent;border-bottom:15px solid transparent;border-left:20px solid #5a5a5a;filter:drop-shadow(3px 0px 0px #fff)}.chat-bubble-content p{margin:0}.chat-bubble.play-bubble{top:auto;bottom:120px;right:40px;transform:none}.chat-bubble.play-bubble:after{top:100%;left:50%;right:auto;transform:translate(-50%);border-top:20px solid #5a5a5a;border-bottom:none;border-left:15px solid transparent;border-right:15px solid transparent;filter:drop-shadow(0px 3px 0px #fff);margin-top:3px}@keyframes fadeIn{0%{opacity:0;transform:translateY(-50%) scale(.8)}to{opacity:1;transform:translateY(-50%) scale(1)}}.chat-bubble.play-bubble{animation:fadeInPlay .3s ease-out}@keyframes fadeInPlay{0%{opacity:0;transform:scale(.8) translateY(20px)}to{opacity:1;transform:scale(1) translateY(0)}}