.information-tool-tip {
    background-image: url("/Dashboard/style/svgicons/media-chooser/grayToolTipIcon.svg");
    display: block;
    height: 24px;
    width: 24px;
}

.react-info-tooltip {
    position: relative;
    display: inline-flex;
    align-items: center;
    vertical-align: middle;
    height: fit-content;
    cursor: pointer;
}

.react-info-tooltip-icon {
    width: 100%;
}

.tooltip.react-info-tooltip-text {
    opacity: 1;
    z-index: 10200;
}

.tooltip.react-info-tooltip-text > .tooltip-inner {
    background-color: #4C4C4C !important;
    border-radius: 4px !important;
    padding: 10px;
}

.tooltip.react-info-tooltip-text.bottom-tooltip > .tooltip-arrow {
    border-bottom-color: #4C4C4C !important;
    top: -3px;
    left: calc(50% - 3px) !important;
    border-width: 0 8px 8px;
}

.tooltip.react-info-tooltip-text.top-tooltip > .tooltip-arrow {
    border-top-color: #4C4C4C !important;
    left: calc(50% - 3px);
    border-width: 8px 8px 0 8px;
}

.tooltip.react-info-tooltip-text.left-tooltip > .tooltip-arrow {
    border-left-color: #4C4C4C !important;
    top: calc(50% - 2px);
    right: -3px;
    border-width: 8px 0 8px 8px;
}

.tooltip.react-info-tooltip-text.right-tooltip > .tooltip-arrow {
    border-right-color: #4C4C4C !important;
    top: calc(50% - 2px);
    left: -3px;
    border-width: 8px 8px 8px 0;
}