Using Multi-Level Push Menu jQuery Plugin but left opsition it's pushing content off screen

Design help Custom code
1

I am using the Multi-Level Push Menu jQuery plugin. It’s working good as per CodePen http://codepen.io/gutterboy/pen/WQKrya.

Main problem is change the menu position right to left.

When the menu expand, horizontal scroll bar come and content area beneath the menu and also pushing content off screen .

I change CSS and JS for change the menu position.

.main-wrap {
margin-top: 57px;
margin-left:40px;
}
.multilevelpushmenu_wrapper {
position: fixed;
top: 57px;
left: 0;
overflow: hidden;
min-width: 100%;
min-height: 100%;
margin: 0;
padding: 0;
}

$(document).ready(function(){
// HTML markup implementation, overlap mode
$( ‘#menu’ ).multilevelpushmenu({
containersToPush: [ $( ‘.main-wrap’ ) ],
menuWidth: ‘15%’,
menuHeight: ‘100%’,
menuID: ‘menu_multilevelpushmenu’,
‘preventItemClick’: true,
‘preventGroupItemClick’: true,
‘collapsed’: true,
‘fullCollapse’: false,
‘direction’: ‘ltr’
});
});