​

​

    <div class="nav-component">

      <div class="container position-relative d-flex align-items-center justify-content-end">

        <button class="menu-toggle">OPEN MENU</button>

      </div>

      <nav>

        <div class="container position-relative d-flex align-items-center justify-content-end h-100">

          <ul class="menu">

            <li class="menu-item">

              <a href="#about-us">Lorem ipsum title 1</a>

              <span class="chevron"></span>

              <ul class="submenu">

                <li>

                  <a href="#history">Lorem ipsum dolor</a>

                  <span class="chevron"></span>

                  <ul class="submenu">

                    <li>Sub sub menu</li>

                    <li>Sub sub menu</li>

                  </ul>

                </li>

                <li>FIRST MENU</li>

​

              </ul>

            </li>

            <li class="menu-item">

              <a href="#capabilities">Lorem ipsum title 2</a>

              <span class="chevron"></span>

              <ul class="submenu">

                <li>2222 Lorem ipsum dolor</li>

​

              </ul>

            </li>

            <li class="menu-item">

              <a href="#sustainability">Lorem ipsum title 3</a>

              <span class="chevron"></span>

              <ul class="submenu">

                <li>333333 Lorem ipsum dolor</li>

              </ul>

            </li>

          </ul>

        </div>

      </nav>

    </div>

​