.toolTip{
color: #341f97;
font-family: 'Montserrat', sans-serif;
font-size: 18px;
font-weight: 600;
text-transform: lowercase;
cursor: pointer;
display: inline-block;
position: relative;
transition: all 0.3s ease 0s;
}
.toolTip:hover{
color: #10ac84;
font-style: italic;
letter-spacing: 1px;
}
.toolTip:after{
content: attr(data-tip);
color: #999;
background: linear-gradient(45deg, #fff 50%, #f9f9f9 50%);
background-size: 20px 20px;
font-size: 13px;
font-style: italic;
font-weight: 500;
height: auto;
width: 180px;
padding: 5px;
border: 3px dashed #f5f5f5;
filter: blur(5px);
opacity: 0;
visibility: hidden;
z-index: 1;
transition: all 0.3s ease 0s;
}
.toolTip:hover:after{
letter-spacing: 0;
filter: blur(0);
opacity: 1;
visibility: visible;
}
.toolTip.top:after{
transform: translateX(-50%) scale(0);
position: absolute;
left: 50%;
bottom: 0;
}
.toolTip.top:hover:after{
transform: translateX(-50%) scale(1);
bottom: 110%;
}
.toolTip.right:after{
transform: translateY(50%) scale(0);
position: absolute;
left: 0;
bottom: 50%;
}
.toolTip.right:hover:after{
transform: translateY(50%) scale(1);
left: 110%;
}
@media only screen and (max-width: 767px){
.toolTip{ margin: 0 0 20px; }
}