Simple File Manage Design by index.php

��

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>@yield('title', 'Gallery - Dusty helmets')</title>
    <meta content="Dusty Helmets" name="Dusty Helmets is a true Kenyan organization that has been created by a group of passionate Kenyans who want to share
  with you their passion and knowledge of the country where you will see wildlife like you have never seen before. Kenya
  has the No.1 world reputation for safaris that show you wildlife. Dusty Helmets takes this experience to a higher level by
  using a world-class enduro motorbike and following tracks that you cannot follow in a conventional tourist safari!">
    <meta content="Dusty Helmets" name="Dusty Helmets, bike riding">
    <link href="assets/images/favi.ico" rel="icon">
    <link href="https://fonts.googleapis.com/css?family=Open+Sans:300,400|Nunito:600,700" rel="stylesheet">
    <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.10.0/css/all.min.css" rel="stylesheet">
    <link href="public/assets/lib/animate/animate.min.css" rel="stylesheet">
    <link href="public/assets/lib/owlcarousel/assets/owl.carousel.min.css" rel="stylesheet">
    <link href="public/assets/lib/flaticon/font/flaticon.css" rel="stylesheet">
    <link href="public/assets/lib/tempusdominus/css/tempusdominus-bootstrap-4.min.css" rel="stylesheet"/>
    <link href="public/assets/lib/bootstrap/css/bootstrap.min.css" rel="stylesheet">
    {{-- <link href="assets/lib/venobox.css" rel="stylesheet"> --}}
    <link href="assets/lib/aos.css" rel="stylesheet">
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.0/dist/css/bootstrap.min.css"
          integrity="sha384-B0vP5xmATw1+K9KRQjQERJvTumQW0nPEzvF6L/Z6nronJ3oUOFUFpCjEUQouq2+l" crossorigin="anonymous">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/venobox/1.9.3/venobox.min.css"
          integrity="sha512-e+0yqAgUQFoRrJ4pZigQXpOE0S7J9IGwmgH801h4H5ODqOCG8/GRfXHQ+9ab754NL79O7wDwdjwY3CcU8sEANg=="
          crossorigin="anonymous" referrerpolicy="no-referrer"/>
    <link href="public/assets/css/style.css" rel="stylesheet">
    <style>
        ul li ul.dropdown {
            min-width: 100%; /* Set width of the dropdown */
            background: #f2f2f2;
            display: none;
            position: absolute;
            z-index: 999;
            left: 0;
        }

ul li:hover ul.dropdown {
            display: block; /* Display the dropdown */

}

ul li ul.dropdown li {
            display: block;
            padding: .75rem 1.25rem;
            min-width: 150px;
            white-space: nowrap;
            border-bottom: 1px solid #603814;
            font-size: 15px;
        }

.imgx {
            -webkit-animation: mover 2s infinite alternate;
            animation: mover 2s infinite alternate;
        }

@-webkit-keyframes mover {
            0% {
                transform: translateY(0);
            }
            100% {
                transform: translateY(-20px);
                transform: rotate(15deg);
            }
        }

@keyframes mover {
            0% {
                transform: translateY(0);
            }
            100% {
                transform: translateY(-20px);
                transform: rotate(-15deg);
            }
        }

#img {
            background: #F1F1FA;
            width: 400px;
            height: 300px;
            display: block;
            margin: 10px auto;
            border: 0;
        }

#cl:hover {
            color: #603814 !important;
        }

.img-fluid {
            width: 350px !important;
            height: 221px !important;
        }

#newImg {
            border-radius: 3px;
            -moz-box-shadow: rgb(0, 0, 0) 0px 0px 3px;
            -webkit-box-shadow: rgb(0, 0, 0) 0px 0px 3px;
            box-shadow: rgb(0, 0, 0) 0px 0px 3px;
            padding: 3px;
            border: 1px solid #cccccc;
            filter: alpha(opacity=90);
            -moz-opacity: 0.9;
            -khtml-opacity: 0.9;
            opacity: 0.9;
        }

#newImg:hover {
            padding: 3px;
            border: 1px solid #000000;
            filter: alpha(opacity=99);
            -moz-opacity: 0.99;
            -khtml-opacity: 0.99;
            opacity: 0.99;
        }

