<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 text-center&quot;&gt;
    &lt;div class=&quot;row&quot;&gt;
      &lt;div class=&quot;col-lg-10 col-xl-8 col-xxl-7 mx-auto mb-8&quot;&gt;
        &lt;h2 class=&quot;display-5 mb-3&quot;&gt;My Selected Shots&lt;/h2&gt;
        &lt;p class=&quot;lead fs-lg&quot;&gt;Photography is my passion and I love to turn ideas into beautiful things.&lt;/p&gt;
      &lt;/div&gt;
      &lt;!-- /column --&gt;
    &lt;/div&gt;
    &lt;!-- /.row --&gt;
    &lt;div class=&quot;grid grid-view projects-masonry&quot;&gt;
      &lt;div class=&quot;isotope-filter filter mb-10&quot;&gt;
        &lt;ul&gt;
          &lt;li&gt;&lt;a class=&quot;filter-item active&quot; data-filter=&quot;*&quot;&gt;All&lt;/a&gt;&lt;/li&gt;
          &lt;li&gt;&lt;a class=&quot;filter-item&quot; data-filter=&quot;.foods&quot;&gt;Foods&lt;/a&gt;&lt;/li&gt;
          &lt;li&gt;&lt;a class=&quot;filter-item&quot; data-filter=&quot;.drinks&quot;&gt;Drinks&lt;/a&gt;&lt;/li&gt;
          &lt;li&gt;&lt;a class=&quot;filter-item&quot; data-filter=&quot;.events&quot;&gt;Events&lt;/a&gt;&lt;/li&gt;
          &lt;li&gt;&lt;a class=&quot;filter-item&quot; data-filter=&quot;.pastries&quot;&gt;Pastries&lt;/a&gt;&lt;/li&gt;
        &lt;/ul&gt;
      &lt;/div&gt;
      &lt;div class=&quot;row gx-md-6 gy-6 isotope&quot;&gt;
        &lt;div class=&quot;project item col-md-6 col-xl-4 drinks events&quot;&gt;
          &lt;figure class=&quot;overlay overlay-1 rounded&quot;&gt;&lt;a href=&quot;/assets/img/photos/pf1-full.jpg&quot; data-glightbox data-gallery=&quot;shots-group&quot;&gt; &lt;img src=&quot;/assets/img/photos/pf1.jpg&quot; alt=&quot;&quot; /&gt;&lt;/a&gt;
            &lt;figcaption&gt;
              &lt;h5 class=&quot;from-top mb-0&quot;&gt;Fringilla Nullam&lt;/h5&gt;
            &lt;/figcaption&gt;
          &lt;/figure&gt;
        &lt;/div&gt;
        &lt;!-- /.project --&gt;
        &lt;div class=&quot;project item col-md-6 col-xl-4 events&quot;&gt;
          &lt;figure class=&quot;overlay overlay-1 rounded&quot;&gt;&lt;a href=&quot;/assets/img/photos/pf2-full.jpg&quot; data-glightbox data-gallery=&quot;shots-group&quot;&gt; &lt;img src=&quot;/assets/img/photos/pf2.jpg&quot; alt=&quot;&quot; /&gt;&lt;/a&gt;
            &lt;figcaption&gt;
              &lt;h5 class=&quot;from-top mb-0&quot;&gt;Ridiculus Parturient&lt;/h5&gt;
            &lt;/figcaption&gt;
          &lt;/figure&gt;
        &lt;/div&gt;
        &lt;!-- /.project --&gt;
        &lt;div class=&quot;project item col-md-6 col-xl-4 drinks foods&quot;&gt;
          &lt;figure class=&quot;overlay overlay-1 rounded&quot;&gt;&lt;a href=&quot;/assets/img/photos/pf3-full.jpg&quot; data-glightbox data-gallery=&quot;shots-group&quot;&gt; &lt;img src=&quot;/assets/img/photos/pf3.jpg&quot; alt=&quot;&quot; /&gt;&lt;/a&gt;
            &lt;figcaption&gt;
              &lt;h5 class=&quot;from-top mb-0&quot;&gt;Ornare Ipsum&lt;/h5&gt;
            &lt;/figcaption&gt;
          &lt;/figure&gt;
        &lt;/div&gt;
        &lt;!-- /.project --&gt;
        &lt;div class=&quot;project item col-md-6 col-xl-4 events&quot;&gt;
          &lt;figure class=&quot;overlay overlay-1 rounded&quot;&gt;&lt;a href=&quot;/assets/img/photos/pf4-full.jpg&quot; data-glightbox data-gallery=&quot;shots-group&quot;&gt; &lt;img src=&quot;/assets/img/photos/pf4.jpg&quot; alt=&quot;&quot; /&gt;&lt;/a&gt;
            &lt;figcaption&gt;
              &lt;h5 class=&quot;from-top mb-0&quot;&gt;Nullam Mollis&lt;/h5&gt;
            &lt;/figcaption&gt;
          &lt;/figure&gt;
        &lt;/div&gt;
        &lt;!-- /.project --&gt;
        &lt;div class=&quot;project item col-md-6 col-xl-4 pastries events&quot;&gt;
          &lt;figure class=&quot;overlay overlay-1 rounded&quot;&gt;&lt;a href=&quot;/assets/img/photos/pf5-full.jpg&quot; data-glightbox data-gallery=&quot;shots-group&quot;&gt; &lt;img src=&quot;/assets/img/photos/pf5.jpg&quot; alt=&quot;&quot; /&gt;&lt;/a&gt;
            &lt;figcaption&gt;
              &lt;h5 class=&quot;from-top mb-0&quot;&gt;Euismod Risus&lt;/h5&gt;
            &lt;/figcaption&gt;
          &lt;/figure&gt;
        &lt;/div&gt;
        &lt;!-- /.project --&gt;
        &lt;div class=&quot;project item col-md-6 col-xl-4 foods&quot;&gt;
          &lt;figure class=&quot;overlay overlay-1 rounded&quot;&gt;&lt;a href=&quot;/assets/img/photos/pf6-full.jpg&quot; data-glightbox data-gallery=&quot;shots-group&quot;&gt; &lt;img src=&quot;/assets/img/photos/pf6.jpg&quot; alt=&quot;&quot; /&gt;&lt;/a&gt;
            &lt;figcaption&gt;
              &lt;h5 class=&quot;from-top mb-0&quot;&gt;Ridiculus Tristique&lt;/h5&gt;
            &lt;/figcaption&gt;
          &lt;/figure&gt;
        &lt;/div&gt;
        &lt;!-- /.project --&gt;
        &lt;div class=&quot;project item col-md-6 col-xl-4 foods drinks&quot;&gt;
          &lt;figure class=&quot;overlay overlay-1 rounded&quot;&gt;&lt;a href=&quot;/assets/img/photos/pf7-full.jpg&quot; data-glightbox data-gallery=&quot;shots-group&quot;&gt; &lt;img src=&quot;/assets/img/photos/pf7.jpg&quot; alt=&quot;&quot; /&gt;&lt;/a&gt;
            &lt;figcaption&gt;
              &lt;h5 class=&quot;from-top mb-0&quot;&gt;Sollicitudin Pharetra&lt;/h5&gt;
            &lt;/figcaption&gt;
          &lt;/figure&gt;
        &lt;/div&gt;
        &lt;!-- /.project --&gt;
        &lt;div class=&quot;project item col-md-6 col-xl-4 pastries&quot;&gt;
          &lt;figure class=&quot;overlay overlay-1 rounded&quot;&gt;&lt;a href=&quot;/assets/img/photos/pf8-full.jpg&quot; data-glightbox data-gallery=&quot;shots-group&quot;&gt; &lt;img src=&quot;/assets/img/photos/pf8.jpg&quot; alt=&quot;&quot; /&gt;&lt;/a&gt;
            &lt;figcaption&gt;
              &lt;h5 class=&quot;from-top mb-0&quot;&gt;Tristique Venenatis&lt;/h5&gt;
            &lt;/figcaption&gt;
          &lt;/figure&gt;
        &lt;/div&gt;
        &lt;!-- /.project --&gt;
        &lt;div class=&quot;project item col-md-6 col-xl-4 events&quot;&gt;
          &lt;figure class=&quot;overlay overlay-1 rounded&quot;&gt;&lt;a href=&quot;/assets/img/photos/pf9-full.jpg&quot; data-glightbox data-gallery=&quot;shots-group&quot;&gt; &lt;img src=&quot;/assets/img/photos/pf9.jpg&quot; alt=&quot;&quot; /&gt;&lt;/a&gt;
            &lt;figcaption&gt;
              &lt;h5 class=&quot;from-top mb-0&quot;&gt;Cursus Fusce&lt;/h5&gt;
            &lt;/figcaption&gt;
          &lt;/figure&gt;
        &lt;/div&gt;
        &lt;!-- /.project --&gt;
        &lt;div class=&quot;project item col-md-6 col-xl-4 foods&quot;&gt;
          &lt;figure class=&quot;overlay overlay-1 rounded&quot;&gt;&lt;a href=&quot;/assets/img/photos/pf10-full.jpg&quot; data-glightbox data-gallery=&quot;shots-group&quot;&gt; &lt;img src=&quot;/assets/img/photos/pf10.jpg&quot; alt=&quot;&quot; /&gt;&lt;/a&gt;
            &lt;figcaption&gt;
              &lt;h5 class=&quot;from-top mb-0&quot;&gt;Consectetur Malesuada&lt;/h5&gt;
            &lt;/figcaption&gt;
          &lt;/figure&gt;
        &lt;/div&gt;
        &lt;!-- /.project --&gt;
        &lt;div class=&quot;project item col-md-6 col-xl-4 drinks&quot;&gt;
          &lt;figure class=&quot;overlay overlay-1 rounded&quot;&gt;&lt;a href=&quot;/assets/img/photos/pf11-full.jpg&quot; data-glightbox data-gallery=&quot;shots-group&quot;&gt; &lt;img src=&quot;/assets/img/photos/pf11.jpg&quot; alt=&quot;&quot; /&gt;&lt;/a&gt;
            &lt;figcaption&gt;
              &lt;h5 class=&quot;from-top mb-0&quot;&gt;Ultricies Aenean&lt;/h5&gt;
            &lt;/figcaption&gt;
          &lt;/figure&gt;
        &lt;/div&gt;
        &lt;!-- /.project --&gt;
        &lt;div class=&quot;project item col-md-6 col-xl-4 foods&quot;&gt;
          &lt;figure class=&quot;overlay overlay-1 rounded&quot;&gt;&lt;a href=&quot;/assets/img/photos/pf12-full.jpg&quot; data-glightbox data-gallery=&quot;shots-group&quot;&gt; &lt;img src=&quot;/assets/img/photos/pf12.jpg&quot; alt=&quot;&quot; /&gt;&lt;/a&gt;
            &lt;figcaption&gt;
              &lt;h5 class=&quot;from-top mb-0&quot;&gt;Pellentesque Commodo&lt;/h5&gt;
            &lt;/figcaption&gt;
          &lt;/figure&gt;
        &lt;/div&gt;
        &lt;!-- /.project --&gt;
        &lt;div class=&quot;project item col-md-6 col-xl-4 drinks&quot;&gt;
          &lt;figure class=&quot;overlay overlay-1 rounded&quot;&gt;&lt;a href=&quot;/assets/img/photos/pf13-full.jpg&quot; data-glightbox data-gallery=&quot;shots-group&quot;&gt; &lt;img src=&quot;/assets/img/photos/pf13.jpg&quot; alt=&quot;&quot; /&gt;&lt;/a&gt;
            &lt;figcaption&gt;
              &lt;h5 class=&quot;from-top mb-0&quot;&gt;Ultricies Aenean&lt;/h5&gt;
            &lt;/figcaption&gt;
          &lt;/figure&gt;
        &lt;/div&gt;
        &lt;!-- /.project --&gt;
      &lt;/div&gt;
      &lt;!-- /.row --&gt;
    &lt;/div&gt;
    &lt;!-- /.grid --&gt;
  &lt;/div&gt;
  &lt;!-- /.container --&gt;
&lt;/section&gt;
&lt;!-- /section --&gt;</code></pre>