gallery.html

<!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">
  <title>Gallery - EduHub Community</title>
  <!-- Favicons -->
  <link href="assets/img/Eduhub Logo (2).png" rel="icon">
  <!-- <link href="assets/img/apple-touch-icon.png" rel="apple-touch-icon"> -->

  <!-- Google Fonts -->
  <link
    href="https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i|Krub:300,300i,400,400i,500,500i,600,600i,700,700i|Poppins:300,300i,400,400i,500,500i,600,600i,700,700i"
    rel="stylesheet">

  <!-- Vendor CSS Files -->
  <link href="assets/vendor/aos/aos.css" rel="stylesheet">
  <link href="assets/vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
  <link href="assets/vendor/bootstrap-icons/bootstrap-icons.css" rel="stylesheet">
  <link href="assets/vendor/boxicons/css/boxicons.min.css" rel="stylesheet">
  <link href="assets/vendor/glightbox/css/glightbox.min.css" rel="stylesheet">
  <link href="assets/vendor/swiper/swiper-bundle.min.css" rel="stylesheet">

  <!-- Template Main CSS File -->
  <link rel="stylesheet" href="assets/css/style.css">

  <!--Local CSS File-->
  <link rel="stylesheet" href="./assets/css/gallery-style.css">
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/magnific-popup.js/1.1.0/magnific-popup.css" />

</head>

