img.info-icon {
    height: 1.0em;
    margin-bottom: 0.2em;
    cursor: pointer;
}

.popover-type1 {
}

.popover-type2 {
}

/*
    <sup>
        <img src="/images/info.PNG" class="info-icon popover-type1"
             data-bs-toggle="popover"
             data-bs-content="X">
    </sup>

    <sup>
        <span class="popover-type2" data-bs-toggle="popover" title="X">
            <img src="/images/info.PNG" class="info-icon popover-type2"
                 alt="Info 1">
            <span id="content1" class="visually-hidden"> x <a href="https://x">X</a>
            </span>
        </span>
    </sup>
*/