Portfolio Section

1 • 2 • 3 • 4 • 5 • 6

Preview
HTML

Portfolio One

Image Description — Logo Design
Branding

<!-- =========={ PORTFOLIO }==========  -->
<div id="portfolio" class="section py-6 py-md-7 bg-light-dark">
  <div class="container">
    <!-- section header -->
    <header class="text-center mx-auto mb-5">
      <h2 class="h3 fw-bold">Portfolio <span class="fw-light">One</span></h2>
      <hr class="divider my-4 bg-warning border-warning">
    </header>

    <!-- navigation -->
    <div class="button-group filters-button-group portfolio-nav text-center">
      <button class="portfolio-nav-item text-body bg-transparent border-0 mb-4 mb-md-5 active" data-filter="*">All</button>
      <button class="portfolio-nav-item text-body bg-transparent border-0 mb-4 mb-md-5" data-filter=".web">Web</button>
      <button class="portfolio-nav-item text-body bg-transparent border-0 mb-4 mb-md-5" data-filter=".branding">Branding</button>
      <button class="portfolio-nav-item text-body bg-transparent border-0 mb-4 mb-md-5" data-filter=".graphic">Graphic</button>
      <button class="portfolio-nav-item text-body bg-transparent border-0 mb-4 mb-md-5" data-filter=".photovid">Photograpy</button>
    </div><!-- end navigation -->

    <!-- Portfolio Content -->
    <div class="grid portfolio row g-0 lightgallery-thumbnail">
      <figure data-src="src/img-min/portfolio/digital1.jpg" class="col-sm-6 col-lg-4 portfolio-item branding" data-sub-html="title images">
        <img class="portfolio-image" src="src/img-min/portfolio/digital1-small.jpg" alt="Image Description">
        <figcaption class="portfolio-info text-center">
          <h3 class="h6 my-1 text-light">Logo Design</h3>
          <small class="d-block">Branding</small>
        </figcaption>
      </figure>

      <figure data-src="src/img-min/portfolio/digital2.jpg" class="col-sm-6 col-lg-4 portfolio-item photovid branding web" data-sub-html="title images">
        <img class="portfolio-image" src="src/img-min/portfolio/digital2-small.jpg" alt="Image Description">
        <figcaption class="portfolio-info text-center">
          <h3 class="h6 my-1 text-light">Web Development</h3>
          <small class="d-block">Web</small>
        </figcaption>
      </figure>

      <figure data-src="src/img-min/portfolio/digital3.jpg" class="col-sm-6 col-lg-4 portfolio-item graphic" data-sub-html="title images">
        <img class="portfolio-image" src="src/img-min/portfolio/digital3-small.jpg" alt="Image Description">
        <figcaption class="portfolio-info text-center">
          <h3 class="h6 my-1 text-light">Graphic Design</h3>
          <small class="d-block">Graphic</small>
        </figcaption>
      </figure>

      <figure data-src="src/img-min/portfolio/digital4.jpg" class="col-sm-6 col-lg-4 portfolio-item branding graphic" data-sub-html="title images">
        <img class="portfolio-image" src="src/img-min/portfolio/digital4-small.jpg" alt="Image Description">
        <figcaption class="portfolio-info text-center">
          <h3 class="h6 my-1 text-light">Video Marketing</h3>
          <small class="d-block">Video</small>
        </figcaption>
      </figure>

      <figure data-src="src/img-min/portfolio/digital5.jpg" class="col-sm-6 col-lg-4 portfolio-item photovid" data-sub-html="title images">
        <img class="portfolio-image" src="src/img-min/portfolio/digital5-small.jpg" alt="Image Description">
        <figcaption class="portfolio-info text-center">
          <h3 class="h6 my-1 text-light">Photography</h3>
          <small class="d-block">Photo</small>
        </figcaption>
      </figure>

      <figure data-src="src/img-min/portfolio/digital6.jpg" class="col-sm-6 col-lg-4 portfolio-item web" data-sub-html="title images">
        <img class="portfolio-image" src="src/img-min/portfolio/digital6-small.jpg" alt="Image Description">
        <figcaption class="portfolio-info text-center">
          <h3 class="h6 my-1 text-light">Apps Development</h3>
          <small class="d-block">Apps</small>
        </figcaption>
      </figure>
    </div>
  </div>