/* Preload images */

body.lb-disable-scrolling {
            overflow: hidden;
        }

.lightboxOverlay {
            position: absolute;
            top: 0;
            left: 0;
            z-index: 9999;
            background-color: black;
            filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
            opacity: 0.8;
            display: none;
        }

.lightbox {
            position: absolute;
            left: 0;
            width: 100%;
            z-index: 10000;
            text-align: center;
            line-height: 0;
            font-weight: normal;
        }

.lightbox .lb-image {
            display: block;
            height: auto;
            max-width: inherit;
            max-height: none;
            border-radius: 3px;

/* Image border */
            border: 4px solid white;
        }

.lightbox a img {
            border: none;
        }

.lb-outerContainer {
            position: relative;
            *zoom: 1;
            width: 250px;
            height: 250px;
            margin: 0 auto;
            border-radius: 4px;

/* Background color behind image.
               This is visible during transitions. */
            background-color: white;
        }

.lb-outerContainer:after {
            content: "";
            display: table;
            clear: both;
        }

.lb-loader {
            position: absolute;
            top: 43%;
            left: 0;
            height: 25%;
            width: 100%;
            text-align: center;
            line-height: 0;
        }

.lb-cancel {
            display: block;
            width: 32px;
            height: 32px;
            margin: 0 auto;
            background: url(../images/loading.gif) no-repeat;
        }

.lb-nav {
            position: absolute;
            top: 0;
            left: 0;
            height: 100%;
            width: 100%;
            z-index: 10;
        }

.lb-container > .nav {
            left: 0;
        }

.lb-nav a {
            outline: none;
            background-image: url('data:image/gif;base64,R0lGODlhAQABAPAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==');
        }

.lb-prev, .lb-next {
            height: 100%;
            cursor: pointer;
            display: block;
        }

.lb-nav a.lb-prev {
            width: 34%;
            left: 0;
            float: left;
            background: url(images/prev.png) left 48% no-repeat;
            filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
            opacity: 0;
            -webkit-transition: opacity 0.6s;
            -moz-transition: opacity 0.6s;
            -o-transition: opacity 0.6s;
            transition: opacity 0.6s;
        }

.lb-nav a.lb-prev:hover {
            filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
            opacity: 1;
        }

.lb-nav a.lb-next {
            width: 64%;
            right: 0;
            float: right;
            background: url(images/next.png) right 48% no-repeat;
            filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
            opacity: 0;
            -webkit-transition: opacity 0.6s;
            -moz-transition: opacity 0.6s;
            -o-transition: opacity 0.6s;
            transition: opacity 0.6s;
        }

.lb-nav a.lb-next:hover {
            filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
            opacity: 1;
        }

.lb-dataContainer {
            margin: 0 auto;
            padding-top: 5px;
            *zoom: 1;
            width: 100%;
            -moz-border-radius-bottomleft: 4px;
            -webkit-border-bottom-left-radius: 4px;
            border-bottom-left-radius: 4px;
            -moz-border-radius-bottomright: 4px;
            -webkit-border-bottom-right-radius: 4px;
            border-bottom-right-radius: 4px;
        }

.lb-dataContainer:after {
            content: "";
            display: table;
            clear: both;
        }

.lb-data {
            padding: 0 4px;
            color: #ccc;
        }

.lb-data .lb-details {
            width: 85%;
            float: left;
            text-align: left;
            line-height: 1.1em;
        }

.lb-data .lb-caption {
            font-size: 13px;
            font-weight: bold;
            line-height: 1em;
        }

.lb-data .lb-caption a {
            color: #4ae;
        }

.lb-data .lb-number {
            display: block;
            clear: left;
            padding-bottom: 1em;
            font-size: 12px;
            color: #999999;
        }

.lb-data .lb-close {
            display: block;
            float: right;
            width: 30px;
            height: 30px;
            background: url(../images/close.png) top right no-repeat;
            text-align: right;
            outline: none;
            filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);
            opacity: 0.7;
            -webkit-transition: opacity 0.2s;
            -moz-transition: opacity 0.2s;
            -o-transition: opacity 0.2s;
            transition: opacity 0.2s;
        }

