How to have 2 separate colors between the View & Add to Cart button in the product_list.css ?

[generalexperts]

I am trying to change the colors of the these two buttons below. I would also like them aligned where the "Add to cart" button currently sits. When I change the color in product_list.css they both change. My site is http://tinyurl.com/n5pfy52 . Thank you!

 

I had previously put in this code which allowed me to move the add to cart button up.

#product_list li .ajax_add_to_cart_button {
background:#25aae1;
margin-right: -67px;
margin-top:-40px;
padding-left:15px;
top:120px;
width:62px;
z-index:10px;
}

 

I also have this in there which might be messing things up, but I've tried different variations with and without it and it didn't do anything:

#product_list li .cart_button {
background:#25aae1;
}

 

This is what I think would change the color of the View button but it does nothing...

#product_list li .lnk_view {
display:block;
margin-top:15px;
padding:0 10px;
border:none;
font-weight:bold;
color:#F90;
background:url(../img/arrow_right_1.png) no-repeat 100% 4px transparent
}

 

Edited April 21, 2014 by generalexperts (see edit history)

[generalexperts]

Can this be edited from the product_list.css? Or a different file?

[vekia]

you want to display them inline?

something like:

 

?

[generalexperts]

Yes, aligned and most importantly different colors. Thanks Vekia!

[generalexperts]

Would you be able to provide details on how to make the change of alignment and colors? Thanks