<body>
  <!-- ======= Header ======= -->
  <header id="header" class="fixed-top">
    <div class="container d-flex align-items-center justify-content-between">
      <!-- <h1 class="logo"><a href="index.html">Bikin</a></h1> -->
      <!-- Uncomment below if you prefer to use an image logo -->
      <a href="index.html" class="logo"><img src="assets/img/Eduhub Logo (2).png" alt="" class="img-fluid" /></a>

      <nav id="navbar" class="navbar">
        <ul>
          <li><a class="nav-link scrollto" href="index.html#hero">Home</a></li>
          <li><a class="nav-link scrollto" href="index.html#about">About</a></li>
          <li><a class="nav-link scrollto" href="index.html#services">Opportunities</a></li>
          <li><a class="nav-link scrollto" href="https://eduhubcommunity.tech/conference/">MeetUps</a></li>
          <li><a class="nav-link scrollto" href="index.html#event">Events</a></li>
          <li><a class="nav-link scrollto" href="internship-detaills.html">Internships</a></li>
          <li><a class="nav-link scrollto active" href="gallery.html">Gallery</a></li>
          <li><a class="nav-link scrollto" href="index.html#team">Team</a></li>
          <li><a class="nav-link scrollto" href="index.html#contact">Contact</a></li>
          <li><a class="getstarted scrollto" href="./index.html#upcoming-events">Explore</a></li>
        </ul>
        <i class="bi bi-list mobile-nav-toggle"></i>
      </nav>
      <!-- .navbar -->
    </div>
  </header>
  <!-- End Header -->

  <!-- ======= Breadcrumbs ======= -->
  <section id="breadcrumbs" class="breadcrumbs">
    <div class="container">
      <ol>
        <li><a href="index.html">Home</a></li>
        <li>Gallery</li>
      </ol>
    </div>
  </section>
  <!-- End Breadcrumbs -->

  <section id="gallery" class="gallery">
    <div class="container" data-aos="fade-up">
      <div class="section-title">
        <h2>Gallery</h2>
        <p>
          Here you will find all the images and the moments we've captured
          of the innumerous events that we've organized
        </p>
      </div>
    </div>
  </section>

  <!-- Gallery Section -->

  <div class="container">

    <div class="gallery-menu mt-2 mb-4">
      <!-- Add New Events Here -->
      <button class="btn btn-outline-dark active" data-filter="*">All</button>
      <button class="btn btn-outline-dark" data-filter=".event1">Event 1</button>
      <button class="btn btn-outline-dark" data-filter=".event2">Event 2</button>
      <button class="btn btn-outline-dark" data-filter=".event3">Event 3</button>
      <button class="btn btn-outline-dark" data-filter=".event4">Event 4</button>
      <button class="btn btn-outline-dark" data-filter=".event5">Event 5</button>
    </div>

    <div class="gallery-item row">
      <!-- Add Event Pic Here | Add data-filter value in class | Add image title -->

      <div class="item event1 col-lg-3 col-md-4 col-6 col-sm">
        <a href="assets\img\events\11.03.2022_19.16.52_REC.png" class="fancylight popup-btn"
          data-fancybox-group="light" title="image title">
          <img class="img-fluid" src="assets\img\events\11.03.2022_19.16.52_REC.png" alt="">
        </a>
      </div>
      <div class="item event1 col-lg-3 col-md-4 col-6 col-sm">
        <a href="assets\img\events\11.03.2022_19.13.57_REC.png"
          class="fancylight popup-btn" data-fancybox-group="light" title="image title">
          <img class="img-fluid"
            src="assets\img\events\11.03.2022_19.13.57_REC.png"
            alt="">
        </a>
      </div>
      <div class="item event1 col-lg-3 col-md-4 col-6 col-sm">
        <a href="assets\img\events\11.03.2022_19.18.03_REC.png"
          class="fancylight popup-btn" data-fancybox-group="light" title="image title">
          <img class="img-fluid"
            src="assets\img\events\11.03.2022_19.18.03_REC.png"
            alt="">
        </a>
      </div>
      <div class="item event2 col-lg-3 col-md-4 col-6 col-sm">
        <a href="assets\img\events\devrel.jpg"
          class="fancylight popup-btn" data-fancybox-group="light" title="image title">
          <img class="img-fluid"
            src="assets\img\events\devrel.jpg"
            alt="">
        </a>
      </div>
      <div class="item event2 col-lg-3 col-md-4 col-6 col-sm">
        <a href="assets\img\events\event-1.jpeg"
          class="fancylight popup-btn" data-fancybox-group="light" title="image title">
          <img class="img-fluid"
            src="assets\img\events\event-1.jpeg"
            alt="">
        </a>
      </div>
      <div class="item event2 col-lg-3 col-md-4 col-6 col-sm">
        <a href="assets\img\events\event-2.jpeg"
          class="fancylight popup-btn" data-fancybox-group="light" title="image title">
          <img class="img-fluid"
            src="assets\img\events\event-2.jpeg"
            alt="">
        </a>
      </div>
      <div class="item event2 col-lg-3 col-md-4 col-6 col-sm">
        <a href="assets\img\events\event-3.jpeg"
          class="fancylight popup-btn" data-fancybox-group="light" title="image title">
          <img class="img-fluid"
            src="assets\img\events\event-3.jpeg"
            alt="">
        </a>
      </div>
      <div class="item event3 col-lg-3 col-md-4 col-6 col-sm">
        <a href="assets\img\events\event-4.jpeg"
          class="fancylight popup-btn" data-fancybox-group="light" title="image title">
          <img class="img-fluid"
            src="assets\img\events\event-4.jpeg"
            alt="">
        </a>
      </div>
      <div class="item event3 col-lg-3 col-md-4 col-6 col-sm">
        <a href="assets\img\events\event-5.jpeg"
          class="fancylight popup-btn" data-fancybox-group="light" title="image title">
          <img class="img-fluid"
            src="assets\img\events\event-5.jpeg"
            alt="">
        </a>
      </div>
      <div class="item event3 col-lg-3 col-md-4 col-6 col-sm">
        <a href="assets\img\events\event-6.jpeg"
          class="fancylight popup-btn" data-fancybox-group="light" title="image title">
          <img class="img-fluid"
            src="assets\img\events\event-6.jpeg"
            alt="">
        </a>
      </div>
      <div class="item event4 col-lg-3 col-md-4 col-6 col-sm">
        <a href="assets\img\events\event-7.jpeg"
          class="fancylight popup-btn" data-fancybox-group="light" title="image title">
          <img class="img-fluid"
            src="assets\img\events\event-7.jpeg"
            alt="">
        </a>
      </div>
      <div class="item event4 col-lg-3 col-md-4 col-6 col-sm">
        <a href="assets\img\events\event-8.jpeg"
          class="fancylight popup-btn" data-fancybox-group="light" title="image title">
          <img class="img-fluid"
            src="assets\img\events\event-8.jpeg"
            alt="">
        </a>
      </div>
      <div class="item event4 col-lg-3 col-md-4 col-6 col-sm">
        <a href="assets\img\events\event-9.jpeg"
          class="fancylight popup-btn" data-fancybox-group="light" title="image title">
          <img class="img-fluid"
            src="assets\img\events\event-9.jpeg"
            alt="">
        </a>
      </div>
      <div class="item event5 col-lg-3 col-md-4 col-6 col-sm">
        <a href="assets\img\events\event-10.jpeg"
          class="fancylight popup-btn" data-fancybox-group="light" title="image title">
          <img class="img-fluid"
            src="assets\img\events\event-10.jpeg"
            alt="">
        </a>
      </div>
      <div class="item event5 col-lg-3 col-md-4 col-6 col-sm">
        <a href="assets\img\events\event-11.jpeg"
          class="fancylight popup-btn" data-fancybox-group="light" title="image title">
          <img class="img-fluid"
            src="assets\img\events\event-11.jpeg"
            alt="">
        </a>
      </div>
      

    </div>
  </div>

  <!-- End Gallery Section -->

  <!-- End Events Section -->
  <div class="section-title">
    <h2></h2>
    <br>

    <!-- ======= Footer ======= -->
    <footer id="footer">
      <div class="footer-top">
        <div class="container">
          <div class="row">
            <div class="col-lg-3 col-md-6 footer-contact">
              <h3>EduHub Community</h3>
              <p>
                Chomu Udaipuria Mod, <br />
                Jaipur,<br />
                Rajasthan. <br /><br />
                <!-- <strong>Phone:</strong> +1 5589 55488 55<br /> -->
                <strong>Email:</strong>
              <p>
                <a target="_blank" href="mailto:eduhub.community@gmail.com">eduhub.community@gmail.com</a>
              </p><br />
              </p>
            </div>

            <div class="col-lg-2 col-md-6 footer-links">
              <h4>Quick Access</h4>
              <ul>
                <li>
                  <i class="bx bx-chevron-right"></i> <a href="./index.html#hero">Home</a>
                </li>
                <li>
                  <i class="bx bx-chevron-right"></i> <a href="./index.html#about">About</a>
                </li>
                <li>
                  <i class="bx bx-chevron-right"></i> <a href="./index.html#services">Opportunities</a>
                </li>
                <li>
                  <i class="bx bx-chevron-right"></i>
                  <a href="./index.html#event">Events</a>
                </li>
                <li>
                  <i class="bx bx-chevron-right"></i>
                  <a href="./index.html#team">Team</a>
                </li>
              </ul>
            </div>

            <div class="col-lg-3 col-md-6 footer-links">
              <h4>Our Outreach</h4>
              <ul>
                <li>
                  <i class="bx bx-chevron-right"></i>
                  <a href="https://linktr.ee/EduhubCommunity">Social Media</a>
                </li>
                <li>
                  <i class="bx bx-chevron-right"></i>
                  <a href="https://drive.google.com/file/d/1G3uDu9hbX7_oFa2B1bikeaTBPr2wBxs-/view?usp=sharing">MSME</a>
                </li>
                <li>
                  <i class="bx bx-chevron-right"></i> <a
                    href="codeOfConduct.html">Code
                    of Conduct</a>
                </li>
                <li>
                  <i class="bx bx-chevron-right"></i>
                  <a
                    href="https://docs.google.com/forms/d/1XUnnCtcWtDgnCSQmBgqPjUQ6H5KlE8Ek1LJpXX76Hg4/viewform?edit_requested=true">Reach
                    out to us for any Queries</a>
                </li>
              </ul>
            </div>

            <div class="col-lg-4 col-md-6 footer-newsletter">
              <h4>Subscribe</h4>
              <p>Stay Updated for our Exciting events</p>
              <form action="" method="post">
                <input type="email" name="email" /><input type="submit" value="Subscribe" />
              </form>
            </div>
          </div>
        </div>
      </div>

      <div class="container d-md-flex py-4">
        <div class="social-links text-center text-md-right pt-3 pt-md-0">
          <!-- <a href="#" class="twitter"><i class="bx bxl-twitter"></i></a> -->
          <a target="_blank" href="https://www.facebook.com/eduhubcommunity" class="facebook"><i
              class="bx bxl-facebook"></i></a>
          <a target="_blank" href="https://www.instagram.com/eduhub_community/" class="instagram"><i
              class="bx bxl-instagram"></i></a>
          <a target="_blank" href="https://www.youtube.com/channel/UCPpG3qqMH_0QDvSzHyjjZJQ" class="google-plus"><i
              class="bx bxl-youtube"></i></a>
          <a target="_blank" href="https://www.linkedin.com/company/eduhub-community" class="linkedin"><i
              class="bx bxl-linkedin"></i></a>
        </div>
      </div>
    </footer>
    <!-- End Footer -->


    <div id="preloader"></div>
    <a href="#" class="back-to-top d-flex align-items-center justify-content-center"><i
        class="bi bi-arrow-up-short"></i></a>

    <!-- Vendor JS Files -->
    <script src="assets/vendor/aos/aos.js"></script>
    <script src="assets/vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
    <script src="assets/vendor/glightbox/js/glightbox.min.js"></script>
    <script src="assets/vendor/isotope-layout/isotope.pkgd.min.js"></script>
    <script src="assets/vendor/swiper/swiper-bundle.min.js"></script>
    <script src="assets/vendor/php-email-form/validate.js"></script>

    <!-- Template Main JS File -->
    <script src="assets/js/main.js"></script>

    <!-- Local Script Files -->
    <script src="https://code.jquery.com/jquery-3.6.1.min.js"></script>
    <script src="./assets/js/gallery-scripts.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.isotope/3.0.6/isotope.pkgd.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/magnific-popup.js/1.1.0/jquery.magnific-popup.js"></script>


</body>

</html>