<div id="layout-builder-modal-screen-1">
  <div class="modal-content">
    <div class="modal-header">
      <h4 class="modal-title">Welcome to MissionKontrol - We’re going to start by building a layout</h4>
    </div>

    <div class="modal-body">
      <p>
        Layouts are a record level view of your data stored in your tables. You’ll need them to view and edit your data.
      </p>

      <p>
        Setting up a layout is easy and the video below explains how it works. Alternatively jump right in and get started with some trial and error.
      </p>

      <div class="embed-responsive embed-responsive-16by9">
        <script src="https://fast.wistia.com/embed/medias/a39zrpqxte.jsonp" async></script>
        <script src="https://fast.wistia.com/assets/external/E-v1.js" async></script>
        <div class="wistia_responsive_padding" style="padding:56.25% 0 0 0;position:relative;">
          <div class="wistia_responsive_wrapper" style="height:100%;left:0;position:absolute;top:0;width:100%;">
            <div class="wistia_embed wistia_async_a39zrpqxte videoFoam=true" style="height:100%;position:relative;width:100%">
              <div class="wistia_swatch" style="height:100%;left:0;opacity:0;overflow:hidden;position:absolute;top:0;transition:opacity 200ms;width:100%;">
                <img src="https://fast.wistia.com/embed/medias/a39zrpqxte/swatch" style="filter:blur(5px);height:100%;object-fit:contain;width:100%;" alt="" aria-hidden="true" onload="this.parentNode.style.opacity=1;" />
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>

    <div class="modal-footer">
      <div class="row">
        <div class="col-sm-8">
          <input type="checkbox" id="layout-builder-modal-ignore-checkbox" name="ignore_modal" value="true"> Do not show this message again
        </div>
        <div class="col-sm-4">
          <a class="btn btn-primary pull-right" id="layout-builder-modal-next-button">Next</a>
      </div>
    </div>
    </div>
  </div>
</div>
