I have insert burger menu code , but not can response .

body {
background: #0B010C;
font: 1/1.5 'Asap', sans-serif;
-webkit-font-smoothing: antialiased;
}

.content {
position: relative;
width: 70%;
height: 100vh;
margin: 10px auto;
background-size: cover;
background-position: center center;
}
.content .overlay {
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(72, 98, 163, 0.9);
}
.content .overlay nav {
text-align: center;
position: relative;
height: 100vh;
top: 50%;
margin-top: -50px;
-webkit-transform: translateY(-30%);
transform: translateY(-30%);
}
.content .overlay nav ul li {
list-style: none;
display: block;
}
.content .overlay nav ul li a {
font-size: 2rem;
line-height: 3rem;
letter-spacing: .1rem;
color: #fff;
font-weight: 100;
transition: all 0.4s;
-webkit-transition: all 0.4s;
-moz-transition: all 0.4s;
}
.content .overlay nav ul li a:hover {
color: rgba(4, 47, 78, 0.58);
}

.overlay-huge {
opacity: 0;
visibility: hidden;
-webkit-transition: opacity 0.5s, visibility 0s 0.5s;
transition: opacity 0.5s, visibility 0s 0.5s;
}

.overlay-huge.open {
opacity: 1;
visibility: visible;
-webkit-transition: opacity 0.5s;
transition: opacity 0.5s;
}

.overlay-hugeinc nav {
-webkit-perspective: 1200px;
perspective: 1200px;
}

.overlay-huge.open nav ul {
opacity: 1;
-webkit-transform: rotateX(0deg);
transform: rotateX(0deg);
}

.overlay-huge nav ul {
opacity: 0.4;
-webkit-transform: translateY(-15%) rotateX(35deg);
transform: translateY(-15%) rotateX(35deg);
-webkit-transition: -webkit-transform 0.5s, opacity 0.5s;
-webkit-transition: opacity 0.5s, -webkit-transform 0.5s;
transition: opacity 0.5s, -webkit-transform 0.5s;
transition: transform 0.5s, opacity 0.5s;
transition: transform 0.5s, opacity 0.5s, -webkit-transform 0.5s;
}

.navigation {
position: absolute;
right: 0;
top: 0px;
width: 100%;
height: 50px;
cursor: pointer;
z-index: 999;
background: rgba(4, 47, 78, 0.58);
}
.navigation #hamburger-icon {
position: absolute;
top: 13px;
right: 15px;
width: 20px;
height: 20px;
}

#hamburger-icon {
display: block;
}
#hamburger-icon .line {
display: block;
background: #fff;
width: 20px;
height: 1px;
position: absolute;
left: 0;
border-radius: 0.5px;
transition: all 0.4s;
-webkit-transition: all 0.4s;
-moz-transition: all 0.4s;
}
#hamburger-icon .line.line-1 {
top: 0;
}
#hamburger-icon .line.line-2 {
top: 50%;
}
#hamburger-icon .line.line-3 {
top: 100%;
}
#hamburger-icon:hover .line-1, #hamburger-icon:focus .line-1 {
transform: translateY(-0.5px);
-webkit-transform: translateY(-0.5px);
-moz-transform: translateY(-0.5px);
}
#hamburger-icon:hover .line-3, #hamburger-icon:focus .line-3 {
transform: translateY(0.5px);
-webkit-transform: translateY(0.5px);
-moz-transform: translateY(0.5px);
}
#hamburger-icon.active .line-1 {
transform: translateY(10px) translateX(0) rotate(45deg);
-webkit-transform: translateY(10px) translateX(0) rotate(45deg);
-moz-transform: translateY(10px) translateX(0) rotate(45deg);
}
#hamburger-icon.active .line-2 {
opacity: 0;
}
#hamburger-icon.active .line-3 {
transform: translateY(-10px) translateX(0) rotate(-45deg);
-webkit-transform: translateY(-10px) translateX(0) rotate(-45deg);
-moz-transform: translateY(-10px) translateX(0) rotate(-45deg);
}