fleet/website/views/pages/compliance.ejs

<div id="compliance" v-cloak>

  <div purpose="hero-background" class="container-lg d-flex justify-content-center">

    <div purpose="hero-container" class="d-flex flex-column align-items-center">
      <div purpose="hero-text">
        <h4 class="mb-2">Visibility and compliance in a single platform</h4>
        <h1>Simplify security compliance</h1>
        <p>Automate security workflows in a single application by creating or installing policies to identify which devices comply with your security guidelines.</p>
        <div purpose="button-row" class="d-flex flex-sm-row flex-column justify-content-center align-items-center">
          <a purpose="cta-button" href="/try-fleet/register?tryitnow">Try Fleet today</a>
          <a @click="clickOpenChatWidget()" purpose="animated-arrow-button-red">Talk to an expert</a>
        </div>
      </div>  
    </div>

  </div>

  <div purpose="page-container" class="container-lg">

    <div purpose="feature" class="d-flex flex-md-row flex-column-reverse justify-content-between mx-auto align-items-center">
      <div class="d-flex flex-column">
        <h3>Out-of-the-box CIS benchmark policies</h3>
        <p>All organizations deal with compliance requirements. With Center for Internet Security (CIS) compliance policies in Fleet,  cybersecurity best practices are at your fingertips.</p>
        <div purpose="checklist" class="flex-column d-flex">
          <p>Out of the box policies for Mac, Windows, and Linux.</p>
          <p>Fleet will keep these policies updated for you.</p>
          <p>Identify which devices are failing the most so you can prioritize your work.</p>
        </div>
      </div>
      <div purpose="feature-image" class="ml-md-5">
        <img alt="Compliance feature image" src="/images/compliance-feature-image-1-360x323@2x.png">
      </div>
    </div>

    <div purpose="feature" class="d-flex flex-md-row flex-column justify-content-between mx-auto align-items-center">
      <div purpose="feature-image" class="mr-md-5">
        <img alt="Compliance feature image" src="/images/compliance-feature-image-2-320x237@2x.png">
      </div>
      <div class="d-flex flex-column">
        <h3>Verify SOC2, NIST compliance</h3>
        <p>Use the growing list of community-sourced query packs to verify your machines are in-line with new and emerging compliance standards. </p>
        <div purpose="checklist" class="flex-column d-flex">
          <p>Powerful visibility of your entire fleet gives you confidence that your SOC2 and NIST policies are being followed. </p>
          <p>Measure how quickly failures are resolved and make sure that they fall within your service level agreement (SLA).</p>
          <p>Identify which devices and policies are failing in real time.</p>
        </div>
      </div>
    </div>

    <div purpose="feature" class="d-flex flex-md-row flex-column-reverse justify-content-between mx-auto align-items-center">
      <div class="d-flex flex-column">
        <h3>Automations in response to failing policies</h3>
        <p>Fleet Premium comes out-of-the-box ready for audits. Integrate with the security tools and services in your stack. Get answers immediately, even when you’re not looking.</p>
        <div purpose="checklist" class="flex-column d-flex">
          <p>Configurable scan intervals for policies.</p>
          <p>Trigger webhooks and integrate with Jira, Zendesk, or Tines.</p>
          <p>Encourage end-user self-remediation with Fleet Desktop.</p>
        </div>
      </div>
      <div purpose="large-feature-image" class="ml-md-5">
        <img alt="Comliance feature image" src="/images/compliance-feature-image-3-398x250@2x.png">
      </div>
    </div>

    <div purpose="button-row" style="margin-top: 60px;" class="d-flex flex-sm-row flex-column justify-content-center align-items-center mx-auto">
      <a purpose="cta-button" href="/try-fleet/register?tryitnow">Try Fleet today</a>
      <a @click="clickOpenChatWidget()" purpose="animated-arrow-button-red">Talk to an expert</a>
    </div>

  </div>
  <%/* End of page gradient */%>
  <div purpose="bottom-gradient">
    <div purpose="tweets-container" class="container-fluid px-md-0 pb-0 d-flex flex-column justify-content-center">
      <div purpose="section-heading" style="max-width: 720px" class="mx-auto text-center">
        <h4>Don’t know osquery?</h4>
        <h2>Dedicated support from osquery experts</h2>
        <p>Osquery is the open-source agent that powers Fleet. And we have the most osquery experts around. We’ll help you realize the potential of this tool for your organization.</p>
      </div>
    </div>

    <scrollable-tweets></scrollable-tweets>
    <div purpose="page-container" class="pb-0 container">

      <div purpose="bottom-cta" class="text-center">
        <h4>Open-source device management</h4>
        <h1>Lighter than air</h1>
        <div purpose="button-row" style="margin-top: 60px;" class="d-flex flex-sm-row flex-column justify-content-center align-items-center mx-auto">
          <a purpose="cta-button" href="/try-fleet/register?tryitnow">Try it out</a>
          <a @click="clickOpenChatWidget()" purpose="animated-arrow-button-red">Talk to an expert</a>
        </div>
      </div>
    </div>
    <%/* Cloud city banner */%>
  </div>
  <div class="d-flex flex-column" purpose="bottom-cloud-city-banner">
    <img alt="A glass city floating on top of fluffy white clouds" class="d-none d-lg-flex" src="/images/homepage-cloud-city-banner-lg-1600x375@2x.png">
    <img alt="A glass city floating on top of fluffy white clouds" class="d-none d-md-flex d-lg-none" src="/images/homepage-cloud-city-banner-md-990x375@2x.png">
    <img alt="A glass city floating on top of fluffy white clouds" class="d-flex d-md-none" src="/images/homepage-cloud-city-banner-sm-375x168@2x.png">
  </div>
</div>

<%- /* Expose server-rendered data as window.SAILS_LOCALS :: */ exposeLocalsToBrowser() %>