#tooltip
{
    display:none;
    position:absolute;
    z-index:99;
    padding:5px 7px;
    font-size:11px !important;
    background-color:#faf5ae;
    color:#000;
    border-radius:3px;
    max-width:350px;
    z-index:99999;
    pointer-events: none;
    
    border:1px solid rgba(0,0,0,.15);
    
    
    box-shadow: 0 0 10px rgba(0,0,0,.15);
    
    -webkit-user-select: none;

    white-space: -moz-pre-wrap !important;  /* Mozilla, since 1999 */
    white-space: -webkit-pre-wrap; /*Chrome & Safari */ 
    white-space: -pre-wrap;        /* Opera 4-6 */
    white-space: -o-pre-wrap;      /* Opera 7 */
    white-space: pre-wrap;         /* CSS3 */
    word-wrap: break-word;         /* Internet Explorer 5.5+ */
    word-break: break-all;
    white-space: normal;
}


/* Down arrow */
#tooltop.up
{
    
}
#tooltip.up:before
{
    content:"";
    position:absolute;
    top: 100%;
    margin-top:1px;
    left: 50%;
	border-left: 5px solid transparent;
	border-right: 5px solid transparent;
	border-top: 5px solid rgba(0,0,0,.15);
    z-index:100;

    
    transform:translateX(-50%);
}
#tooltip.up:after
{
    content:"";
    position:absolute;
    top: 100%;
    left: 50%;
	border-left: 5px solid transparent;
	border-right: 5px solid transparent;
	border-top: 5px solid #faf5ae;
    z-index:100;

    
    transform:translateX(-50%);
}


/* Left arrow */
#tooltop.right
{
    
}
#tooltip.right:before
{
    content:"";
    position:absolute;
    left:0;
    margin-left:-6px;
	border-top: 5px solid transparent;
	border-bottom: 5px solid transparent;
	border-right: 5px solid rgba(0,0,0,.15);
    z-index:100;

    top: 50%;
    transform:translatey(-50%);
}

#tooltip.right:after
{
    content:"";
    position:absolute;
    left:0;
    margin-left:-5px;
	border-top: 5px solid transparent;
	border-bottom: 5px solid transparent;
	border-right: 5px solid #faf5ae;
    z-index:100;

    
    top: 50%;
    transform:translatey(-50%);
}

/* right arrow */
#tooltop.left
{
    
}
#tooltip.left:before
{
    content:"";
    position:absolute;
    right:-6px;
	border-top: 5px solid transparent;
	border-bottom: 5px solid transparent;
	border-left: 5px solid rgba(0,0,0,.15);
    z-index:100;

    top: 50%;
    transform:translatey(-50%);
}

#tooltip.left:after
{
    content:"";
    position:absolute;
    right:-5px;
	border-top: 5px solid transparent;
	border-bottom: 5px solid transparent;
	border-left: 5px solid #faf5ae;
    z-index:100;

    
    top: 50%;
    transform:translatey(-50%);
}

/* up arrow */
#tooltop.down
{
    
}
#tooltip.down:before
{
    content:"";
    position:absolute;
    top: -6px;
	border-left: 5px solid transparent;
	border-right: 5px solid transparent;
	border-bottom: 5px solid rgba(0,0,0,.15);
    z-index:100;

    left: 50%;
    transform:translateX(-50%);
}

#tooltip.down:after
{
    content:"";
    position:absolute;
    top: -5px;
    
	border-left: 5px solid transparent;
	border-right: 5px solid transparent;
	border-bottom: 5px solid #faf5ae;
    z-index:100;

    left: 50%;
    transform:translateX(-50%);
}