</div><!-- End portfolio -->

Preview
HTML

Portfolio Two

<!-- =========={ PORTFOLIO }==========  -->
<div id="portfolio" class="section py-6 py-md-7 bg-body">
  <div class="container">
    <header class="text-center mx-auto mb-5">
      <h2 class="h3 fw-bold">Portfolio <span class="fw-light">Two</span></h2>
      <hr class="divider my-4 bg-warning border-warning">
    </header>

    <!-- Portfolio Content -->
    <div class="grid portfolio row g-0 lightgallery-thumbnail">
      <figure data-src="src/img-min/portfolio/digital1.jpg"  class="col-sm-6 col-lg-4 portfolio-item branding" data-sub-html="title images">
        <img class="portfolio-image-2" src="src/img-min/portfolio/digital1-small.jpg" alt="Image Description">
        <figcaption class="portfolio-info-2">
          <div class="portfolio-info-content-2">
            <h3 class="h5 mb-3 text-white">Logo Design</h3>
            <small class="d-block text-light">Rebranding Your Brand with new Logo</small>
          </div>
        </figcaption>
      </figure>

      <figure data-src="src/img-min/portfolio/digital2.jpg"  class="col-sm-6 col-lg-4 portfolio-item photovid branding web" data-sub-html="title images">
        <img class="portfolio-image-2" src="src/img-min/portfolio/digital2-small.jpg" alt="Image Description">
        <figcaption class="portfolio-info-2">
          <div class="portfolio-info-content-2">
            <h3 class="h5 mb-3 text-white">Web</h3>
            <small class="d-block text-light">Web Development Service</small>
          </div>
        </figcaption>
      </figure>

      <figure data-src="src/img-min/portfolio/digital3.jpg"  class="col-sm-6 col-lg-4 portfolio-item graphic" data-sub-html="title images">
        <img class="portfolio-image-2" src="src/img-min/portfolio/digital3-small.jpg" alt="Image Description">
        <figcaption class="portfolio-info-2">
          <div class="portfolio-info-content-2">
            <h3 class="h5 mb-3 text-white">Graphic</h3>
            <small class="d-block text-light">Graphic Design for Marketing</small>
          </div>
        </figcaption>
      </figure>

      <figure data-src="src/img-min/portfolio/digital4.jpg"  class="col-sm-6 col-lg-4 portfolio-item branding graphic" data-sub-html="title images">
        <img class="portfolio-image-2" src="src/img-min/portfolio/digital4-small.jpg" alt="Image Description">
        <figcaption class="portfolio-info-2">
          <div class="portfolio-info-content-2">
            <h3 class="h5 mb-3 text-white">Video</h3>
            <small class="d-block text-light">Video Sales and Marketing</small>
          </div>
        </figcaption>
      </figure>

      <figure data-src="src/img-min/portfolio/digital5.jpg"  class="col-sm-6 col-lg-4 portfolio-item photovid" data-sub-html="title images">
        <img class="portfolio-image-2" src="src/img-min/portfolio/digital5-small.jpg" alt="Image Description">
        <figcaption class="portfolio-info-2">
          <div class="portfolio-info-content-2">
            <h3 class="h5 mb-3 text-white">Photography</h3>
            <small class="d-block text-light">Record Your Best Moment</small>
          </div>
        </figcaption>
      </figure>

      <figure data-src="src/img-min/portfolio/digital6.jpg"  class="col-sm-6 col-lg-4 portfolio-item web" data-sub-html="title images">
        <img class="portfolio-image-2" src="src/img-min/portfolio/digital6-small.jpg" alt="Image Description">
        <figcaption class="portfolio-info-2">
          <div class="portfolio-info-content-2">
            <h3 class="h5 mb-3 text-white">Apps</h3>
            <small class="d-block text-light">Apps Development and Games</small>
          </div>
        </figcaption>
      </figure>
    </div>
  </div>
</div><!-- End portfolio -->

Preview
HTML

Portfolio Three

