items wont align left CSS Question

I have list items in a Movable Type calendar that aren't aligning to the left of the cell. This is essentially a stock calendar from Movable Type, so pardon my use of tables.

This is a link to the page in question:

HTML Code:

http://www.pmojo.com/calendar

Anyway, here is a snippet of CSS:

Code:

#event-calendar {
        line-height: 140%;
        color: #666666;
        font-family: Verdana, Arial, sans-serif;
        font-size: 11px;
        text-align: left;
        margin-bottom: 30px;
       }

#event-calendar li ul {
padding:0px;
margin:0px;
text-align: left;
left:0px;
}

.first {
list-style-type: none;
padding:0px;
margin:0px;
text-align: left;
left: 0px;
border-left: 1px solid #999999; /* added to see the extent of the alignment */
}

and now the HTML for a table cell:

HTML Code:

			<td valign="top" class="d24">
				21
					<ul>
						<li class="first"><a href="http://www.pmojo.com/calendar/2004/09/all_campus_chor.php">All Campus Chorale Rehearsal</a></li>
					</ul>		
			</td>

Any ideas?

Thanks in advance!