index.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="description" content="" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta
      name="viewport"
      content="width=device-width, initial-scale=1.0, shrink-to-fit=no"
    />

    <meta
      name="google-site-verification"
      content="Exxlz7urXb5XhU5rgnhuvVPa6tegzMO-w1L4seva_x8"
    />

    <meta
      name="description"
      content="HackVerse - 2nd Edition of the 24 Hour Nation-Wide Hackathon at NITK, Surathkal"
    />
    <meta
      name="keywords"
      content="HackVerse, Hackathon, Nation-Wide, NITK Surathkal, Prizes, 2nd Edition"
    />

    <meta
      property="og:title"
      content="HackVerse - 2nd Edition of One of India's Biggest Student Run Hackathons"
    />
    <meta
      property="og:description"
      content="HackVerse - 2nd Edition of the 24 Hour Nation-Wide Hackathon at NITK, Surathkal"
    />
    <meta
      property="og:image"
      content="https://raw.githubusercontent.com/HackVerse/HackVerseV2/master/img/logo.webp"
    />
    <meta property="og:type" content="website" />
    <meta property="og:url" content="hackverse.nitk.ac.in" />

    <link rel="icon" href="/img/logo.png" />

    <title>HackVerse 2.0 | February, 2021</title>
    <script
      src="https://kit.fontawesome.com/ecbc21292c.js"
      crossorigin="anonymous"
    ></script>

    <link
      rel="stylesheet"
      href="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/css/bootstrap.min.css"
      integrity="sha384-TX8t27EcRE3e/ihU7zmQxVncDAy5uIKz4rEkgIXeMed4M0jlfIDPvg6uqKI2xXr2"
      crossorigin="anonymous"
    />
    <link href="https://unpkg.com/aos@2.3.1/dist/aos.css" rel="stylesheet" />

    <link
      rel="stylesheet"
      href="https://cdnjs.cloudflare.com/ajax/libs/material-design-iconic-font/2.2.0/css/material-design-iconic-font.min.css"
    />
    <link
      rel="stylesheet"
      href="https://fonts.googleapis.com/icon?family=Material+Icons"
    />
    <link
      href="https://unpkg.com/material-components-web@latest/dist/material-components-web.min.css"
      rel="stylesheet"
    />
    <script src="https://unpkg.com/material-components-web@latest/dist/material-components-web.min.js"></script>
    <link
      href="https://unpkg.com/@pqina/flip/dist/flip.min.css"
      rel="stylesheet"
    />
    <link rel="stylesheet" href="css/styles.css" />
    <link rel="stylesheet" href="css/events.css" />
    <link rel="stylesheet" href="css/prizes.css" />
    <link rel="stylesheet" href="css/schedule.css" />
  </head>

  <body>
    <!--Welcome Area-->
    <header>
      <div class="welcome jumbotron">
        <div class="logo" data-aos="fade-right" data-aos-duration="800"></div>

        <div class="content" data-aos="fade-left" data-aos-duration="800">
          <img class="banner" src="./img/Banner.png" alt="EVENT BY NITK" />
          <h1 class="subtitle mt-3">24-HOUR NATION WIDE HACKATHON</h1>
            <h1 class="title">
                <a href="https://youtu.be/AooUtb5dGUI" class="title" target="_blank" style="color:black">
                  HACK<span style="color: #233452">VERSE</span>
              <span style="color: #db2121">2.0</span>
            </a>
          </h1>
          <div class="extras">
            <div class="alert alert-light date">
              <span
                class="material-icons"
                style="margin-right: 5px"
                >calendar_today</span
              >
              <span style="text-align: left; color:black;">
                27-28th Feb, 2021</span>
            </div>
            <div>
              <a
                href="http://hackverse.nitk.ac.in/2020"
                target="_blank"
                rel="noopener noreferrer"
                class="revisit alert alert-light"
              >
                <span
                  class="material-icons"
                  style="margin-right: 5px"
                  >history</span
                >
                <span style="text-align: left; color:black"
                  >Revisit HackVerse '20</span
                >
              </a>
            </div>
          </div>
          <div class="extras" style="padding-bottom:12px;">
            <div class="alert alert-success date" style="color: #7289da; ">
              <i class="fab fa-discord mr-2" aria-hidden="true"></i>
              <a href="https://discord.gg/sMNZvATkCr" style="color: purple; font-size:1.5em">Join Our Discord Server</a>
            </div>
          </div>
          <div
            class="apply-button"
            data-hackathon-slug="hackverse2021"
            data-button-theme="light"
            style="height: 44px; width: 312px"
          ></div>
        </div>
      </div>
    </header>

    <!--------------------------------------------------------------------------------------------------------------------------->
    <!--What is HackVerse-->
    <section class="part-2">
      <div class="container align-items-center">
        <div class="row justify-content-center" style="padding-bottom: 30px">
          <div
            class="col-12 col-lg-5 offset-lg-1 order-lg-last justify-content-center"
          >
            <img
              class="logo-2"
              src="img/logo.webp"
              onerror="this.onerror=null;this.src='img/logo.png';"
              alt="Hackverse2.0"
            />
          </div>
          <div class="col-12 col-lg-6 order-lg-first about">
            <h2 style="font-family: 'Lobster', cursive">
              What Is HackVerse 2.0
            </h2>
            <br />
            <p class="lead">
              HackVerse serves as a platform to encourage enthusiastic minds to
              brainstorm on solutions for challenging issues from all over
              India. The unified motive of gathering all like-minded hackers to
              our alma mater, is what led to the creation of the idea in NITK
              Surathkal, the first of its kind. We’ll provide a platform for
              innovations, where developers can test and showcase their
              potential to the best of their abilities. The hackathon will also
              have keynotes & workshops from executives from the industry.
            </p>
          </div>
        </div>

        <!-- HackVerse 2.0 stats -->
      <div class="container mt-5 mb-5">
        <div class="row">
          <div class="col-12 col-md-12">
            <div class="section-heading-2">
              <h3 class="text-center schedule-header" style="margin-bottom: 70px; color: black">
                HackVerse 2.0 Stats
              </h3>
            </div>
          </div>
        </div>
        <div class="row stats">
          <div class="col-12 col-lg-4">
            <div class="text-center mb-100">
              <i class="fas fa-users fa-4x" aria-hidden="true"></i>
              <div class="milestone-number">
                <span class="number-holder">2800</span>
                <span class="number-suffix">+</span>
              </div>
              <div class="milestone-desc">Total Registrations</div>
            </div>
          </div>
          <div class="col-12 col-lg-4">
            <div class="text-center mb-100">
              <i class="fas fa-user-secret fa-4x" aria-hidden="true"></i>
              <div class="milestone-number">
                <span class="number-holder">700</span>
                <span class="number-suffix">+</span>
              </div>
              <div class="milestone-desc">Hackers Hosted</div>
            </div>
          </div>
          <div class="col-12 col-lg-4">
            <div class="text-center mb-100">
              <i class="fas fa-university fa-4x" aria-hidden="true"></i>
              <div class="milestone-number">
                <span class="number-holder">140</span>
                <span class="number-suffix">+</span>
              </div>
              <div class="milestone-desc">Engineering Institutes</div>
            </div>
          </div>
          <!-- <div class="col-12 col-lg-3 mb-100">
            <div class="text-center mb-100">
              <i class="fas fa-globe fa-4x" aria-hidden="true"></i>
              <div class="milestone-number">
                <span class="number-holder">15</span>
                <span class="number-suffix">+</span>
              </div>
              <div class="milestone-desc">Companies</div>
            </div>
          </div> -->
        </div>
      </div>

        <!-- <div class="row justify-content-center">
          <div class="col-9 iframe-container">
            <iframe
              class="responsive-iframe"
              src="https://www.youtube.com/embed/VD_wGhoDtUE"
              frameborder="0"
              allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
              allowfullscreen
            ></iframe>
          </div>
        </div> -->

        <!-- <div class="row">
          <div class="col-12">
            <div
              class="section-heading-2"
              style="margin-bottom: 0px !important; margin-top: 50px"
            >
              <h3 class="text-center schedule-header" style="color: black">
                Live Judging Begins In
              </h3>
            </div>
          </div>
        </div>
        <div class="text-center" style="padding-bottom: 40px; padding-top: 100px">
          <div class="tick" data-did-init="handleTickInit">
            <div
              data-repeat="true"
              data-layout="horizontal fit"
              data-transform="preset(d, h, m, s) -> delay"
            >
              <div class="tick-group">
                <div
                  data-key="value"
                  data-repeat="true"
                  data-transform="pad(00) -> split -> delay"
                >
                  <span data-view="flip"></span>
                </div>
                <span
                  data-key="label"
                  data-view="text"
                  class="tick-label"
                ></span>
              </div>
            </div>
          </div>
        </div> -->

