1#@!#!123s

: / home / rakcha / public_html /
Filename : gallery.php
back
<?php
include'admin/includes/database.php';
?>

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="keywords" content="Nutricare - Nutrition Health Services HTML5 Template" />
<meta name="description" content="Nutricare - Nutrition Health Services HTML5 Template, Nutrico - Nutrition Health Services WordPress Theme, themes & template, html5 template, WordPress theme, unlimited colors available, ui/ux, ui/ux design, best html template, html template, html, woocommerce, shopify, prestashop, eCommerce, JavaScript, best CSS theme,css3, elementor theme, latest premium themes 2024, latest premium templates 2024, Preyan Technosys Pvt.Ltd, cymol themes, themetech mount, Web 3.0, multi-theme, website theme and template, woocommerce, bootstrap template, web templates, responsive theme, services, web design and development, business, diet and nutrition template, dietitian, fitness, food, health, health and diet consultancy, healthy food, meals, nutrition, nutrition health care, nutrition WordPress theme, organic, sport and weight loss programs, vegetarian, yoga, healthy lifestyle, healthy food, weight loss, wellness, fitness motivation, healthy living, healthy eating, vegan, personal trainer, weight loss journey" />
<meta name="author" content="https://www.themetechmount.com/" />
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
<title>Gallery | Rakcha</title>

<!-- favicon icon -->
<link rel="shortcut icon" href="images/favicon.png" />

<!-- bootstrap -->
<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css"/>

<!-- animate -->
<link rel="stylesheet" type="text/css" href="css/animate.css"/>

<!-- owl-carousel -->
<link rel="stylesheet" type="text/css" href="css/owl.carousel.css">

<!-- fontawesome -->
<link rel="stylesheet" type="text/css" href="css/font-awesome.css"/>

<!-- themify -->
<link rel="stylesheet" type="text/css" href="css/themify-icons.css"/>

<!-- flaticon -->
<link rel="stylesheet" type="text/css" href="css/flaticon.css"/>

<!-- prettyphoto -->
<link rel="stylesheet" type="text/css" href="css/prettyPhoto.css">

<!-- shortcodes -->
<link rel="stylesheet" type="text/css" href="css/shortcodes.css"/>

<!-- main -->
<link rel="stylesheet" type="text/css" href="css/main.css"/>

<!-- responsive -->
<link rel="stylesheet" type="text/css" href="css/responsive.css"/>




   <!-- Bootstrap CSS (optional, for layout) -->
    <link href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css" rel="stylesheet">

    <!-- Lightbox2 CSS -->
    <link href="https://cdnjs.cloudflare.com/ajax/libs/lightbox2/2.11.3/css/lightbox.min.css" rel="stylesheet" />




  <style>
        .sub_title_border {
            border-bottom: 2px solid #000;
            display: inline-block;
            margin-bottom: 20px;
            padding-bottom: 5px;
        }
        .mb-30 {
            margin-bottom: 30px;
        }
    </style>


    
    <style>
       
        .featured-imagebox-team .featured-thumbnail {
    position: relative;
    overflow: hidden;
    background-color: #fff;
}
.featured-imagebox-team.ttm-team-box-view-overlay-style2 .featured-title h5 {
    font-size: 19px;
    line-height: 25px;
    padding-bottom: 0;
    font-weight: 800;
}

