body{padding:20px;background-color:white}h1.title{text-align:center;font-weight:normal;color:#4e5166;font-size:3em}p{font-size:3em;line-height:1.7em;color:#4e665e}p span.used{color:#9bb2aa}p.fillspan span{color:#3800b6;text-shadow:0 2px 2px white}u{text-decoration:none;font-weight:normal;position:relative;display:inline-block;border-bottom:2px dotted #ff9266;text-shadow:0px 2px 0px white;line-height:.8em}u>em{font-size:.5em;font-style:normal;font-weight:normal;line-height:1em;opacity:0;-webkit-transition:opacity 0.5s;-o-transition:opacity 0.5s;transition:opacity 0.5s;background-color:#e6e5e0;color:#4e665e;text-align:center;border-radius:12px;padding:6px 8px 8px 8px;position:absolute;z-index:1;top:100%;width:calc(100% - 15px);left:50%;margin-left:-50%;display:table}u>em:after{content:"";position:absolute;bottom:100%;left:50%;margin-left:-5px;border-width:5px;border-style:solid;border-color:transparent transparent #e6e5e0 transparent}u:hover{border-bottom:none}u:hover>em{visibility:visible;opacity:1}