custom css for main navigation

Hi, i’ve been asking a lot of questions. Hope i’m not too much of a bother.

I’m trying to customise the main navigation a little, and trying to give each link a different colour.
so active state, hover state including the line that appears under the link.

so i’ve done the following but it doesn’t seem to work.

.menu-item-3121 .main_menu ul:first-child > li > a { font-size: 18px; color: red!important; background-color: green; }
.menu-item-3121 .main_menu ul:first-child > li > a:hover { color: orange!important; }
.menu-item-3121 .header_color .main_menu ul:first-child > li.current-menu-item > a, .header_color .main_menu ul:first-child > li.current_page_item > a { color: blue!important; }