Если оставить этот табличный раритет, то в media для мелких верхнее меню скрывать display:none, нижнее показывать. Для больших - соответственно наоборот.
Треугольнички - треугольниками за счет border и before, after
Низ трапецией - вот этим html5book.ru/3d-transform, либо тоже приставленными треугольниками через before, after
Сделать справочник настолько удобным (примеры, поиск, перелинковка, что-то еще не знаю что актуально для Вашей тематики), чтобы при простом копипасте получался никому не интересный набор страниц. Тогда все посетители будут именно Ваши.
На сайтах не правильно подключен шрифт, не во всех вариациях. Может быть конфликт с установленным шрифтом.
В данном случае подключен с жирностью 300 и 400, а не отображается, там где должен быть bold.
