<div class="code-wrapper">
              <div class="code-wrapper-inner">
                <pre class="language-html"><code>&lt;section class=&quot;wrapper bg-light&quot;&gt;
  &lt;div class=&quot;container py-14 py-md-16&quot;&gt;
    &lt;div class=&quot;row&quot;&gt;
      &lt;div class=&quot;col-md-10 offset-md-1 col-lg-8 offset-lg-2 mx-auto text-center&quot;&gt;
        &lt;h2 class=&quot;fs-15 text-uppercase text-muted mb-3&quot;&gt;Why Choose Sandbox?&lt;/h2&gt;
        &lt;h3 class=&quot;display-4 mb-10 px-xl-10 px-xxl-15&quot;&gt;Here are a few reasons why our customers choose Sandbox.&lt;/h3&gt;
      &lt;/div&gt;
      &lt;!-- /column --&gt;
    &lt;/div&gt;
    &lt;!-- /.row --&gt;
    &lt;ul class=&quot;nav nav-tabs nav-tabs-bg d-flex justify-content-between nav-justified flex-lg-row flex-column&quot;&gt;
      &lt;li class=&quot;nav-item&quot;&gt; &lt;a class=&quot;nav-link d-flex flex-row active&quot; data-bs-toggle=&quot;tab&quot; href=&quot;#tab2-1&quot;&gt;
          &lt;div&gt;&lt;img src=&quot;/assets/img/icons/lineal/rocket.svg&quot; class=&quot;svg-inject icon-svg icon-svg-md text-yellow me-4&quot; alt=&quot;&quot; /&gt;&lt;/div&gt;
          &lt;div&gt;
            &lt;h4&gt;Easy Usage&lt;/h4&gt;
            &lt;p&gt;Duis mollis commodo luctus cursus commodo tortor mauris.&lt;/p&gt;
          &lt;/div&gt;
        &lt;/a&gt; &lt;/li&gt;
      &lt;li class=&quot;nav-item&quot;&gt; &lt;a class=&quot;nav-link d-flex flex-row&quot; data-bs-toggle=&quot;tab&quot; href=&quot;#tab2-2&quot;&gt;
          &lt;div&gt;&lt;img src=&quot;/assets/img/icons/lineal/savings.svg&quot; class=&quot;svg-inject icon-svg icon-svg-md text-green me-4&quot; alt=&quot;&quot; /&gt;&lt;/div&gt;
          &lt;div&gt;
            &lt;h4&gt;Fast Transactions&lt;/h4&gt;
            &lt;p&gt;Vivamus sagittis lacus augue fusce dapibus tellus nibh.&lt;/p&gt;
          &lt;/div&gt;
        &lt;/a&gt; &lt;/li&gt;
      &lt;li class=&quot;nav-item&quot;&gt; &lt;a class=&quot;nav-link d-flex flex-row&quot; data-bs-toggle=&quot;tab&quot; href=&quot;#tab2-3&quot;&gt;
          &lt;div&gt;&lt;img src=&quot;/assets/img/icons/lineal/shield.svg&quot; class=&quot;svg-inject icon-svg icon-svg-md text-red me-4&quot; alt=&quot;&quot; /&gt;&lt;/div&gt;
          &lt;div&gt;
            &lt;h4&gt;Secure Payments&lt;/h4&gt;
            &lt;p&gt;Vestibulum ligula porta felis maecenas faucibus mollis.&lt;/p&gt;
          &lt;/div&gt;
        &lt;/a&gt; &lt;/li&gt;
    &lt;/ul&gt;
    &lt;!-- /.nav-tabs --&gt;
    &lt;div class=&quot;tab-content mt-6 mt-lg-8&quot;&gt;
      &lt;div class=&quot;tab-pane fade show active&quot; id=&quot;tab2-1&quot;&gt;
        &lt;div class=&quot;row gx-lg-8 gx-xl-12 gy-10 align-items-center&quot;&gt;
          &lt;div class=&quot;col-lg-6&quot;&gt;
            &lt;div class=&quot;row gx-md-5 gy-5 align-items-center&quot;&gt;
              &lt;div class=&quot;col-6&quot;&gt;
                &lt;img class=&quot;img-fluid rounded shadow-lg d-flex ms-auto&quot; src=&quot;/assets/img/photos/sa13.jpg&quot; srcset=&quot;/assets/img/photos/sa13@2x.jpg 2x&quot; alt=&quot;&quot; /&gt;
              &lt;/div&gt;
              &lt;!-- /column --&gt;
              &lt;div class=&quot;col-6&quot;&gt;
                &lt;img class=&quot;img-fluid rounded shadow-lg mb-5&quot; src=&quot;/assets/img/photos/sa14.jpg&quot; srcset=&quot;/assets/img/photos/sa14@2x.jpg 2x&quot; alt=&quot;&quot; /&gt;
                &lt;img class=&quot;img-fluid rounded shadow-lg d-flex col-10&quot; src=&quot;/assets/img/photos/sa15.jpg&quot; srcset=&quot;/assets/img/photos/sa15@2x.jpg 2x&quot; alt=&quot;&quot; /&gt;
              &lt;/div&gt;
              &lt;!-- /column --&gt;
            &lt;/div&gt;
            &lt;!-- /.row --&gt;
          &lt;/div&gt;
          &lt;!--/column --&gt;
          &lt;div class=&quot;col-lg-6&quot;&gt;
            &lt;h2 class=&quot;mb-3&quot;&gt;Easy Usage&lt;/h2&gt;
            &lt;p&gt;Etiam porta sem malesuada magna mollis euismod. Donec ullamcorper nulla non metus auctor fringilla. Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Nullam quis risus eget urna.&lt;/p&gt;
            &lt;ul class=&quot;icon-list bullet-bg bullet-soft-yellow&quot;&gt;
              &lt;li&gt;&lt;i class=&quot;uil uil-check&quot;&gt;&lt;/i&gt;Aenean eu leo quam. Pellentesque ornare.&lt;/li&gt;
              &lt;li&gt;&lt;i class=&quot;uil uil-check&quot;&gt;&lt;/i&gt;Nullam quis risus eget urna mollis ornare.&lt;/li&gt;
              &lt;li&gt;&lt;i class=&quot;uil uil-check&quot;&gt;&lt;/i&gt;Donec id elit non mi porta gravida at eget.&lt;/li&gt;
            &lt;/ul&gt;
            &lt;a href=&quot;#&quot; class=&quot;btn btn-yellow mt-2&quot;&gt;Learn More&lt;/a&gt;
          &lt;/div&gt;
          &lt;!--/column --&gt;
        &lt;/div&gt;
        &lt;!--/.row --&gt;
      &lt;/div&gt;
      &lt;!--/.tab-pane --&gt;
      &lt;div class=&quot;tab-pane fade&quot; id=&quot;tab2-2&quot;&gt;
        &lt;div class=&quot;row gx-lg-8 gx-xl-12 gy-10 align-items-center&quot;&gt;
          &lt;div class=&quot;col-lg-6 order-lg-2&quot;&gt;
            &lt;div class=&quot;row gx-md-5 gy-5&quot;&gt;
              &lt;div class=&quot;col-5&quot;&gt;
                &lt;img class=&quot;img-fluid rounded shadow-lg my-5 d-flex ms-auto&quot; src=&quot;/assets/img/photos/sa9.jpg&quot; srcset=&quot;/assets/img/photos/sa9@2x.jpg 2x&quot; alt=&quot;&quot; /&gt;
                &lt;img class=&quot;img-fluid rounded shadow-lg d-flex col-10 ms-auto&quot; src=&quot;/assets/img/photos/sa10.jpg&quot; srcset=&quot;/assets/img/photos/sa10@2x.jpg 2x&quot; alt=&quot;&quot; /&gt;
              &lt;/div&gt;
              &lt;!-- /column --&gt;
              &lt;div class=&quot;col-7&quot;&gt;
                &lt;img class=&quot;img-fluid rounded shadow-lg mb-5&quot; src=&quot;/assets/img/photos/sa11.jpg&quot; srcset=&quot;/assets/img/photos/sa11@2x.jpg 2x&quot; alt=&quot;&quot; /&gt;
                &lt;img class=&quot;img-fluid rounded shadow-lg d-flex col-11&quot; src=&quot;/assets/img/photos/sa12.jpg&quot; srcset=&quot;/assets/img/photos/sa12@2x.jpg 2x&quot; alt=&quot;&quot; /&gt;
              &lt;/div&gt;
              &lt;!-- /column --&gt;
            &lt;/div&gt;
            &lt;!-- /.row --&gt;
          &lt;/div&gt;
          &lt;!--/column --&gt;
          &lt;div class=&quot;col-lg-6&quot;&gt;
            &lt;h2 class=&quot;mb-3&quot;&gt;Fast Transactions&lt;/h2&gt;
            &lt;p&gt;Etiam porta sem malesuada magna mollis euismod. Donec ullamcorper nulla non metus auctor fringilla. Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Nullam quis risus eget urna.&lt;/p&gt;
            &lt;ul class=&quot;icon-list bullet-bg bullet-soft-green&quot;&gt;
              &lt;li&gt;&lt;i class=&quot;uil uil-check&quot;&gt;&lt;/i&gt;Aenean eu leo quam. Pellentesque ornare.&lt;/li&gt;
              &lt;li&gt;&lt;i class=&quot;uil uil-check&quot;&gt;&lt;/i&gt;Nullam quis risus eget urna mollis ornare.&lt;/li&gt;
              &lt;li&gt;&lt;i class=&quot;uil uil-check&quot;&gt;&lt;/i&gt;Donec id elit non mi porta gravida at eget.&lt;/li&gt;
            &lt;/ul&gt;
            &lt;a href=&quot;#&quot; class=&quot;btn btn-green mt-2&quot;&gt;Learn More&lt;/a&gt;
          &lt;/div&gt;
          &lt;!--/column --&gt;
        &lt;/div&gt;
        &lt;!--/.row --&gt;
      &lt;/div&gt;
      &lt;!--/.tab-pane --&gt;
      &lt;div class=&quot;tab-pane fade&quot; id=&quot;tab2-3&quot;&gt;
        &lt;div class=&quot;row gx-lg-8 gx-xl-12 gy-10 align-items-center&quot;&gt;
          &lt;div class=&quot;col-lg-6&quot;&gt;
            &lt;div class=&quot;row gx-md-5 gy-5&quot;&gt;
              &lt;div class=&quot;col-6&quot;&gt;
                &lt;img class=&quot;img-fluid rounded shadow-lg mb-5&quot; src=&quot;/assets/img/photos/sa5.jpg&quot; srcset=&quot;/assets/img/photos/sa5@2x.jpg 2x&quot; alt=&quot;&quot; /&gt;
                &lt;img class=&quot;img-fluid rounded shadow-lg d-flex col-10 ms-auto&quot; src=&quot;/assets/img/photos/sa6.jpg&quot; srcset=&quot;/assets/img/photos/sa6@2x.jpg 2x&quot; alt=&quot;&quot; /&gt;
              &lt;/div&gt;
              &lt;!-- /column --&gt;
              &lt;div class=&quot;col-6&quot;&gt;
                &lt;img class=&quot;img-fluid rounded shadow-lg my-5&quot; src=&quot;/assets/img/photos/sa7.jpg&quot; srcset=&quot;/assets/img/photos/sa7@2x.jpg 2x&quot; alt=&quot;&quot; /&gt;
                &lt;img class=&quot;img-fluid rounded shadow-lg d-flex col-10&quot; src=&quot;/assets/img/photos/sa8.jpg&quot; srcset=&quot;/assets/img/photos/sa8@2x.jpg 2x&quot; alt=&quot;&quot; /&gt;
              &lt;/div&gt;
              &lt;!-- /column --&gt;
            &lt;/div&gt;
            &lt;!-- /.row --&gt;
          &lt;/div&gt;
          &lt;!--/column --&gt;
          &lt;div class=&quot;col-lg-6&quot;&gt;
            &lt;h2 class=&quot;mb-3&quot;&gt;Secure Payments&lt;/h2&gt;
            &lt;p&gt;Etiam porta sem malesuada magna mollis euismod. Donec ullamcorper nulla non metus auctor fringilla. Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Nullam quis risus eget urna.&lt;/p&gt;
            &lt;ul class=&quot;icon-list bullet-bg bullet-soft-red&quot;&gt;
              &lt;li&gt;&lt;i class=&quot;uil uil-check&quot;&gt;&lt;/i&gt;Aenean eu leo quam. Pellentesque ornare.&lt;/li&gt;
              &lt;li&gt;&lt;i class=&quot;uil uil-check&quot;&gt;&lt;/i&gt;Nullam quis risus eget urna mollis ornare.&lt;/li&gt;
              &lt;li&gt;&lt;i class=&quot;uil uil-check&quot;&gt;&lt;/i&gt;Donec id elit non mi porta gravida at eget.&lt;/li&gt;
            &lt;/ul&gt;
            &lt;a href=&quot;#&quot; class=&quot;btn btn-red mt-2&quot;&gt;Learn More&lt;/a&gt;
          &lt;/div&gt;
          &lt;!--/column --&gt;
        &lt;/div&gt;
        &lt;!--/.row --&gt;
      &lt;/div&gt;
      &lt;!--/.tab-pane --&gt;
    &lt;/div&gt;
    &lt;!-- /.tab-content --&gt;
  &lt;/div&gt;
  &lt;!-- /.container --&gt;
&lt;/section&gt;
&lt;!-- /section --&gt;</code></pre>