<!-- =========={ PORTFOLIO }==========  -->
<div id="portfolio" class="section py-6 py-md-7 bg-light-dark">
  <div class="container">
    <header class="text-center mx-auto mb-5">
      <h2 class="h3 fw-bold">Portfolio <span class="fw-light">Three</span></h2>
      <hr class="divider my-4 bg-warning border-warning">
    </header>

    <!-- Portfolio Content -->
    <div class="grid portfolio row g-0 lightgallery-thumbnail">
      <figure data-src="src/img-min/portfolio/digital1.jpg" class="col-sm-6 col-lg-4 portfolio-item branding" data-sub-html="title images">
        <img class="portfolio-image-3" src="src/img-min/portfolio/digital1-small.jpg" alt="Image Description">
        <figcaption class="portfolio-info-3">
          <div class="portfolio-info-content-3">
            <h3 class="h5 mb-3 text-white">Logo Design</h3>
            <small class="d-block text-light">Rebranding Your Brand with new Logo</small>
          </div>
        </figcaption>
      </figure>

      <figure data-src="src/img-min/portfolio/digital2.jpg" class="col-sm-6 col-lg-4 portfolio-item photovid branding web" data-sub-html="title images">
        <img class="portfolio-image-3" src="src/img-min/portfolio/digital2-small.jpg" alt="Image Description">
        <figcaption class="portfolio-info-3">
          <div class="portfolio-info-content-3">
            <h3 class="h5 mb-3 text-white">Web</h3>
            <small class="d-block text-light">Web Development Service</small>
          </div>
        </figcaption>
      </figure>

      <figure data-src="src/img-min/portfolio/digital3.jpg" class="col-sm-6 col-lg-4 portfolio-item graphic" data-sub-html="title images">
        <img class="portfolio-image-3" src="src/img-min/portfolio/digital3-small.jpg" alt="Image Description">
        <figcaption class="portfolio-info-3">
          <div class="portfolio-info-content-3">
            <h3 class="h5 mb-3 text-white">Graphic</h3>
            <small class="d-block text-light">Graphic Design for Marketing</small>
          </div>
        </figcaption>
      </figure>

      <figure data-src="src/img-min/portfolio/digital4.jpg" class="col-sm-6 col-lg-4 portfolio-item branding graphic" data-sub-html="title images">
        <img class="portfolio-image-3" src="src/img-min/portfolio/digital4-small.jpg" alt="Image Description">
        <figcaption class="portfolio-info-3">
          <div class="portfolio-info-content-3">
            <h3 class="h5 mb-3 text-white">Video</h3>
            <small class="d-block text-light">Video Sales and Marketing</small>
          </div>
        </figcaption>
      </figure>

      <figure data-src="src/img-min/portfolio/digital5.jpg" class="col-sm-6 col-lg-4 portfolio-item photovid" data-sub-html="title images">
        <img class="portfolio-image-3" src="src/img-min/portfolio/digital5-small.jpg" alt="Image Description">
        <figcaption class="portfolio-info-3">
          <div class="portfolio-info-content-3">
            <h3 class="h5 mb-3 text-white">Photography</h3>
            <small class="d-block text-light">Record Your Best Moment</small>
          </div>
        </figcaption>
      </figure>

      <figure data-src="src/img-min/portfolio/digital6.jpg" class="col-sm-6 col-lg-4 portfolio-item web" data-sub-html="title images">
        <img class="portfolio-image-3" src="src/img-min/portfolio/digital6-small.jpg" alt="Image Description">
        <figcaption class="portfolio-info-3">
          <div class="portfolio-info-content-3">
            <h3 class="h5 mb-3 text-white">Apps</h3>
            <small class="d-block text-light">Apps Development and Games</small>
          </div>
        </figcaption>
      </figure>
    </div>
  </div>
</div><!-- End portfolio -->

Preview
HTML

Portfolio Four