.team_bg
{
    background-image: url(images/gallery.webp);
    background-size: cover;
    background-position: center;
}

 @media (max-width:768px)
    {
        .team_bg
        {
            height:140px !important;
        }
        



    </style>

    
</head>

<body>

    <!--page start-->
    <div class="page">

        <!--header start-->
        <?php include 'header.php'; ?>
        <!--header end-->

        <!-- page-title -->
        <div class="ttm-page-title-row team_bg">
            <div class="ttm-page-title-row-bg-layer ttm-bg-layer"></div>
            <div class="container">
                <div class="row">
                    <div class="col-md-12 text-center"> 
                        <div class="title-box ttm-textcolor-white">
                            <div class="page-title-heading ttm-textcolor-white">
                                <!--<h1 class="title">Our Team</h1>-->
                            </div><!-- /.page-title-captions -->
                            <div class="breadcrumb-wrapper">
                                <span>
                                    <!--<a title="Homepage" href="index.php"><i class="ti ti-home"></i> Home </a>-->
                                </span>
                                <!--<span class="ttm-bread-sep"> &nbsp; :&nbsp;: &nbsp; </span>-->
                                <!--<span><span class="ttm-textcolor-skincolor">Our Team</span></span>-->
                            </div>  
                        </div>
                    </div><!-- /.col-md-12 -->  
                </div><!-- /.row -->  
            </div><!-- /.container -->                      
        </div><!-- page-title end-->


    <!--site-main start-->
    <div class="site-main">
<style>
    h5 a{
    z-index: 99999;
    position: relative;
    top: -153px;
    color: blue;
    font-size: 18px;
    background: yellow;
}

.to_gallery{
    color: #81d501;
    font-size: 30px;
    text-decoration: none;
    margin-left: 30px;
    cursor:pointer;
    font-size:30px;
    font-family: "Times New Roman", Times, serif;
}
a:hover {
    color: #0056b3;
    text-decoration: none;
}
</style>



<style>
    .featured-thumbnail img {
        width: 100%;
        height: 250px; /* Set your desired height */
        object-fit: cover;
    }
</style>

        <!--team-style2-section-->
            
            
        <section class="ttm-row team-style2-section clearfix">
    <div class="container">
        <a href="gallery.php"  class="title sub_title_border to_gallery">Images</a>
        <a href="video.php"  class="title sub_title_border to_gallery">Video's</a>
        <div class="row">
            <?php
            // Fetch gallery images from database
            $getGallery = mysqli_query($con, "SELECT * FROM `gallery` where source='image'") or die(mysqli_error($con));
            
            // Loop through the results
            while ($row = mysqli_fetch_array($getGallery)) {
                $imageID = $row['id']; // Assuming 'id' is the primary key or unique identifier
                $imageURL = $row['image']; // Assuming 'image_url' is the column where image URLs are stored
              
                ?>
                
                <div class="col-md-6 col-lg-3">
                    <div class="featured-imagebox featured-imagebox-team ttm-team-box-view-overlay-style2 mb-30">
                        <div class="ttm-box-view-overlay ttm-team-style2-box-view-overlay">
                            <div class="featured-thumbnail">
                                <a href="admin/gallery/<?php echo $imageURL; ?>" data-lightbox="gallery-group" data-title="Image <?php echo $imageID; ?>">
                                    <img class="img-fluid" src="admin/gallery/<?php echo $imageURL; ?>" alt="Gallery Image <?php echo $imageID; ?>">
                                </a>
                            </div>
                        </div>
                    </div>
                </div>
                
                <?php
            }
            ?>
        </div>
    </div>
</section>


    <!-- jQuery (required by Lightbox2) -->
    <script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>

    <!-- Lightbox2 JS -->
    <script src="https://cdnjs.cloudflare.com/ajax/libs/lightbox2/2.11.3/js/lightbox.min.js"></script>


<style>
    .featured-thumbnail img {
        width: 100%;
        height: 250px;
        object-fit: cover;
    }
</style>


<style>
    .featured-thumbnail img {
        width: 100%;
        height: 250px;
        object-fit: cover;
    }
</style>


        <!--team-style2-section end-->

        


    </div><!--site-main end-->


    <!--footer start-->
   <?php include 'footer.php'; ?>
    <!--footer end-->

    <!--back-to-top start-->
    <a id="totop" href="#top">
        <i class="fa fa-angle-up"></i>
    </a>
    <!--back-to-top end-->

</div><!-- page end -->


    <!-- Javascript -->

    <script src="js/jquery-3.7.1.min.js"></script>
    <script src="js/jquery-migrate-3.4.1.min.js"></script>
    <script src="js/tether.min.js"></script>
    <script src="js/bootstrap.min.js"></script> 
    <script src="js/jquery.easing.js"></script>    
    <script src="js/jquery-waypoints.js"></script>    
    <script src="js/owl.carousel.js"></script>
    <script src="js/jquery.prettyPhoto.js"></script>
    <script src="js/numinate.min.js?ver=4.9.3"></script>
    <script src="js/main.js"></script>

    <!-- Javascript end-->

</body>
</html>