.zctooltip {    position: absolute;    top: 0;    left: 0;    outline: 0;    transition-property: opacity, transform;    transition-timing-function: cubic-bezier(0.16, 1, 0.3, 1);    pointer-events: none;    user-select: none;    -webkit-user-select: none;    -moz-user-select: none;    -ms-user-select: none;}.zctooltip:not(.zctooltip-visible) {    opacity: 0;}.zctooltip.zctooltip-visible {    opacity: 1;}.zctooltip-box {    position: relative;    background: #3d3d3d;    color: #fff;    padding: 4px 10px;    border-radius: 4px;    font-size: 12px;    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);    line-height: normal;    word-wrap: break-word;    box-sizing: content-box;}.zctooltip-box::before {    content: '';    position: absolute;    border: 6px solid transparent;}.zctooltip-arrow-top .zctooltip-box::before {        position: absolute;    top: 100%;    left: 50%;    transform: translateX(-50%);    border-top-color: #3d3d3d;    margin-bottom: -1px;}.zctooltip-arrow-bottom .zctooltip-box::before {    position: absolute;    bottom: 100%;    left: 50%;    transform: translateX(-50%);    border-bottom-color: #3d3d3d;    margin-top: -1px;}.zctooltip-arrow-left .zctooltip-box::before {    position: absolute;    left: 100%;    top: 50%;    transform: translateY(-50%);    border-left-color: #3d3d3d;    margin-right: -1px;}.zctooltip-arrow-right .zctooltip-box::before {    position: absolute;    right: 100%;    top: 50%;    transform: translateY(-50%);    border-right-color: #3d3d3d;    margin-left: -1px;}