nav.m_nav {position:fixed;top:0px;left:0;z-index:-1;overflow:hidden;overflow-y:scroll;transform:translateY(115%);width:100vw;height:100vh;transition:all 600ms cubic-bezier(.8,0,.33,1);} nav.m_nav::-webkit-scrollbar {width:0px;background:rgba(255,255,255,.3);} nav.m_nav.nav-open {background:#fff;z-index:9991;transform:translateY(0);} .menu-btn {cursor:pointer;z-index:99992;color:#444;transition:.36s all;} .menu-btn:hover .line {background:#f4950d;} .nav-open .menu-btn {background:none;top: 6px;right: 15px;position:fixed;} .menu-btn .line {padding:0;width:30px;background:#444;height:1px;margin:6px 5px;transition:all 700ms cubic-bezier(.9,0,.33,1);} .nav-open .menu-btn .line {background:#f4950d;} .menu-btn .line.line--1 {width:25px;transform:rotate(0) translateY(0);margin-left:auto;} .menu-btn .line.line--1.line-cross {width:30px;transform:rotate(45deg) translateY(2px) translateX(4px);} .menu-btn .line.line--2 {width:15px;transform:translateX(0);} .menu-btn .line.line--2.line-fade-out {width:25px;transform:translate(30px);opacity:0;} .menu-btn .line.line--3 {width:25px;transform:rotate(0) translateY(0);} .menu-btn .line.line--3.line-cross {width:30px;transform:rotate(-45deg) translateY(-7px) translateX(7px);} nav.m_nav .nav-links {position:absolute;left:0;top:0;width:100%;height:100%;transform:translateY(0);opacity:0;display:flex;flex-direction:column;justify-content:space-between;} nav.m_nav .nav-links ul {width:100%;margin-top:5vh;} nav.m_nav .nav-links.fade-in {opacity:1;transform:translateY(0);} @media(min-width:992px) { a.menu-btn,.nav-open a.menu-btn {background:none;color:unset;position:relative;} .nav-open .menu-btn {display:block!important;} } nav.m_nav .navsub {display:none;} nav.m_nav .nav-item {cursor:pointer;} nav.m_nav .nav-item .link {width:85%;max-width:400px;font-size:16px;border-bottom: 1px solid #eee;margin:0 auto;padding:17px 10px;display:flex;align-items:center;justify-content:space-between;} nav.m_nav .nav-item div.link:after {content:'\ec00';font-family:'iconfont';} nav.m_nav .nav-item:first-child .link {font-weight:bold;border-bottom:none;margin-bottom:20px;} nav.m_nav .nav-item:first-child:hover .link {background:none;} nav.m_nav .nav-item:last-child .link {border-bottom:none;} nav.m_nav .nav-item:hover .link,.nav-item.active .link {color:#fff;background:#f4950d;} nav.m_nav .nav-item.active .link:after {transform: rotate(135deg);transition:.2s all linear;} nav.m_nav .nav-item.active .link a {font-weight:bold;} nav.m_nav .nav-item.active .navsub {display:block;} nav.m_nav .nav-item.active .navsub a {animation:flipInX 1.5s;width:100%;padding: 17px 10px 17px 30px;} nav.m_nav .nav-subitem {color:#444;border-bottom: 1px solid rgba(0,0,0,.1);width: 85%;font-size: 1rem;max-width: 400px;margin: 0 auto;display: flex;align-items: center;justify-content: space-between;} nav.m_nav .nav-subitem a {display:block;} nav.m_nav .nav-subitem a.active,nav.m_nav .nav-subitem a:hover {color:#f4950d;} nav.m_nav .navbottom {color:#fff;background:#f4950d;border-top:1px solid #f4950d;position:relative;margin-top:20px;padding:20px 0;transform:translateY(100%);} nav.m_nav .navbottom:after {content:'';position:absolute;z-index:9;right:0;top:0;bottom:0;width:0;height:0;transform:translateY(-100%);} nav.m_nav .navbottom a {display:block;margin:0 auto;padding: 17px 10px;font-size: 1.2rem; border-bottom: 1px solid rgba(0,0,0, 0.3);width: 85%;position:relative;} nav.m_nav .navbottom a:last-child {border-bottom:none;} .nav-open nav.m_nav .navbottom {transform:translateY(0);transition: all 1000ms cubic-bezier(.8, 0, .33, 1);}