Divi mobile menu breakpoints for tablet

Sometimes the logo overlaps the menu items. The simplest way to avoid is, is setting a max-width for the logo.

This is another CSS approach: display the hamburger and the hide main navigation at a custom width.

I needed 1170px; set your own width.

/* HIDE DEFAULT MENU AND DISPLAY HAMBURGER ON CUSTOM SCREEN WIDTH */
@media only screen and (max-width: 1170px) {
    #top-menu-nav {
        display: none;
    }
    #et_mobile_nav_menu {
        display: block;
    }
}