Будьте любезны! Прошу помощи! Спасибо! Как уменьшить размер шрифта подменю? В чём есть ошибки. Спасибо!

Курсы §13. Мастерская: создаём меню
1

Код HTML

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>Испытание: многоуровневое меню</title>
    </head>
    <body>
        <ul class="main-menu">
            <li class="active">
                <a href="/courses">Курсы</a>
                <ul>
                    <li><a href="/courses/4">Знакомство</a></li>
                    <li><a href="/courses/42">Селекторы</a></li>
                    <li><a href="/courses/45">Позиционирование</a></li>
                </ul>
            </li>
            <li><a href="/demos">Демонстрации</a></li>
            <li><a href="/public_profiles">Участники</a></li>
            <li><a href="/achievments">Достижения</a></li>
        </ul>
    </body>
</html>

CSS:

html,
body {
margin: 0;
padding: 0;
}

body {
width: 280px;
min-height: 280px;
padding: 10px;
font-family: “Arial”, sans-serif;
font-size: 14px;
line-height: 1.4;
background: #ecf0f1;
}

.main-menu {
padding:0px;
margin:0px;
width:190px;
list-style:none;
}

.main-menu>li {
background:#2980b9;
color:#ffffff;
}

.main-menu >li> a {
border-bottom:2px solid #2c3e50;
}

.main-menu a {
color:#ffffff;
text-decoration:none;
display:table;
padding:10px 15px;
width:160px;
}

.main-menu>.active>a {
background:#1abc9c;
}

.main-menu ul {
padding:0px;
margin:0px;
list-style:none;
text-decoration:underline;
background:#ffffff;
border-bottom:2px solid #2c3e50;
}

.main-menu ul a {
color:#2980b9;
}