Highlight the “Home” / “Blog” button while on main page

WordPress marks the currently displayed page in the menu with CSS classes .current-menu-item, .current-menu-parent, .current-menu-ancestor. Add the required styles to highlight items using these classes.

Sample Menu:

* Blog
  * First Category
  * Second Category
* About
* Contact

When you open blog page, the corresponding menu item (“Blog“) has a class .current-menu-item. Similarly, when you open a contact page, the corresponding menu item will have a class .current-menu-item.

if you go to the page second category, the menu item “Second Category” will have class .current-menu-item and “Blog” item will have class .current-menu-parent.


UPDATE (Highlight similar to hover)

To highlight “Blog” on your site when you are on the home page or one of the categories (“Music & Party”, “Travel & Culture”, etc.) add to styles:

.home #menu-item-1258 > a span, 
#menu-main > .current-menu-item > a span, 
#menu-main > .current-menu-parent > a span, 
#menu-main ul .current-menu-item, 
#menu-main ul .current-menu-parent { 
   background-color: #37cadd; 
}