<!--   Schedule      -->
        <div class="row">
          <div class="col-12">
            <div
              class="section-heading-2"
              style="margin-bottom: 0px !important; margin-top: 40px"
            >
              <h3 class="text-center schedule-header" style="color: black">
                Schedule
              </h3>
            </div>
          </div>
          <div class="col-12">
            <div id="timeline-content">
              <div><h4 style="text-align: left">27 Feb 2021</h4></div>

              <ul class="timeline">
                <li class="event" data-date="09:30AM" style="color: black">
                  <div class="member-infos">
                    <h1 class="member-title active-sch" style="cursor: pointer">
                      Opening Ceremony - <a href="https://youtu.be/v6s543aH948" target="_blank">Watch On Youtube</a>
                      <i class="fa fa-plus-circle float-right exp-sch"></i>
                    </h1>
                    <div class="member-location" style="padding-top:5px;">
                      <ul style="list-style: none;">
                        <li><h5>09.30AM - Introduction </h5></li>
                        <li><h5>09.40AM - Welcome Address </h5></li>
                        <li><h5>09.45AM - HackVerse 2.0 Report</h5></li>
                        <li><h5>09.50AM - Inagural Address</h5></li>
                        <li><h5>10.00AM - Cheif Guest's Address</h5></li>
                        <li><h5>10.20AM - Presidential Address</h5></li>
                        <li><h5>10.30AM - Vote of Thanks</h5></li>
                      </ul>
                    </div>
                  </div>
                </li>
                <li id="fader" class="event" data-date="10:40AM">
                  <div class="member-infos">
                    <h1 class="member-title">
                      Opening Announcements - <a href="https://youtu.be/v6s543aH948?t=3705" target="_blank">Watch On Youtube</a>
                      <!-- <i class="fa fa-plus-circle float-right exp-sch"></i> -->
                    </h1>
                  </div>
                </li>
                <li id="fader" class="event" data-date="11:00AM">
                  <div class="member-infos">
                    <h1 class="member-title">
                      Participants Check-In
                      <!-- <i class="fa fa-plus-circle float-right exp-sch"></i> -->
                    </h1>
                  </div>
                </li>
                <li class="event" data-date="12:00PM">
                  <div class="member-infos">
                    <h1 class="member-title">
                      Coding Begins
                      <!-- <i class="fa fa-plus-circle float-right exp-sch"></i> -->
                    </h1>
                  </div>
                </li>
                <li class="event" data-date="04:00PM">
                  <div class="member-infos">
                    <h1 class="member-title">
                      CodeChef Hours #1 and #2
                      <i class="fa fa-plus-circle float-right exp-sch"></i></h1>
                      <div class="member-location" style="padding-top:5px;">
                        <ul style="list-style: none;">
                          <li><h5>01.00PM - CodeChef Hour #1 </h5></li>
                          <li><h5>04.00PM - CodeChef Hour #2 </h5></li>
                        </ul>
                      </div>
                  </div>
                </li>
                <li class="event" data-date="05:00PM">
                  <div class="member-infos">
                    <h1 class="member-title">
                      MLH Mini Event
                      <!-- <i class="fa fa-plus-circle float-right exp-sch"></i> -->
                    </h1>
                  </div>
                </li>
                <li class="event" data-date="08:00PM">
                  <div class="member-infos">
                    <h1 class="member-title last-rs">
                      CodeChef Hours #3 and #4
                      <i class="fa fa-plus-circle float-right exp-sch"></i></h1>
                      <div class="member-location" style="padding-top:5px;">
                        <ul style="list-style: none;">
                          <li><h5>08.00PM - CodeChef Hour #3 </h5></li>
                          <li><h5>10.00PM - CodeChef Hour #4 </h5></li>
                        </ul>
                      </div>
                    
                  </div>
                </li>
              </ul>

              <div>
                <h4 style="text-align: left; padding-top: 20px">28 Feb 2021</h4>
              </div>

              <ul class="timeline">
                <li class="event" data-date="01:00AM">
                  <div class="member-infos">
                    <h1 class="member-title last-rs">
                      CodeChef Hours #5, #6 and #7 <!--  - <a href="https://www.codechef.com/CCHR006" target="_blank">Join the Contest</a> -->
                      <i class="fa fa-plus-circle float-right exp-sch"></i></h1>
                      <div class="member-location" style="padding-top:5px;">
                        <ul style="list-style: none;">
                          <li><h5>01.00AM - CodeChef Hour #5 </h5></li>
                          <li><h5>08.00AM - CodeChef Hour #6 </h5></li>
                          <li><h5>10.00AM - CodeChef Hour #7 </h5></li>
                        </ul>
                      </div>
                    
                  </div>
                </li>
                <li class="event" data-date="12:00PM" >
                  <div class="member-infos">
                    <h1 class="member-title">Coding Ends, Judging Begins
                      <!-- - <a href="https://docs.google.com/document/d/e/2PACX-1vTZ8jyT5QRGxxxEAIzXFp2ovx2rVJd4QK-pSl2egENsf5TOYDP98p47Y-8FI-OGOsFA5rkPXxskVkfO/pub"  
                      target="_blank">Submission Guidelines</a> -->
                    </h1>
                  </div>
                </li>
                <li id="fader" class="event" data-date="05:30PM">
                  <div class="member-infos">
                    <h1 class="member-title">
                      Live Judging - <a href="https://youtu.be/VD_wGhoDtUE" target="_blank">Watch on Youtube</a>
                    </h1>
                  </div>
                </li>
                <li class="event" data-date="08:00PM">
                  <div class="member-infos">
                    <h1 class="member-title last-rs"  style="cursor: pointer">
                      Results Announcement
                      <i class="fa fa-plus-circle float-right exp-sch"></i>
                    </h1>
                    <div class="member-location" style="padding-top:5px;">
                      <ul style="list-style: none;">
                        <li><h5>08.00PM - MLH Prizes Announcement </h5></li>
                        <li><h5>08.05PM - Judges' Experience </h5></li>
                        <li><h5>08.20PM - Track Prizes Announcement </h5></li>
                        <li><h5>08.30PM - Valedictory Address </h5></li>
                        <li><h5>08.40PM - Main Prizes Announcement </h5></li>
                        <li><h5>08.50PM - Vote of Thanks </h5></li>
                      </ul>
                    </div>
                  </div>
                </li>
              </ul>
            </div>
          </div>
        </div> 

        
      </div>
    </section>

    <!--Section Breaker Welcome/Events-->
    <div class="section-divider stat-color unselectable">
      <img
        src="./img/Sea creatures/S2.png"
        style="
          height: auto;
          position: absolute;
          z-index: 4;
          transform: translateY(-12%);
          left: 1%;
        "
        alt="Sea creature"
        id="sea-creatures"
      />
      <img
        src="./img/Sea creatures/S3.png"
        style="
          height: auto;
          position: absolute;
          z-index: 4;
          right: 1%;
          transform: translateY(-12%);
        "
        alt="Sea creature"
        id="sea-creatures"
      />
      <img
        src="img/section_breaker_blue/W1.webp"
        onerror="this.onerror=null;this.src='img/section_breaker_blue/W1.png';"
      />
    </div>

    <!--------------------------------------------------------------------------------------------------------------------------->
    <!-- Events Section-->
    <section class="part-3">
      <div class="events-container">
        <div class="row">
          <div class="col-12 col-md-12">
            <div class="section-heading-2">
              <h4
                class="text-center"
                style="
                  margin-bottom: 70px;
                  color: black;
                  font-family: 'Lobster', cursive;
                "
              >
                Events and Updates
              </h4>
            </div>
          </div>
        </div>
        <div class="carousel">
          <input type="radio" name="slides" checked="checked" id="slide-1" />
          <input type="radio" name="slides" id="slide-2" />
          <input type="radio" name="slides" id="slide-3" />
          <input type="radio" name="slides" id="slide-4" />
          <input type="radio" name="slides" id="slide-5" />
          <input type="radio" name="slides" id="slide-6" />

          <ul class="carousel__slides">
            <li class="carousel__slide">
              <figure>
                <div>
                  <img
                    src="img/events/make-with-hackverse-manas.webp"
                    onerror="this.onerror=null;this.src='img/events/make-with-hackverse-manas.jpg';"
                    alt=""
                  />
                </div>
                <figcaption>
                  <strong>
                    <span style="font-size: 1.3em">
                      Make With HackVerse: Your First Desktop Application Using Java and MySQL
                    </span><br />
                    Date: 26th February 2021<br />
                    Time: 4:00 PM<br />
                    <a href="https://youtu.be/kfKOjI9cOOg">Join On Youtube!</a
                    ><br /><br />
                    A hands-on workshop by Manas Trivedi.<br />
                    Make sure you have the required software installed before the session.<br />
                    Check out the <a href="http://bit.ly/37Moerg">Installation guide</a><br />
                  </strong>
                </figcaption>
              </figure>
            </li>
            <li class="carousel__slide">
              <figure>
                <div>
                  <img
                    src="img/events/make-with-hackverse-gaurav-2.webp"
                    onerror="this.onerror=null;this.src='img/events/make-with-hackverse-gaurav-2.jpg';"
                    alt=""
                  />
                </div>
                <figcaption>
                  <strong>
                    <span style="font-size: 1.3em"
                      >Make With HackVerse: Secure Chat Application with
                      WebSockets: Part-2</span
                    ><br />
                    Date: 24th February 2021<br />
                    Time: 4:00 PM<br />
                    <a href="https://youtu.be/gcdKTFwN4FM">Watch On Youtube!</a
                    ><br /><br />
                    Watch <a href="https://youtu.be/bQLutm4hS6w">Part 1</a><br />
                    The second part of the hands-on workshop by Gaurav Chaurasia
                    where you will build a chat application from scratch,
                    step-by-step.<br />
                    Prerequisites: Basics of HTML, CSS, Javascript. Node.js must
                    be pre-installed on your system.<br /></strong>
                </figcaption>
              </figure>
            </li>
            <li class="carousel__slide">
              <figure>
                <div>
                  <img
                    src="img/events/codechef-workshop.webp"
                    onerror="this.onerror=null;this.src='img/events/codechef-workshop.jpg';"
                    alt=""
                  />
                </div>
                <figcaption>
                  <strong>
                    <span style="font-size: 1.3em"
                      >HeadStart to Competitive Programming</span
                    ><br />
                    Date: 6th February 2021<br />
                    Time: 1:00 PM<br />
                    Access Code: HEADSTART <br />
                    <a
                      href="https://unacademy.com/class/headstart-to-competitive-programming/OIZ5ZAN6"
                      >Join Now!</a
                    ><br /><br />
                    Brush up your coding skills with this workshop by CodeChef
                    in association with HackVerse.<br /><br />
                    Sanket Singh, SDE at LinkedIn, will be hosting this hands-on
                    workshop with fun-filled activities in the lineup to provide
                    you a headstart in cracking coding interviews. </strong
                  ><br />
                </figcaption>
              </figure>
            </li>
            <li class="carousel__slide">
              <figure>
                <div>
                  <img
                    src="img/events/yocket-webinar.webp"
                    onerror="this.onerror=null;this.src='img/events/yocket-webinar.jpg';"
                    alt=""
                  />
                </div>
                <figcaption>
                  <strong
                    >HackVerse 2.0 in association with Yocket is here to help
                    you to build an amazing profile for top universities.<br /><br />
                    Attend the Webinar for free guidance from Expert Counselors
                    on securing admissions to top universities abroad.<br /><br />
                    Date: 30th January, 2021<br />
                    Time: 4:30 PM<br />
                    <a href="https://event.webinarjam.com/register/366/844q6tvg"
                      >Register Now!</a
                    ></strong
                  ><br />
                </figcaption>
              </figure>
            </li>
            <li class="carousel__slide">
              <figure>
                <div>
                  <img
                    src="img/events/mlh-web-scraping.webp"
                    onerror="this.onerror=null;this.src='img/events/mlh-web-scraping.jpg';"
                    alt=""
                  />
                </div>
                <figcaption>
                  <strong
                    >MLH Localhost session on Web Scraping in Python hosted by
                    S.R.Sahith<br /><br />
                    The session covered Web Scraping using BeautifulSoup and
                    Regular Expression Python libraries to create a bot of any
                    Twitter celebrity!<br /><br />
                    <a href="https://youtu.be/98k5QSqDhXQ"
                      >Watch on Youtube</a
                    ></strong
                  >
                </figcaption>
              </figure>
            </li>
            <li class="carousel__slide">
              <figure>
                <div>
                  <img
                    src="img/events/hacktober-workshop.webp"
                    onerror="this.onerror=null;this.src='img/events/hacktober-workshop.jpg';"
                    alt=""
                  />
                </div>
                <figcaption>
                  <strong
                    >Online Meetup at NITK Surathkal organized as part of
                    Hacktoberfest<br /><br />
                    Maintainers were invited to guide would-be contributors
                    towards issues that will help move the project forward, and
                    contributors get the opportunity to give back to the
                    projects .<br /><br />
                    <a
                      href="https://youtube.com/playlist?list=PL9G8ordCN9gt1zZhGA6HcoYjoiwj_ac0z"
                      >Watch on Youtube</a
                    ></strong
                  >
                </figcaption>
              </figure>
            </li>
          </ul>

          <ul class="carousel__thumbnails">
            <li>
              <label class="carousel-label" for="slide-1">
                <img
                  src="img/events/make-with-hackverse-manas.webp"
                  onerror="this.onerror=null;this.src='img/events/make-with-hackverse-manas.jpg';"
                  alt=""
                />
              </label>
            </li>
            <li>
              <label class="carousel-label" for="slide-2">
                <img
                  src="img/events/make-with-hackverse-gaurav-2.webp"
                  onerror="this.onerror=null;this.src='img/events/make-with-hackverse-gaurav-2.jpg';"
                  alt=""
                />
              </label>
            </li>
            <li>
              <label class="carousel-label" for="slide-3">
                <img
                  src="img/events/codechef-workshop.webp"
                  onerror="this.onerror=null;this.src='img/events/codechef-workshop.jpg';"
                  alt=""
                />
              </label>
            </li>
            <li>
              <label class="carousel-label" for="slide-4">
                <img
                  src="img/events/yocket-webinar.webp"
                  onerror="this.onerror=null;this.src='img/events/yocket-webinar.jpg';"
                  alt=""
                />
              </label>
            </li>
            <li>
              <label class="carousel-label" for="slide-5">
                <img
                  src="img/events/mlh-web-scraping.webp"
                  onerror="this.onerror=null;this.src='img/events/mlh-web-scraping.jpg';"
                  alt=""
                />
              </label>
            </li>
            <li>
              <label class="carousel-label" for="slide-6">
                <img
                  src="img/events/hacktober-workshop.webp"
                  onerror="this.onerror=null;this.src='img/events/hacktober-workshop.jpg';"
                  alt=""
                />
              </label>
            </li>
            <!-- 
                <li>
                    <label class="carousel-label" for="slide-6"><img src="https://picsum.photos/id/1052/150/150" alt=""></label> 
                </li>-->
          </ul>
        </div>
      </div>
    </section>
    <!--Section Breaker-->
    <div class="section-divider unselectable" style="background-color: #2df0df">
      <img
        src="img/section_breaker_blue/W3.webp"
        onerror="this.onerror=null;this.src='img/section_breaker_blue/W4.png';"
      />
    </div>

    <!--------------------------------------------------------------------------------------------------------------------------->
    <!-- Prizes -->
    <section id="prizes">
      <div class="container">
        <div class="row">
          <div class="col-12 col-md-12">
            <div class="section-heading-2">
              <h4 class="text-center" style="margin-bottom: 70px; color: black">
                HackVerse 2.0 Prizes
              </h4>
            </div>
          </div>
        </div>

        <div class="prize-body">
          <div class="row">
            <div class="col-sm-12 col-md-12 col-lg-4 mb-3">
              <div class="prize-wrapper">
                <div class="prize-card prize-card-size">
                  <input
                    type="checkbox"
                    id="card1"
                    class="more"
                    aria-hidden="true"
                  />
                  <div class="prize-content">
                    <div class="front">
                      <div class="inner">
                        <h6
                          class="ticket-plan"
                          style="background-color: gold !important"
                        >
                          1st Prize
                        </h6>
                        <div class="ticket-icon">
                          <img src="img/Gold.png" alt="1st Prize" />
                        </div>
                        <div>
                          <h2
                            class="ticket-price"
                            style="font-size: 2em !important"
                          >
                            <span>₹</span>50,000
                          </h2>

                        </div>
                        <div class="text-center" style="color: #000;   font-family: Barlow Semi Condensed;">
                          <p> <strong>Claimed By: </strong> </p>
                          <p class="lead"><a href="https://devfolio.co/submissions/hashbyte-9bd9" target="_blank" rel="noopener noreferrer">HashByte</a> </p> 
                          <p class="lead" >•&nbspYash Verma •&nbspVedant Saxena •&nbspTanmay Shishodia </p>
                        </div>
                        
                        <label for="card1" class="prize-button" aria-hidden="true" style="color: black !important; border-color: black">
                                    Details
                                </label>


                      </div>
                    </div>
                    <div class="back">
                      <div class="inner">
                        <div class="description">
                          <ul style="list-style-type: square">
                            <li>Devfolio and DigitalOcean Goodies for each team member </li>
                            <li>Unlimited use of <a href="https://www.clerky.com/pricing">Clerky </a>
                              standard Fundraising, Hiring, Commercial, and Maintenance products for the lifetime of your startup worth USD 799.
                            </li>
                            <li>GeeksForGeeks course worth ₹3500 for each team member</li>
                            <li>3-month free membership to Qfuss</li>
                            <li>Learning While Travelling academy's 6-month free membership(Worth ₹1499 per month) </li>
                          </ul>
                        </div>
                        <div class="location">1st Prize</div>
                        <div class="price">₹50,000</div>
                        <label
                          for="card1"
                          class="prize-button return"
                          aria-hidden="true"
                        >
                          <i class="fas fa-arrow-left"></i>
                        </label>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>

            <div class="col-sm-12 col-md-12 col-lg-4 mb-3 order-lg-first">
              <div class="prize-wrapper prize-step">
                <div class="prize-card prize-card-size">
                  <input
                    type="checkbox"
                    id="card2"
                    class="more"
                    aria-hidden="true"
                  />
                  <div class="prize-content">
                    <div class="front">
                      <div class="inner">
                        <h6
                          class="ticket-plan"
                          style="background-color: #c0c0c0 !important"
                        >
                          2nd Prize
                        </h6>
                        <div class="ticket-icon" >
                          <img src="img/Silver.png" alt="2nd Prize" />
                        </div>
                        <div>
                          <h2
                            class="ticket-price"
                            style="font-size: 2em !important"
                          >
                            <span>₹</span>35,000
                          </h2>
                        </div>
                        <div class="text-center" style="color: #000;   font-family: Barlow Semi Condensed;">
                          <p> <strong>Claimed By: </strong> </p>
                          <p class="lead"><a href="https://devfolio.co/submissions/snaplify-7885" target="_blank" rel="noopener noreferrer">XLR8</a> </p> 
                          <p class="lead" >•&nbspMihir Khambhati •&nbspKrunal Rank</p>
                        </div>

                        <label for="card2" class="prize-button" aria-hidden="true" style="color: black !important; border-color: black">
                                  Details
                              </label>
                      </div>
                    </div>
                    <div class="back">
                      <div class="inner">
                        <div class="description">
                          <ul style="list-style-type: square">
                            <li>Devfolio and DigitalOcean Goodies for each team member.</li>
                            <li>GeeksForGeeks course worth ₹2500 for each team member.</li>
                            <li>3-month free membership to Qfuss.</li>
                            <li>Learning While Travelling academy's 6-month free membership(Worth ₹1499 per month) </li>
                          </ul>
                        </div>
                        <div class="location">2nd Prize</div>
                        <div class="price">₹35,000</div>
                        <label
                          for="card2"
                          class="prize-button return"
                          aria-hidden="true"
                        >
                          <i class="fas fa-arrow-left"></i>
                        </label>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>

            <!--style="background: linear-gradient(0deg, #5588cc , white) !important;"-->
            <div class="col-sm-12 col-md-12 col-lg-4 mb-3 order-lg-last">
              <div class="prize-wrapper prize-step">
                <div class="prize-card prize-card-size">
                  <input
                    type="checkbox"
                    id="card3"
                    class="more"
                    aria-hidden="true"
                  />
                  <div class="prize-content">
                    <div class="front">
                      <div class="inner">
                        <h6
                          class="ticket-plan"
                          style="background-color: #cd7f32 !important"
                        >
                          3rd Prize
                        </h6>
                        <div class="ticket-icon">
                          <img src="img/Bronze.png" alt="3rd Prize" />
                        </div>
                        <div>
                          <h2
                            class="ticket-price"
                            style="font-size: 2em !important"
                          >
                            <span>₹</span>25,000
                          </h2>
                        </div>
                        <div class="text-center" style="color: #000;   font-family: Barlow Semi Condensed;">
                          <p> <strong>Claimed By: </strong> </p>
                          <p class="lead"><a href="https://devfolio.co/submissions/lend-a-hand-e721" target="_blank" rel="noopener noreferrer">LEGO</a> </p> 
                          <p class="lead" >•&nbspShobit Tulshain •&nbspShruti Nk •&nbspGeeth Kuldeep</p>
                        </div>

                        <label for="card3" class="prize-button" aria-hidden="true"  style="color: black !important; border-color: black">
                                    Details
                                </label>
                      </div>
                    </div>
                    <div class="back">
                      <div class="inner">
                        <div class="description">
                          <ul style="list-style-type: square">
                            <li>Devfolio and DigitalOcean Goodies for each team member.</li>
                            <li>GeeksForGeeks course worth ₹2000 for each team member.</li>
                            <li>3-month free membership to Qfuss.</li>
                            <li>Learning While Travelling academy's 6-month free membership(Worth ₹1499 per month)</li>
                          </ul>
                        </div>
                         
                        <div class="location">3rd Prize</div>
                        <div class="price">₹25,000</div>

                        <label
                          for="card3"
                          class="prize-button return"
                          aria-hidden="true"
                        >
                          <i class="fas fa-arrow-left"></i>
                        </label>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>


          </div>
        </div>


        <div class="row">
          <div class="col-12 col-md-12">
            <div class="section-heading-2">
              <h4
                class="text-center"
                style="
                  margin-top: 40px;
                  color: white;
                  font-size: 1.8em !important;
                "
              >
                <a href="#tracks">Track Prizes</a> worth ₹50,000 and more
                available
              </h4>
            </div>
          </div>
        </div> 
         
        <!--API Prizes-->
        <div class="row" style="padding-bottom: 30px">
          <div class="col-12">
            <div
              class="section-heading-2"
              style="
                margin-top: 30px;
                margin-bottom: 0px !important;
                font-size: 2.5em;
              "
            >
              <h4 class="text-center">Special Prizes</h4>
            </div>
          </div>
        </div>

        <div class="row">
          <div class="col-12 col-md-6 col-lg-3">
            <div class="prize-wrapper">
              <div class="prize-card api-card-size">
                <input
                  type="checkbox"
                  id="card5"
                  class="more"
                  aria-hidden="true"
                />
                <div class="prize-content">
                  <div
                    class="front"
                    style="
                      background: linear-gradient(
                        180deg,
                        rgb(0, 215, 253),
                        rgb(219, 247, 252)
                      ) !important;
                    "
                  >
                    <div class="inner">
                      <h6 class="api-plan">Matic</h6>
                      <div class="api-icon">
                        <img
                          style="
                            width: 200px;
                            height: auto;
                            margin-bottom: 30px;
                            margin-top: 50px;
                          "
                          src="img/sponsors-img/matic.webp"
                          onerror="this.onerror=null;this.src='img/sponsors-img/matic.png';"
                          alt="Clerky"
                        />
                      </div>
                      <!--div >
                                    <h2 class="api-price" style="color:black !important;">HACK USING ETHEREUM</h2>
                                </div-->
                      <div>
                        <h2
                          class="ticket-price"
                          style="color: black !important"
                        >
                          <span>₹</span>15,000
                        </h2>
                      </div>

                      <label
                        for="card5"
                        class="prize-button"
                        aria-hidden="true"
                        style="color: black !important; border-color: black"
                      >
                        Details
                      </label>
                    </div>
                  </div>
                  <div class="back">
                    <div class="inner">
                      <div class="description">
                        <ul style="list-style-type: square">
                          <li>
                            ₹15,000 for the best hack built on Ethereum and
                            Matic OR<br />10,000 for the best hack built on
                            Ethereum<br />
                          </li>
                          <li>
                            Eligibility to apply for internship/full-time roles
                            and seed funding of up to 5,000 USD for winners!
                          </li>
                        </ul>
                      </div>
                      <div class="location">Matic</div>
                      <div class="price"><span>₹</span>15,000</div>
                      <label
                        for="card5"
                        class="prize-button return"
                        aria-hidden="true"
                      >
                        <i class="fas fa-arrow-left"></i>
                      </label>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>

          <div class="col-12 col-md-6 col-lg-3">
            <div class="prize-wrapper">
              <div class="prize-card api-card-size">
                <input
                  type="checkbox"
                  id="card6"
                  class="more"
                  aria-hidden="true"
                />
                <div class="prize-content">
                  <div
                    class="front"
                    style="
                      background: linear-gradient(
                        180deg,
                        rgb(0, 215, 253),
                        rgb(219, 247, 252)
                      ) !important;
                    "
                  >
                    <div class="inner">
                      <h6 class="api-plan">Portis</h6>
                      <div class="api-icon">
                        <img
                          style="
                            width: 200px;
                            height: auto;
                            margin-bottom: 25px;
                            margin-top: 35px;
                          "
                          src="img/sponsors-img/Portis_Logo-Black.png"
                          alt="Portis"
                        />
                      </div>
                      <div>
                        <h2
                          class="ticket-price"
                          style="color: black !important"
                        >
                          <span>₹</span>15,000
                        </h2>
                      </div>

                      <label
                        for="card6"
                        class="prize-button"
                        aria-hidden="true"
                        style="color: black !important; border-color: black"
                      >
                        Details
                      </label>
                    </div>
                  </div>
                  <div class="back">
                    <div class="inner">
                      <div class="description">
                        <p>₹15,000 for best Dapp built on Portis</p>
                      </div>
                      <div class="location">Portis</div>
                      <div class="price"><span>₹</span>15,000</div>
                      <label
                        for="card6"
                        class="prize-button return"
                        aria-hidden="true"
                      >
                        <i class="fas fa-arrow-left"></i>
                      </label>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>

          <div class="col-12 col-md-6 col-lg-3">
            <div class="prize-wrapper">
              <div class="prize-card api-card-size">
                <input
                  type="checkbox"
                  id="card7"
                  class="more"
                  aria-hidden="true"
                />
                <div class="prize-content">
                  <div
                    class="front"
                    style="
                      background: linear-gradient(
                        180deg,
                        rgb(0, 215, 253),
                        rgb(219, 247, 252)
                      ) !important;
                    "
                  >
                    <div class="inner">
                      <h6 class="api-plan">Tezos</h6>
                      <div class="api-icon">
                        <img
                          style="
                            width: 200px;
                            height: auto;
                            margin-bottom: 25px;
                            margin-top: 35px;
                          "
                          src="img/sponsors-img/Tezos_Logo-Colored.png"
                          alt="Tezos"
                        />
                      </div>
                      <div>
                        <h2
                          class="ticket-price"
                          style="color: black !important"
                        >
                          <span>₹</span>20,000
                        </h2>
                      </div>

                      <label
                        for="card7"
                        class="prize-button"
                        aria-hidden="true"
                        style="color: black !important; border-color: black"
                      >
                        Details
                      </label>
                    </div>
                  </div>
                  <div class="back">
                    <div class="inner">
                      <div class="description">
                        <p>
                          ₹20,000 for best Dapp built on Tezos<br />
                          <br />Continuity Grant opportunity for exceptional
                          builders
                        </p>
                      </div>
                      <div class="location">Tezos</div>
                      <div class="price"><span>₹</span>20,000</div>
                      <label
                        for="card7"
                        class="prize-button return"
                        aria-hidden="true"
                      >
                        <i class="fas fa-arrow-left"></i>
                      </label>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>

          <div class="col-12 col-md-6 col-lg-3">
            <div class="prize-wrapper">
              <div class="prize-card api-card-size">
                <input
                  type="checkbox"
                  id="card4"
                  class="more"
                  aria-hidden="true"
                />
                <div class="prize-content">
                  <div
                    class="front"
                    style="
                      background: linear-gradient(
                        180deg,
                        rgb(0, 215, 253),
                        rgb(219, 247, 252)
                      ) !important;
                    "
                  >
                    <div class="inner">
                      <h6 class="api-plan">echoAR</h6>
                      <div class="api-icon">
                        <img
                          style="
                            width: 200px;
                            height: auto;
                            margin-bottom: 17px;
                            margin-top: 35px;
                          "
                          src="img/sponsors-img/echoAR2020.webp"
                          alt="echoAR"
                        />
                      </div>
                      <div>
                        <h2
                          class="ticket-price"
                          style="color: black !important"
                        >
                          <span>$</span>50*
                        </h2>
                      </div>

                      <label
                        for="card4"
                        class="prize-button"
                        aria-hidden="true"
                        style="color: black !important; border-color: black"
                      >
                        Details
                      </label>
                    </div>
                  </div>
                  <div class="back">
                    <div class="inner">
                      <div class="description">
                        <p>Amazon Gift Card worth $50</p>
                      </div>
                      <div class="location">echoAR</div>
                      <div class="price">$50</div>
                      <label
                        for="card4"
                        class="prize-button return"
                        aria-hidden="true"
                      >
                        <i class="fas fa-arrow-left"></i>
                      </label>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>

        <div class="prize-body">
          <div class="row">
            <div class="col-sm-12 col-md-12 col-lg-4">
              <div class="prize-wrapper">
                <div class="prize-card prize-card-size">
                  <input
                    type="checkbox"
                    id="card-best-hw"
                    class="more"
                    aria-hidden="true"
                  />
                  <div class="prize-content">
                    <div
                      class="front"
                      style="
                        background: linear-gradient(
                          180deg,
                          rgb(0, 215, 253),
                          rgb(219, 247, 252)
                        ) !important;
                      "
                    >
                      <div class="inner">
                        <h6
                          class="mlh-plan"
                          style="background-color: black !important"
                        >
                          Best Hardware Hack
                        </h6>
                        <div
                          class="ticket-icon"
                          style="
                            padding-bottom: 20px !important;
                            padding-top: 20px !important;
                          "
                        >
                          <img
                            style="width: 200px; height: auto"
                            src="img/sponsors-img/digiKey.png"
                            alt="DigiKey"
                          />
                        </div>
                        <div>
                          <h2 class="mlh-price">Grove Beginner Kits</h2>
                        </div>

                        <label
                          for="card-best-hw"
                          class="prize-button"
                          aria-hidden="true"
                          style="color: black !important; border-color: black"
                        >
                          Details
                        </label>
                      </div>
                    </div>
                    <div class="back">
                      <div class="inner">
                        <div class="description">
                          <ul style="list-style-type: square">
                            <li>
                              Using your preferred hardware or hardware
                              emulator, build a hack for your chance to win a
                              Grove Beginner Kit, with Arduino Uno R3
                              included<br />
                            </li>
                            <li>
                              Two winning teams to be selected for this
                              category<br />
                            </li>
                            <li>
                              Each winning team member will receive a prize!
                            </li>
                          </ul>
                        </div>
                        <div class="location">DigiKey</div>
                        <div class="price">Grove Beginner Kits</div>
                        <label
                          for="card-best-hw"
                          class="prize-button return"
                          aria-hidden="true"
                        >
                          <i class="fas fa-arrow-left"></i>
                        </label>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>

            <div class="col-sm-12 col-md-12 col-lg-4">
              <div class="prize-wrapper">
                <div class="prize-card prize-card-size">
                  <input
                    type="checkbox"
                    id="card-best-begin"
                    class="more"
                    aria-hidden="true"
                  />
                  <div class="prize-content">
                    <div
                      class="front"
                      style="
                        background: linear-gradient(
                          180deg,
                          rgb(0, 215, 253),
                          rgb(219, 247, 252)
                        ) !important;
                      "
                    >
                      <div class="inner">
                        <h6
                          class="mlh-plan"
                          style="background-color: black !important"
                        >
                          Best Beginner Hack
                        </h6>
                        <div
                          class="ticket-icon"
                          style="
                            padding-bottom: 20px !important;
                            padding-top: 20px !important;
                          "
                        >
                          <img
                            style="
                              width: 200px;
                              height: auto;
                              padding-top: 10px;
                              padding-bottom: 10px;
                            "
                            src="img/sponsors-img/mlh-logo-color.svg"
                            alt="DigiKey"
                          />
                        </div>
                        <div>
                          <h2 class="mlh-price">Grove Starter Kit</h2>
                        </div>

                        <label
                          for="card-best-begin"
                          class="prize-button"
                          aria-hidden="true"
                          style="color: black !important; border-color: black"
                        >
                          Details
                        </label>
                      </div>
                    </div>
                    <div class="back">
                      <div class="inner">
                        <div class="description">
                          <ul style="list-style-type: square">
                            <li>
                              The Best team of beginners will take home arduino
                              starter kits to continue hacking on at future
                              events.<br />
                            </li>
                            <li>
                              Teams must be at least 50% first time hackers to
                              be eligible.
                            </li>
                          </ul>
                        </div>
                        <div class="location">MLH</div>
                        <div class="price">Grove Starter Kits</div>
                        <label
                          for="card-best-begin"
                          class="prize-button return"
                          aria-hidden="true"
                        >
                          <i class="fas fa-arrow-left"></i>
                        </label>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>

            <div class="col-sm-12 col-md-12 col-lg-4">
              <div class="prize-wrapper">
                <div class="prize-card prize-card-size">
                  <input
                    type="checkbox"
                    id="card-best-domain"
                    class="more"
                    aria-hidden="true"
                  />
                  <div class="prize-content">
                    <div
                      class="front"
                      style="
                        background: linear-gradient(
                          180deg,
                          rgb(0, 215, 253),
                          rgb(219, 247, 252)
                        ) !important;
                      "
                    >
                      <div class="inner">
                        <h6
                          class="mlh-plan"
                          style="background-color: black !important"
                        >
                          Best Domain Name
                        </h6>
                        <div
                          class="ticket-icon"
                          style="
                            padding-bottom: 20px !important;
                            padding-top: 20px !important;
                          "
                        >
                          <img
                            style="
                              width: 200px;
                              height: auto;
                              padding-top: 30px;
                              padding-bottom: 30px;
                            "
                            src="img/sponsors-img/godaddy.svg"
                            alt="DigiKey"
                          />
                        </div>
                        <div>
                          <h2 class="mlh-price">Hack from Home Kit</h2>
                        </div>

                        <label
                          for="card-best-domain"
                          class="prize-button"
                          aria-hidden="true"
                          style="color: black !important; border-color: black"
                        >
                          Details
                        </label>
                      </div>
                    </div>
                    <div class="back">
                      <div class="inner">
                        <div class="description">
                          <ul style="list-style-type: square">
                            <li>
                              GoDaddy Registry is giving you everything you need
                              to be the best hacker no matter where you are.<br />
                            </li>
                            <li>
                              Register your domain name with GoDaddy Registry
                              for a chance to win a Hack from Home Kit!<br />
                            </li>
                            <li>
                              Each Kit contains wireless earbuds, blue light
                              glasses, selfie ring light and a pouch for easy
                              transport.
                            </li>
                          </ul>
                        </div>
                        <div class="location">GoDaddy</div>
                        <div class="price">Hack from Home Kit</div>
                        <label
                          for="card-best-domain"
                          class="prize-button return"
                          aria-hidden="true"
                        >
                          <i class="fas fa-arrow-left"></i>
                        </label>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>

        <!---->
        <div class="row" style="padding-bottom: 30px">
          <div class="col-12">
            <div
              class="section-heading-2"
              style="
                margin-top: 40px;
                margin-bottom: 0px !important;
                font-size: 2.5em;">
              <h4 class="text-center" style="color:black">Participation Perks</h4>
            </div>
          </div>
        </div>

        <div class="row">
          <div class="col-12">
            <div class="prize-wrapper">
              <div class="prize-card prize-card-size-p">
                <input
                  type="checkbox"
                  id="card-p"
                  class="more"
                  aria-hidden="true"
                />
                <div class="prize-content">
                  <div class="front"
                    style="background: linear-gradient(180deg,rgb(0, 215, 253),rgb(219, 247, 252)) !important;">
                    <div class="inner">
                      <div class="description">
                        <ul style="list-style-type: square; color:black;padding-inline-start: 10px;">
                          <li>Participation Certificates</li>
                          <li>HackVerse 2.0 Goodies for Top 50 teams</li>
                          <li>MLH Goodies</li>
                          <li>Digital Ocean Cloud Credits of $100 per participant</li>
                          <li>GeeksforGeeks Discount Coupon worth ₹300</li>
                          <li>10% Discount for membership with Learn While Travelling</li>
                          <li>Replit Hacker plan for 3 months</li>
                        </ul>
                      </div>
                    </div>
                  </div>
                </div>
                
              </div>
            </div>
          </div>
        </div>

    </section>
  

    <!--Section Breaker Prizes/Sponsors-->

    <div class="section-divider tracks-color unselectable">
      <img
        src="./img/Sea creatures/S1.png"
        style="
          height: auto;
          position: absolute;
          z-index: 4;
          left: 1%;
          transform: translateY(12%);
        "
        alt="Sea creature"
        id="sea-creatures"
      />
      <img
        src="./img/Sea creatures/S4.png"
        style="
          height: auto;
          position: absolute;
          z-index: 4;
          right: 1%;
          transform: translateY(25%);
        "
        alt="Sea creature"
        id="sea-creatures"
      />
      <img
        src="img/section_breaker_blue/W4.webp"
        onerror="this.onerror=null;this.src='img/section_breaker_blue/W4.png';"
      />
    </div>

    <!--------------------------------------------------------------------------------------------------------------------------->
    <!--Tracks-->

    <section
      style="padding-top: 30px"
      class="what-we-offer-area section-padding-100-70"
      id="tracks"
    >
      <div class="container">
        <div class="row">
          <div class="col-12">
            <div class="section-heading-2">
              <h4 class="text-center" style="margin-bottom: 70px; color: black">
                Tracks
              </h4>
            </div>
          </div>
        </div>

        <div class="row">
          <div class="col-12 col-md-4 col-xl-4">
            <div
              class="single-we-offer-content text-center wow fadeInUp"
              data-wow-delay="0.3s"
            >
              <div
                style="background-image: none; background: none"
                class="offer-icon"
              >
                <img
                  src="img/tracks/fun.webp"
                  onerror="this.onerror=null;this.src='img/tracks/Fun.png';"
                  alt="Let's Have Fun"
                  width="150"
                  height="150"
                />
              </div>
              <h5 style="padding-top: 10px">Let's Have Fun</h5>
              <p>
                "Recreate a newer version of any of your Favourite Game or any
                New Game. Not just games, your project can include any hacks
                that can make you and your pals have Fun together!"
              </p>
              <h5>
                Track Prize<br /><strong><span>₹</span>10,000</strong><br>
              </h5>
              <p style="font-size:12.0pt; text-align: center">50% off for a month of LWT membership <strong>|</strong>
              GeeksForGeeks course worth ₹1200 <strong>|</strong>
              30% off for a month of Qfuss membership.</p>
            </div>
          </div>
          <div class="col-12 col-md-4 col-xl-4">
            <div
              class="single-we-offer-content text-center wow fadeInUp"
              data-wow-delay="0.3s"
            >
              <div
                style="background-image: none; background: none"
                class="offer-icon"
              >
                <img
                  src="img/tracks/connect.webp"
                  onerror="this.onerror=null;this.src='img/tracks/Connect.png';"
                  alt="Let's Connect"
                  width="150"
                  height="150"
                />
              </div>
              <h5 style="padding-top: 10px">Let's Connect</h5>
              <p>
                "Getting bored with your Virtual Setup? Find ways of making your
                Virtual Education, Classrooms, Gatherings or even Work From Home
                more Interactive and Easy to work with!"
              </p>
              <h5>
                Track Prize<br /><strong><span>₹</span>10,000</strong><br>
              </h5>
              <p style="font-size:12.0pt; text-align: center">50% off for a month of LWT membership <strong>|</strong>
                GeeksForGeeks course worth ₹1200 <strong>|</strong>
                30% off for a month of Qfuss membership.
              </p>
            </div>
          </div>
          <div class="col-12 col-md-4 col-xl-4">
            <div
              class="single-we-offer-content text-center wow fadeInUp"
              data-wow-delay="0.3s"
            >
              <div
                style="background-image: none; background: none"
                class="offer-icon"
              >
                <img
                  src="img/tracks/fitness.webp"
                  onerror="this.onerror=null;this.src='img/tracks/Fitness.png';"
                  alt="Let's Stay Fit"
                  width="150"
                  height="150"
                />
              </div>
              <h5 style="padding-top: 10px">Let's Stay Fit</h5>
              <p>
                "Health is Wealth! Especially during these tough times. Design
                ways of keeping yourself and your loved ones safe by making
                Healthcare more efficient and easily accessible."
              </p>
              <h5 style="padding-top: 22px">
                Track Prize<br /><strong><span>₹</span>10,000</strong><br>
              </h5>
              <p style="font-size:12.0pt; text-align: center">50% off for a month of LWT membership <strong>|</strong>
                GeeksForGeeks course worth ₹1200 <strong>|</strong>
                30% off for a month of Qfuss membership.
              </p>
            </div>
          </div>
        </div>

        <div class="row">
          <div class="col-12 col-md-4 col-xl-4">
            <div
              class="single-we-offer-content text-center wow fadeInUp"
              data-wow-delay="0.3s"
            >
              <div
                style="background-image: none; background: none"
                class="offer-icon"
              >
                <img
                  src="img/tracks/contactless.webp"
                  onerror="this.onerror=null;this.src='img/tracks/Contactless.png';"
                  alt="Let's Go Contactless"
                  width="150"
                  height="150"
                />
              </div>
              <h5 style="padding-top: 10px">Let's Go Contactless</h5>
              <p>
                "Want to Stay Safe from the Virus 🦠? Going Contactless is the
                Key. Design a contactless alternative for any activity that
                requires human interaction!"
              </p>
              <h5>
                Track Prize<br /><strong><span>₹</span>10,000</strong><br>
              </h5>
              <p style="font-size:12.0pt; text-align: center">50% off for a month of LWT membership <strong>|</strong>
                GeeksForGeeks course worth ₹1200 <strong>|</strong>
                30% off for a month of Qfuss membership.
              </p>
            </div>
          </div>
          <div class="col-12 col-md-4 col-xl-4">
            <div
              class="single-we-offer-content text-center wow fadeInUp"
              data-wow-delay="0.3s"
            >
              <div
                style="background-image: none; background: none"
                class="offer-icon"
              >
                <img
                  src="img/tracks/security.webp"
                  onerror="this.onerror=null;this.src='img/tracks/Security.png';"
                  alt="Let's Stay Safe"
                  width="150"
                  height="150"
                />
              </div>
              <h5 style="padding-top: 10px">Let's Stay Safe</h5>
              <p>
                "With the surge in Crime Rates, its better to be “Safe than
                Sorry”. Come up with hacks of making the Community safe, secure
                and a better place to live in."
              </p>
              <h5>
                Track Prize<br /><strong><span>₹</span>10,000</strong><br>
              </h5>
              <p style="font-size:12.0pt; text-align: center">50% off for a month of LWT membership <strong>|</strong>
                GeeksForGeeks course worth ₹1200 <strong>|</strong>
                30% off for a month of Qfuss membership.
              </p>
            </div>
          </div>
          <div class="col-12 col-md-4 col-xl-4">
            <div
              class="single-we-offer-content text-center wow fadeInUp"
              data-wow-delay="0.3s"
            >
              <div
                style="background-image: none; background: none"
                class="offer-icon"
              >
                <img
                  src="img/tracks/innovate.webp"
                  onerror="this.onerror=null;this.src='img/tracks/Innovate.png';"
                  alt="Let's Innovate"
                  width="150"
                  height="150"
                />
              </div>
              <h5 style="padding-top: 10px">Let's Innovate</h5>
              <p>
                "Technology makes your everyday life easy. So put your thinking
                caps 🧢 on and Innovate!"
              </p>
            </div>
          </div>
        </div>

        <div class="row">
          <div class="col-12 col-md-12">
            <div class="section-heading-2">
              <h4
                class="text-center"
                style="
                  margin-top: 40px;
                  color: black;
                  font-size: 1.8em !important;
                "
              >
                Check out the
                <a href="https://hack.mlh.io/software/" target="_blank"
                  >Free APIs</a
                >
                available during HackVerse 2.0!
              </h4>
            </div>
          </div>
        </div>
      </div>
    </section>
    <!--TRACKS End-->
    <div class="section-divider sponser-color unselectable">
      <img
        src="img/section_breaker_blue/W4.webp"
        onerror="this.onerror=null;this.src='img/section_breaker_blue/W4.png';"
      />
    </div>

    <!--------------------------------------------------------------------------------------------------------------------------->
    <!-- Judges Area -->
    
    <section id="judges" class="our-judge-area section-padding-100-60">
      <div class="container">
        <div class="row">
          <div class="col-12">
            <div class="section-heading-2">
              <h4 class="text-center" style="margin-bottom: 70px; color: black">
                Our Judges
              </h4>
            </div>
          </div>
        </div>
        <div class="row justify-content-center">
          <div id="grid" class="col-12 col-md-4 col-lg-3">
            <div class="single-judge-area">
              <div class="judge-single-thumb">
                <img
                  style="height: 240px"
                  class="img-fluid"
                  src="img/judges-img/Akash James.jpg"
                  onerror="this.onerror=null;this.src='img/judges-img/';"
                  alt="Akash James"
                />
              </div>
              <div class="social-info">
                <a href="https://www.linkedin.com/in/akashjames/"
                  ><i class="zmdi zmdi-linkedin"></i
                ></a>
              </div>
              <div class="judge-info">
                <h5>Akash James</h5>
                <p >
                  AI Architect at Integration Wizards | NASA Space Apps 2020/19
                  Winner
                </p>
              </div>
            </div>
          </div>

          <div id="grid" class="col-12 col-md-4 col-lg-3">
            <div class="single-judge-area">
              <div class="judge-single-thumb">
                <img
                  style="height: 240px"
                  class="img-fluid"
                  src="img/judges-img/Akshay R.jpg"
                  onerror="this.onerror=null;this.src='img/judges-img/';"
                  alt="Akshay Revankar"
                />
              </div>
              <div class="social-info">
                <a href="https://www.linkedin.com/in/akshayrevankar/"
                  ><i class="zmdi zmdi-linkedin"></i
                ></a>
              </div>
              <div class="judge-info">
                <h5>Akshay Revankar</h5>
                <p>Digital Engineer at Texas Instruments</p>
              </div>
            </div>
          </div>

          <div id="grid" class="col-12 col-md-4 col-lg-3">
            <div class="single-judge-area">
              <div class="judge-single-thumb">
                <img
                  style="height: 240px"
                  class="img-fluid"
                  src="img/judges-img/Venkat R.jpg"
                  onerror="this.onerror=null;this.src='img/judges-img/';"
                  alt="K Venkat Ramana Reddy"
                />
              </div>
              <div class="social-info">
                <a href="https://www.linkedin.com/in/venkat-ramana-reddy/"
                  ><i class="zmdi zmdi-linkedin"></i
                ></a>
              </div>
              <div class="judge-info">
                <h5>K Venkat Ramana Reddy</h5>
                <p>
                  Senior Software Engineer at Intuit India
                </p>
              </div>
            </div>
          </div>

          <div id="grid" class="col-12 col-md-4 col-lg-3">
            <div class="single-judge-area">
              <div class="judge-single-thumb">
                <img
                  style="height: 240px"
                  class="img-fluid"
                  src="img/judges-img/Pratik_Gupta.jpeg"
                  onerror="this.onerror=null;this.src='img/judges-img/';"
                  alt="Prateek Gupta "
                />
              </div>
              <div class="social-info">
                <a href="https://www.linkedin.com/in/prateek-gupta-34014618/"
                  ><i class="zmdi zmdi-linkedin"></i
                ></a>
              </div>
              <div class="judge-info">
                <h5>Prateek Gupta</h5>
                <p >Senior Product Designer at Flipkart</p>
              </div>
            </div>
          </div>

          <div id="grid" class="col-12 col-md-4 col-lg-3">
            <div class="single-judge-area">
              <div class="judge-single-thumb">
                <img
                  style="height: 240px"
                  class="img-fluid"
                  src="img/judges-img/Prateek B.jpeg"
                  onerror="this.onerror=null;this.src='img/judges-img/';"
                  alt="Pratik Bhattacharya"
                />
              </div>
              <div class="social-info">
                <a href="https://www.linkedin.com/in/patrickb404/"
                  ><i class="zmdi zmdi-linkedin"></i
                ></a>
              </div>
              <div class="judge-info">
                <h5>Pratik Bhattacharya</h5>
                <p>Senior Software Engineer at Microsoft</p>
              </div>
            </div>
          </div>

          <div id="grid" class="col-12 col-md-4 col-lg-3">
            <div class="single-judge-area">
              <div class="judge-single-thumb">
                <img
                  style="height: 240px"
                  class="img-fluid"
                  src="img/judges-img/Sreenivas K.jpg"
                  onerror="this.onerror=null;this.src='img/judges-img/';"
                  alt="Sreenivasamurthy Krishnappa"
                />
              </div>
              <div class="social-info">
                <a
                  href="https://in.linkedin.com/in/sreenivasamurthy-krishnappa-9a05971"
                  ><i class="zmdi zmdi-linkedin"></i
                ></a>
              </div>
              <div class="judge-info">
                <h5>Sreenivasamurthy Krishnappa</h5>
                <p>
                  Senior Engineering Manager at Wells Fargo
                </p>
              </div>
            </div>
          </div>
        </div>
      </div>
    </section>

