Hi Lisa,
That is difficult to guess at, it maybe that for some reason the order that the stylesheets were called in to the page changed.
At the moment, the stylesheets that could have affected your final navigation design are:
<link rel="stylesheet" type="text/css" href="webassist/plugins/main_menu/menu.css">
@import url("webassist/themes/segalmedia3/css/default_styles.css");
@import url("webassist/themes/segalmedia3/css/configurable.css");
But unless you have been changing the order of these (maybe adding/removing plugins) then I don't think that could have caused the change.
The first of those is just a very basic stylesheet for the menu that wouldn't affect the finer styling of the menu.
As the background colors for the a and hover states are defined in the last of these (configurable.css) then those will be the ones that are written to your page, even if you also set the background color styles in the 'default_styles.css'.
The default_styles.css is responsible for defining the basic shape (width, position, padding margin, moz-radius) of the links, the configurable.css coming after it defines the finer tuning, colors.
That's the long and useless answer,
The short and accurate answer is that I haven't a clue. If you wanted to experiment with colors some more, then it would be in the configurable.css stylesheet.