.menu {position: fixed; top: 0px; right: 0px; width: 215px; bottom:3em; overflow: hidden; z-index:100;
     -webkit-transform: translate3d(170px, 0, 0);
     transform: translate3d(170px, 0, 0);
     -webkit-transition: -webkit-transform 0.6s;
     transition: transform 0.6s;
}
 .menu.menu--open {
     -webkit-transform: translate3d(0, 0, 0);
     transform: translate3d(0, 0, 0);
     top:0px;
}
 .main {
     -webkit-transition: opacity 0.6s;
     transition: opacity 0.6s;
}
 .menu.menu--open + .main {
     opacity: 0.3;
     pointer-events: none;
}
 .menu__inner {position: relative; padding: 0 0px 2em 45px; width: calc(100% + 25px); height: 100%; overflow-y: auto; z-index: 100;}
 .menu ul {list-style: none; padding: 0; margin: 0; height:100%; background:#01a747; opacity:0.93;}
 .menu ul li { padding-left:10px; height:40px; line-height:40px; border-bottom: solid 1px #1cac59;}
 
 .menu.menu--anim ul li {
     -webkit-transform: translate3d(0, 0, 0);
     transform: translate3d(0, 0, 0);
}
 .menu ul li:first-child {
     -webkit-transition-delay: 0.3s;
     transition-delay: 0.3s;
}
 .menu ul li:nth-child(2) {
     -webkit-transition-delay: 0.2s;
     transition-delay: 0.2s;
}
 .menu ul li:nth-child(3) {
     -webkit-transition-delay: 0.1s;
     transition-delay: 0.1s;
}
 .menu ul li a {display: block; outline: none; color: #fff; font-size:14px;}
 .menu ul li a:hover{ color:#000;}
 .menu ul li a img{ width:18px; line-height:18px; margin-right:10px;}
 .menu ul li .fa {
     font-size: 2.5em;
     display: block;
     margin: 0 auto;
     color: #5f656f;
}
 .menu ul li span {
     font-weight: bold;
     font-size: 0.75em;
     font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}
 .menu__handle {position: absolute; top: 15px; left: 0px; padding: 0; width: 40px; height: 40px; background: url(index1_06.png); border: none; outline: none; z-index: 2000;}


 .menu__handle span {
     position: absolute;
     width: 100%;
     height: 2px;
     left: 0;
     overflow: hidden;
     text-indent: 200%;
     -webkit-transition: opacity 0.25s;
     transition: opacity 0.25s;
}

 .menu--open .menu__handle span {
     opacity: 0;
}

 .morph-shape {
     position: absolute;
     width: 240px;
     height: 100%;
     top: 0;
     right: 0;
}
 .morph-shape svg path {
    
     stroke-width: 5px;
}
 @media screen and (max-width: 63em) {
     .main {
         padding: 0 2em;
         -webkit-transition: opacity 0.6s;
         transition: opacity 0.6s;
    }
     .menu {
         -webkit-transform: translate3d(170px, 0, 0);
         transform: translate3d(170px, 0, 0);
    }
     .menu.menu--open + .main {
         opacity: 0.05;
    }
}