<!-- =========={ PORTFOLIO }==========  -->
<div id="portfolio" class="section py-6 py-md-7 bg-body">
  <div class="container">
    <header class="text-center mx-auto mb-5">
      <h2 class="h3 fw-bold">Portfolio <span class="fw-light">Four</span></h2>
      <hr class="divider my-4 bg-warning border-warning">
    </header>

    <!-- Portfolio Content -->
    <div class="grid portfolio row g-0 lightgallery-thumbnail">
      <figure data-src="src/img-min/portfolio/digital1.jpg" class="col-sm-6 col-lg-4 portfolio-item branding" data-sub-html="title images">
        <img class="portfolio-image-4" src="src/img-min/portfolio/digital1-small.jpg" alt="Image Description">
        <figcaption class="portfolio-info-4">
          <div class="portfolio-info-content-4">
            <div class="portfolio-center-icon text-light">
              <svg class="bi bi-plus-circle" width="2rem" height="2rem" viewBox="0 0 16 16" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
                <path fill-rule="evenodd" d="M8 3.5a.5.5 0 01.5.5v4a.5.5 0 01-.5.5H4a.5.5 0 010-1h3.5V4a.5.5 0 01.5-.5z" clip-rule="evenodd"></path>
                <path fill-rule="evenodd" d="M7.5 8a.5.5 0 01.5-.5h4a.5.5 0 010 1H8.5V12a.5.5 0 01-1 0V8z" clip-rule="evenodd"></path>
                <path fill-rule="evenodd" d="M8 15A7 7 0 108 1a7 7 0 000 14zm0 1A8 8 0 108 0a8 8 0 000 16z" clip-rule="evenodd"></path>
              </svg>
            </div>
          </div>
        </figcaption>
      </figure>

      <figure data-src="src/img-min/portfolio/digital2.jpg" class="col-sm-6 col-lg-4 portfolio-item photovid branding web" data-sub-html="title images">
        <img class="portfolio-image-4" src="src/img-min/portfolio/digital2-small.jpg" alt="Image Description">
        <figcaption class="portfolio-info-4">
          <div class="portfolio-info-content-4">
            <div class="portfolio-center-icon text-light">
              <svg class="bi bi-plus-circle" width="2rem" height="2rem" viewBox="0 0 16 16" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
                <path fill-rule="evenodd" d="M8 3.5a.5.5 0 01.5.5v4a.5.5 0 01-.5.5H4a.5.5 0 010-1h3.5V4a.5.5 0 01.5-.5z" clip-rule="evenodd"></path>
                <path fill-rule="evenodd" d="M7.5 8a.5.5 0 01.5-.5h4a.5.5 0 010 1H8.5V12a.5.5 0 01-1 0V8z" clip-rule="evenodd"></path>
                <path fill-rule="evenodd" d="M8 15A7 7 0 108 1a7 7 0 000 14zm0 1A8 8 0 108 0a8 8 0 000 16z" clip-rule="evenodd"></path>
              </svg>
            </div>
          </div>
        </figcaption>
      </figure>

      <figure data-src="src/img-min/portfolio/digital3.jpg" class="col-sm-6 col-lg-4 portfolio-item graphic" data-sub-html="title images">
        <img class="portfolio-image-4" src="src/img-min/portfolio/digital3-small.jpg" alt="Image Description">
        <figcaption class="portfolio-info-4">
          <div class="portfolio-info-content-4">
            <div class="portfolio-center-icon text-light">
              <svg class="bi bi-plus-circle" width="2rem" height="2rem" viewBox="0 0 16 16" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
                <path fill-rule="evenodd" d="M8 3.5a.5.5 0 01.5.5v4a.5.5 0 01-.5.5H4a.5.5 0 010-1h3.5V4a.5.5 0 01.5-.5z" clip-rule="evenodd"></path>
                <path fill-rule="evenodd" d="M7.5 8a.5.5 0 01.5-.5h4a.5.5 0 010 1H8.5V12a.5.5 0 01-1 0V8z" clip-rule="evenodd"></path>
                <path fill-rule="evenodd" d="M8 15A7 7 0 108 1a7 7 0 000 14zm0 1A8 8 0 108 0a8 8 0 000 16z" clip-rule="evenodd"></path>
              </svg>
            </div>
          </div>
        </figcaption>
      </figure>

      <figure data-src="src/img-min/portfolio/digital4.jpg" class="col-sm-6 col-lg-4 portfolio-item branding graphic" data-sub-html="title images">
        <img class="portfolio-image-4" src="src/img-min/portfolio/digital4-small.jpg" alt="Image Description">
        <figcaption class="portfolio-info-4">
          <div class="portfolio-info-content-4">
            <div class="portfolio-center-icon text-light">
              <svg class="bi bi-plus-circle" width="2rem" height="2rem" viewBox="0 0 16 16" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
                <path fill-rule="evenodd" d="M8 3.5a.5.5 0 01.5.5v4a.5.5 0 01-.5.5H4a.5.5 0 010-1h3.5V4a.5.5 0 01.5-.5z" clip-rule="evenodd"></path>
                <path fill-rule="evenodd" d="M7.5 8a.5.5 0 01.5-.5h4a.5.5 0 010 1H8.5V12a.5.5 0 01-1 0V8z" clip-rule="evenodd"></path>
                <path fill-rule="evenodd" d="M8 15A7 7 0 108 1a7 7 0 000 14zm0 1A8 8 0 108 0a8 8 0 000 16z" clip-rule="evenodd"></path>
              </svg>
            </div>
          </div>
        </figcaption>
      </figure>

      <figure data-src="src/img-min/portfolio/digital5.jpg" class="col-sm-6 col-lg-4 portfolio-item photovid" data-sub-html="title images">
        <img class="portfolio-image-4" src="src/img-min/portfolio/digital5-small.jpg" alt="Image Description">
        <figcaption class="portfolio-info-4">
          <div class="portfolio-info-content-4">
            <div class="portfolio-center-icon text-light">
              <svg class="bi bi-plus-circle" width="2rem" height="2rem" viewBox="0 0 16 16" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
                <path fill-rule="evenodd" d="M8 3.5a.5.5 0 01.5.5v4a.5.5 0 01-.5.5H4a.5.5 0 010-1h3.5V4a.5.5 0 01.5-.5z" clip-rule="evenodd"></path>
                <path fill-rule="evenodd" d="M7.5 8a.5.5 0 01.5-.5h4a.5.5 0 010 1H8.5V12a.5.5 0 01-1 0V8z" clip-rule="evenodd"></path>
                <path fill-rule="evenodd" d="M8 15A7 7 0 108 1a7 7 0 000 14zm0 1A8 8 0 108 0a8 8 0 000 16z" clip-rule="evenodd"></path>
              </svg>
            </div>
          </div>
        </figcaption>
      </figure>

      <figure data-src="src/img-min/portfolio/digital6.jpg" class="col-sm-6 col-lg-4 portfolio-item web" data-sub-html="title images">
        <img class="portfolio-image-4" src="src/img-min/portfolio/digital6-small.jpg" alt="Image Description">
        <figcaption class="portfolio-info-4">
          <div class="portfolio-info-content-4">
            <div class="portfolio-center-icon text-light">
              <svg class="bi bi-plus-circle" width="2rem" height="2rem" viewBox="0 0 16 16" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
                <path fill-rule="evenodd" d="M8 3.5a.5.5 0 01.5.5v4a.5.5 0 01-.5.5H4a.5.5 0 010-1h3.5V4a.5.5 0 01.5-.5z" clip-rule="evenodd"></path>
                <path fill-rule="evenodd" d="M7.5 8a.5.5 0 01.5-.5h4a.5.5 0 010 1H8.5V12a.5.5 0 01-1 0V8z" clip-rule="evenodd"></path>
                <path fill-rule="evenodd" d="M8 15A7 7 0 108 1a7 7 0 000 14zm0 1A8 8 0 108 0a8 8 0 000 16z" clip-rule="evenodd"></path>
              </svg>
            </div>
          </div>
        </figcaption>
      </figure>
    </div>
  </div>
