[data-tooltip]:not(:disabled)
{
cursor: help;
}

#data-tooltip {
background-color: #ffffee;
border: 1px solid #332211;
border-radius: 3px;
color: #000000;
padding: 12px 18px;
max-width: 480px;

-ms-word-break: break-all;
    word-break: break-all;
    word-break: break-word;	/* Non standard for webkit */

-webkit-hyphens: auto;
   -moz-hyphens: auto;
    -ms-hyphens: auto;
        hyphens: auto;

/*
display: block;
max-width: 380px;
width: 380px;
position: absolute;

font-family: open-sans-regular, sans-serif;
font-size: 14px;
font-weight: 600;

line-height: 22px;
box-sizing: border-box;
z-index: 3;
text-transform: none;
visibility: hidden;
outline: 0;
*/
}

#data-tooltip:before {
content: "";
display: block;
width: 0;
height: 0;
position: absolute;
/* Top by default */
left: 50%;
}

#data-tooltip:after {
content: "";
display: block;
width: 0;
height: 0;
position: absolute;
/* Top by default */
left: 50%;
}

#data-tooltip.alignment-top:before {
border-left: 6px solid transparent;
border-right: 6px solid transparent;
border-top: 6px solid #000000;
margin-top: -6px;
margin-left: -6px;
bottom: -7px;
}

#data-tooltip.alignment-top:after {
border-left: 6px solid transparent;
border-right: 6px solid transparent;
border-top: 6px solid #ffffee;
margin-top: -6px;
margin-left: -6px;
bottom: -6px;
}

#data-tooltip.alignment-bottom:before {
border-left: 6px solid transparent;
border-right: 6px solid transparent;
border-bottom: 6px solid #000000;
margin-bottom: -6px;
margin-left: -6px;
top: -7px;
}

#data-tooltip.alignment-bottom:after {
border-left: 6px solid transparent;
border-right: 6px solid transparent;
border-bottom: 6px solid #ffffee;
margin-bottom: -6px;
margin-left: -6px;
top: -6px;
}









#data-tooltip.alignment-left:before,
#data-tooltip.alignment-right:before {
top: 50%;
left: auto;
}

#data-tooltip.alignment-left:after,
#data-tooltip.alignment-right:after {
top: 50%;
left: auto;
}





#data-tooltip.alignment-left:before {
border-top: 6px solid transparent;
border-bottom: 6px solid transparent;
border-left: 6px solid #000000;
margin-left: -6px;
margin-top: -6px;
right: -7px;
}

#data-tooltip.alignment-left:after {
border-top: 6px solid transparent;
border-bottom: 6px solid transparent;
border-left: 6px solid #ffffee;
margin-left: -6px;
margin-top: -6px;
right: -6px;
}





#data-tooltip.alignment-right:before {
border-top: 6px solid transparent;
border-bottom: 6px solid transparent;
border-right: 6px solid #000000;
margin-right: -6px;
margin-top: -6px;
left: -7px;
}

#data-tooltip.alignment-right:after {
border-top: 6px solid transparent;
border-bottom: 6px solid transparent;
border-right: 6px solid #ffffee;
margin-right: -6px;
margin-top: -6px;
left: -6px;
}







/*
[data-tooltip]
{
cursor: help;
position: relative;
text-decoration: underline;
}

[data-tooltip=""]
{
cursor: default;
text-decoration: none;
}

[data-tooltip]:after
{
background-color: #ffffee;
border-radius: 5px;
border: 1px solid #332211;
box-shadow: 0  7px 25px 4px rgba(0,0,0,0.10);
box-shadow: 0 11px 35px 4px rgba(0,0,0,0.15);
color: #000000;
content: none;
display: block;
margin: -50px 0 0 50px;
overflow: hidden;
padding: 10px;
position: absolute;
white-space: pre;
width: auto;
z-index: 1;
}

[data-tooltip]:hover:after
{
content: attr(data-tooltip);
}

[data-tooltip=""]:after,
[data-tooltip=""]:hover:after
{
content: none;
}

*/