Danny Arty

Ближе к закрывающему тэгу body

Дык она в принципе будет появляться при клике) ничего писать не надо

Есть такая вещь как Woocommerce Measurement Price Calculator

Думаю это то, что вам нужно

100% уверен, что у вашего шрифта отсутствуют жирное и курсивное начертание и поэтому каждый раз, когда вы задаете любому тексту с данным шрифтом свойство font-weight: bold, браузер самостоятельно создает это начертание и вот тут возможны такие "ляпы".
Варианты такие:
1. Использовать другой шрифт
2. Поискать этот шрифт в начертании bold и определить его в font-face
3. Использовать только normal начертание с этим шрифтом на сайте

Эти метки (те, что на картинке) отображаются для категорий организаций, занесенных в Яндекс.Справочник.
Таких нет среди встроенных меток в JS API, но вы можете загрузить любые изображения меток под ваши нужды.

Например так

Если у вас компонент "Яндекс.Карты: Настраиваемая карта", то вам нужно найти файл script.js и в его коде найти строку:
{balloonCloseButton: true}
под этой строкой добавляете:

balloonCloseButton: true,
iconImageHref:"путь к картинке",
iconImageSize: [ширина, высота],

Если не ошибаюсь, то автор имел в виду это

Пропишите инлайновые стили для текста и вообще для всех элементов. А не в теге style