<div id="get-started">
  <div class="pb-5">
    <div
      style="max-width: 1260px"
      class="container-fluid pt-5 px-4 px-sm-5 mx-auto"
    >
      <section id="install-section" class="py-4 mx-auto">
        <h1>Get Started with Fleet</h1>
        <p class="mb-4">
          No need to put the kettle on, you'll be up and running before you can
          say "osquery."
        </p>
        <img
          alt="Fleet introduction to hosts"
          src="/images/intro-pic-800x364@2x.png"
          style="max-width: 900px; height: auto"
          class="w-100 my-5 mx-auto"
        />
      </section>
      <section id="try-fleet" class="py-4 mx-auto">
        <h2 class="mb-3">Try Fleet</h2>
        <p class="my-2">
          With
          <a href="https://nodejs.org/en/download/" target="_blank">Node.js</a>
          and
          <a href="https://docs.docker.com/get-docker/" target="_blank"
            >Docker</a
          >
          installed:
        </p>
        <img
          alt="Install and run fleet in command-line"
          src="/images/install-fleet-800x188@2x.png"
          style="max-width: 900px; height: auto"
          class="w-100 my-5 mx-auto"
        />
        <p>
          The Fleet UI is now available at
          <a href="http://localhost:1337" target="_blank"
            >http://localhost:1337</a
          >.
        </p>
      </section>
      <hr class="solid" style="max-width: 800px" />
      <section id="query-section" class="py-4 mx-auto">
        <h2 class="mb-3">Ready to run your first query?</h2>
        <p class="mb-5">
          Target some of the sample hosts included, and give it a try.
          <br />Unsure of what questions to ask?
          <a
            href="https://github.com/fleetdm/fleet/tree/main/handbook/queries"
            target="_blank"
            >Here’s a few queries to get you started.</a
          >
        </p>
        <img
          alt="Install and run fleet in command-line"
          src="/images/run-query-800x537@2x.png"
          style="max-width: 900px; height: auto"
          class="w-100 my-4 mx-auto"
        />
      </section>
      <section class="py-5 mx-auto">
        <div class="row">
          <div class="col-lg px-1 mx-auto" style="max-width: 810px">
            <div style="border-radius: 15px" class="mb-4">
              <div class="py-5 px-5" id="learn-more">
                <h2 class="mb-3">Learn more about how to use Fleet</h2>
                <ul class="mb-5">
                  <li>
                    See how companies like <a href="https://github.com/palantir/osquery-configuration/tree/master/Fleet" target="_blank">Palantir</a> use osquery in production.
                  </li>
                  <li>
                    Need even more functionality? Install osquery extensions
                    like <a href="https://github.com/trailofbits/osquery-extensions">these</a> from Trail of Bits.
                  </li>
                </ul>
                <div
                  class="tpbutton btn-toolbar"
                  style="text-align: left"
                >
                  <a
                    target="_blank"
                    href="https://github.com/fleetdm/fleet/tree/main/docs"
                    style="max-width: 150px"
                    class="btn btn-block btn-md btn-primary my-1 mr-2"
                    id="primary-button"
                  >
                    Go to docs
                  </a>
                  <a
                    target="_blank"
                    href="https://calendly.com/fleetdm/demo"
                    style="max-width: 250px"
                    class="btn btn-block btn-lg btn-schedule my-1 ml-2"
                    id="arrow"
                    >Schedule a demo
                  </a>
                </div>
              </div>
            </div>
          </div>
        </div>
      </section>
    </div>
  </div>
</div>
