videos.html

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Isherveer Bhullar | Videos</title>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500;600;700&family=Inter:wght@400;500;600&family=JetBrains+Mono:wght@400;500&display=swap" rel="stylesheet">
<link rel="stylesheet" href="style.css?v=2">
<script>try{if(localStorage.getItem('theme')!=='dark')document.documentElement.classList.add('light');}catch(e){}</script>
</head>
<body>

<div class="blob blob1"></div>
<div class="blob blob2"></div>
<div class="blob blob3"></div>
<div class="blob blob4"></div>
<div class="grain"></div>

<div class="topbar glass">
  <div class="brand">
    <div class="ring"><img src="profile.jpg" alt="Isherveer Bhullar" onerror="this.style.display='none'; this.nextElementSibling.style.display='flex';"><b style="display:none;">IB</b></div>
    <div>
      <div class="name">Isherveer Bhullar</div>
      <div class="rec"><span class="dot"></span>REC · PORTFOLIO</div>
    </div>
  </div>
  <div class="nav-pill" id="tabs">
    <a class="nav-btn" href="index.html">About</a>
    <a class="nav-btn" href="resume.html">Resume</a>
    <a class="nav-btn active" href="videos.html">Videos</a>
    <a class="nav-btn" href="projects.html">Projects</a>
    <a class="nav-btn" href="credentials.html">Credentials</a>
    <a class="nav-btn" href="contact.html">Contact</a>
  </div>
  <button class="icon-btn" id="themeToggle" onclick="toggleTheme()">🌙</button>
</div>

