Define separate menu and submenu items

http://www.youngleek.com

I’m editing the stylesheet for the theme I’m using. I’m trying to figure out how to make the top menu and submenu items two separate items so I can change the font size of the submenu items without changing the size of the top menu items. Is there a way to define a new submenu item that I can customize?

******************************************************************
NAVIGATION STYLES
(Main Navigation)
******************************************************************/
nav[role=navigation] {
	position:relative;
	width:100%;
	margin:0px;
	background:none;
	background-image:url(library/images/bg-nav.png);
	padding:0;
}

nav[role=navigation] #searchform {
	position:absolute;
	top:10px;
	right:20px;
}

nav[role=navigation] #searchform label, nav[role=navigation] #searchform #searchsubmit {
	display:none;
}

nav[role=navigation] #searchform #s {
	background:#dedede;
	width: 150px;
	padding:5px;
	font-family:Georgia, "Times New Roman", Times, serif;
	font-size:12px;
	border:1px solid #fff;
	border-radius:3px;
	box-shadow:0 0 5px #aaa inset;
}

	nav[role=navigation] .menu {}
	nav[role=navigation] .menu ul {
		margin-right:175px;
	}
		nav[role=navigation] .menu ul li {}
			nav[role=navigation] .menu ul li a, nav[role=navigation] .menu #menu-icon {
				text-transform:lowercase;
				font-family: 'IM Fell English SC', serif;
				font-size:28px;
				line-height:43px;
				padding: 0 0.8em;
				text-shadow: 1px 1px 2px #043156;
				color:#e8e4d9;
			}
				nav[role=navigation] .menu ul li a:hover {
					background:none;
					color: #fff;
				}

				nav[role=navigation] .menu #menu-icon {
					width:100px;
					cursor:pointer;
					display:none;
				}

				nav[role=navigation] .menu ul li:first-child a {
				}

		nav[role=navigation] .menu ul li.current-menu-item a,
		.nav ul li.current_page_item a,
		nav[role=navigation] .menu ul li.current_page_item a { color:#fff; }

		nav[role=navigation] .menu ul li ul.sub-menu,
		nav[role=navigation] .menu ul li ul.children {
			background:#fafafa;
			box-shadow:1px 1px 3px #aaa;.

		}

		nav[role=navigation] .menu ul li ul.sub-menu li,
		nav[role=navigation] .menu ul li ul.children li {
			border-bottom:1px solid #f0f0f0;
			width:200px;
		}

		nav[role=navigation] .menu ul li ul.sub-menu li:first-child,
		nav[role=navigation] .menu ul li ul.children li:first-child {

		}
			nav[role=navigation] .menu ul li ul li a { color:#555; text-shadow:0px 0px; }
				nav[role=navigation] .menu ul li ul li a:hover { background:#f5f5f5; color:#555; }
			nav[role=navigation] .menu ul li ul li:last-child a {}
			nav[role=navigation] .menu ul li:hover ul {}
				nav[role=navigation] .menu ul li ul li ul.sub-menu,
				nav[role=navigation] .menu ul li ul li ul.children {
					margin-top: -43px;
				}
					nav[role=navigation] .menu ul li ul li:hover ul.sub-menu,
					nav[role=navigation] .menu ul li ul li:hover ul.children {

					}