having a problem styling unordered list menu

I am having a minor problem that is causing me a HUGE headache. I’ve styled my wordpress-generated page menus using the following CSS

#menu ul li {
	border: 1px solid #333333;
	width: 150px;
	margin-right: 10px;
	padding: 0px 10px 0px 0px;
}

#menu ul li a, #menu ul li a:visited, #menu ul li a:active {
	color: #CCCCCC;
	font-size: 110%;
}

#menu ul ul li {
	border: none;
	margin: 0;
	padding: 0;
}

#menu ul ul li a, #menu ul ul li a:visited, #menu ul ul li a:active {
	color: #999999;
	font-size: 70%;
	display: block;
	margin: 0;
}

and the output is the following structure

Category
          subCategory
          subCategory
          subCategory
          subCategory
    Category
          subCategory
          subCategory
          subCategory
    Category
          subCategory
          subCategory
    Category

my question is: How do I control the subCategory indent size to look like the following:

Category
     subCategory
     subCategory
     subCategory
     subCategory
    Category
     subCategory
     subCategory
     subCategory
    Category
     subCategory
     subCategory
    Category

I have read so many resources to th epoint my brain melted, but I dont want to give up on this. Any help is much appreciated ??