Владимир Коротенко

При открытой консоли взведите эту галочку, и не забывайте про ctrl+5

Возьмите за основу
https://github.com/vkorotenko/calcxactive

https://github.com/zualex/devmap

label:after{
			  	content: '\2713';
				/*color: #203260;*/
        color: red;
        font-weight: bold;
				position: absolute;
				top: 11px;
				left: 15px;
				font-size: 2em;
				width: 20px;
				height: 16px;
				opacity: 0;
				border-radius: 5px;
			}

F12 и смотрите что за тайлы присылает вам сервер, потом идете в папку кеша браузера и копируете их.
Есть и более сложные способы.

ПС ФСБ крайне негативно относится к картографической информации высокого разрешения.

Может сделать проще? 20К кода на css, вроде немного.
https://bulma.io/documentation/components/navbar/#...

Видимо как то так
https://jsfiddle.net/vkorotenko/bkwz2fgc/

1. Относительное позиционирование
2. Список с картинками
3. Z-index
4. css animation

Немного кода.

TheBott учтите что с плагинами проблема, пока не загрузится вся страница, это не сработает, будет большой кусок текста. Так что лучше изменить разметку и получить универсальное решение, второй пример вообще на css

https://www.w3schools.com/howto/howto_js_read_more.asp
https://codepen.io/Idered/pen/AeBgF

Крутая задачка как по мне :)
Но в общем можно реализовать примерно так:

1. WordPress - авторизация, создание страниц, навигация и прочие плагины
2. Курсы - страница с интерактивными курсами просто список, в зависимости от роли появляются различные диаграммы.
2.1 - плагин который делает запросы непосредственно к базе курсов, написать на связке vue + php (админ)
2.2 - плагин который будет выводить прогресс курсов для обычных пользователей
3. Страница курса - шапка, ссылки на обучающие модули, окончательное тестирование
4. модуль окончательного тестирования
4.1 - серверная часть, которая выбирает случайные вопросы из курса, для того что бы каждому был выдан индивидуальный набор вопросов
4.2 - клиентская часть. Проверка правильности.
4.3 - Типы проверяемых данных.
* строка - точное соответствие/ нечеткое соответствие (Нижний регистр)
* число - результат вычисления
* дата - дата
* картинка - выбор картинки соответствующей вопросу
* чекбоксы - выбор из набора вариантов
* радиокнопки - выбор единственного из вариантов
* Кастомный ответ - Поле ввода, которое проверяется непосредственно преподавателем.
4.4 - В зависимости от результатов вывод прошел не прошел и вывод страницы с результатами. Занесение результатов в базу