/**
 * All of the CSS for your public-facing functionality should be
 * included in this file.
 */

 .title-tip[title]:hover {
    position: relative;
  }
  .title-tip[title]:hover:before {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 99999;
    content: attr(title);
    margin-top: 0.5em;
    padding: 0.5em;
    width: 125px;    /* change it */
    overflow: hidden;
    word-wrap: break-word;
    font-size: inherit;
    color: #000;
    text-align: center;
    background-color: #fafafa;
    box-sizing: border-box;
    border: 1px solid #f0f0f0;
    border-radius: 3px;
  }
  .title-tip[title]:hover:after {
    position: absolute;
    top: 100%;
    left: 50%;
    z-index: 99999;
    content: '';
    margin-left: -0.125em;
    width: 0;
    height: 0;
    border: 0.25em dashed transparent;
    border-bottom: 0.25em solid #FFF;
    font-size: inherit;
  }
  
  /* title-tip-up */
  .title-tip-up[title]:hover:before {
    top: auto;
    bottom: 100%;
    margin-top: 0;
    margin-bottom: 0.5em;
  }
  .title-tip-up[title]:hover:after {
    top: auto;
    bottom: 100%;
    border: 0.25em dashed transparent;
    border-top: 0.25em solid #222;
  }