HTML
<div class="popover-container popover-high-contrast popover-bottom tooltip">
<div class="tooltip-trigger-wrapper">
<button class="sb-tooltip-trigger" type="button" aria-labelledby="tooltip-:r1:">
<svg focusable="false" preserveAspectRatio="xMidYMid meet" fill="currentColor" width="16" height="16" viewBox="0 0 16 16" aria-hidden="true" xmlns="http://www.w3.org/2000/svg">
<path d="M8.5 11L8.5 6.5 6.5 6.5 6.5 7.5 7.5 7.5 7.5 11 6 11 6 12 10 12 10 11zM8 3.5c-.4 0-.8.3-.8.8S7.6 5 8 5c.4 0 .8-.3.8-.8S8.4 3.5 8 3.5z"></path >
<path d="M8,15c-3.9,0-7-3.1-7-7s3.1-7,7-7s7,3.1,7,7S11.9,15,8,15z M8,2C4.7,2,2,4.7,2,8s2.7,6,6,6s6-2.7,6-6S11.3,2,8,2z"></path >
</svg>
</button>
</div>
<span aria-hidden="true" id="tooltip-1" role="tooltip" class="popover">
<span class="popover-content tooltip-content">
Occasionally, services are updated in a specified time window to ensure no down time for customers.</span>
<span class="popover-caret"></span>
</span>
</div>
CSS