<div class="code-wrapper">
              <div class="code-wrapper-inner">
                <pre class="language-html"><code>&lt;section class=&quot;wrapper bg-light wrapper-border&quot;&gt;
  &lt;div class=&quot;container py-14 py-md-16&quot;&gt;
    &lt;div class=&quot;row gy-10 gy-sm-13 gx-lg-3 align-items-center&quot;&gt;
      &lt;div class=&quot;col-md-8 col-lg-6 position-relative&quot;&gt;
        &lt;div class=&quot;shape bg-dot primary rellax w-17 h-21&quot; data-rellax-speed=&quot;1&quot; style=&quot;top: -2rem; left: -1.9rem;&quot;&gt;&lt;/div&gt;
        &lt;div class=&quot;shape rounded bg-soft-primary rellax d-md-block&quot; data-rellax-speed=&quot;0&quot; style=&quot;bottom: -1.8rem; right: -1.5rem; width: 85%; height: 90%; &quot;&gt;&lt;/div&gt;
        &lt;figure class=&quot;rounded&quot;&gt;&lt;img src=&quot;/assets/img/photos/about7.jpg&quot; srcset=&quot;/assets/img/photos/about7@2x.jpg 2x&quot; alt=&quot;&quot; /&gt;&lt;/figure&gt;
      &lt;/div&gt;
      &lt;!--/column --&gt;
      &lt;div class=&quot;col-lg-5 col-xl-4 offset-lg-1&quot;&gt;
        &lt;h2 class=&quot;h1 mb-3&quot;&gt;How It Works?&lt;/h2&gt;
        &lt;p class=&quot;lead fs-lg mb-6&quot;&gt;So here are three working steps why our valued customers choose us.&lt;/p&gt;
        &lt;div class=&quot;d-flex flex-row mb-6&quot;&gt;
          &lt;div&gt;
            &lt;span class=&quot;icon btn btn-circle btn-primary pe-none me-5&quot;&gt;&lt;span class=&quot;number fs-18&quot;&gt;1&lt;/span&gt;&lt;/span&gt;
          &lt;/div&gt;
          &lt;div&gt;
            &lt;h4 class=&quot;mb-1&quot;&gt;Collect Ideas&lt;/h4&gt;
            &lt;p class=&quot;mb-0&quot;&gt;Nulla vitae elit libero pharetra augue dapibus. Praesent commodo cursus.&lt;/p&gt;
          &lt;/div&gt;
        &lt;/div&gt;
        &lt;div class=&quot;d-flex flex-row mb-6&quot;&gt;
          &lt;div&gt;
            &lt;span class=&quot;icon btn btn-circle btn-primary pe-none me-5&quot;&gt;&lt;span class=&quot;number fs-18&quot;&gt;2&lt;/span&gt;&lt;/span&gt;
          &lt;/div&gt;
          &lt;div&gt;
            &lt;h4 class=&quot;mb-1&quot;&gt;Data Analysis&lt;/h4&gt;
            &lt;p class=&quot;mb-0&quot;&gt;Vivamus sagittis lacus vel augue laoreet. Etiam porta sem malesuada magna.&lt;/p&gt;
          &lt;/div&gt;
        &lt;/div&gt;
        &lt;div class=&quot;d-flex flex-row&quot;&gt;
          &lt;div&gt;
            &lt;span class=&quot;icon btn btn-circle btn-primary pe-none me-5&quot;&gt;&lt;span class=&quot;number fs-18&quot;&gt;3&lt;/span&gt;&lt;/span&gt;
          &lt;/div&gt;
          &lt;div&gt;
            &lt;h4 class=&quot;mb-1&quot;&gt;Finalize Product&lt;/h4&gt;
            &lt;p class=&quot;mb-0&quot;&gt;Cras mattis consectetur purus sit amet. Aenean lacinia bibendum nulla sed.&lt;/p&gt;
          &lt;/div&gt;
        &lt;/div&gt;
      &lt;/div&gt;
      &lt;!--/column --&gt;
    &lt;/div&gt;
    &lt;!--/.row --&gt;
  &lt;/div&gt;
  &lt;!-- /.container --&gt;
&lt;/section&gt;
&lt;!-- /section --&gt;</code></pre>