</div><!-- End portfolio -->

Preview
HTML

Portfolio Five

<!-- =========={ PORTFOLIO }==========  -->
<div id="portfolio" class="section py-6 py-md-7 bg-light-dark">
  <div class="container">
    <header class="text-center mx-auto mb-5">
      <h2 class="h3 fw-bold">Portfolio <span class="fw-light">Five</span></h2>
      <hr class="divider my-4 bg-warning border-warning">
    </header>

    <!-- Portfolio Content -->
    <div class="grid portfolio row g-0 lightgallery-thumbnail">
      <figure data-src="src/img-min/portfolio/digital1.jpg" class="col-sm-6 col-lg-4 portfolio-item branding" data-sub-html="title images">
        <img class="portfolio-image-5" src="src/img-min/portfolio/digital1-small.jpg" alt="Image Description">
        <figcaption class="portfolio-info-5">
          <div class="portfolio-info-content-5">
            <h3 class="h5 mb-3 text-white">Logo Design</h3>
            <small class="d-block text-light">Rebranding Your Brand with new Logo</small>
          </div>
        </figcaption>
      </figure>

      <figure data-src="src/img-min/portfolio/digital2.jpg" class="col-sm-6 col-lg-4 portfolio-item photovid branding web" data-sub-html="title images">
        <img class="portfolio-image-5" src="src/img-min/portfolio/digital2-small.jpg" alt="Image Description">
        <figcaption class="portfolio-info-5">
          <div class="portfolio-info-content-5">
            <h3 class="h5 mb-3 text-white">Web</h3>
            <small class="d-block text-light">Web Development Service</small>
          </div>
        </figcaption>
      </figure>

      <figure data-src="src/img-min/portfolio/digital3.jpg" class="col-sm-6 col-lg-4 portfolio-item graphic" data-sub-html="title images">
        <img class="portfolio-image-5" src="src/img-min/portfolio/digital3-small.jpg" alt="Image Description">
        <figcaption class="portfolio-info-5">
          <div class="portfolio-info-content-5">
            <h3 class="h5 mb-3 text-white">Graphic</h3>
            <small class="d-block text-light">Graphic Design for Marketing</small>
          </div>
        </figcaption>
      </figure>

      <figure data-src="src/img-min/portfolio/digital4.jpg" class="col-sm-6 col-lg-4 portfolio-item branding graphic" data-sub-html="title images">
        <img class="portfolio-image-5" src="src/img-min/portfolio/digital4-small.jpg" alt="Image Description">
        <figcaption class="portfolio-info-5">
          <div class="portfolio-info-content-5">
            <h3 class="h5 mb-3 text-white">Video</h3>
            <small class="d-block text-light">Video Sales and Marketing</small>
          </div>
        </figcaption>
      </figure>

      <figure data-src="src/img-min/portfolio/digital5.jpg" class="col-sm-6 col-lg-4 portfolio-item photovid" data-sub-html="title images">
        <img class="portfolio-image-5" src="src/img-min/portfolio/digital5-small.jpg" alt="Image Description">
        <figcaption class="portfolio-info-5">
          <div class="portfolio-info-content-5">
            <h3 class="h5 mb-3 text-white">Photography</h3>
            <small class="d-block text-light">Record Your Best Moment</small>
          </div>
        </figcaption>
      </figure>

      <figure data-src="src/img-min/portfolio/digital6.jpg" class="col-sm-6 col-lg-4 portfolio-item web" data-sub-html="title images">
        <img class="portfolio-image-5" src="src/img-min/portfolio/digital6-small.jpg" alt="Image Description">
        <figcaption class="portfolio-info-5">
          <div class="portfolio-info-content-5">
            <h3 class="h5 mb-3 text-white">Apps</h3>
            <small class="d-block text-light">Apps Development and Games</small>
          </div>
        </figcaption>
      </figure>
    </div>
  </div>
