How to add CUSTOM CSS to change the rollover colour of the menu & buttons

Go to THEMES – CUSTOMIZE – STYLES – Click on the PENCIL to edit the current style

On the right at the bottom you find the option for ADDITIONAL CSS

and in the box you can add the code for the additional CSS,

The current CSS

/* BUTTON HOVER / / COLOUR LIGHT GREY */
.wp-element-button:hover {
background-color: #CFCFCF ;
}

/* NAVIGATION UNDERLINE / / COLOUR: BLUE DE FRANCE */
.wp-block-navigation-item__label:hover, :focus
{
color: #283044;
}

/* NAVIGATION UNDERLINE / / COLOUR: SPACE CADET */
LI.current-menu-item A
{
border-color: #2886E6 !important;
}

/* ROLLOVER ON EVENTS not / / working on / / narrow screen */

@media only screen and (min-width: 600px) {

nav.wp-block-navigation li.wp-block-navigation-item a:hover {
color: #283044 !important
}
}

/* REMOVE SUBMENU LINE */
nav.wp-block-navigation li.wp-block-navigation-item li a:visited {
border-color: white!important
}
}