<?php
/* panel for multi-slide tutorials */
?>
<div class="container">
  <div class="row">
    <div class="columns one-third">
      <div class="iframe">
        <iframe src="https://www.youtube.com/embed/WiweQRhOr0g?controls=0" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
      </div>
      <h3>Learn how to create multi-step multi-slide CF7 forms using a slider construct functionality of the Smart Grid-layout extension plugin,</h3>
      <ul>
        <li><a href="https://www.youtube.com//watch?v=WiweQRhOr0g&amp;t=260s">00:04:20</a><span> - Convert collapsible rows into slides</span></li>
        <li><a href="https://www.youtube.com//watch?v=WiweQRhOr0g&amp;t=315s">00:05:15</a><span> - customise the control buttons,</span></li>
        <li><a href="https://www.youtube.com//watch?v=WiweQRhOr0g&amp;t=355s">00:05:55</a><span> - add a submit button on the last slide</span></li>
        <li><a href="https://www.youtube.com//watch?v=WiweQRhOr0g&amp;t=765s">00:12:45</a><span> - automatic slide change to invalid fields on validation</span></li>
      </ul>

    </div>
    <div class="columns one-third">
    </div>
  </div>
</div>