.lb-data .lb-close:hover {
            cursor: pointer;
            filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
            opacity: 1;
        }
    </style>
</head>
<body>
@include('includes.header')
<div class="mb-0 page-header"
     style="background: linear-gradient(rgba(0, 0, 0, .2), rgba(0, 0, 0, .2)), url(public/assets/P6/pic2.jpg);background-position: center; background-repeat: no-repeat; background-size: cover;">
    <div class="container">
        <div class="row">
            <div class="col-12">
                <h2>Gallery</h2>
            </div>
            <div class="col-12">
                <a href="{{url('/')}}">Home</a>
                <a href="{{url('/mission')}}">Gallery</a>
            </div>
        </div>
    </div>
</div>
<div class="about">
    <div class="container">
        <div class="row align-items-center">
            <div class="col-md-12">
                <div class="about-content">
                    <div class="section-header" style="margin-bottom: 10px !important;">
                        <p>Gallery</p>
                    </div>
                    <div class="about-text">
                        <p>
                            Click on any thumbnail to show larger image
                        </p>
                    </div>
                </div>
            </div>
        </div>
        <section id="portfolio" class="portfolio">
            <div class="container">
                <div id="landscape">
                    <div class="row portfolio-container">
                        @foreach($galleries1 as $gallery)
                            <div class="col-lg-4 col-md-6 portfolio-item filter-landscape">
                                <a class="example-image-link" href="#"
                                   data-lightbox="example-set"
                                   data-title="Click the right half of the image to move forward, left half to move to previous and outside the image to close.">
                                    <img class="example-image img-responsive img-fluid"
                                         src="{{asset('')}}public/storage/{{$gallery->image}}" id="newImg"/>
                                </a>
                                <div class="portfolio-info">
                                    <h4>{{$gallery->captions}}</h4>
                                    {{-- <a href="#"  data-gall="portfolioGallery" class="venobox preview-link" title=""><i class="fa fa-sm fa-plus"></i></a> --}}
                                    <a class="venobox preview-link" data-gall="portfolioGallery"
                                       href="{{url('')}}/public/storage/{{$gallery->image}}">
                                        <i class="fa fa-sm fa-plus"></i>
                                    </a>
                                </div>
                            </div>
                        @endforeach
                        @foreach($galleries2 as $gallery)
                            <div class="col-lg-4 col-md-6 portfolio-item filter-landscape">
                                <a class="example-image-link" href="#"
                                   data-lightbox="example-set"
                                   data-title="Click the right half of the image to move forward, left half to move to previous and outside the image to close.">
                                    <img class="example-image img-responsive img-fluid lazy"
                                         data-src="{{asset('')}}public/storage/{{$gallery->image}}" id="newImg"/>
                                </a>
                                <div class="portfolio-info">
                                    <h4>{{$gallery->captions}}</h4>
                                    <a href="{{asset('')}}/public/storage/{{$gallery->image}}" data-gall="portfolioGallery"
                                       class="venobox preview-link" title="">
                                        <i class="fa fa-sm fa-plus"></i>
                                    </a>
                                </div>
                            </div>
                        @endforeach
                    </div>
                </div>
            </div>
        </section>
    </div>
</div>
@include('includes.footer')
<script>
    document.addEventListener("DOMContentLoaded", function () {
        var lazyloadImages = document.querySelectorAll("img.lazy");
        var lazyloadThrottleTimeout;

function lazyload() {
            if (lazyloadThrottleTimeout) {
                clearTimeout(lazyloadThrottleTimeout);
            }

lazyloadThrottleTimeout = setTimeout(function () {
                var scrollTop = window.pageYOffset;
                lazyloadImages.forEach(function (img) {
                    if (img.offsetTop < (window.innerHeight + scrollTop)) {
                        img.src = img.dataset.src;
                        img.classList.remove('lazy');
                    }
                });
                if (lazyloadImages.length === 0) {
                    document.removeEventListener("scroll", lazyload);
                    window.removeEventListener("resize", lazyload);
                    window.removeEventListener("orientationChange", lazyload);
                }
            }, 20);
        }

document.addEventListener("scroll", lazyload);
        window.addEventListener("resize", lazyload);
        window.addEventListener("orientationChange", lazyload);
    });
