Lightbox

Don't forget to include assets/vendors/node_modules/css/glightbox.min.css in head of HTML File
Single images lightbox
image 

<!-- Single image lightbox -->
<a href="assets/img/960x900/3.jpg" class="glightbox3" data-glightbox data-gallery="gallery0">
 <img src="assets/img/960x900/3.jpg" class="width-14x h-auto" alt="image" />
</a>
Multiple images lightbox gallery
image image 

<!--Lightbox gallery-->
<a href="assets/img/960x900/1.jpg" class="glightbox3" data-glightbox data-gallery="gallery1">
  <img src="assets/img/960x900/1.jpg" class="width-14x h-auto" alt="image" />
</a>
<a href="assets/img/960x900/2.jpg" class="glightbox3" data-glightbox data-gallery="gallery1">
    <img src="assets/img/960x900/2.jpg" class="width-14x h-auto" alt="image" />
</a>
Vimeo video

<!--Video Lightbox-->
 <a href="https://vimeo.com/167338879" class="btn btn-outline-primary p-0 flex-center glightbox3 width-8x height-8x rounded-circle" data-glightbox data-gallery="gallery-2">
  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="36" height="36">
   <path fill="currentColor" d="M6.427 4.427l3.396 3.396a.25.25 0 010 .354l-3.396 3.396A.25.25 0 016 11.396V4.604a.25.25 0 01.427-.177z">
  </path>
 </svg>
</a>
Youtube video

<!--Video Lightbox-->
<a href="https://www.youtube.com/watch?v=V_romThfA0I" data-glightbox data-gallery="gallery-3">
<img src="https://img.youtube.com/vi/V_romThfA0I/maxresdefault.jpg" alt=""
        class="img-fluid">
</a>
HTML5 video
    
     <!--Video Lightbox-->
     <a href="assets/videos/officeloop.mp4" data-glightbox data-gallery="gallery-4">
       <img src="assets/videos/officeloop-cover.jpg" alt="" class="img-fluid">
     </a>
Plugin Documentation

Let's start building stunning websites

Lorem ipsum is placeholder text commonly used in the graphic, print, and publishing industries for previewing layouts and visual mockups.