Mobile Navigation Icon

Supper easy mobile navigation icon with animated toggle.

HTML:
<div class="mni"></div>

CSS:
.mni {
position: absolute;
top: 1em;
right: 1em;
width: 2em;
height: 2em;
cursor: pointer;
z-index: 9;
color: #777777;
transition: .2s ease all;
}
.mni.active {
transform: rotate(-90deg);
}
.mni:before {
content: " ";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 4px;
border-top: 5px solid;
border-bottom: 5px solid;
}
.mni:after {
content: " ";
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 4px;
border-top: 5px solid;
border-bottom: 5px solid;
}

JQuery:
$(document).on('click','.mni',function(){
$(this).toggleClass('active');
});