.header_content{display:grid;grid-template-columns:auto 1fr auto;align-items:center;.navigation{display:flex;align-items:center;gap:10px}}.menu_wrapper{position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:#fff;transform:translateY(-100%);z-index:-1000;opacity:0;transition:opacity .2s linear,.3s ease-in-out;svg{outline:none}.menu_header{display:flex;justify-content:space-between;align-items:center;gap:40px;margin:30px 0 50px;.search_bar{width:100%;max-width:500px;padding:10px 16px;outline:none;font-size:18px;border:none;border-bottom:1px solid grey}.close_btn{width:30px;height:30px;font-size:24px;background:none;display:flex;justify-content:center;align-items:center;border:none;cursor:pointer;font-weight:700}}.menu_list{list-style:none;display:flex;flex-direction:column;gap:20px;max-height:calc(100vh - 140px);overflow:auto;&::-webkit-scrollbar{width:0;height:4px}&::-webkit-scrollbar-track{background:#fff}&::-webkit-scrollbar-thumb{background:grey;border-radius:20px}li{font-size:18px;line-height:20px;cursor:pointer;a{position:relative;transition:padding .3s ease,color .3s ease;color:inherit;&:before{content:"";position:absolute;left:0;bottom:0;width:10px;height:2px;background-color:#333;opacity:0;transition:opacity .3s ease}&:focus-visible,&:hover{padding-left:20px;outline:none;&:before{opacity:1}}}}.no_results{font-size:18px;color:#676767}}}.menu_wrapper.open{transform:translateY(0);z-index:1000;opacity:1;transition:opacity .2s linear}body.menu-open,html.menu-open{overflow:hidden}