css responsive navigation

1#header{
2position:fixed;
3z-index:1000;
4left:0;
5top:0;
6width:100vw;
7height:auto;
8}
9
10#header .header{
11min-height:8vh;
12background-color: rgba(0,0,0,0.3);
13}
14
15#header .nav-bar{
16  display:flex;
17  align-items:center;
18  justify-content:space-between;
19  width:100%;
20  height:100%;
21  max-width:1300px;
22  padding:0 10px;
23}
24
25#header .nav-list ul{
26  list-style:none;
27  position:absolute;
28  background-color:rgb(31,30,30);
29  width:100vw;
30  height:100vh;
31  left:0;
32  top:0;
33  display:flex;
34  flex-direction:column;
35  justify-content:center;
36  align-items:center;
37  z-index:1;
38  overflow-x:hidden;
39}
40
41#header .nav-list ul a{
42  font-size:2.5rem;
43  font-weight:500;
44  letter-spacing: .2rem;
45  text-decoration:none;
46  color:white;
47  text-transform:uppercase;
48  padding:20px;
49  display:block;
50  
51  
52}