On a recent application developed using APEX 5 and the new Universal Theme, I wanted to totally hide the left navigation menu on entry to the page. The menu can be expanded by clicking on the menu control button and then manually compressed again by clicking the button again. However, when compressed I wanted it to completely close, and not leave the slim bar of icons on the left. I accomplished this in two steps.

First, to set the default menu bar setting to closed on entry, I added the following javascript to the page Javascript -> Execute when page loads:] 

$(window).on("theme42ready", function() {
 
   if ($("body").hasClass("js-navExpanded")) {
 
   $("#t_Button_navControl").click();
 
  }
 
});

Note, I found these references to using the above code:

https://community.oracle.com/message/13076306
https://community.oracle.com/message/13051415

Next, to completely close the navigation, rather than the default of a slim bar on the left, I found the media tags for mobile and added the contained CSS to the page CSS -> inline:

.apex-side-nav.js-navExpanded .t-Body-content, 
.apex-side-nav.js-navExpanded .t-Body-side, 
.apex-side-nav.js-navExpanded .t-Body-title {
    margin-left: 0;
}
.apex-side-nav.js-navExpanded .t-Body-main {
    margin-left: 0;
    transform: translate3d(200px, 0px, 0px);
}
.apex-side-nav.js-navCollapsed .t-Body-nav {
    transform: translateX(-40px);
}
.apex-side-nav.js-navCollapsed .t-Body-content, 
.apex-side-nav.js-navCollapsed .t-Body-side, 
.apex-side-nav.js-navCollapsed .t-Body-title {
    margin-left: 0;
}
.t-PageBody--login, .t-PageBody--login .t-Body {
    background-color: #fff;
}

The highlighting of an active menu selection seemed a little light, so I added the following CSS to the CSS -> inline page sections:

.a-TreeView-content.is-current {
  background: green;
}

Thats it, now when the page is open the navigation bar on the left is completely hidden until manually opened/closed.