.tooltips {
    position: relative;
    display: inline; 
	border-bottom:2px dotted #222222;
}


a.tooltips, .tooltips a { 
text-decoration:none; 
}


.tooltips div {
    position: absolute;
    padding:8px;
    max-width:450px;
    min-width:180px;
    font-family:sans-serif,Arial,Helvetica;
    font-style:normal;
    font-size:15px;
    font-weight:normal;
    text-decoration:none;
    color:#000000;
    background:#FFF6C3;
    border:2px solid #FFEE88;
    border-radius: 0.3em;
    box-shadow: 0.3em 0.3em 0.2em #666666;
    white-space:normal;
    text-align: center;
    visibility: hidden;
}


.tooltips div:before {
    content: '';
    position: absolute;
    bottom: 100%;
    left: 7%;
    margin-left: -12px;
    width: 0; height: 0;
    border-bottom: 12px solid #FFEE88;
    border-right: 12px solid transparent;
    border-left: 12px solid transparent;
}


.tooltips div:after {
    content: '';
    position: absolute;
    bottom: 100%;
    left: 7%;
    margin-left: -8px;
    width: 0; height: 0;
    border-bottom: 8px solid #FFF6C3;
    border-right: 8px solid transparent;
    border-left: 8px solid transparent;
}


.tooltips:hover div {
    visibility: visible;
    opacity: 1;
    top: 38px;
    left: 0%;
    margin-left: -4px;
    z-index: 999;
}