.hint-point-panel {
	position: absolute;
	/*display: none;*/
	/*z-index: 1419;*/
    z-index: 1010;
	/*-webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -ms-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;*/
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
    line-height: 20px;
    word-break: break-all;
    opacity: 0;
    visibility: hidden;
    /*left: 0;
    top: 0;*/
}
.hint-point-panel.top {
	/*margin-top: -16px; */
    margin-top: -10px;
}
.hint-point-panel.left {
    margin-left: -16px;
}
.hint-point-panel.right {
    margin-left: 16px;
}
.hint-point-panel.bottom {
    margin-top: 16px;
}
.hint-point-panel.hf-in,
.hint-point-panel.top.hf-in,
.hint-point-panel.left.hf-in,
.hint-point-panel.bottom.hf-in,
.hint-point-panel.right.hf-in {
	margin: 0px;
	opacity: 1;
	/*-webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;*/
    visibility: visible;
}
.hint-point-text {
	max-width: 200px;
	padding: 4px 8px;
	color: #fff;
	text-align: left;
	text-decoration: none;
	background-color: rgba(0, 0, 0, 0.9);
	border-radius: 4px;
    font-size: 12px;
}
.hint-point-arrow {
	position: absolute;
    width: 0;
    height: 0;
    border-color: transparent;
    border-style: solid;
}
.hint-point-panel.top .hint-point-arrow {
    bottom: -5px;
    left: 50%;
    margin-left: -5px;
    border-width: 5px 5px 0;
    border-top-color: rgba(0, 0, 0, 0.9);
}
.hint-point-panel.left .hint-point-arrow {
    top: 50%;
    right: -5px;
    margin-top: -5px;
    border-width: 5px 0 5px 5px;
    border-left-color: rgba(0, 0, 0, 0.9);
}
.hint-point-panel.right .hint-point-arrow {
    top: 50%;
    left: -5px;
    margin-top: -5px;
    border-width: 5px 5px 5px 0;
    border-right-color: rgba(0, 0, 0, 0.9);
}
.hint-point-panel.bottom .hint-point-arrow {
    top: -5px;
    left: 50%;
    margin-left: -5px;
    border-width: 0 5px 5px;
    border-bottom-color: rgba(0, 0, 0, 0.9);
}
.hint-point-panel.middle .hint-point-text {
    text-align: center;
}