.tooltip{
position: relative;
display: inline-block;
}
.tooltip:hover .tooltiptext{
visability: visable;
}
.tooltip .tooltiptext{
visibility: hidden;
background-color: black;
color: #fff;
width: 140px;
text-align: center;
padding:5px 0px;
border-radius: 6px;
position: absolute;
z-index: 1;
bottom:150%;
left:50%
margin-left:-70px;
}
.tooltip .tooltiptext::before{
content:"";
border:5px solid;
border-color: black-transparent transparent transparent;
position:absoulte;
top:100%;
left:50%;
margin-left:-5px;