Bootstrap Components in Cronos library

<section class="pb-20 bg-secondary-light">
  <nav class="position-relative navbar navbar-expand-lg navbar-light py-5">
    <div class="container-fluid">
      <a class="navbar-brand" href="#">
        <img src="cronos-assets/logos/cronos-logo.svg" alt="" width="132">
      </a>
      <button class="btn p-0 d-lg-none navbar-burger">
        <svg width="24" height="24" viewbox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
          <path fill-rule="evenodd" clip-rule="evenodd" d="M3.5 7C3.22386 7 3 6.77614 3 6.5C3 6.22386 3.22386 6 3.5 6H20.5C20.7761 6 21 6.22386 21 6.5C21 6.77614 20.7761 7 20.5 7H3.5ZM3.5 12C3.22386 12 3 11.7761 3 11.5C3 11.2239 3.22386 11 3.5 11H20.5C20.7761 11 21 11.2239 21 11.5C21 11.7761 20.7761 12 20.5 12H3.5ZM3 16.5C3 16.7761 3.22386 17 3.5 17H20.5C20.7761 17 21 16.7761 21 16.5C21 16.2239 20.7761 16 20.5 16H3.5C3.22386 16 3 16.2239 3 16.5Z" fill="#006251"></path>
        </svg>
      </button>
      <ul class="d-none d-lg-flex position-absolute top-50 start-50 translate-middle navbar-nav">
        <li class="nav-item"><a class="nav-link" href="#">About</a></li>
        <li class="nav-item"><a class="nav-link" href="#">Company</a></li>
        <li class="nav-item"><a class="nav-link" href="#">Services</a></li>
        <li class="nav-item"><a class="nav-link" href="#">Testimonials</a></li>
      </ul>
      <div class="d-none d-lg-block"><a class="btn btn-secondary" href="#">Contact Us</a></div>
    </div>
  </nav>
  <div class="container mt-8">
    <div class="row align-items-center mb-12">
      <div class="col-12 col-lg-6 mb-20 mb-lg-0">
        <div class="mw-lg-md">
          <h2 class="mb-5 text-primary">Take care of your performance every day.</h2>
          <p class="lead text-muted lh-lg mb-6">Build a well-presented brand that everyone will love. Take care to develop resources continually and integrity them with previous projects.</p>
          <a class="btn btn-primary d-block d-md-inline-block mb-2 mb-md-0 mb-lg-0 me-md-4" href="#">Track your performance</a><a class="btn btn-dark d-block d-md-inline-block" href="#">Learn More</a>
        </div>
      </div>
      <div class="col-12 col-lg-6">
        <img class="img-fluid" src="cronos-assets/images/example-scene.png" alt="">
      </div>
    </div>
    <div class="text-center">
      <a class="text-decoration-none text-muted small" href="#">
        <svg class="text-secondary mb-2" width="9" height="12" viewbox="0 0 9 12" fill="none" xmlns="http://www.w3.org/2000/svg">
          <path d="M5 10.2929L8.14645 7.14645C8.34171 6.95118 8.65829 6.95118 8.85355 7.14645C9.04882 7.34171 9.04882 7.65829 8.85355 7.85355L4.85355 11.8536C4.65829 12.0488 4.34171 12.0488 4.14645 11.8536L0.146447 7.85355C-0.0488155 7.65829 -0.0488155 7.34171 0.146447 7.14645C0.341709 6.95118 0.658291 6.95118 0.853553 7.14645L4 10.2929V0.5C4 0.223858 4.22386 0 4.5 0C4.77614 0 5 0.223858 5 0.5V10.2929Z" fill="currentColor"></path>
        </svg>
        <span class="d-block text-secondary">Scroll to see benefits</span>
      </a>
    </div>
  </div>
  <div class="d-none navbar-menu position-fixed top-0 start-0 bottom-0 w-75 mw-sm" style="z-index: 9999;">
    <div class="navbar-backdrop position-fixed top-0 start-0 end-0 bottom-0 bg-primary" style="opacity: 90%;"></div>
    <nav class="position-relative h-100 w-100 d-flex flex-column py-6 px-6 navbar-light bg-white overflow-auto">
      <div class="d-flex align-items-center mb-10">
        <a class="me-auto navbar-brand" href="#">
          <img src="cronos-assets/logos/cronos-logo.svg" alt="" width="132">
        </a>
        <button class="navbar-close btn-close" type="button" aria-label="Close"></button>
      </div>
      <div>
        <ul class="nav flex-column">
          <li class="nav-item mb-4"><a class="nav-link" href="#">About</a></li>
          <li class="nav-item mb-4"><a class="nav-link" href="#">Company</a></li>
          <li class="nav-item mb-4"><a class="nav-link" href="#">Services</a></li>
          <li class="nav-item mb-4"><a class="nav-link" href="#">Testimonials</a></li>
        </ul>
      </div>
      <div class="mt-auto">
        <div class="py-6"><a class="w-100 btn btn-primary" href="#">Contact Us</a></div>
        <p class="mb-4 small text-center text-muted">&copy; 2021 All rights reserved.</p>
      </div>
    </nav>
  </div>
</section>