div.proposal {
    border: 4px solid #b28aec;
    padding: 20px;
    position: relative;
    background-color: white;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="300" height="300"><text x="50%" y="50%" font-family="Arial" font-size="24" font-weight="bold" fill="rgba(178, 138, 236, 0.2)" text-anchor="middle" dominant-baseline="middle" transform="rotate(-45, 150, 150)">PROPOSAL</text></svg>');
    background-repeat: repeat;
    background-size: 300px 300px;
  }
  
  div.current {
    position: relative;
    z-index: 1;
  }


  .tooltip{
    position: relative;
  }
  
  .tooltip:before,
  .tooltip:after{
    --scale: 0;	
    --arrow-size: 8px;
    --tooltip-text-color: hsla(191, 0%, 95%, 0.9);
    --tooltip-color: #4a4a4a;
    /*--tooltip-text-color: white;
    --toolip-color: rgb(58, 58, 58);*/
    position: absolute;
    top: -.25rem;
    left: 50%;
    transform: translateX(-50%)  translateY(var(--translate-y, 0)) scale(var(--scale));
    transition: 150ms transform;
    transform-origin: bottom center;
  }
  
  .tooltip:before{
    --translate-y: calc(-100% - var(--arrow-size));
    content: attr(data-tooltip);
          color: var(--tooltip-text-color);
    font-size: .8rem; 
    line-height: 1;
    padding: .4rem .6rem;
    width: max-content;
    background: var(--tooltip-color);	
    border-radius: .3rem;
    text-align: center;
  }
  
  .tooltip:hover:before,
  .tooltip:hover:after{
    --scale: 1;
  }
  
  .tooltip:after{
    --translate-y: calc(-1 * var(--arrow-size));
    content:'';
    border: var(--arrow-size) solid transparent;
    border-top-color: var(--tooltip-color);
    transform-origin: top center;
  }

  .anchorLink {
    display: flex;
    align-items:center;
  }

  .anchorLink:hover .linky{
    opacity:100%;
  }

  .linky {
    height:1em;
    width:1em;
    background-image: url('data:image/svg+xml,<svg  version="1.1" viewBox="0 0 16 16" aria-hidden="true"  xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg>');;
    display: flex;
    align-items: center;
    padding-left: 0.5em;
    border: 0;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: contain;
    margin-left:0.5em;
    opacity: 0;
    transition: 0.1s;

    font-family: "Lato", "proxima-nova", "Helvetica Neue", "Arial", sans-serif;
    font-size: 16px;
  }

  
  .linky:hover {
    cursor:pointer;
 
  }