tt.css

[data-tt]{position:relative;box-sizing:border-box}[data-tt]::before,[data-tt]::after{border:none;box-sizing:inherit;display:inline-block;font-size:13px;font-style:normal;font-weight:300;line-height:18px;opacity:0;pointer-events:none;position:absolute;right:50%;text-align:center;text-decoration:none;text-shadow:none;text-transform:none;top:100%;-webkit-transform:translateX(50%);-ms-transform:translateX(50%);transform:translateX(50%);-webkit-transition:opacity .2s step-start 100ms;transition:opacity .2s step-start 100ms;visibility:hidden;z-index:1000000}[data-tt]::before{background:#333;border-radius:3px;color:#eee;content:attr(data-tt);margin:10px 0 0;padding:9px 13px;white-space:pre;word-wrap:break-word}[data-tt]::after{border:5px solid transparent;border-bottom-color:#333;content:'';margin:0 0 0 -5px}[data-tt]:hover::before,[data-tt]:hover::after{visibility:visible;opacity:1}.tt-n::before,.tt-n::after{top:auto;bottom:100%}.tt-e::before,.tt-e::after,.tt-w::before,.tt-w::after{top:auto;bottom:50%;-webkit-transform:translateY(50%);-ms-transform:translateY(50%);transform:translateY(50%)}.tt-e::before,.tt-e::after{left:100%;right:auto}.tt-w::before,.tt-w::after{left:auto;right:100%}.tt-n::before{margin:0 0 10px}.tt-e::before{margin:0 0 0 10px}.tt-w::before{margin:0 10px 0 0}.tt-n::after{border-color:transparent;border-top-color:#333;margin:0 0 0 5px}.tt-e::after,.tt-w::after{border-color:transparent;margin:5px 0 0}.tt-e::after{border-right-color:#333}.tt-w::after{border-left-color:#333}