</script>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"
        integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/venobox/1.9.3/venobox.min.js"
        integrity="sha512-zBTnX97k269iewUwROiWwO82A6uXO4lcjq0Z4xnvO+qAblC/RMQRUu8fQVKtSFhPNKD5Xzh9PMoZG7+LnmH1Hg=="
        crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script>
    $(document).ready(function () {
        /* default settings */
        $('.venobox').venobox();
        /* open content with custom settings */

// $('.venobox_custom').venobox({

//     framewidth: '300px',

//     frameheight: '250px',

//     border: '6px',

//     bordercolor: '#ba7c36',

//     numeratio: true
// });
        /* auto-open #firstlink on page load */

$("#firstlink").venobox().trigger('click');
    });
</script>

<a href="#" class="back-to-top"><i class="fa fa-chevron-up"></i></a>

{{-- <script src="assets/lib/jquery/jquery.min.js"></script> --}}
<script src="public/assets/lib/bootstrap/js/bootstrap.bundle.min.js"></script>
<script>// src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
<script>// src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.bundle.min.js"></script>
<script src="public/assets/lib/easing/easing.min.js"></script>
<script src="public/assets/lib/owlcarousel/owl.carousel.min.js"></script>
<script src="public/assets/lib/tempusdominus/js/moment.min.js"></script>
<script src="public/assets/lib/tempusdominus/js/moment-timezone.min.js"></script>
<script src="public/assets/lib/tempusdominus/js/tempusdominus-bootstrap-4.min.js"></script>
{{-- <script src="assets/lib/venobox.min.js"></script> --}}
<script src="public/assets/lib/aos.js"></script>

<script>// src="mail/jqBootstrapValidation.min.js"></script>
<script>// src="mail/contact.js"></script>

<script src="public/assets/js/main.js"></script>
</body>
</html>

{{--  <img src="https://ik.imagekit.io/demo/img/image1.jpeg?tr=w-400,h-300" id="img" />--}}
{{--  <img src="https://ik.imagekit.io/demo/img/image2.jpeg?tr=w-400,h-300" id="img" />--}}
{{--  <img src="https://ik.imagekit.io/demo/img/image3.jpg?tr=w-400,h-300"  id="img"/>--}}
{{--  <img class="lazy" data-src="https://zalegoinstitute.ac.ke/dustyhelmets/public/assets/Gallery/img/G5.jpg" id="img"/>--}}
{{--  <img class="lazy" data-src="https://ik.imagekit.io/demo/img/image4.jpeg?tr=w-400,h-300" id="img" />--}}
{{--  <img class="lazy" data-src="https://ik.imagekit.io/demo/img/image5.jpeg?tr=w-400,h-300" id="img" />--}}
{{--  <img class="lazy" data-src="https://ik.imagekit.io/demo/img/image6.jpeg?tr=w-400,h-300" id="img" />--}}
{{--  <img class="lazy" data-src="https://ik.imagekit.io/demo/img/image7.jpeg?tr=w-400,h-300" id="img" />--}}
{{--  <img class="lazy" data-src="https://ik.imagekit.io/demo/img/image8.jpeg?tr=w-400,h-300" id="img" />--}}
{{--  <img class="lazy" data-src="https://ik.imagekit.io/demo/img/image9.jpeg?tr=w-400,h-300" id="img" />--}}
{{--  <img class="lazy" data-src="https://ik.imagekit.io/demo/img/image10.jpeg?tr=w-400,h-300" id="img" />--}}

{{-- <div class="col-lg-4 col-md-6 portfolio-item filter-landscape">
      <a class="example-image-link" href="#"
         data-lightbox="example-set" data-title="Click the right half of the image to move forward, left half to move to previous and outside the image to close.">
          <img class="example-image img-responsive img-fluid" src="assets/Gallery/img/Black1.jpg?tr=w-400,h-300" id="newImg" />
      </a>
      <div class="portfolio-info">
          <h4></h4>
          <a href="#"  data-gall="portfolioGallery" class="venobox preview-link" title=""><i class="fa fa-sm fa-plus"></i></a>
      </div>
</div> --}}

