With left menu I have problems with Bootstrap 4.1 pages layout

[mstdmstdd]

Hello all.
Could you please to look at layout of the Bootstrap 4.1 page:
http://demo2.nilov-sergey-demo-apps.tk/admin/warehouses/2/edit
It is under credentials   admin@demo.com 111111

I made menu at left side by some sample(it must be hidden on small device).
But with this left menu there are some features I would like to fix :

1) I need page content (blue border) to be centered and it is ruled by styles :

.wrapper {
  display: flex;
  align-items: stretch;
  border: 2px dotted red;
  margin-right: auto;
  margin-left: auto;
  padding: 0 !important;
}

#page-wrapper {
  margin-right: 10px;
  margin-left: 10px;
  padding: 0 !important;
  width: 100% !important;
  border: 1px solid blue !important;
  align-content: center;
}

Looks like the reason is in props display and align-items of wrapper class, but when I tried to modify these values
the left menu stopped working

2) Listing http://demo2.nilov-sergey-demo-apps.tk/admin/clients with many columns must be with horizontal scrolling,
but instead scrolling of table with data with syntax

<div class="table-responsive">
    <div id="get-client-dt-listing-table_wrapper" class="dataTables_wrapper no-footer">

    
all page is moving by mouse move. Again I suspect that is because of left menu

How to fix it ?

Thanks!