<div class="show-on-mobile">
<input type="checkbox" id="hmt" class="hidden-menu-ticker">
<label class="btn-menu" for="hmt">
<span class="first"></span>
<span class="second"></span>
<span class="third"></span>
</label>
<ul class="hidden-menu">
<li><a href="#">ваша ссылка</a></li>
<li><a href="#">ваша ссылка</a></li>
<li><a href="#">ваша ссылка</a></li>
<li><a href="#">ваша ссылка</a></li>
<li><a href="#">ваша ссылка</a></li>
<li><a href="#">ваша ссылка</a></li>
<li><a href="#">ваша ссылка</a></li>
</ul>
</div>

.hidden-menu {display:block;position:fixed;list-style:none;padding:15px;box-sizing:border-box;width:320px;background:#007badcc;height:100%;top:0;right:-320px;transition:right .2s;z-index:2;-webkit-transform:translateZ(0);-webkit-backface-visibility:hidden;}
.hidden-menu li {border-bottom:1px solid #6796ab;padding:15px;text-transform:uppercase;font-size:14px;font-family:RalewaySemiBold;}
.hidden-menu a {text-decoration:none;color:#fff;}
.hidden-menu a:hover {color:#fff000;}
.hidden-menu-ticker {display:none;}
.btn-menu {color:#0058B9;position:fixed;top:22px;right:22px;cursor:pointer;transition:right .23s;z-index:3;width:25px;-webkit-transform:translateZ(0);-webkit-backface-visibility:hidden;}
.btn-menu span {display:block;height:3px;background-color:#fff;margin:5px 0 0;transition:all .1s linear .23s;position:relative;}
.btn-menu span.first {margin-top:0;}
.hidden-menu-ticker:checked ~ .btn-menu {right:-30px;}
.hidden-menu-ticker:checked ~ .hidden-menu {right:0;}
.hidden-menu-ticker:checked ~ .btn-menu span.first {-webkit-transform:rotate(45deg);top:8px;}
.hidden-menu-ticker:checked ~ .btn-menu span.second {opacity:0;}
.hidden-menu-ticker:checked ~ .btn-menu span.third {-webkit-transform:rotate(-45deg);top:-8px;}
.show-on-mobile { display:none;}
@media only screen and (max-width:620px){ .show-on-mobile { display:inline;}
header .intro {text-align:left;}
}

<script>$('.hidden-menu a').click(function(){
    $('#hmt').click()
})</script>