<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
    <title>Babbler - A Jungle Resort</title>
    <link rel="shortcut icon" type="image/x-icon" href="images/Logo.png">
    <meta name="keywords" content="">
    
    <!-- Bootstrap CSS -->
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.2/css/all.min.css">
    <link href="css/style.css" type="text/css" rel="stylesheet" media="all">
    <link href="css/style-media.css" type="text/css" rel="stylesheet" media="all">
    <!--owl carasal-->
    <link rel="stylesheet" href="css/owl.carousel.min.css">
    <link rel="stylesheet" href="css/owl.theme.default.min.css">
    <!--owl carasal end-->
    <!--for animation-->
    <link rel="stylesheet" href="css/animations.css">
    <link href="css/animate.min.css" rel="stylesheet"> 
    <!--for animation-->
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/magnific-popup.js/1.1.0/magnific-popup.css">
    <!--for gallery-->  
       <link rel="stylesheet" type="text/css" href="css/extras/main.css">
        <link rel="stylesheet" type="text/css" href="css/extras/responsive.css">
        <link rel="stylesheet" type="text/css" href="css/extras/animate.css">
        <link rel="stylesheet" type="text/css" href="css/extras/lightbox.css">
   <!--for gallery end-->

  </head>
  <body>
   <?php include("inc/header_.php"); ?>  
<div class="container-fluid">
<div class="row">
<div class="inpage_slider_container1">
        <div class="flexslider">
            <ul class="innerslide">
                <li>
                 <img src="images/banner/slider/banner1.jpg" alt="" title=""/>
              </li>                  
            </ul>
      </div>
      <div class="cliver_inpage1">
            <div class="inpage_heading">
                <h2>Photo Gallery</h2>
                <p>Whole Gallery, Built For You</p>
                <ul>
                    <li><a href="index.php"><i class="fa-solid fa-house"></i> Home</a></li>
                    <li><i class="fa-solid fa-chevron-right"></i></li>
                    <li>Gallery</li>
                </ul>
            </div>
        </div>
   </div>
</div>
</div>

<div class="container-fluid">
    <div class="row">  
        <div class="gallery_inpage">
            <div class="animatedParent" data-sequence='100'>
                <div class="row">
                    <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12 padk animated fadeInUpShort" data-id='3'>
                        <div class="portfolio-item">
                            <a href="#"><img src="images/room/1.jpg" alt=""></a>
                            <div class="overlay">
                                <div class="icons">
                                    <a data-lightbox="image1" href="images/room/1.jpg" class="preview" title="GALLERY"><i class="fa-solid fa-arrow-right-long"></i></a>
                                </div>
                           </div>
                        </div>
                    </div>
                    <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12 padk animated fadeInUpShort" data-id='3'>
                        <div class="portfolio-item">
                            <a href="#"><img src="images/room/2.jpg" alt=""></a>
                            <div class="overlay">
                                <div class="icons">
                                    <a data-lightbox="image1" href="images/room/2.jpg" class="preview" title="GALLERY"><i class="fa-solid fa-arrow-right-long"></i></a>
                                </div>
                           </div>
                        </div>
                    </div>
                    <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12 padk animated fadeInUpShort" data-id='3'>
                        <div class="portfolio-item">
                            <a href="#"><img src="images/room/3.jpg" alt=""></a>
                            <div class="overlay">
                                <div class="icons">
                                    <a data-lightbox="image1" href="images/room/3.jpg" class="preview" title="GALLERY"><i class="fa-solid fa-arrow-right-long"></i></a>
                                </div>
                           </div>
                        </div>
                    </div>
                    <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12 padk animated fadeInUpShort" data-id='3'>
                        <div class="portfolio-item">
                            <a href="#"><img src="images/room/4.jpg" alt=""></a>
                            <div class="overlay">
                                <div class="icons">
                                    <a data-lightbox="image1" href="images/room/4.jpg" class="preview" title="GALLERY"><i class="fa-solid fa-arrow-right-long"></i></a>
                                </div>
                           </div>
                        </div>
                    </div>
                    <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12 padk animated fadeInUpShort" data-id='3'>
                        <div class="portfolio-item">
                            <a href="#"><img src="images/room/5.webp" alt=""></a>
                            <div class="overlay">
                                <div class="icons">
                                    <a data-lightbox="image1" href="images/room/5.webp" class="preview" title="GALLERY"><i class="fa-solid fa-arrow-right-long"></i></a>
                                </div>
                           </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>




<?php include("inc/footer.php"); ?>
    <!-- Optional JavaScript -->
    <!-- jQuery first, then Popper.js, then Bootstrap JS -->
<script src="https://code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
  
<script src="https://cdnjs.cloudflare.com/ajax/libs/magnific-popup.js/1.1.0/jquery.magnific-popup.js"></script>  
<script src="https://cdnjs.cloudflare.com/ajax/libs/ScrollMagic/2.0.8/ScrollMagic.min.js"></script>
<script src="https://unpkg.com/@studio-freight/lenis@1.0.34/dist/lenis.min.js"></script>
<script type="text/javascript" src="js/jquery.flexslider-min.js"></script><!--for banner-->
<script src="js/owl.carousel.js"></script>
<!--init Jarallax-->
<script src="https://unpkg.com/object-fit-images/dist/ofi.min.js"></script>
<script src="jaralax/jarallax.js"></script>
      <!--init Jarallax--> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/typed.js/2.0.11/typed.min.js"></script> 
<script src='js/animate-it.js'></script>
<script src="js/jquery.tabby.js"></script>




<script src="js/lightbox.min.js"></script> 
<script src="js/jquery.stickem.js"></script>

<script src="js/customize-js.js"></script> 



  </body>
</html>