How to make a menu like on this site?

Question

Layout

I'm trying to make a menu like on this site https://lomonosov.school/ ?
The menu slides out when you hover over the panel on the left or on the icon in the upper left corner.

Basically, it is not possible to make the menu window overlap the content on the right.
When I hover over the menu, the right block decreases.

.leftcol{
    float: left;
    width:100px;
    background-color: rgb(229, 255, 0);
}
.leftcol:hover{
    width:200px;
    transition-duration: .5s;
    overflow: hidden;
}

Answer 1

Make the menu position:fixed and set the z-index higher than the content part