modificare colore al passaggio del cursore su link

[ludo13]

buonasera a tutti. scusatemi ma non ci capisco niente di css chiedo aiuto a voi. ho un tema wordpress che vorrei modificare. non posso mettere un link perchè non è attivo e ci sto alvorando in locale, però provo lo stesso a farmi capire. praticamente nella barra in alto vi è il classico spazio per il logo e a fianco vi è un menù. ho cambiato colore (da rosso a blu) come background, però il problema è che quando si passa col mouse su una delle pagine del menu di navigazione appare il colore rosso di default, e non l'ho trovato nel css. li ho guardati tutti tramite firebug e nel foglio di stile. come devo fare per cambiare anche questo? il tema se può interessare è https://wordpress.org/themes/start-point e il codice che trovo (credo riguardante il menu in oggetto) è:

.menu-wrapper {
  width: 100%;
  z-index: 3;
  position: fixed;
}
.menu-wrapper-bg {
  background: #09a0e7;
}
.menu-wrapper.notvisible.single-page-nav {
    visibility: hidden;
    position: static;
    top:0;
}
.menu-sp ul {
    float: right;
}
.menu-sp ul a{
    color: #fff;
    font-size: 16px;
}
.menu-sp ul a:hover {
    color: #000;
    transition: color .4s;
}
.menu-sp ul a.current, li.current_page_item > a , li.current_menu_item > a{
  color: #000;
  transition: color .4s;
}
.mm-menu li.current_page_item > a, .mm-menu li.current_menu_item > a {
background: rgba(0, 0, 0, 0.1);
color: rgba(255, 255, 255, 0.3);
}
.mm-menu .mm-list > li.current_page_item:after, .mm-menu .mm-list > 

li.current_menu_item:after {
    border-color: rgba(0, 0, 0, 0);
}
.menu-sp ul li {
    display: inline-block;
    height: 63px;
}
.menu-sp ul ul li {
  display: block;
}
.menu-sp ul li a {
    padding-top: 18px;
    padding-bottom: 21px;
    padding-left: 10px;
    padding-right: 10px;
    display: inline-block;
}
.menu-sp ul li:after {
    content: "/";
    color: #fff;
  }
  .menu-sp ul ul li:after {
    content: "";
  }
 .menu-sp ul li:last-child:after {
    content:"";
  }
.menu-sp ul ul li {
  height: 42px;
}
.menu-sp ul ul li a {
  padding-bottom: 10px;
  padding-top: 8px;
}
/* mobile menu */ 
.mm-fixed-top a  img{
    width: 40px;
    height: 40px;
}
.mm-fixed-top { 
    z-index: 4;
}
.mm-fixed-top {
  display: none;
}
/*----- Menu Ends -----*/

e inoltre come faccio a rerndere più trasparente il bakground?
vi ringrazio

[KillerWorm]

Ciao, prima di modificare il css, hai provato ad agire, da wordpress, sul pannello di controllo del tema?
Io non lo conosco ma, facendo qualche ricerca, ho visto che c'è qualche opzione per definire proprio il colore del tema.

Vedi "How to change Theme Style options?" nella documentazione.

[ludo13]

Grazie mille KillerWorm, il problema è che non ho il premium, ma il free e quindi non ci sono quelle opzioni defo agire per forza sul css...qualche dritta?

[ludo13]

ok ho risolto peril colore era dentro un file "superfish". mentre per rendere più yrasparente come si fa?

[KillerWorm]

Ok, per la trasparenza del colore di sfondo puoi usare la notazione rgba();

Ad esempio:

background-color: rgba(0, 0, 255, .5); // blu pieno con opacità al 50%

[ludo13]

ma lo devo aggiungere dove? rispetto al codice che ho postato intendo

[KillerWorm]

e inoltre come faccio a rerndere più trasparente il bakground?

Puoi chiarire di che background stai parlando?
Se intendi quello dei vari elementi del menu, in tal caso dovrai aggiungerlo, o perlomeno sostituirlo, per ogni elemento a cui vuoi dare la trasparenza.
Ad esempio, nel file superfish.css, al posto di ogni background: #e76756; (che indica il colore rosso del tema originale) puoi mettere background: rgba(0, 0, 255, .5); specificando, chiaramente, i valori delle componenti e dell'opacità che desideri.

[ludo13]

intendo su tutta la striscia credo che sia <div class="menu-wrapper-bg">, in modo che quando si scorre la pagina si intraveda ciò che c'è sotto. ho provato ad aggiungerlo dopo background: none repeat scroll 0 0 #09a0e7; con firebug ma non cambia....

[KillerWorm]

Ok, fa riferimento al file style.css.
Guarda alla riga 134. Sostituisci questo:

.menu-wrapper-bg {
  background: #e76756;
}

con una cosa del genere:

.menu-wrapper-bg {
  background: rgba(0, 0, 255, .5);
}

Ugualmente, su firebug puoi inserire direttamente rgba(0, 0, 255, .5); sostituendolo a tutto ciò che hai trovato in background: su tale elemento.

[ludo13]

provato, ma ritorna rosso e non è trasparente