</div><!-- End portfolio -->

Preview
HTML

Portfolio Six

<!-- =========={ PORTFOLIO }==========  -->
<div id="portfolio" class="section py-6 pt-md-7 bg-light-dark">
  <div class="container">
    <!-- section header -->
    <header class="text-center mx-auto mb-5">
      <h2 class="h3 fw-bold">Portfolio <span class="fw-light">One</span></h2>
      <hr class="divider my-4 bg-warning border-warning">
    </header>

    <div class="row lightgallery-thumbnail">
      <figure data-src="src/img-min/portfolio/digital1.jpg"  class="col-sm-6 col-lg-4 portfolio-item branding" data-sub-html="title images">
        <div class="position-relative mb-4 shadow-sm">
          <img class="portfolio-image-2" src="src/img-min/portfolio/digital1-small.jpg" alt="Image Description">
          <figcaption class="portfolio-info-2">
            <div class="portfolio-info-content-2">
              <h3 class="h5 mb-3 text-white">Logo Design</h3>
              <small class="d-block text-light">Rebranding Your Brand with new Logo</small>
            </div>
          </figcaption>
        </div>
      </figure>

      <figure data-src="src/img-min/portfolio/digital2.jpg"  class="col-sm-6 col-lg-4 portfolio-item photovid branding web" data-sub-html="title images">
        <div class="position-relative mb-4 shadow-sm">
          <img class="portfolio-image-2" src="src/img-min/portfolio/digital2-small.jpg" alt="Image Description">
          <figcaption class="portfolio-info-2">
            <div class="portfolio-info-content-2">
              <h3 class="h5 mb-3 text-white">Web</h3>
              <small class="d-block text-light">Web Development Service</small>
            </div>
          </figcaption>
        </div>
      </figure>

      <figure data-src="src/img-min/portfolio/digital3.jpg"  class="col-sm-6 col-lg-4 portfolio-item graphic" data-sub-html="title images">
        <div class="position-relative mb-4 shadow-sm">
          <img class="portfolio-image-2" src="src/img-min/portfolio/digital3-small.jpg" alt="Image Description">
          <figcaption class="portfolio-info-2">
            <div class="portfolio-info-content-2">
              <h3 class="h5 mb-3 text-white">Graphic</h3>
              <small class="d-block text-light">Graphic Design for Marketing</small>
            </div>
          </figcaption>
        </div>
      </figure>

      <figure data-src="src/img-min/portfolio/digital4.jpg"  class="col-sm-6 col-lg-4 portfolio-item branding graphic" data-sub-html="title images">
        <div class="position-relative mb-4 shadow-sm">
          <img class="portfolio-image-2" src="src/img-min/portfolio/digital4-small.jpg" alt="Image Description">
          <figcaption class="portfolio-info-2">
            <div class="portfolio-info-content-2">
              <h3 class="h5 mb-3 text-white">Video</h3>
              <small class="d-block text-light">Video Sales and Marketing</small>
            </div>
          </figcaption>
        </div>
      </figure>

      <figure data-src="src/img-min/portfolio/digital5.jpg"  class="col-sm-6 col-lg-4 portfolio-item photovid" data-sub-html="title images">
        <div class="position-relative mb-4 shadow-sm">
          <img class="portfolio-image-2" src="src/img-min/portfolio/digital5-small.jpg" alt="Image Description">
          <figcaption class="portfolio-info-2">
            <div class="portfolio-info-content-2">
              <h3 class="h5 mb-3 text-white">Photography</h3>
              <small class="d-block text-light">Record Your Best Moment</small>
            </div>
          </figcaption>
        </div>
      </figure>

      <figure data-src="src/img-min/portfolio/digital6.jpg"  class="col-sm-6 col-lg-4 portfolio-item web" data-sub-html="title images">
        <div class="position-relative mb-4 shadow-sm">
          <img class="portfolio-image-2" src="src/img-min/portfolio/digital6-small.jpg" alt="Image Description">
          <figcaption class="portfolio-info-2">
            <div class="portfolio-info-content-2">
              <h3 class="h5 mb-3 text-white">Apps</h3>
              <small class="d-block text-light">Apps Development and Games</small>
            </div>
          </figcaption>
        </div>
      </figure>
    </div>
  </div>
</div><!-- End portfolio -->

Sections

Documentation

Components

Changelog

Portfolio Section

Logo Design

Web Development

Graphic Design

Video Marketing

Photography

Apps Development

Logo Design

Web

Graphic

Video

Photography

Apps

Logo Design

Web

Graphic

Video

Photography

Apps

Logo Design

Web

Graphic

Video

Photography

Apps

Logo Design

Web

Graphic

Video

Photography

Apps