css3 – Problem with the vertical menu css and html5

It has happened to comment, I made a vertical menu, it works fine, the problem is that it is corrected, what I want, but when the previous items pass, they disappear. I know the overflow scrolls, but I have another button to open the menu that I can not get, and if I scroll I go, I need the menu to scroll without losing the button or the fixed menu. I explain myself. Here is the html

 

and that's the css

.menuModulos {
position: fixed;
height: 100%;
width: 10rem;
background color: black;
z-index: 1000;
left: -10rem;


}

.menuModules li {

list style: none;
left margin: -3rem;
}

.menuModulos ul {
position: relative;
upper margin: 10%;
overflow-y: visible;
}

.menuModulos .BotonAbrirMenu {
position: absolute! important;
height: 2rem! important;
width: 10rem! important;
left margin: 60%! important;
margin-top: 20rem! important;
transform: rotate (90deg)! important;
-webkit-transform: rotation (90deg);
-moz-transform: rotation (90deg);
-ms-transform: rotation (90deg);
-o-transform: rotate (90deg);
}

I hope you can give me a hand.