<div class="layout">
  <!-- SIDEBAR -->
  <aside class="sidebar glass">
    <div class="avatar-wrap"><div class="avatar"><img src="profile.jpg" alt="Isherveer Bhullar" onerror="this.style.display='none'; this.nextElementSibling.style.display='flex';"><b style="display:none;">IB</b></div></div>
    <h1>Isherveer Bhullar</h1>
    <span class="role-chip">CS STUDENT · DRONE PILOT · EDITOR</span>
    <div class="status"><span class="dot"></span> Open to summer internships</div>

    <div class="info"><div class="info-label">Email</div><div class="info-value">isherveer@gmail.com</div></div>
    <div class="info"><div class="info-label">Location</div><div class="info-value">Rotorua, Bay of Plenty, NZ</div></div>

    <hr class="sep">
    <div class="socials">
      <a class="social-btn" href="https://github.com/codemastervy" target="_blank" rel="noopener">GitHub</a>
      <a class="social-btn" href="https://www.linkedin.com/in/isherveer-bhullar-572016202/" target="_blank" rel="noopener">LinkedIn</a>
    </div>
    <a class="cta" href="mailto:isherveer@gmail.com">Get in touch →</a>
    <div class="clock" id="clock">--:--:--</div>
  </aside>

  <!-- MAIN -->
  <main>

    <section class="panel active" id="videos">
      <div class="card glass">
        <span class="eyebrow">✦ VIDEOS</span>
        <h2 class="headline">Video work I've shot<br>and edited.</h2>
        <p class="lede">A showcase of video work edited in DaVinci Resolve, including aerial footage from my drone.</p>
        <div class="video-note">Most of these videos were edited for Western Heights High School's social media page.</div>
        <div class="video-grid">
          <div class="v-card">
            <div class="v-embed"><iframe src="https://drive.google.com/file/d/1CqFLPRIFViOAjFqG1XEH747Y-wqvdzNe/preview" allow="autoplay; fullscreen" allowfullscreen></iframe></div>
            <div class="v-body"><div class="v-title">Mr Hodge Sports Video</div><div class="v-tool">Edited · DaVinci Resolve</div></div>
          </div>
          <div class="v-card">
            <div class="v-embed"><iframe src="https://drive.google.com/file/d/1RnRr5Dwz5xwCU9UcdI9dkIqqUaguKOnD/preview" allow="autoplay; fullscreen" allowfullscreen></iframe></div>
            <div class="v-body"><div class="v-title">Interhouse Gaming Competition</div><div class="v-tool">Edited · DaVinci Resolve</div></div>
          </div>
          <div class="v-card">
            <div class="v-embed"><iframe src="https://drive.google.com/file/d/1lJ2Y13Lf88zwf7dgt3Uk4Ab43bd3x23a/preview" allow="autoplay; fullscreen" allowfullscreen></iframe></div>
            <div class="v-body"><div class="v-title">Cultural Day (with Beppu)</div><div class="v-tool">Edited · DaVinci Resolve</div></div>
          </div>
          <div class="v-card">
            <div class="v-embed"><iframe src="https://drive.google.com/file/d/1aQN0mYBR1vd5sVYZGKFXckGzx58Z8UcY/preview" allow="autoplay; fullscreen" allowfullscreen></iframe></div>
            <div class="v-body"><div class="v-title">Ori Day 2 (v2)</div><div class="v-tool">Edited · DaVinci Resolve</div></div>
          </div>
          <div class="v-card">
            <div class="v-embed"><iframe src="https://drive.google.com/file/d/1WQuriHehqiLd8yHscv37yrT_dNWCtg9X/preview" allow="autoplay; fullscreen" allowfullscreen></iframe></div>
            <div class="v-body"><div class="v-title">2024 Spirit Day</div><div class="v-tool">Shot & edited · DaVinci Resolve</div></div>
          </div>
          <div class="v-card">
            <div class="v-embed"><iframe src="https://drive.google.com/file/d/1KSptBfLz0cE_-iu7ISlwVU9fVa-YvwqW/preview" allow="autoplay; fullscreen" allowfullscreen></iframe></div>
            <div class="v-body"><div class="v-title">WHHS Ori Day 1</div><div class="v-tool">Edited · DaVinci Resolve</div></div>
          </div>
          <div class="v-card">
            <div class="v-embed"><iframe src="https://drive.google.com/file/d/1e2LRwdVSXHwzomM4hdeTknyUqtFooLxX/preview" allow="autoplay; fullscreen" allowfullscreen></iframe></div>
            <div class="v-body"><div class="v-title">Heights Creative 2025 (v2)</div><div class="v-tool">Edited · DaVinci Resolve</div></div>
          </div>
          <div class="v-card">
            <div class="v-embed"><iframe src="https://drive.google.com/file/d/1y-py-PDHfMD8yGMbjJ-hqCkOu9go55ci/preview" allow="autoplay; fullscreen" allowfullscreen></iframe></div>
            <div class="v-body"><div class="v-title">Battle Of The Pans</div><div class="v-tool">Edited · DaVinci Resolve</div></div>
          </div>
          <div class="v-card">
            <div class="v-embed"><iframe src="https://drive.google.com/file/d/1i_DoiokrgVjx7VQbUiFoKHhHRow4ZZGG/preview" allow="autoplay; fullscreen" allowfullscreen></iframe></div>
            <div class="v-body"><div class="v-title">Te Wiki O Te Reo</div><div class="v-tool">Edited · DaVinci Resolve</div></div>
          </div>
          <div class="v-card">
            <div class="v-embed"><iframe src="https://drive.google.com/file/d/1WQZvkL_95AJ31MsRSFiRkn_XSRGkEa4x/preview" allow="autoplay; fullscreen" allowfullscreen></iframe></div>
            <div class="v-body"><div class="v-title">2025 Spirit Day</div><div class="v-tool">Edited · DaVinci Resolve</div></div>
          </div>
          <div class="v-card">
            <div class="v-embed"><iframe src="https://drive.google.com/file/d/1nnheIObH0a2Xh2bE5WBW7HGmFx50lrgg/preview" allow="autoplay; fullscreen" allowfullscreen></iframe></div>
            <div class="v-body"><div class="v-title">WHHS Cultural Day Performance (v3)</div><div class="v-tool">Edited · DaVinci Resolve</div></div>
          </div>
        </div>
      </div>
    </section>

  </main>
</div>

<footer>
  <div>
    <div class="fname">Isherveer Bhullar</div>
    <div>Computer science student, drone pilot, and video editor.</div>
    <div class="fnote">ROTORUA, NZ · OPEN TO SUMMER INTERNSHIPS</div>
  </div>
  <div style="display:flex; gap:50px; flex-wrap:wrap;">
    <div style="display:flex; flex-direction:column; gap:8px;">
      <a href="index.html">About</a>
      <a href="resume.html">Resume</a>
      <a href="videos.html">Videos</a>
    </div>
    <div style="display:flex; flex-direction:column; gap:8px;">
      <a href="projects.html">Projects</a>
      <a href="credentials.html">Credentials</a>
      <a href="contact.html">Contact</a>
    </div>
  </div>
</footer>

<script src="script.js?v=2"></script>
</body>
</html>