title: How to change MenuItem focus/hover color
body: <p>I'm trying to change the highlight/focus/hover color of menu items.</p>
  <p><a href="https://i.stack.imgur.com/X8haN.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/X8haN.png" alt="" /></a></p>
  
  <p>I'm trying to change the blue background to another color, but nothing seems to work?</p>
  <p>I've tried a few things with no luck from: <a href="https://stackoverflow.com/questions/11127999/how-do-you-set-the-style-for-a-javafx-contextmenu-using-css">How do you set the style for a JavaFX ContextMenu using css?</a>  and  <a href="https://stackoverflow.com/questions/12299162/how-to-style-menu-button-and-menu-items">How to style menu button and menu items</a></p>
  <pre><code>.context-menu:focused {
      -fx-background-color:white;
      -fx-focus-color:white;
  }
  
  .menu-item:focused {
      -fx-background-color:white;
      -fx-focus-color:white;
  }
  
  .menu:focused {
      -fx-background-color:white;
      -fx-focus-color:white;
  }
  </code></pre>
  <p>and many other variations...</p>
  <p>Also some example code that's using the menu item's</p>
  <pre><code>// Menu
  final ContextMenu contextMenu = new ContextMenu();
  </code></pre>
  <p>and construct a MenuItem:</p>
  <pre><code>maximizeMenuItem = new MenuItem(Config.getString(&quot;Maximize&quot;));
  maximizeMenuItem.setOnAction(new EventHandler&lt;ActionEvent&gt;() { /* do stuff */ }
  </code></pre>
  <p>I could try a:</p>
  <pre><code>contextMenu.setStyle(&quot;-fx-focus-color:white&quot;);
  </code></pre>
  <p>or</p>
  <pre><code>maximizeMenuItem.setStyle(&quot;-fx-focus-color:white&quot;);
  </code></pre>
  <p>but I can't seem to figure out which <code>-fx-</code> css tag controls that blue background color...</p>
  <p>If possible, please post the <code>FXML</code> solution as well as the in-line code solution.</p>