Cant Scroll After editing mobile website design - html

Question

Im making a responive website and the mobile design is fine but when I expand to desktop size I can't scroll? Does it have to do with anything in my universal selector (*)? Do I need to add media queries? Does it have to do with specificity Can you find any errors in my CSS?:
* {
margin: 0;
padding: 0;
list-style-type: none;
}
html,
body {
background-color: black;
width: 100%;
height: 100%;
max-width: 100%;
overflow-x: hidden;
text-decoration: none;
}
/*Fonts*/
#font-face {
src: url(../fonts/Montserrat-Regular.ttf);
font-family: mos;
}
#font-face {
src: url(../fonts/Montserrat-Bold.ttf);
font-family: mosbo;
}
#font-face {
src: url(../fonts/Montserrat-Italic.ttf);
font-family: mosit;
}
/*button that the user clicks to open navigation*/
#white-elip {
position: absolute;
width: 70px;
height: 70px;
left: 10px;
}
/*header*/
#picofme {
width: 220px;
height: 220px;
position: absolute;
left: 30px;
}
h1 {
color: white;
font-family: mosbo;
font-size: 1.6rem;
position: absolute;
top: 110px;
left: 35px;
}
.caption {
color: white;
font-family: mos;
font-size: 0.9rem;
width: 200px;
position: absolute;
top: 150px;
left: 20px;
}