[data-clew]{position:relative}[data-clew]:after{position:absolute;transform:translateX(-50%);display:none;font-size:13px;border-radius:4px;content:attr(data-clew);padding:10px;background-color:#fff;box-shadow:0 0 14px rgba(0,0,0,.1);border:1px solid #ddd;color:#777;width:200px;line-height:1.25rem;text-align:left}[data-clew].clew-animation{overflow:hidden}[data-clew].clew-animation:after{display:block;opacity:0;visibility:hidden;transition:all .3s}[data-clew].clew-animation:hover{overflow:visible}[data-clew].clew-animation:hover:after{opacity:1;visibility:visible}[data-clew]:hover:after{display:block}[data-clew].clew-top:after{bottom:100%;left:50%;transform:translateX(-50%) translateY(8px)}[data-clew].clew-bottom:after,[data-clew].clew-top:hover:after{transform:translateX(-50%) translateY(-8px)}[data-clew].clew-bottom:after{top:100%;left:50%}[data-clew].clew-bottom:hover:after{transform:translateX(-50%) translateY(8px)}[data-clew].clew-left:after{top:50%;right:100%;transform:translateX(8px) translateY(-50%)}[data-clew].clew-left:hover:after,[data-clew].clew-right:after{transform:translateX(-8px) translateY(-50%)}[data-clew].clew-right:after{top:50%;left:100%}[data-clew].clew-right:hover:after{transform:translateX(8px) translateY(-50%)}