{{--                        <div class="col-lg-4 col-md-6 portfolio-item filter-landscape">--}}
                        {{--                            <a class="example-image-link" href="#"--}}
                        {{--                               data-lightbox="example-set" data-title="Click the right half of the image to move forward, left half to move to previous and outside the image to close.">--}}
                        {{--                                <img class="example-image img-responsive img-fluid" src="assets/Gallery/img/Black1.jpg?tr=w-400,h-300" id="newImg" />--}}
                        {{--                            </a>--}}
                        {{--                            <div class="portfolio-info">--}}
                        {{--                                <h4></h4>--}}
                        {{--                                --}}{{-- <a href="#"  data-gall="portfolioGallery" class="venobox preview-link" title=""><i class="fa fa-sm fa-plus"></i></a> --}}
                        {{--                                <a class="venobox preview-link" data-gall="portfolioGallery" href="assets/Gallery/img/Black1.jpg">--}}
                        {{--                                    <i class="fa fa-sm fa-plus"></i>--}}
                        {{--                                </a>--}}
                        {{--                            </div>--}}
                        {{--                        </div>--}}
                        {{--                        <div class="col-lg-4 col-md-6 portfolio-item filter-landscape">--}}
                        {{--                            <a class="example-image-link" href="#"--}}
                        {{--                                data-lightbox="example-set" data-title="Click the right half of the image to move forward, left half to move to previous and outside the image to close.">--}}
                        {{--                                <img class="example-image img-responsive img-fluid" src="assets/Gallery/img/Black2.jpg?tr=w-400,h-300" id="newImg" />--}}
                        {{--                            </a>--}}
                        {{--                            <div class="portfolio-info">--}}
                        {{--                                <h4></h4>--}}
                        {{--                                <a href="assets/Gallery/img/Black2.jpg"  data-gall="portfolioGallery" class="venobox preview-link" title="">--}}
                        {{--                                    <i class="fa fa-sm fa-plus"></i>--}}
                        {{--                                </a>--}}
                        {{--                            </div>--}}
                        {{--                        </div>--}}
                        {{--                        <div class="col-lg-4 col-md-6 portfolio-item filter-landscape">--}}
                        {{--                            <a class="example-image-link" href="#"--}}
                        {{--                                data-lightbox="example-set" data-title="Click the right half of the image to move forward, left half to move to previous and outside the image to close.">--}}
                        {{--                                <img class="example-image img-responsive img-fluid" src="assets/Gallery/img/Elementeita.jpg?tr=w-400,h-300" id="newImg" />--}}
                        {{--                            </a>--}}
                        {{--                            <div class="portfolio-info">--}}
                        {{--                                <h4></h4>--}}
                        {{--                                <a href="assets/Gallery/img/Elementeita.jpg"  data-gall="portfolioGallery" class="venobox preview-link" title="">--}}
                        {{--                                    <i class="fa fa-sm fa-plus"></i>--}}
                        {{--                                </a>--}}
                        {{--                            </div>--}}
                        {{--                        </div>--}}
                        {{--                        <div class="col-lg-4 col-md-6 portfolio-item filter-landscape">--}}
                        {{--                            <a class="example-image-link" href="#"--}}
                        {{--                                data-lightbox="example-set" data-title="Click the right half of the image to move forward, left half to move to previous and outside the image to close.">--}}
                        {{--                                <img class="example-image img-responsive img-fluid lazy" data-src="assets/Gallery/img/Flamingos.jpg?tr=w-400,h-300" id="newImg" />--}}
                        {{--                            </a>--}}
                        {{--                            <div class="portfolio-info">--}}
                        {{--                                <h4></h4>--}}
                        {{--                                <a href="assets/Gallery/img/Flamingos.jpg"  data-gall="portfolioGallery" class="venobox preview-link" title="">--}}
                        {{--                                    <i class="fa fa-sm fa-plus"></i>--}}
                        {{--                                </a>--}}
                        {{--                            </div>--}}
                        {{--                        </div>--}}
                        {{--                        <div class="col-lg-4 col-md-6 portfolio-item filter-landscape">--}}
                        {{--                            <a class="example-image-link" href="#"--}}
                        {{--                                data-lightbox="example-set" data-title="Click the right half of the image to move forward, left half to move to previous and outside the image to close.">--}}
                        {{--                                <img class="example-image img-responsive img-fluid lazy" data-src="assets/Gallery/img/Husaberg.png?tr=w-400,h-300" id="newImg" />--}}
                        {{--                            </a>--}}
                        {{--                            <div class="portfolio-info">--}}
                        {{--                                <h4></h4>--}}
                        {{--                                <a href="assets/Gallery/img/Husaberg.png"  data-gall="portfolioGallery" class="venobox preview-link" title="">--}}
                        {{--                                    <i class="fa fa-sm fa-plus"></i>--}}
                        {{--                                </a>--}}
                        {{--                            </div>--}}
                        {{--                        </div>--}}
                        {{--                        <div class="col-lg-4 col-md-6 portfolio-item filter-landscape">--}}
                        {{--                            <a class="example-image-link" href="#"--}}
                        {{--                                data-lightbox="example-set" data-title="Click the right half of the image to move forward, left half to move to previous and outside the image to close.">--}}
                        {{--                                <img class="example-image img-responsive img-fluid lazy" data-src="assets/Gallery/img/Maasai.jpg?tr=w-400,h-300" id="newImg" />--}}
                        {{--                            </a>--}}
                        {{--                            <div class="portfolio-info">--}}
                        {{--                                <h4></h4>--}}
                        {{--                                <a href="assets/Gallery/img/Maasai.jpg"  data-gall="portfolioGallery" class="venobox preview-link" title=""><i class="fa fa-sm fa-plus"></i></a>--}}
                        {{--                            </div>--}}
                        {{--                        </div>--}}
                        {{--                        <div class="col-lg-4 col-md-6 portfolio-item filter-landscape">--}}
                        {{--                            <a class="example-image-link" href="#"--}}
                        {{--                                data-lightbox="example-set" data-title="Click the right half of the image to move forward, left half to move to previous and outside the image to close.">--}}
                        {{--                                <img class="example-image img-responsive img-fluid lazy" data-src="assets/Gallery/img/Splashing.jpg?tr=w-400,h-300" id="newImg" />--}}
                        {{--                            </a>--}}
                        {{--                            <div class="portfolio-info">--}}
                        {{--                                <h4></h4>--}}
                        {{--                                <a href="assets/Gallery/img/Splashing.jpg"  data-gall="portfolioGallery" class="venobox preview-link" title=""><i class="fa fa-sm fa-plus"></i></a>--}}
                        {{--                            </div>--}}
                        {{--                        </div>--}}
                        {{--                        <div class="col-lg-4 col-md-6 portfolio-item filter-landscape">--}}
                        {{--                            <a class="example-image-link" href="#"--}}
                        {{--                                data-lightbox="example-set" data-title="Click the right half of the image to move forward, left half to move to previous and outside the image to close.">--}}
                        {{--                                <img class="example-image img-responsive img-fluid lazy" data-src="assets/Gallery/img/trail.jpg?tr=w-400,h-300" id="newImg" />--}}
                        {{--                            </a>--}}
                        {{--                            <div class="portfolio-info">--}}
                        {{--                                <h4></h4>--}}
                        {{--                                <a href="assets/Gallery/img/trail.jpg"  data-gall="portfolioGallery" class="venobox preview-link" title=""><i class="fa fa-sm fa-plus"></i></a>--}}
                        {{--                            </div>--}}
                        {{--                        </div>--}}
                        {{--                        <div class="col-lg-4 col-md-6 portfolio-item filter-landscape">--}}
                        {{--                            <a class="example-image-link" href="#"--}}
                        {{--                                data-lightbox="example-set" data-title="Click the right half of the image to move forward, left half to move to previous and outside the image to close.">--}}
                        {{--                                <img class="example-image img-responsive img-fluid lazy" data-src="assets/Gallery/img/ng1.jpg?tr=w-400,h-300" id="newImg" />--}}
                        {{--                            </a>--}}
                        {{--                            <div class="portfolio-info">--}}
                        {{--                                <h4></h4>--}}
                        {{--                                <a href="assets/Gallery/img/ng1.jpg"  data-gall="portfolioGallery" class="venobox preview-link" title=""><i class="fa fa-sm fa-plus"></i></a>--}}
                        {{--                            </div>--}}
                        {{--                        </div>--}}
                        {{--                        <div class="col-lg-4 col-md-6 portfolio-item filter-landscape">--}}
                        {{--                            <a class="example-image-link" href="#"--}}
                        {{--                                data-lightbox="example-set" data-title="Click the right half of the image to move forward, left half to move to previous and outside the image to close.">--}}
                        {{--                                <img class="example-image img-responsive img-fluid lazy" data-src="assets/Gallery/img/G2.jpg?tr=w-400,h-300" id="newImg" />--}}
                        {{--                            </a>--}}
                        {{--                            <div class="portfolio-info">--}}
                        {{--                                <h4></h4>--}}
                        {{--                                <a href="assets/Gallery/img/G2.jpg"  data-gall="portfolioGallery" class="venobox preview-link" title=""><i class="fa fa-sm fa-plus"></i></a>--}}
                        {{--                            </div>--}}
                        {{--                        </div>--}}
                        {{--                        <div class="col-lg-4 col-md-6 portfolio-item filter-landscape">--}}
                        {{--                            <a class="example-image-link" href="#"--}}
                        {{--                                data-lightbox="example-set" data-title="Click the right half of the image to move forward, left half to move to previous and outside the image to close.">--}}
                        {{--                                <img class="example-image img-responsive img-fluid lazy" data-src="assets/Gallery/img/ng3.jpg?tr=w-400,h-300" id="newImg" />--}}
                        {{--                            </a>--}}
                        {{--                            <div class="portfolio-info">--}}
                        {{--                                <h4></h4>--}}
                        {{--                                <a href="assets/Gallery/img/ng3.jpg"  data-gall="portfolioGallery" class="venobox preview-link" title=""><i class="fa fa-sm fa-plus"></i></a>--}}
                        {{--                            </div>--}}
                        {{--                        </div>--}}
                        {{--                        <div class="col-lg-4 col-md-6 portfolio-item filter-landscape">--}}
                        {{--                            <a class="example-image-link" href="#"--}}
                        {{--                                data-lightbox="example-set" data-title="Click the right half of the image to move forward, left half to move to previous and outside the image to close.">--}}
                        {{--                                <img class="example-image img-responsive img-fluid lazy" data-src="assets/Gallery/img/G14.jpg?tr=w-400,h-300" id="newImg" />--}}
                        {{--                            </a>--}}
                        {{--                            <div class="portfolio-info">--}}
                        {{--                                <h4></h4>--}}
                        {{--                                <a href="assets/Gallery/img/G14.jpg"  data-gall="portfolioGallery" class="venobox preview-link" title=""><i class="fa fa-sm fa-plus"></i></a>--}}
                        {{--                            </div>--}}
                        {{--                        </div>--}}
                        {{--                        <div class="col-lg-4 col-md-6 portfolio-item filter-landscape">--}}
                        {{--                            <a class="example-image-link" href="#"--}}
                        {{--                                data-lightbox="example-set" data-title="Click the right half of the image to move forward, left half to move to previous and outside the image to close.">--}}
                        {{--                                <img class="example-image img-responsive img-fluid lazy" data-src="assets/Gallery/img/ng6.jpg?tr=w-400,h-300" id="newImg" />--}}
                        {{--                            </a>--}}
                        {{--                            <div class="portfolio-info">--}}
                        {{--                                <h4></h4>--}}
                        {{--                                <a href="assets/Gallery/img/ng6.jpg"  data-gall="portfolioGallery" class="venobox preview-link" title=""><i class="fa fa-sm fa-plus"></i></a>--}}
                        {{--                            </div>--}}
                        {{--                        </div>--}}
                        {{--                        <div class="col-lg-4 col-md-6 portfolio-item filter-landscape">--}}
                        {{--                            <a class="example-image-link" href="#"--}}
                        {{--                                data-lightbox="example-set" data-title="Click the right half of the image to move forward, left half to move to previous and outside the image to close.">--}}
                        {{--                                <img class="example-image img-responsive img-fluid lazy" data-src="assets/P1/pic7.jpg?tr=w-400,h-300" id="newImg" />--}}
                        {{--                            </a>--}}
                        {{--                            <div class="portfolio-info">--}}
                        {{--                                <h4></h4>--}}
                        {{--                                <a href="assets/P1/pic7.jpg"  data-gall="portfolioGallery" class="venobox preview-link" title=""><i class="fa fa-sm fa-plus"></i></a>--}}
                        {{--                            </div>--}}
                        {{--                        </div>--}}
                        {{--                        <div class="col-lg-4 col-md-6 portfolio-item filter-landscape">--}}
                        {{--                            <a class="example-image-link" href="#"--}}
                        {{--                                data-lightbox="example-set" data-title="Click the right half of the image to move forward, left half to move to previous and outside the image to close.">--}}
                        {{--                                <img class="example-image img-responsive img-fluid lazy" data-src="assets/Gallery/img/G5.jpg?tr=w-400,h-300" id="newImg" />--}}
                        {{--                            </a>--}}
                        {{--                            <div class="portfolio-info">--}}
                        {{--                                <h4></h4>--}}
                        {{--                                <a href="assets/Gallery/img/G5.jpg"  data-gall="portfolioGallery" class="venobox preview-link" title=""><i class="fa fa-sm fa-plus"></i></a>--}}
                        {{--                            </div>--}}
                        {{--                        </div>--}}
                        {{--                        <div class="col-lg-4 col-md-6 portfolio-item filter-landscape">--}}
                        {{--                            <a class="example-image-link" href="#"--}}
                        {{--                                data-lightbox="example-set" data-title="Click the right half of the image to move forward, left half to move to previous and outside the image to close.">--}}
                        {{--                                <img class="example-image img-responsive img-fluid lazy" data-src="assets/Gallery/img/G6.jpg?tr=w-400,h-300" id="newImg" />--}}
                        {{--                            </a>--}}
                        {{--                            <div class="portfolio-info">--}}
                        {{--                                <h4></h4>--}}
                        {{--                                <a href="assets/Gallery/img/G6.jpg"  data-gall="portfolioGallery" class="venobox preview-link" title=""><i class="fa fa-sm fa-plus"></i></a>--}}
                        {{--                            </div>--}}
                        {{--                        </div>--}}
                        {{--                        <div class="col-lg-4 col-md-6 portfolio-item filter-landscape">--}}
                        {{--                            <a class="example-image-link" href="#"--}}
                        {{--                                data-lightbox="example-set" data-title="Click the right half of the image to move forward, left half to move to previous and outside the image to close.">--}}
                        {{--                                <img class="example-image img-responsive img-fluid lazy" data-src="assets/Gallery/img/G7.jpg?tr=w-400,h-300" id="newImg" />--}}
                        {{--                            </a>--}}
                        {{--                            <div class="portfolio-info">--}}
                        {{--                                <h4></h4>--}}
                        {{--                                <a href="assets/Gallery/img/G7.jpg"  data-gall="portfolioGallery" class="venobox preview-link" title=""><i class="fa fa-sm fa-plus"></i></a>--}}
                        {{--                            </div>--}}
                        {{--                        </div>--}}
                        {{--                        <div class="col-lg-4 col-md-6 portfolio-item filter-landscape">--}}
                        {{--                            <a class="example-image-link" href="#"--}}
                        {{--                                data-lightbox="example-set" data-title="Click the right half of the image to move forward, left half to move to previous and outside the image to close.">--}}
                        {{--                                <img class="example-image img-responsive img-fluid lazy" data-src="assets/Gallery/img/G9.jpg?tr=w-400,h-300" id="newImg" />--}}
                        {{--                            </a>--}}
                        {{--                            <div class="portfolio-info">--}}
                        {{--                                <h4></h4>--}}
                        {{--                                <a href="assets/Gallery/img/G9.jpg"  data-gall="portfolioGallery" class="venobox preview-link" title=""><i class="fa fa-sm fa-plus"></i></a>--}}
                        {{--                            </div>--}}
                        {{--                        </div>--}}