Не применится шрифт на всех уровнях меню
 

Привет всем!
Я тут недавно постил проблемки разбираясь с CSS в Zoo-Blog. Но те траблы я победил!!разобрался где и чего лежит. Шрифт сделал какой мне надо! Сайт уже выходит на финишную прямую (почти) и сейчас настал черед главного и выпадающего меню.
Использую шаблон YT Drive. Сделал некоторые изменения в шаблоне по шрифтам - внедрил туда свои шрифты(кириллические), делал по мануалу от Yootheme. Все получилось, шрифты даже стали доступны в настройках шаблона в админке и для меню я выбрал шрифт GunnyRewrittenRegular.
Главное меню теперь выглядит так:

и другой блок


Как видно, верхний уровень 1 меню применил к себе шрифт. А под уровни ни фига!
------вот код CSS для стиля меню--------------------------
.menu-dropdown a.level1,
.menu-dropdown span.level1 {
font-family: "GunnyRewrittenRegular", Arial, Helvetica, sans-serif; /* шрифт главного меню */
font-size: 20px;
}

.menu-dropdown .level2 (тут можно изменять шрифт подменю) > span > span.subtitle,
.menu-dropdown li.level3 { font-size: 14px; } /* подписи в подменю */

.menu-dropdown .level1 > span > span.subtitle { font-size: 12px; } /*подписи в главном меню
-------------------------------------------------------------------
Проблема в том, что я ни как не могу правильно отредактировать этот CSS чтобы все уровни меню были шрифтом GunnyRewrittenRegular
К примеру: такой код дает следующий результат:
-------------------------------------------------------------------
.menu-dropdown a.level1,
.menu-dropdown span.level1 {
font-family: "GunnyRewrittenRegular", Arial, Helvetica, sans-serif;
font-size: 22px;
}

.menu-dropdown .level2 > span > span.subtitle,
.menu-dropdown li.level3 { font-family: "GunnyRewrittenRegular", Arial, Helvetica, sans-serif; font-size: 14px; }

.menu-dropdown .level1 > span > span.subtitle { font-size: 12px; }
-------------------------------------------------------------------


Видим, что шрифт поменялся у широкого меню (Блоги). Теперь пробуем поменять шрифт в выпадающем меню у пункта "Яркий Кадр"
-------------------------------------------------------------------
.menu-dropdown a.level1,
.menu-dropdown span.level1 {
font-family: "GunnyRewrittenRegular", Arial, Helvetica, sans-serif;
font-size: 22px;
}

.menu-dropdown .level2 { font-family: "GunnyRewrittenRegular", Arial, Helvetica, sans-serif; font-size: 14px; } > span > span.subtitle,
.menu-dropdown li.level3 { font-family: "GunnyRewrittenRegular", Arial, Helvetica, sans-serif; font-size: 14px; }

.menu-dropdown .level1 > span > span.subtitle { font-size: 12px; }
-------------------------------------------------------------------
Видим, что шрифт применился:

но у подменю БЛОГИ шрифт стал УЛТРА-мелким! И увеличивая размер в font-size, шрифт не увеличивается!

Вот я и не могу понять как тут между SPAN-ами правильно разместить описание шрифта для всего меню целиком
Прошу прощения за подобие стенгазеты, попытался более подробно представить проблему. Очень прошу помочь в написании правильного синтаксиса в этом CSS, для того чтобы шрифт был везде одинаковый на трех уровнях меню:
1) Главное меню - уровень 1
2) Подменю - уровень 2
3) Subtitle - это подпись в меню (познавательный уголок, мир графики, мир кино и т.п.)

Спасибо!