Custom Menu -- CSS Classes

I am trying to add a custom item to my main menu. I want to add a logo, and have it float right -- away from the other menu items. I have created a Menu item, and successfully added the logo to the menu. For the CSS Classes (optional) field, I added "realtylogo".
Next, I went into my style.css file and added the following lines:
.realtylogo {
float:right;
}
That didnt work. When using Firefox's Firebug, I noticed that the class was coming out as: "realtylogo menu-item menu-item-type-custom menu-item-object-custom menu-item-270".
Could someone please help me out with my next steps? I've been working on this for a few hours, and am stumped.
Thanks so much ahead of time

btw, I also tried:
.menu-item-270 {
float:right;
}

any help would be great!

 

Figured it out. I added this following code to Appearance > Theme Options > Styling Options > Custom CSS:

#menu-main-menu #menu-item-270 {
float: right;
}