.hintClass {
    color: #404040;
    font-size: 12px;
    font-family: Roboto, Arial, Helvetica, sans-serif;
    border: 0px;
    text-align: center;
    position: relative;
}


.hintClass2 {
    border: none;
   /* font-size: 10px;
    font-family: "Roboto", "Lucida Console", "Courier New", monospace;*/
/*    padding: 5px 0;  */
    position: relative;

    content: attr(data-text); /* here's the magic */
    /*position:absolute;*/

    /* vertically center */
    /*top:50%;
    transform:translateY(-20%);*/

    /* move to right */
    /*left:100%;
    margin-left:15px;*/ /* and add a small left margin */

    /* basic styles */
    /*width:200px;*/
    padding:5px;
    border-radius:5px;
    background:#ffefbb;
    color: #404040;
    text-align:center;
}