#my-mmenu {position: fixed; top: 0px !important;display: block !important; box-shadow: initial !important; left: 0px !important;z-index: 100 !important;height: 100% !important; width: 100%!important;transform: translateX(-100%);-webkit-transition: all .4s, font-size 0s;-o-transition: all .4s, font-size 0s;transition: all .4s, font-size 0s;}
#my-mmenu.bg {background: rgba(0,0,0,0.5);}
#my-mmenu ul {width: 80%;min-width: 140px;max-width: 440px;height: 100%;background: #FFF;padding-left: 0px;}
#my-mmenu ul li {border-bottom: 1px solid #DDD;line-height: 20px;display: block;}
#my-mmenu ul li:hover {background: #CCC;}
#my-mmenu ul li:hover a {text-decoration: none;color: #555;}
#my-mmenu ul li.active {background: #CCC;}
#my-mmenu ul li.active .openNav { padding: 0px; text-align: center; }
#my-mmenu ul li .openNav.active::before {content: '\f00d';}
#my-mmenu ul li .openNav {float: right;background: rgba(0, 0, 0, 0.1);cursor: pointer; width: 45px; height: 45px;line-height: 45px;padding: 0px;text-align: center;}
#my-mmenu ul li .openNav::before {content: '\f054';font-family:'FontAwesome';font-size: 1em;}
#my-mmenu ul li a {display: block;padding: 15px 20px 10px 20px; color: #555; text-decoration: none;}
#my-mmenu ul li ul {display: none;width: 100%;}
#my-mmenu ul li ul.active {display: block;}
#my-mmenu.active {transform: translateX(0%);}