<!-- Judges End -->
    <div class="section-divider judges-color unselectable">
      <img
        src="img/section_breaker_blue/W5.webp"
        onerror="this.onerror=null;this.src='img/section_breaker_blue/W4.png';"
      />
    </div>

    <!--------------------------------------------------------------------------------------------------------------------------->
    <!--Sponsors-->
    <section id="sponsors" class="our-sponsor-client-area section-padding-100">
      <div class="container">
        <div class="row">
          <div class="col-12">
            <div class="section-heading-2 text-center wow fadeInUp">
              <h4>Official Sponsors</h4>
            </div>
          </div>
        </div>

        <!-- text-shadow: 0.6px 0.6px black -->
        <div class="sponsor-message" style="padding-bottom: 40px">
          <h5 style="display: flex; justify-content: center">
            Interested in sponsoring HackVerse 2.0?
          </h5>
          <h5 style="display: flex; justify-content: center">
            Shoot us an email &nbsp;
            <a
              style="
                color: rgb(107, 5, 5);
                font-weight: normal;
                text-indent: 0.2em;
              "
              href="mailto:hackverse@nitk.edu.in"
              target="_blank"
              >hackverse@nitk.edu.in</a
            >
          </h5>
        </div>

        <!--ROW 1-->
        <div class="row align-items-center">
          <div class="col-6 col-md-4 col-lg-3">
            <a
              target="_blank"
              rel="noopener noreferrer"
              href="https://www.wellsfargo.com/"
              ><img
                src="img/sponsors-img/WF.webp"
                onerror="this.onerror=null;this.src='img/sponsors-img/WF.jpg';"
                alt="Wells Fargo"
            /></a>
          </div>
          <div class="col-6 col-md-4 col-lg-3">
            <a
              target="_blank"
              rel="noopener noreferrer"
              href="https://devfolio.co/"
              ><img
                src="img/sponsors-img/devfolio.webp"
                onerror="this.onerror=null;this.src='img/sponsors-img/devfolio.png';"
                alt="Devfolio"
            /></a>
          </div>
          <div class="col-6 col-md-4 col-lg-3">
            <a
              target="_blank"
              rel="noopener noreferrer"
              href="https://www.digitalocean.com/"
              ><img
                src="img/sponsors-img/digital-ocean.webp"
                onerror="this.onerror=null;this.src='img/sponsors-img/digital-ocean.png';"
                alt="Digital Ocean"
            /></a>
          </div>
          <div class="col-6 col-md-4 col-lg-3">
            <a
              target="_blank"
              rel="noopener noreferrer"
              href="https://www.geeksforgeeks.org/"
              ><img
                src="img/sponsors-img/GFG LOGO-1.png"
                onerror="this.onerror=null;this.src='img/sponsors-img/GFG LOGO-1.png';"
                alt="GeeksforGeeks"
            /></a>
          </div>
          <div class="col-6 col-md-4 col-lg-3">
            <a
              target="_blank"
              rel="noopener noreferrer"
              href="https://www.codechef.com/"
              ><img
                src="img/sponsors-img/codechef.webp"
                onerror="this.onerror=null;this.src='img/sponsors-img/codechef.png';"
                alt="Codechef"
            /></a>
          </div>
          <!-- <div id="wells-fargo" class="col-6 col-md-4 col-lg-3">
            <a
              target="_blank"
              rel="noopener noreferrer"
              href="https://www.wellsfargojobs.com/egs"
              ><img
                src="img/sponsors-img/wells-fargo.webp"
                onerror="this.onerror=null;this.src='img/sponsors-img/wells-fargo.png';"
                alt="Wells Fargo"
            /></a>
          </div>
         
          <div class="col-6 col-md-4 col-lg-3">
            <a
              target="_blank"
              rel="noopener noreferrer"
              href="https://www.fidelity.com/"
              ><img
                src="img/sponsors-img/fidelity.webp"
                onerror="this.onerror=null;this.src='img/sponsors-img/fidelity.png';"
                alt="Fidelity"
            /></a>
          </div>
          </div> -->

          <!--ROW 2-->
          <div class="col-6 col-md-4 col-lg-3">
            <a
              target="_blank"
              rel="noopener noreferrer"
              href="https://matic.network"
              ><img
                src="img/sponsors-img/matic.webp"
                onerror="this.onerror=null;this.src='img/sponsors-img/matic.png';"
                alt="Matic"
            /></a>
          </div>
          <div class="col-6 col-md-4 col-lg-3">
            <a
              target="_blank"
              rel="noopener noreferrer"
              href=" https://www.portis.io/"
              ><img
                src="img/sponsors-img/Portis_Logo-Black.png"
                onerror="this.onerror=null;this.src='img/sponsors-img/Portis_Logo-Colored_Black.png';"
                alt="Portis"
            /></a>
          </div>
          <div class="col-6 col-md-4 col-lg-3">
            <a
              target="_blank"
              rel="noopener noreferrer"
              href=" https://tezos.com"
              ><img
                src="img/sponsors-img/Tezos_Logo-White.png"
                onerror="this.onerror=null;this.src='img/sponsors-img/Tezos_Logo-White.png';"
                alt="Tezos"
            /></a>
          </div>
          <div class="col-6 col-md-4 col-lg-3">
            <a
              target="_blank"
              rel="noopener noreferrer"
              href="https://www.technoforte.co.in//"
              ><img src="img/sponsors-img/technofotre.png" alt="technoforte"
            /></a>
          </div>

          <!--ROW 3-->

          <div class="col-6 col-md-4 col-lg-3">
            <a
              target="_blank"
              rel="noopener noreferrer"
              href="https://www.clerky.com/"
              ><img src="img/sponsors-img/Clerky_Logo.png" alt="Clerky"
            /></a>
          </div>

          <div class="col-6 col-md-4 col-lg-3">
            <a target="_blank" rel="noopener noreferrer" href="https://repl.it/"
              ><img
                src="img/sponsors-img/Replit_logo.webp"
                alt="Replit"
                onerror="this.onerror=null;this.src='img/sponsors-img/Replit_logo.png';"
            /></a>
          </div>

          <div class="col-6 col-md-4 col-lg-3">
            <a
              target="_blank"
              rel="noopener noreferrer"
              href="https://learningwhiletravelling.com/"
              ><img
                src="img/sponsors-img/LWT.png"
                alt="Learning While Travelling"
            /></a>
          </div>

          <div class="col-6 col-md-4 col-lg-3">
            <a
              target="_blank"
              rel="noopener noreferrer"
              href="https://www.echoar.xyz/"
              ><img
                src="img/sponsors-img/echoAR2020.webp"
                onerror="this.onerror=null;this.src='img/sponsors-img/echoAR2020.webp';"
                alt="echoAR"
            /></a>
          </div>

          <div class="col-6 col-md-4 col-lg-3">
            <a
              target="_blank"
              rel="noopener noreferrer"
              href="https://yocket.in/"
              ><img
                style="height: 100px"
                src="img/sponsors-img/yocket-sm.webp"
                onerror="this.onerror=null;this.src='img/sponsors-img/yocket-sm.png';"
                alt="Yocket"
            /></a>
          </div>
          <div class="col-6 col-md-4 col-lg-3">
            <a
              target="_blank"
              rel="noopener noreferrer"
              href="https://www.qfuss.com/"
              ><img
                style="height: 100px"
                src="img/sponsors-img/qFuss.webp"
                onerror="this.onerror=null;this.src='img/sponsors-img/qFuss.png';"
                alt="qFuss"
            /></a>
          </div>
          <div class="col-6 col-md-4 col-lg-3">
            <a
              target="_blank"
              rel="noopener noreferrer"
              href="https://givemycertificate.com/"
              ><img
                src="img/sponsors-img/GMC.webp"
                onerror="this.onerror=null;this.src='img/sponsors-img/GMC.png';"
                alt="givemycertificate"
            /></a>
          </div>
          <div class="col-6 col-md-4 col-lg-3">
            <a
              target="_blank"
              rel="noopener noreferrer"
              href="http://hackp.ac/mlh-stickermule-hackathons"
              ><img
                src="img/sponsors-img/sticker-mule-logo.webp"
                onerror="this.onerror=null;this.src='img/sponsors-img/sticker-mule-logo-light.png';"
                alt="StickerMule"
            /></a>
          </div>
        </div>
      </div>
    </section>

    <!--sponser ended-->
    <!--section breaker between sponser and faq-->
    <div class="section-divider faq-color unselectable">
      <img
        src="img/section_breaker_blue/W7.webp"
        onerror="this.onerror=null;this.src='img/section_breaker_blue/W7.png';"
      />
    </div>

    <!--------------------------------------------------------------------------------------------------------------------------->
    <!--FAQ Section-->
    <section id="faq">
      <div class="container">
        <div class="row">
          <div class="col-12 col-md-12">
            <div class="section-heading-2">
              <h4 class="text-center" style="margin-bottom: 70px; color: black">
                FAQs
              </h4>
            </div>
          </div>
        </div>
        <div class="row" id="faq-list">
          <div class="col-lg-6">
            <ul>
              <li>
                <a data-toggle="collapse" class="collapsed" href="#faq1"
                  >Is this hackathon an online event or offline?
                  <i class="fas fa-plus-circle float-right"></i
                ></a>
                <div id="faq1" class="collapse" data-parent="#faq-list">
                  <p>HackVerse 2.0 will be an online event.</p>
                </div>
              </li>

              <li>
                <a data-toggle="collapse" class="collapsed" href="#faq2"
                  >Who is eligible to apply?<i
                    class="fa fa-plus-circle float-right"
                  ></i
                ></a>
                <div id="faq2" class="collapse" data-parent="#faq-list">
                  <p>
                    Only Current Students (both Indian and International) are
                    allowed to apply.
                  </p>
                </div>
              </li>

              <li>
                <a data-toggle="collapse" href="#faq3" class="collapsed"
                  >Is there any registration fee?
                  <i class="fa fa-plus-circle float-right"></i
                ></a>
                <div id="faq3" class="collapse" data-parent="#faq-list">
                  <p>No. Registrations are completely free of cost.</p>
                </div>
              </li>

              <li>
                <a data-toggle="collapse" href="#faq5" class="collapsed"
                  >What is the selection criteria?
                  <i class="fa fa-plus-circle float-right"></i
                ></a>
                <div id="faq5" class="collapse" data-parent="#faq-list">
                  <p>
                    We are looking for people who innovate and can build crazy,
                    unique solutions to real-world problems. Tell us why you
                    want to be a part of HackVerse, any accomplishments you are
                    proud of and anything else which could strengthen your
                    application.
                    <!--                     Also, make sure your Devfolio profile is
                    complete with your resume and relevant links. -->
                  </p>
                </div>
              </li>
              <li>
                <a data-toggle="collapse" href="#faq15" class="collapsed"
                  >Can I participate without a team?
                  <i class="fa fa-plus-circle float-right"></i
                ></a>
                <div id="faq15" class="collapse" data-parent="#faq-list">
                  <p>
                    No, Hackverse is a team event. Student teams need a minimum
                    of two members but a maximum of three. However, you can
                    submit the application alone and form teams after selection
                    with other selected participants.
                  </p>
                </div>
              </li>
            </ul>
          </div>

          <div class="col-lg-6">
            <ul>
              <li>
                <a data-toggle="collapse" href="#faq9" class="collapsed"
                  >What are the perks of participating in this hackathon?
                  <i class="fa fa-plus-circle float-right"></i
                ></a>
                <div id="faq9" class="collapse" data-parent="#faq-list">
                  <p>
                    The hackathon will instantly increase your knowledge and
                    skill level and will serve as a platform to socialize with
                    the tech community. Cash prizes and other perks are in store
                    for the winners and cool swag for all participants.
                  </p>
                </div>
              </li>

              <li>
                <a data-toggle="collapse" href="#faq11" class="collapsed"
                  >Can I participate without a computer science background?<i
                    class="fa fa-plus-circle float-right"
                  ></i
                ></a>
                <div id="faq11" class="collapse" data-parent="#faq-list">
                  <p>
                    Yes. Creativity is independent of your technical skills. You
                    can learn the tools and technologies anytime.
                  </p>
                </div>
              </li>

              <li>
                <a data-toggle="collapse" href="#faq13" class="collapsed"
                  >Can I start working on my hack before the event?
                  <i class="fa fa-plus-circle float-right"></i
                ></a>
                <div id="faq13" class="collapse" data-parent="#faq-list">
                  <p>Please refer to our Terms and Conditions.</p>
                </div>
              </li>

              <li>
                <a data-toggle="collapse" href="#faq14" class="collapsed"
                  >Still got questions?<i
                    class="fa fa-plus-circle float-right"
                  ></i
                ></a>
                <div id="faq14" class="collapse" data-parent="#faq-list">
                  <p>
                    Please join our Telegram Channel: @hackverse, and ask your
                    question, one of the organizers will get in touch with you.
                  </p>
                </div>
              </li>
            </ul>
          </div>
          <!-- </div> -->
        </div>
      </div>
    </section>

    <!--section breaker between faq and footer-->
    <div class="section-divider footer-color unselectable">
      <img
        src="./img/Sea creatures/S7.png"
        style="
          height: auto;
          position: absolute;
          z-index: 4;
          left: 1%;
          transform: translateY(-15%);
        "
        alt="Sea creature"
        id="sea-creatures"
      />

      <img
        src="img/section_breaker_blue/W8.webp"
        onerror="this.onerror=null;this.src='img/section_breaker_blue/W8.png';"
      />
    </div>

    <!--------------------------------------------------------------------------------------------------------------------------->
    <!--Contact Us (Footer)-->
    <!-- Footer Area Start -->
    <footer id="footer" class="footer-area">
      <div class="main-footer-area">
        <div class="container">
          <div
            class="row"
            style="
              width: 100% !important;
              position: relative;
              text-align: center !important;
            "
          >
            <!-- Single Footer Widget Area -->
            <div class="col-12 col-md-5">
              <div class="single-footer-widget">
                <!-- Footer Logo -->
                <a href="#" class="footer-logo">
                  <img
                    style="
                      height: auto;
                      width: auto;
                      max-height: 300px;
                      max-width: 300px;
                    "
                    src="img/logo_long.webp"
                    onerror="this.onerror=null;this.src='img/logo_long.png';"
                    alt="HackVerse"
                /></a>
                <p style="color: #fff; margin-top: -20px">
                  Hack it till you crack it!
                </p>
                <p style="margin-top: -10px">
                  <a style="color: rgb(0, 255, 242); " href="team.html" target="_blank">Team HackVerse 2.0</a>
                </p>

                <!-- Social Info -->
                <div class="social-info">
                  <a
                    target="_blank"
                    rel="noopener noreferrer"
                    href="https://www.facebook.com/hackverse/"
                    ><i class="fab fa-facebook-square fa-2x"></i
                  ></a>
                  <a
                    target="_blank"
                    rel="noopener noreferrer"
                    href="https://www.instagram.com/hackversenitk/"
                    ><i class="fab fa-instagram fa-2x"></i
                  ></a>
                  <a
                    target="_blank"
                    rel="noopener noreferrer"
                    href="https://twitter.com/hackversenitk/"
                    ><i class="fab fa-twitter fa-2x"></i
                  ></a>
                  <a
                    target="_blank"
                    rel="noopener noreferrer"
                    href="https://www.linkedin.com/company/hackverse/"
                    ><i class="fab fa-linkedin fa-2x"></i
                  ></a>
                  <a
                    target="_blank"
                    rel="noopener noreferrer"
                    href="https://t.me/hackverse"
                    ><i class="fa fa-telegram fa-2x" aria-hidden="true"></i
                  ></a>
                  <a
                    target="_blank"
                    rel="noopener noreferrer"
                    href="https://www.youtube.com/channel/UC_hR3RkqNKQMDG1R2hpbSoA"
                    ><i class="fa fa-youtube fa-2x" aria-hidden="true"></i
                  ></a>
                </div>
              </div>
            </div>

            <!-- Single Footer Widget Area -->
            <div class="col-12 col-md-3">
              <div class="single-footer-widget">
                <!-- Widget Title -->
                <h5 class="widget-title">Contact</h5>

                <!-- Contact Area -->
                <div class="footer-contact-info">
                  <p>
                    <i
                      style="color: rgb(252, 147, 147)"
                      class="zmdi zmdi-pin"
                    ></i>
                    <a
                      style="color: #fff"
                      href="https://goo.gl/maps/86DJCMqtYdhVFNgA8"
                      target="_blank"
                    >
                      National Institute of Technology Karnataka, Surathkal
                    </a>
                  </p>
                  <p>
                    <i
                      style="color: rgb(252, 155, 155)"
                      class="zmdi zmdi-email"
                    ></i>
                    <a
                      style="color: white"
                      href="mailto:hackverse@nitk.edu.in"
                      target="_blank"
                    >
                      hackverse@nitk.edu.in
                    </a>
                  </p>
                </div>
              </div>
            </div>

            <div class="col-12 col-md-3">
              <div class="single-footer-widget">
                <h5 class="widget-title" style="text-align: center !important">
                  Community Partners
                </h5>
                <div class="comm-part">
                  <a href="https://hackon.tech/">hackon.tech</a><br />
                  <a href="https://nitk.acm.org/">ACM NITK</a><br />
                  <a href="https://ie.nitk.ac.in/">IE NITK</a><br />
                  <a href="https://ieee.nitk.ac.in/">IEEE NITK</a><br />
                  <a href="https://ietnitk.netlify.app/">IET NITK</a><br />
                  <a href="https://iste.nitk.ac.in/">ISTE NITK</a><br />
                  <a href="https://webclub.nitk.ac.in/">WEC NITK</a><br />
                </div>
              </div>
            </div>
          </div>
          <!-- Single Footer Widget Area -->
          <div class="row">
            <div class="col-12">
              <div class="single-footer-widget">
                <h5 class="widget-title">Campus</h5>

                <div class="footer-gallery" style="pointer-events: none">
                  <div class="row">
                    <div class="col-6 col-md-2">
                      <a href="/img/nitk/01.webp" class="single-gallery-item"
                        ><img
                          src="img/nitk/01.webp"
                          onerror="this.onerror=null;this.src='img/nitk/01.jpg';"
                          alt="NITK, Surathkal"
                      /></a>
                    </div>
                    <div class="col-6 col-md-2">
                      <a href="/img/nitk/02.webp" class="single-gallery-item"
                        ><img
                          src="img/nitk/02.webp"
                          onerror="this.onerror=null;this.src='img/nitk/02.jpg';"
                          alt="NITK, Surathkal"
                      /></a>
                    </div>
                    <div class="col-6 col-md-2">
                      <a href="/img/nitk/03.webp" class="single-gallery-item"
                        ><img
                          src="img/nitk/03.webp"
                          onerror="this.onerror=null;this.src='img/nitk/03.jpg';"
                          alt="NITK, Surathkal"
                      /></a>
                    </div>
                    <div class="col-6 col-md-2">
                      <a href="/img/nitk/04.webp" class="single-gallery-item"
                        ><img
                          src="img/nitk/04.webp"
                          onerror="this.onerror=null;this.src='img/nitk/04.jpg';"
                          alt="NITK, Surathkal"
                      /></a>
                    </div>
                    <div class="col-6 col-md-2">
                      <a href="/img/nitk/05.webp" class="single-gallery-item"
                        ><img
                          src="img/nitk/05.webp"
                          onerror="this.onerror=null;this.src='img/nitk/05.jpg';"
                          alt="NITK, Surathkal"
                      /></a>
                    </div>
                    <div class="col-6 col-md-2">
                      <a href="/img/nitk/06.webp" class="single-gallery-item">
                        <img
                          src="img/nitk/06.webp"
                          onerror="this.onerror=null;this.src='img/nitk/06.jpg';"
                          alt="NITK, Surathkal"
                      /></a>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>

      <!--------------------------------------------------------------------------------------------------------------------------->
      <!-- Copywrite Area -->
      <div class="container">
        <div class="copywrite-content">
          <div class="row">
            <!-- Copywrite Text -->
            <div class="col-12 col-md-6 text-center">
              <div class="copywrite-text">
                <p style="color: white">
                  Copyright &copy; 2021 All rights reserved |
                  <span
                    >Made with
                    <i
                      class="fas fa-heart"
                      style="color: red"
                      aria-hidden="true"
                    ></i>
                    by
                    <a
                      href="team.html"
                      target="_blank"
                      >HackVerse Team</a
                    >
                  </span>
                </p>
              </div>
            </div>
            <!-- Footer Menu -->
            <div class="col-12 col-md-6 text-center">
              <div class="footer-menu">
                <ul class="nav">
                  <!-- <li>
                    <a
                      style="color: white"
                      target="_blank"
                      rel="noopener noreferrer"
                      href="/docs/HackVerse Terms&Conditions.pdf"
                      ><i class="zmdi zmdi-circle"></i>Terms & Conditions</a
                    >
                  </li> -->
                  <li>
                    <a
                      target="_blank"
                      rel="noopener noreferrer"
                      href="https://mlh.io/code-of-conduct"
                    >
                      • MLH Code of Conduct</a
                    >
                  </li>
                  <li>
                    <a
                      target="_blank"
                      rel="noopener noreferrer"
                      href="https://devfolio.co/code-of-conduct"
                    >
                      • Devfolio Code of Conduct</a
                    >
                  </li>
                  <li>
                    <a
                      target="_blank"
                      rel="noopener noreferrer"
                      href="./docs/HackVerse Terms & Conditions.pdf"
                    >
                      • Terms & Conditions</a
                    >
                  </li>
                </ul>
              </div>
            </div>
          </div>
        </div>
      </div>
    </footer>

    <!--------------------------------------------------------------------------------------------------------------------------->
    <!-- Footer Area End -->
    <!--Contact Us (Footer)-->
    <div class="fabs">
      <div id="fab" class="mdc-touch-target-wrapper">
        <button id="fab-open" class="mdc-fab mdc-fab--touch">
          <div class="mdc-fab__ripple"></div>
          <span id="icon" class="material-icons mdc-fab__icon">forum</span>
          <div class="mdc-fab__touch"></div>
        </button>
      </div>

      <div class="social-icons hidden">
          <button
            style="background-color: rgb(230, 118, 14)"
            class="mdc-fab mdc-fab--mini"
            aria-label="TnC"
            data-toggle="tooltip" title="Terms and Conditions"
          >
          <div class="mdc-fab__ripple"></div>
          <a
            target="_blank"
            rel="noopener noreferrer"
            href="./docs/HackVerse Terms & Conditions.pdf"
            class="mdc-fab__icon fas fa-file-contract"
            >
          </a>
          <a
            target="_blank"
            rel="noopener noreferrer"
            href="./docs/HackVerse Terms & Conditions.pdf"
            class="mdc-fab__label hidden"
            >TnC</a
          >
        </button>
        <button
          style="background-color: hsl(203, 89%, 53%)"
          class="mdc-fab mdc-fab--mini"
          aria-label="Telegram"
          data-toggle="tooltip" title="HackVerse 2.0 Telegram"
        >
          <div class="mdc-fab__ripple"></div>
          <a
            target="_blank"
            rel="noopener noreferrer"
            href="https://t.me/hackverse"
            class="mdc-fab__icon fab fa-telegram"
          ></a>
          <a
            target="_blank"
            rel="noopener noreferrer"
            href="https://t.me/hackverse"
            class="mdc-fab__label hidden"
            >Telegram</a
          >
        </button>
        <button
          style="background-color: rgb(66, 66, 66)"
          class="mdc-fab mdc-fab--mini"
          aria-label="blog"
          data-toggle="tooltip" title="HackVerse 2.0 Blog"
        >
          <div class="mdc-fab__ripple"></div>
          <a
            target="_blank"
            rel="noopener noreferrer"
            href="https://hackverse.nitk.ac.in/blog/"
            class="mdc-fab__icon fas fa-blog"
          >
          </a>
          <a
            target="_blank"
            rel="noopener noreferrer"
            href="https://hackverse.nitk.ac.in/blog/"
            class="mdc-fab__label hidden"
            >Blog</a
          >
        </button>
        <button
          style="background-color: rgb(87, 196, 84)"
          class="mdc-fab mdc-fab--mini"
          aria-label="mail"
          data-toggle="tooltip" title="Mail Us"
        >
          <div class="mdc-fab__ripple"></div>
          <a
            target="_blank"
            rel="noopener noreferrer"
            href="mailto:hackverse@nitk.edu.in"
            class="mdc-fab__icon material-icons"
            >email
          </a>
          <a
            target="_blank"
            rel="noopener noreferrer"
            href="mailto:hackverse@nitk.edu.in"
            class="mdc-fab__label hidden"
            >Mail Us</a
          >
        </button>
      </div>
    </div>

    <!--------------------------------------------------------------------------------------------------------------------------->
    <!-- <script
      src="https://code.jquery.com/jquery-3.5.1.slim.min.js"
      integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj"
      crossorigin="anonymous"
    ></script> -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    <script
      src="https://cdn.jsdelivr.net/npm/popper.js@1.16.1/dist/umd/popper.min.js"
      integrity="sha384-9/reFTGAW83EW2RDu2S0VKaIzap3H66lZH81PoYlFhbGU+6BZp6G7niu735Sk7lN"
      crossorigin="anonymous"
    ></script>
    <script
      src="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/js/bootstrap.min.js"
      integrity="sha384-w1Q4orYjBQndcko6MimVbzY0tgp4pWB4lZ7lr30WKz0vr/aWKhXdBNmNb5D92v7s"
      crossorigin="anonymous"
    ></script>
    <script src="https://unpkg.com/aos@2.3.1/dist/aos.js"></script>
    <script>
      AOS.init();
    </script>
    <script defer async src="https://apply.devfolio.co/v2/sdk.js"></script>
    <script src="https://unpkg.com/@pqina/flip/dist/flip.min.js"></script>
    <!-- <script src="js/script.js"></script> -->
    <script>
      $(document).ready(function(){
        $('[data-toggle="tooltip"]').tooltip();
        $(".last-rs").next().hide();
      });

      var welcomeElement = document.getElementsByClassName("welcome")[0];
      var imageURL = "";
      var date = new Date();
      var hourOfDay = date.getHours();
      if (hourOfDay >= 20 || hourOfDay <= 4) {
        imageURL = "img/landing_bg/Night.jpg";
      } else if (hourOfDay >= 4 && hourOfDay <= 6) {
        imageURL = "img/landing_bg/Sunset_Sunrise.jpg";
      } else if (hourOfDay >= 6 && hourOfDay <= 11) {
        imageURL = "img/landing_bg/Morning_Evening.jpg";
      } else if (hourOfDay >= 11 && hourOfDay <= 17) {
        imageURL = "img/landing_bg/Noon.jpg";
      } else if (hourOfDay >= 17 && hourOfDay <= 19) {
        imageURL = "img/landing_bg/Sunset_Sunrise.jpg";
      } else if (hourOfDay >= 19 && hourOfDay <= 20) {
        imageURL = "img/landing_bg/Morning_Evening.jpg";
      }
      var x = "url(" + '"' + imageURL + '"' + ") left no-repeat";
      console.log(x);
      welcomeElement.style.background = x;
      welcomeElement.style.height = "100vh";
      welcomeElement.style.backgroundSize = "cover";
      welcomeElement.style.overflow = "hidden";
      welcomeElement.style.margin = "0";
      welcomeElement.style.borderRadius = "0";
      console.log(welcomeElement);
      console.log(welcomeElement.style);
      var fab = document.getElementById("fab");
      var icon = document.getElementById("icon");
      var sico = document.querySelector(".social-icons");
      fab.addEventListener("click", () => {
        if (icon.innerHTML == "forum") {
          icon.innerHTML = "close";
          show();
        } else {
          icon.innerHTML = "forum";
          show();
        }
      });

      function show() {
        sico.classList.toggle("hidden");
      }
      $(function () {
        $("#fab-open").click();
      });
      // $(".social-icons button").mouseenter(function () {
      //   $(this).addClass("mdc-fab--extended").removeClass("mdc-fab--mini");
      //   $(this).find(".mdc-fab__label").removeClass("hidden");
      // });
      // $(".social-icons button").mouseleave(function () {
      //   $(this).addClass("mdc-fab--mini").removeClass("mdc-fab--extended");
      //   $(this).find(".mdc-fab__label").addClass("hidden");
      // });

      function handleTickInit(tick) {
        const counter = Tick.count.down("2021-02-28T12:00:00Z");
        console.log(counter);
        setTimeout((_) => {
          tick.value = counter.value;
          counter.onupdate = (value) => {
            tick.value = value;
          };
        }, 1000);
        counter.onended = (_) => {
          // Have to add code to make the counter hidden here
        };
        // data-value="[00,00,00,00]"
        // arrive(8, .01) -> round ->
      }

      $(".member-title").click(function (e) {
        $(this).next().slideToggle();
        $(this).next().next().next().slideToggle();
      });

      $(window).scroll(testScroll);
      var viewed = false;

      function isScrolledIntoView(elem) {
          var docViewTop = $(window).scrollTop();
          var docViewBottom = docViewTop + $(window).height();

          var elemTop = $(elem).offset().top;
          var elemBottom = elemTop + $(elem).height();

          return ((elemBottom <= docViewBottom) && (elemTop >= docViewTop));
      }

      function testScroll() {
        if (isScrolledIntoView($(".milestone-number")) && !viewed) {
            viewed = true;
            $('.number-holder').each(function () {
            $(this).prop('Counter',0).animate({
                Counter: $(this).text()
            }, {
                duration: 4000,
                easing: 'swing',
                step: function (now) {
                    $(this).text(Math.ceil(now));
                }
            });
          });
        }
      }
    </script>

    <a
      id="mlh-trust-badge"
      style="
        display: block;
        max-width: 90px;
        min-width: 60px;
        position: fixed;
        right: 25px;
        top: 0;
        width: 10%;
        z-index: 10000;
      "
      href="https://mlh.io/seasons/2021/events?utm_source=apac-hackathon&utm_medium=TrustBadge&utm_campaign=2021-season&utm_content=white"
      target="_blank"
      ><img
        src="https://s3.amazonaws.com/logged-assets/trust-badge/2021/mlh-trust-badge-2021-white.svg"
        alt="Major League Hacking 2021 Hackathon Season"
        style="width: 100%"
    /></a>
  </body>
</html>