Spaces:

R-Kentaren
/

AudioEditingWeb

Running

App Files Files Community

R-Kentaren commited on Jun 13, 2025

Commit

dcdfae3

verified ·

1 Parent(s): 1699200

Update index.html

Browse files

Files changed (1) hide show

index.html +155 -761

index.html CHANGED Viewed

@@ -1,774 +1,168 @@
 <!DOCTYPE html>
 <html lang="en">
 <head>
-    <meta charset="utf-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
-    <title>Zero-Shot Unsupervised and Text-Based Audio Editing Using DDPM Inversion</title>
-    <link rel="shortcut icon" type="image/x-icon" href="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/favicon.ico">
-    <meta property="og:image" content="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/teaser.png"/>
-    <meta property="og:title" content="Zero-Shot Unsupervised and Text-Based Audio Editing Using DDPM Inversion" />
-    <meta property="og:description" content="Zero-Shot Unsupervised and Text-Based Audio Editing Using DDPM Inversion" />
-    <!-- Fonts -->
-    <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=Poppins:wght@400;500;600;700;800&display=swap" rel="stylesheet">
-    <!-- Bootstrap CSS -->
-    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous">
-    <!-- Tailwind CSS -->
-    <script src="https://cdn.tailwindcss.com"></script>
-    <!-- Academicons and Font Awesome -->
-    <link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/jpswalsh/academicons@1/css/academicons.min.css">
-    <script src="https://kit.fontawesome.com/ad96f96272.js" crossorigin="anonymous"></script>
-    <!-- jQuery -->
-    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.1/jquery.min.js"></script>
-    <!-- Custom JavaScript -->
-    <script type="text/javascript" src="functionality.js"></script>
-    <style>
-        body {
-            @apply bg-gray-900 text-gray-100 font-poppins;
-        }
-        .navbar {
-            @apply bg-gradient-to-r from-blue-600 to-blue-800 shadow-lg;
-        }
-        .btn-outline-primary {
-            @apply border-blue-500 text-blue-500 hover:bg-blue-500 hover:text-white transition-colors duration-300;
-        }
-        .btn-back-to-top {
-            @apply fixed bottom-8 right-8 bg-red-600 text-white rounded-full p-4 shadow-lg hover:bg-red-700 transition-colors duration-300;
-        }
-        .table {
-            @apply bg-gray-800 text-gray-100 border-gray-700;
-        }
-        .table th, .table td {
-            @apply border-gray-700;
-        }
-        .table thead th {
-            @apply bg-gray-700 text-gray-200;
-        }
-        .audio-player {
-            @apply w-full max-w-[200px] sm:max-w-[250px] md:max-w-[300px];
-        }
-        .shortaudio, .shorteraudio {
-            @apply audio-player;
-        }
-        .section {
-            @apply mb-8;
-        }
-        .anchor {
-            @apply mt-12 mb-6;
-        }
-        .poppins-regular {
-            @apply font-normal;
-        }
-        .poppins-medium {
-            @apply font-medium;
-        }
-        @media (max-width: 768px) {
-            h1 {
-                @apply text-2xl;
-            }
-            h2 {
-                @apply text-xl;
-            }
-            h3 {
-                @apply text-lg;
-            }
-            .table-responsive {
-                @apply overflow-x-auto;
-            }
-            .btn-lg {
-                @apply text-sm px-3 py-1;
-            }
-            .audio-player {
-                @apply max-w-[150px];
-            }
-            .navbar-brand {
-                @apply text-lg;
-            }
-        }
-    </style>
 </head>
 <body>
-    <!-- Bootstrap JS -->
-    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz" crossorigin="anonymous"></script>
-    <!-- Navigation Bar -->
-    <nav id="navbar_top" class="navbar sticky-top navbar-expand-lg navbar-dark">
-        <div class="container">
-            <a class="navbar-brand poppins-medium" href="#">Zero-Shot Unsupervised and Text-Based Audio Editing</a>
-            <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#main_nav" aria-controls="main_nav" aria-expanded="false" aria-label="Toggle navigation">
-                <span class="navbar-toggler-icon"></span>
-            </button>
-            <div class="collapse navbar-collapse" id="main_nav">
-                <ul class="navbar-nav ms-auto">
-                    <li class="nav-item"><a class="nav-link" href="#supsamples">Text-based Editing</a></li>
-                    <li class="nav-item"><a class="nav-link" href="#unsupsamples">Unsup. Editing</a></li>
-                    <li class="nav-item"><a class="nav-link" href="#supcomparisons">Text-Based Editing Comp.</a></li>
-                    <li class="nav-item"><a class="nav-link" href="#unsupcomparisons">Unsup. Editing Comp.</a></li>
-                </ul>
-            </div>
-        </div>
-    </nav>
-    <div class="container-xl px-4 sm:px-6 lg:px-8">
-        <!-- Back to Top Button -->
-        <button type="button" class="btn btn-danger btn-floating btn-lg hidden" id="btn-back-to-top">
-            <i class="fas fa-arrow-up"></i>
-        </button>
-        <!-- Header Section -->
-        <div class="text-center py-8">
-            <h1 class="poppins-medium text-3xl md:text-4xl lg:text-5xl mb-4">Zero-Shot Unsupervised and Text-Based Audio Editing Using DDPM Inversion</h1>
-            <h4 class="poppins-regular text-xl md:text-2xl">ICML 2024</h4>
-            <div class="flex flex-wrap justify-center gap-4 mt-4">
-                <a href="https://www.linkedin.com/in/hilamanor/" target="_blank" rel="noopener noreferrer" class="text-2xl hover:text-blue-400 transition-colors">Hila Manor</a>
-                <a href="https://tomer.net.technion.ac.il/" target="_blank" rel="noopener noreferrer" class="text-2xl hover:text-blue-400 transition-colors">Tomer Michaeli</a>
-            </div>
-            <p class="text-center text-lg md:text-xl mt-2">Technion - Israel Institute of Technology</p>
-            <div class="flex flex-wrap justify-center gap-4 mt-6">
-                <a class="btn btn-lg btn-outline-primary" href="https://arxiv.org/abs/2402.10009" target="_blank" rel="noopener noreferrer">
-                    <i class="ai ai-arxiv" aria-hidden="true"></i> ArXiv
-                </a>
-                <a class="btn btn-lg btn-outline-primary" href="https://github.com/HilaManor/AudioEditingCode/" target="_blank" rel="noopener noreferrer">
-                    <i class="fa fa-github" aria-hidden="true"></i> Code
-                </a>
-                <a class="btn btn-lg btn-outline-primary" href="https://youtu.be/lBnldOQVbS4" target="_blank" rel="noopener noreferrer">
-                    <i class="fa fa-youtube" aria-hidden="true"></i> Presentation
-                </a>
-                <a class="btn btn-lg btn-outline-primary" href="https://huggingface.co/spaces/hilamanor/audioEditing/" target="_blank" rel="noopener noreferrer">
-                    🤗 Text-Based Space
-                </a>
-            </div>
-        </div>
-        <!-- Abstract and Teaser Image -->
-        <div class="text-center py-8">
-            <img alt="Teaser" id="teaser" src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/teaser.png" class="max-w-full w-full md:w-3/4 lg:w-2/3 mx-auto rounded-lg shadow-lg"/>
-            <h1 class="poppins-regular text-2xl md:text-3xl mt-6">Abstract</h1>
-            <p class="text-base md:text-lg leading-relaxed mt-4">
-                Editing signals using large pre-trained models, in a zero-shot manner, has recently seen rapid advancements in the image domain. However, this wave has yet to reach the audio domain.
-                In this paper, we explore two zero-shot editing techniques for audio signals, which use DDPM inversion on pre-trained diffusion models. The first, adopted from the image domain, allows text-based editing.
-                The second, is a novel approach for discovering semantically meaningful editing directions without supervision.
-                When applied to music signals, this method exposes a range of musically interesting modifications, from controlling the participation of specific instruments to improvisations on the melody.
-            </p>
-        </div>
-        <hr class="border-gray-700 my-8">
-        <!-- Video Overview -->
-        <div class="text-center py-8">
-            <h1 class="poppins-regular text-2xl md:text-3xl">Video Overview</h1>
-            <p class="text-base md:text-lg mt-2">For people in a hurry. Images were generated by <a href="https://openai.com/dall-e-2" class="text-blue-400 hover:underline">DALL-E 2</a> and <a href="https://www.bing.com/copilot" class="text-blue-400 hover:underline">Copilot</a>.</p>
-            <video controls class="w-full max-w-[400px] mx-auto rounded-lg shadow-lg mt-4">
-                <source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/overview.mp4" type="video/mp4">
-                Your browser does not support the video tag.
-            </video>
-        </div>
-        <hr class="border-gray-700 my-8">
-        <!-- Samples of Editing -->
-        <div class="text-center py-8">
-            <h1 class="poppins-regular text-2xl md:text-3xl">1. Samples of Editing</h1>
-            <p class="text-base md:text-lg mt-2">We present samples of audio editing using our proposed methods. The samples are organized into two sections: text-based editing and unsupervised editing.</p>
-            <!-- Text-Based Editing -->
-            <h2 id="supsamples" class="anchor poppins-regular text-xl md:text-2xl flex items-center justify-center">
-                <button type="button" id="variousSupSamplesBtn" onclick="toggleCollapseArrow('variousSupSamplesBtn')" class="btn btn-light mr-2" data-bs-toggle="collapse" data-bs-target="#variousSupSamples" aria-expanded="true" aria-controls="variousSupSamples"><i class="fas fa-chevron-down"></i></button>
-                1.1. Samples of Text-Based Editing
-            </h2>
-            <div class="container show" id="variousSupSamples">
-                <div class="table-responsive">
-                    <table class="table table-sm">
-                        <thead>
-                            <tr class="text-center">
-                                <th scope="col">#</th>
-                                <th scope="col">Source Prompt</th>
-                                <th scope="col">Target Prompt</th>
-                                <th scope="col">Original Audio</th>
-                                <th scope="col">Edited Audio</th>
-                                <th scope="col">Edit T<sub>start</sub></th>
-                            </tr>
-                        </thead>
-                        <tbody>
-                            <tr>
-                                <th scope="row">1</th>
-                                <td>A recording of a <b>sneaky jazz</b> song.</td>
-                                <td>A recording of a <b>tense classical</b> music score.</td>
-                                <td><audio preload="auto" controls class="audio-player"><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/orig/MDDBFreeJazz.mp3" type="audio/mp4"></audio></td>
-                                <td><audio preload="auto" controls class="audio-player"><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/sup_samples/orchestra_MDDBFreeJazz_ours_90.mp3" type="audio/mp4"></audio></td>
-                                <td class="text-center align-middle">110</td>
-                            </tr>
-                            <tr>
-                                <th scope="row">2</th>
-                                <td>A recording of a <b>hard rock</b> song.</td>
-                                <td>A recording of a <b>jazz</b> song.</td>
-                                <td><audio preload="auto" controls class="audio-player"><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/orig/MDDBZeppelin.mp3" type="audio/mp4"></audio></td>
-                                <td><audio preload="auto" controls class="audio-player"><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/sup_samples/jazz_MDDBZeppelin_ours_100.mp3" type="audio/mp4"></audio></td>
-                                <td class="text-center align-middle">100</td>
-                            </tr>
-                            <tr>
-                                <th scope="row">3</th>
-                                <td>A recording of a happy upbeat <b>classical music piece</b>.</td>
-                                <td>A recording of a happy upbeat <b>arcade game soundtrack</b>.</td>
-                                <td><audio preload="auto" controls class="audio-player"><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/orig/MDDBVivaldi.mp3" type="audio/mp4"></audio></td>
-                                <td><audio preload="auto" controls class="audio-player"><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/sup_samples/arcade_MDDBVivaldi_ours_100.mp3" type="audio/mp4"></audio></td>
-                                <td class="text-center align-middle">100</td>
-                            </tr>
-                            <tr>
-                                <th scope="row">4</th>
-                                <td><b>Trumpets</b> playing alongside a piano, bass and drums in an upbeat old-timey cool <b>jazz</b> song.</td>
-                                <td><b>A banjo</b> playing alongside a piano, bass and drums in an upbeat old-timey cool <b>country</b> song.</td>
-                                <td><audio preload="auto" controls class="audio-player"><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/orig/MDDBModalJazz.mp3" type="audio/mp4"></audio></td>
-                                <td><audio preload="auto" controls class="audio-player"><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/sup_samples/country_MDDBModalJazz_ours_110.mp3" type="audio/mp4"></audio></td>
-                                <td class="text-center align-middle">90</td>
-                            </tr>
-                            <tr>
-                                <th scope="row">5</th>
-                                <td class="text-center align-middle">——</td>
-                                <td>A recording of a dark techno song.</td>
-                                <td><audio preload="auto" controls class="audio-player"><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/orig/MDDBBeethoven.mp3" type="audio/mp4"></audio></td>
-                                <td><audio preload="auto" controls class="audio-player"><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/sup_samples/techno_MDDBBeethoven_ours_110.mp3" type="audio/mp4"></audio></td>
-                                <td class="text-center align-middle">90</td>
-                            </tr>
-                            <tr class="text-center align-middle">
-                                <td colspan="6">
-                                    <button class="btn btn-outline-secondary" type="button" id="supExamplesHearMore1Btn" onclick="hearMore('supExamplesHearMore1Btn', 6, 13)">
-                                        <i class="fa fa-plus-square-o" aria-hidden="true"></i> I want to hear more!
-                                    </button>
-                                </td>
-                            </tr>
-                            <tr hidden>
-                                <th scope="row">6</th>
-                                <td>A recording of a dramatic <b>epic Chinese</b> piece.</td>
-                                <td>A recording of a dramatic <b>heavy metal</b> piece.</td>
-                                <td><audio preload="auto" controls class="audio-player"><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/orig/MDDBChineseDrama.mp3" type="audio/mp4"></audio></td>
-                                <td><audio preload="auto" controls class="audio-player"><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/sup_samples/metal_MDDBChineseDrama_ours_160.mp3" type="audio/mp4"></audio></td>
-                                <td class="text-center align-middle">40</td>
-                            </tr>
-                            <tr hidden>
-                                <th scope="row">7</th>
-                                <td>A recording of <b>a rock song</b>.</td>
-                                <td>A recording of <b>Arabic music</b>.</td>
-                                <td><audio preload="auto" controls class="audio-player"><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/orig/MDDBBritpop.mp3" type="audio/mp4"></audio></td>
-                                <td><audio preload="auto" controls class="audio-player"><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/sup_samples/arabic_MDDBBritpop_ours_90.mp3" type="audio/mp4"></audio></td>
-                                <td class="text-center align-middle">110</td>
-                            </tr>
-                            <tr hidden>
-                                <th scope="row">8</th>
-                                <td class="text-center align-middle">——</td>
-                                <td>A recording of a funky hip hop song.</td>
-                                <td><audio preload="auto" controls class="audio-player"><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/orig/MDDBFunkJazz.mp3" type="audio/mp4"></audio></td>
-                                <td><audio preload="auto" controls class="audio-player"><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/sup_samples/hiphop_MDDBFunkJazz_ours_90.mp3" type="audio/mp4"></audio></td>
-                                <td class="text-center align-middle">110</td>
-                            </tr>
-                            <tr hidden>
-                                <th scope="row">9</th>
-                                <td>A high quality recording of <b>wind instruments and strings</b> playing.</td>
-                                <td>A high quality recording of <b>a piano</b> playing.</td>
-                                <td><audio preload="auto" controls class="audio-player"><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/orig/MDDBBeethoven.mp3" type="audio/mp4"></audio></td>
-                                <td><audio preload="auto" controls class="audio-player"><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/sup_samples/instrument_MDDBBeethoven_ours_130.mp3" type="audio/mp4"></audio></td>
-                                <td class="text-center align-middle">70</td>
-                            </tr>
-                            <tr hidden>
-                                <th scope="row">10</th>
-                                <td>A recording of an upbeat <b>gospel</b> song.</td>
-                                <td>A recording of an upbeat <b>techno</b> song.</td>
-                                <td><audio preload="auto" controls class="audio-player"><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/orig/MDDBGospel.mp3" type="audio/mp4"></audio></td>
-                                <td><audio preload="auto" controls class="audio-player"><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/sup_samples/techno_MDDBGospel_ours_100.mp3" type="audio/mp4"></audio></td>
-                                <td class="text-center align-middle">100</td>
-                            </tr>
-                            <tr hidden>
-                                <th scope="row">11</th>
-                                <td>A recording of a happy upbeat song in a <b>Latin jazz</b> style.</td>
-                                <td>A recording of a happy upbeat song in a <b>retro arcade game soundtrack</b> style.</td>
-                                <td><audio preload="auto" controls class="audio-player"><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/orig/MDDBLatinJazz.mp3" type="audio/mp4"></audio></td>
-                                <td><audio preload="auto" controls class="audio-player"><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/sup_samples/arcade_MDDBLatinJazz_ours_110.mp3" type="audio/mp4"></audio></td>
-                                <td class="text-center align-middle">90</td>
-                            </tr>
-                            <tr hidden>
-                                <th scope="row">12</th>
-                                <td class="text-center align-middle">——</td>
-                                <td>A recording of an upbeat cool jazz song.</td>
-                                <td><audio preload="auto" controls class="audio-player"><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/orig/MDDBPunk.mp3" type="audio/mp4"></audio></td>
-                                <td><audio preload="auto" controls class="audio-player"><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/sup_samples/jazz_MDDBPunk_ours_110.mp3" type="audio/mp4"></audio></td>
-                                <td class="text-center align-middle">90</td>
-                            </tr>
-                            <tr class="text-center align-middle" hidden>
-                                <td colspan="6">
-                                    <button class="btn btn-outline-secondary" type="button" id="supExamplesHearMore2Btn" onclick="hearMore('supExamplesHearMore2Btn', 14, 19)">
-                                        <i class="fa fa-plus-square-o" aria-hidden="true"></i> I want to hear even more!
-                                    </button>
-                                </td>
-                            </tr>
-                            <tr hidden>
-                                <th scope="row">13</th>
-                                <td>A recording of an <b>old rock</b> song.</td>
-                                <td>A recording of an <b>techno</b> song.</td>
-                                <td><audio preload="auto" controls class="audio-player"><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/orig/MDDBRockabilly.mp3" type="audio/mp4"></audio></td>
-                                <td><audio preload="auto" controls class="audio-player"><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/sup_samples/techno_MDDBRockabilly_ours_110.mp3" type="audio/mp4"></audio></td>
-                                <td class="text-center align-middle">90</td>
-                            </tr>
-                            <tr hidden>
-                                <th scope="row">14</th>
-                                <td>Chinese strings, flutes, and harps playing an <b>upbeat</b> piece.</td>
-                                <td>Chinese strings, flutes, and harps playing an <b>somber</b> piece.</td>
-                                <td><audio preload="auto" controls class="audio-player"><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/orig/MDDBChineseChaoZhou.mp3" type="audio/mp4"></audio></td>
-                                <td><audio preload="auto" controls class="audio-player"><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/sup_samples/tone_MDDBChineseChaoZhou_ours_120.mp3" type="audio/mp4"></audio></td>
-                                <td class="text-center align-middle">80</td>
-                            </tr>
-                            <tr hidden>
-                                <th scope="row">15</th>
-                                <td class="text-center align-middle">——</td>
-                                <td>A recording of an upbeat arcade game soundtrack.</td>
-                                <td><audio preload="auto" controls class="audio-player"><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/orig/MDDBBebopJazz.mp3" type="audio/mp4"></audio></td>
-                                <td><audio preload="auto" controls class="audio-player"><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/sup_samples/arcade_MDDBBebopJazz_ours_120.mp3" type="audio/mp4"></audio></td>
-                                <td class="text-center align-middle">80</td>
-                            </tr>
-                            <tr hidden>
-                                <th scope="row">16</th>
-                                <td>A high quality recording of a <b>cat meowing</b>.</td>
-                                <td>A high quality recording of a <b>dog barking</b>.</td>
-                                <td><audio controls class="audio-player"><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/orig/CuteCat_10sec.mp3" type="audio/mp4"></audio></td>
-                                <td><audio controls class="audio-player"><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/sup_samples/CuteCat_10sec_ours_50.mp3" type="audio/mp4"></audio></td>
-                                <td class="text-center">150</td>
-                            </tr>
-                            <tr hidden>
-                                <th scope="row">17</th>
-                                <td>A high quality recording of a <b>dog barking</b> a lot.</td>
-                                <td>A high quality recording of a <b>gun shooting</b> a lot.</td>
-                                <td><audio controls class="audio-player"><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/orig/DogBarking_10sec.mp3" type="audio/mp4"></audio></td>
-                                <td><audio controls class="audio-player"><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/sup_samples/DogBarking_10sec_ours_100.mp3" type="audio/mp4"></audio></td>
-                                <td class="text-center">100</td>
-                            </tr>
-                            <tr hidden>
-                                <th scope="row">18</th>
-                                <td>A <b>kid talking loudly</b>.</td>
-                                <td>A <b>rooster crowing</b>.</td>
-                                <td><audio controls class="audio-player"><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/orig/Shouting.mp3" type="audio/mp4"></audio></td>
-                                <td><audio controls class="audio-player"><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/sup_samples/Shouting_ours_90.mp3" type="audio/mp4"></audio></td>
-                                <td class="text-center">110</td>
-                            </tr>
-                        </tbody>
-                    </table>
-                </div>
-                <div class="mt-6">
-                    <div class="flex justify-center">
-                        <button class="btn btn-lg btn-warning" type="button" data-bs-toggle="collapse" data-bs-target="#huggingface_demo" aria-expanded="false" aria-controls="huggingface_demo">🤗 Space Demo</button>
-                    </div>
-                    <div id="huggingface_demo" class="collapse mt-4">
-                        <div class="card-body">
-                            <iframe src="https://hilamanor-audioediting.hf.space" frameborder="0" class="w-full h-[600px] rounded-lg shadow-lg"></iframe>
-                        </div>
-                    </div>
-                </div>
-            </div>
-            <!-- Unsupervised Editing -->
-            <h2 id="unsupsamples" class="anchor poppins-regular text-xl md:text-2xl">1.2. Samples of Unsupervised Editing</h2>
-            <p class="text-base md:text-lg mt-2">For the unsupervised editing, we split the samples into two sections.<br>The first section (Strength changes) shows how the same direction applied with different strengths changes the audio sequentially.<br>The second section (PC direction changes) shows how removing or adding a direction removes or adds a concept.</p>
-            <h3 class="poppins-regular text-lg md:text-xl flex items-center justify-center">
-                <button type="button" id="variousUnsupSamplesStrengthBtn" onclick="toggleCollapseArrow('variousUnsupSamplesStrengthBtn')" class="btn btn-light mr-2" data-bs-toggle="collapse" data-bs-target="#variousUnsupSamplesStrength" aria-expanded="true" aria-controls="variousUnsupSamplesStrength"><i class="fas fa-chevron-down"></i></button>
-                1.2.1. Various Samples (Strength changes)
-            </h3>
-            <div class="container show" id="variousUnsupSamplesStrength">
-                <div class="table-responsive">
-                    <table class="table table-sm">
-                        <thead>
-                            <tr class="text-center">
-                                <th scope="col">#</th>
-                                <th scope="col">Inversion Prompt</th>
-                                <th scope="col">Original Audio</th>
-                                <th scope="col">Edited Audio +PC</th>
-                                <th scope="col">Edited Audio +2PC</th>
-                                <th scope="col">PC Interpretation</th>
-                                <th scope="col">Edit Parameters</th>
-                            </tr>
-                        </thead>
-                        <tbody>
-                            <tr>
-                                <th scope="row">1</th>
-                                <td>A high quality recording of flutes and a trumpet playing.</td>
-                                <td><audio class="shortaudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/orig/MDDBLatinJazz_8secs.mp3" type="audio/mp4"></audio></td>
-                                <td><audio class="shortaudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/unsup_samples/MDDBLatinJazz_ours_200--1_spts80_pcs_a-1.mp3" type="audio/mp4"></audio></td>
-                                <td><audio class="shortaudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/unsup_samples/MDDBLatinJazz_ours_200--1_spts80_pcs_a-2.mp3" type="audio/mp4"></audio></td>
-                                <td>Melody change</td>
-                                <td class="text-center">t'∈[200, -1]<br>Specific t=80 used<br>PCs 1+2+3</td>
-                            </tr>
-                            <tr>
-                                <th scope="row">2</th>
-                                <td>A recording of a calm country song.</td>
-                                <td><audio class="shortaudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/orig/MDDBCountry1_8secs.mp3" type="audio/mp4"></audio></td>
-                                <td><audio class="shortaudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/unsup_samples/MDDBCountry1_ours_150--1_spts115_pcs_a1.mp3" type="audio/mp4"></audio></td>
-                                <td><audio class="shortaudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/unsup_samples/MDDBCountry1_ours_150--1_spts115_pcs_a2.mp3" type="audio/mp4"></audio></td>
-                                <td>Remove singer</td>
-                                <td class="text-center">t'∈[150, -1]<br>Specific t=115 used<br>PCs 1+2+3</td>
-                            </tr>
-                            <tr>
-                                <th scope="row">3</th>
-                                <td class="text-center">—</td>
-                                <td><audio class="shortaudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/orig/MDDBReggae_8secs.mp3" type="audio/mp4"></audio></td>
-                                <td><audio class="shortaudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/unsup_samples/MDDBReggae_ours_150--1_spts80_pcs_a-1.mp3" type="audio/mp4"></audio></td>
-                                <td><audio class="shortaudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/unsup_samples/MDDBReggae_ours_150--1_spts80_pcs_a-2.mp3" type="audio/mp4"></audio></td>
-                                <td>Just drums</td>
-                                <td class="text-center">t'∈[150, -1]<br>Specific t=80 used<br>PCs 1+2+3</td>
-                            </tr>
-                            <tr>
-                                <th scope="row">4</th>
-                                <td>A recording of a scary classical music piece.</td>
-                                <td><audio class="shortaudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/orig/MDDBInTheHalloftheMountainKing.mp3" type="audio/mp4"></audio></td>
-                                <td><audio class="shortaudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/unsup_samples/MDDBInTheHalloftheMountainKing_ours_150-50_spts95_pcs_a1.mp3" type="audio/mp4"></audio></td>
-                                <td><audio class="shortaudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/unsup_samples/MDDBInTheHalloftheMountainKing_ours_150-50_spts95_pcs_a2.mp3" type="audio/mp4"></audio></td>
-                                <td>Melody change</td>
-                                <td class="text-center">t'∈[150, 50]<br>Specific t=95 used<br>PCs 1+2+3</td>
-                            </tr>
-                            <tr>
-                                <th scope="row">5</th>
-                                <td>A trumpet and a saxophone playing a cool jazz melody, with an accompaniment of a piano, bass and drums.</td>
-                                <td><audio class="shortaudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/orig/MDDBCoolJazz.mp3" type="audio/mp4"></audio></td>
-                                <td><audio class="shortaudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/unsup_samples/MDDBCoolJazz_ours_135-95_pcs_a20.mp3" type="audio/mp4"></audio></td>
-                                <td><audio class="shortaudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/unsup_samples/MDDBCoolJazz_ours_135-95_pcs_a40.mp3" type="audio/mp4"></audio></td>
-                                <td>Melody change</td>
-                                <td class="text-center">t'∈[135, 95]<br>PCs 1+2+3</td>
-                            </tr>
-                            <tr class="text-center align-middle">
-                                <td colspan="7">
-                                    <button class="btn btn-outline-secondary" type="button" id="unsupExamplesStrengthHearMoreBtn" onclick="hearMore('unsupExamplesStrengthHearMoreBtn', 6, 10)">
-                                        <i class="fa fa-plus-square-o" aria-hidden="true"></i> I want to hear more!
-                                    </button>
-                                </td>
-                            </tr>
-                            <tr hidden>
-                                <th scope="row">6</th>
-                                <td>A high quality recording of wind instruments and strings playing.</td>
-                                <td><audio class="shortaudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/orig/MDDBBeethoven.mp3" type="audio/mp4"></audio></td>
-                                <td><audio class="shortaudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/unsup_samples/MDDBBeethoven_ours_135-95_pcs_a-20.mp3" type="audio/mp4"></audio></td>
-                                <td><audio class="shortaudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/unsup_samples/MDDBBeethoven_ours_135-95_pcs_a-40.mp3" type="audio/mp4"></audio></td>
-                                <td>Melody change</td>
-                                <td class="text-center">t'∈[135, 95]<br>PCs 1+2+3</td>
-                            </tr>
-                            <tr hidden>
-                                <th scope="row">7</th>
-                                <td>A strings section playing classical music.</td>
-                                <td><audio class="shortaudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/orig/MDDBVivaldi.mp3" type="audio/mp4"></audio></td>
-                                <td><audio class="shortaudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/unsup_samples/MDDBVivaldi_ours_95-80_pcs_a-20.mp3" type="audio/mp4"></audio></td>
-                                <td><audio class="shortaudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/unsup_samples/MDDBVivaldi_ours_95-80_pcs_a-40.mp3" type="audio/mp4"></audio></td>
-                                <td>Minor melody changes</td>
-                                <td class="text-center">t'∈[95, 80]<br>PCs 1</td>
-                            </tr>
-                            <tr hidden>
-                                <th scope="row">8</th>
-                                <td>A high quality recording of a woman singing while a guitar and drums play in the background.</td>
-                                <td><audio class="shortaudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/orig/MDDBRockabilly_8secs.mp3" type="audio/mp4"></audio></td>
-                                </td><td><audio class="shortaudio" controls src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/unsup_samples/MDDBRockabilly_ours_200--1_spts65_pcs_a-1.mp3"></td>
-<td><audio class="shortaudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/unsup_samples/MDDBRockabilly_ours_200--1_spts65_pcs_a-2.mp3"></audio></td>
-<td>Instrument change</td>
-<td>t'∈[200, -1]<br>Specific t=65 used<br>PCs 1</td>
-</tr>
-<tr hidden>
-<th scope="row">9</th>
-<td>A high quality recording of wind instruments and strings playing.</td>
-<td><audio class="shortaudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/orig/MDDBBeethoven.mp3"></audio></td>
-<td><audio class="shortaudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/unsup_samples/MDDBBeethoven_ours_200--1_spts135_pc3_a1.mp3"></audio></td>
-<td><audio class="shortaudio" controls><source src="/driver://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/unsup_samples/MDBBeethoven_ours_200--1_spts135_pc3_a2.mp3"></audio></td>
-<td>Melody changes</td>
-<td>t'∈[200, -1]<br>Specific t=135 used<br>PC #3</td>
-</tr>
-<tr hidden>
-<th scope="row">10</th>
-<td>A high quality recording of a rock band playing an upbeat rock song.</td>
-<td><audio class="shortaudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/orig/MDDBritpop_8secs.mp3"></audio></td>
-<td><audio class="shortaudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/unsup_samples/MDDBritpop_ours_200--1_spts95_pcs_a1.mp3"></audio></td>
-<td><audio class="shortaudio" controls><source src="https://github.com/hilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/unsup_samples/MDDBritpop_ours_200--1_spts95_pcs_a2.mp3"></td>
-<td>Drums style change</td>
-<td>t'∈[200, -1]<br>Specific t=95 used<br>PCs 1+3</td>
-</tbody>
-</table>
-</div>
-</div>
-<h3 id="unsup-singlepc" class="anchor poppins-regular">1.2. Various Samples (PC direction changes)</h3>
-<div class="container">
-<div class="table-responsive">
-<table class="table">
-<thead>
-<tr class="text-center">
-<th scope="col">#</th>
-<th>Inversion Prompt</th>
-<th scope="col">Edited Audio -γPC</th>
-<th scope="col">Original Audio</th>
-<th scope="col">Edited Audio +γPC</th>
-<th scope="col">PC Interpretation</th>
-<th scope="col">Edit Parameters</th>
-</tr>
-</thead>
-<tbody>
-<tr>
-<th scope="row">1</th>
-<td>A high quality recording of a man singing and drums, guitar and bass playing a song, and later a woman singing.</td>
-<td><audio class="shortaudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/unsup_samples/MDBDBeatles_ours_115-80_pc1_a-40.mp3"></audio></td>
-<td><audio class="shortaudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/orig/MDDBBeatles.mp3"></audio></td>
-<td><audio class="shortaudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/unsup_samples/MDDBBeatles_ours_115-80_pc1_a40.mp3"></audio></td>
-<td>Lead Guitar/Singer emphasis</td>
-<td>t'∈[115, 80]<br>PC #1</td>
-</tr>
-<tr>
-<th scope="row">2</th>
-<td>A high quality recording of a man singing and drums, guitar and bass playing a song, and later a woman singing.</td>
-<td><audio class="shortaudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/unsup_samples/MDDBBeatles_ours_115-80_pc2_a-40.mp3"></audio></td>
-<td><audio class="shortaudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/orig/MDDDBBeatles.mp3"></audio></td>
-<td><audio class="shortaudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/unsup_samples/MDDBBeatles_ours_115-80_pc2_a40.mp3"></audio></td>
-<td>Singers/Drums emphasis</td>
-<td>t'∈[115, 80]<br>PC #2</td>
-</tr>
-<tr>
-<th scope="row">3</th>
-<td>A high quality recording of a man singing with a rock band accompaniment.</td>
-<td><audio class="shortaudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/unsup_samples/MDDBHendrix_ours_200--1_spts80_pc1_a-2.mp3"></audio></td>
-<td><audio class="shortaudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/orig/MDDBHendrix_8secs.mp3"></audio></td>
-<td><audio class="shortaudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/unsup_samples/MDDBHendrix_ours_200--1_spts80_pc1_a2.mp3"></audio></td>
-<td>Drum-beats style</td>
-<td>t'∈[200, -1]<br>Specific t=80 used<br>PC #1</td>
-</tr>
-<tr class="text-center align-middle">
-<td colspan="7">
-<button class="btn btn-outline-secondary" type="button" id="unsupExamplesDirectionHearMoreBtn" onclick="hearMore('unsupExamplesDirectionHearMoreBtn', 4, 6)">
-<i class="fa fa-plus-square-o" aria-hidden="true"></i> I want to hear more!
-</button>
-</td>
-</tr>
-<tr hidden>
-<th scope="row">4</th>
-<td>A recording of rhythmic clapping, a woman singing, and drums and guitar playing.</td>
-<td><audio class="shortaudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/unsup_samples/MDDBGospel_ours_150--1_spts120_pc3_a-2.mp3"></audio></td>
-<td><audio class="shortaudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/orig/MDDBGospel_8secs.mp3"></audio></td>
-<td><audio class="shortaudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/unsup_samples/MDDBGospel_ours_150--1_spts120_pc3_a2.mp3"></audio></td>
-<td>Vibrato strength</td>
-<td>t'∈[150, -1]<br>Specific t=120 used<br>PC #3</td>
-</tr>
-<tr hidden>
-<th scope="row">5</th>
-<td>A recording of an old timey rock song from the sixties.</td>
-<td><audio class="shortaudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/unsup_samples/MDDBRock_ours_200--1_spts65_pcs_a-2.mp3"></audio></td>
-<td><audio class="shortaudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/orig/MDDBRock_8secs.mp3"></audio></td>
-<td><audio class="shortaudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/unsup_samples/MDDBRock_ours_200--1_spts65_pcs_a2.mp3"></audio></td>
-<td>Guitar/Singer emphasis</td>
-<td>t'∈[200, -1]<br>Specific t=65 used<br>PCs t</td>
-</tr>
-<tr hidden>
-<th scope="row">6</th>
-<td class="text-center">—</td>
-<td><audio class="shortaudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/unsup_samples/ManSpeakingBGNoise_ours_115-95_pc1_a-40.mp3"></audio></td>
-<td><audio class="shortaudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/orig/ManSpeakingBGNoise.mp3"></audio></td>
-<td><audio class="shortaudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/unsup_samples/ManSpeakingBGNoise_ours_115-95_pc1_a40.mp3"></audio></td>
-<td>Isolate Woman/Man</td>
-<td>t'∈[115, 95]<br>PC #1</td>
-</tr>
-</tbody>
-</table>
-</div>
-</div>
-</div>
-<hr class="border-gray-700">
-<!-- Comparisons to Other Methods -->
-<div class="text-center py-8">
-<h1 class="poppins-regular text-2xl md:text-3xl">2. Comparisons to Other Methods</h1>
-<h2 id="supcomparisons" class="anchor poppins-regular text-xl md:text-2xl">2.1. Comparisons of Text-Based Editing</h2>
-<h3 class="poppins-regular text-lg md:text-xl flex items-center justify-center">
-<button type="button" id="supComparisonsMusicSamplesBtn" onclick="toggleCollapseArrow('supComparisonsMusicSamplesBtn')" class="btn btn-light mr-2" data-bs-toggle="collapse" data-bs-target="#supComparisonsMusicSamples" aria-expanded="true" aria-controls="supComparisonsMusicSamples"><i class="fas fa-chevron-down"></i></button>
-2.1.2. Music Samples
-</h3>
-<div class="container show" id="supComparisonsMusicSamples">
-<div class="table-responsive">
-<table class="table table-sm">
-<thead>
-<tr class="text-center">
-<th scope="col">#</th>
-<th scope="col">Source Prompt</th>
-<th scope="col">Target Prompt</th>
-<th scope="col">Original Audio</th>
-<th scope="col">Ours</th>
-<th scope="col">SDEdit<br>T<sub>start</sub>=100<br>T<sub>start</sub>=70<br>T<sub>start</sub>=40</th>
-<th scope="col">MusicGen</th>
-<th scope="col">DDIM Editing</th>
-</tr>
-</thead>
-<tbody>
-<tr class="align-top">
-<th scope="row">1</th>
-<td class="align-top">A recording of <b>a rock song</b>.</td>
-<td class="align-top">A recording of <b>Arabic music</b>.</td>
-<td class="text-center align-middle"><audio preload="auto" class="shorteraudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/audio/orig/MDDBBritpop.mp3" type="audio/mp4"></audio></td>
-<td class="text-center align-middle"><br>
-<audio preload="auto" class="shorteraudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/audio/sup_samples/arabic_MDDBBritpop_ours_90.mp3" type="audio/mp4"></audio>
-<br>T<sub>start</sub>=110</td>
-<td class="text-center align-middle"><br>
-<audio preload="auto" class="shorteraudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/audio/sdedit/arabic_MDDBBritpop_sdedit_100.mp3" type="audio/mp4"></audio>
-<br>
-<audio preload="auto" class="shorteraudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/audio/sdedit/arabic_MDDBBritpop_sdedit_130.mp3" type="audio/mp4"></audio>
-<br>
-<audio preload="auto" class="shorteraudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/audio/sdedit/arabic_MDDBBritpop_sdedit_160.mp3" type="audio/mp4"></audio>
-</td>
-<td class="text-center align-middle"><audio preload="auto" class="shorteraudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/audio/musicgen/arabic_MDDBBritpop_musicgen.mp3" type="audio/mp4"></audio></td>
-<td class="text-center align-middle"><audio preload="auto" class="shorteraudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/audio/ddim/arabic_MDDBBritpop_ddim.mp3" type="audio/mp4"></audio></td>
-</tr>
-<tr class="align-top">
-<th scope="row">2</th>
-<td class="align-top">A recording of an <b>upbeat rock song</b>.</td>
-<td class="align-top">A recording of an <b>arcade game soundtrack</b>.</td>
-<td class="text-center align-middle"><audio preload="auto" class="shorteraudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/audio/orig/MDDBBeatles.mp3" type="audio/mp4"></audio></td>
-<td class="text-center align-middle"><br>
-<audio preload="auto" class="shorteraudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/audio/sup_samples/arcade_MDDBBeatles_ours_100.mp3" type="audio/mp4"></audio>
-<br>T<sub>start</sub>=100</td>
-<td class="text-center align-middle"><br>
-<audio preload="auto" class="shorteraudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/audio/sdedit/arcade_MDDBBeatles_sdedit_100.mp3" type="audio/mp4"></audio>
-<br>
-<audio preload="auto" class="shorteraudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/audio/sdedit/arcade_MDDBBeatles_sdedit_130.mp3" type="audio/mp4"></audio>
-<br>
-<audio preload="auto" class="shorteraudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/audio/sdedit/arcade_MDDBBeatles_sdedit_160.mp3" type="audio/mp4"></audio>
-</td>
-<td class="text-center align-middle"><audio preload="auto" class="shorteraudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/audio/musicgen/arcade_MDDBBeatles_musicgen.mp3" type="audio/mp4"></audio></td>
-<td class="text-center align-middle"><audio preload="auto" class="shorteraudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/audio/ddim/arcade_MDDBBeatles_ddim.mp3" type="audio/mp4"></audio></td>
-</tr>
-<tr class="align-top">
-<th scope="row">3</th>
-<td class="align-top text-center">—</td>
-<td class="align-top">A recording of a dark techno song.</td>
-<td class="text-center align-middle"><audio preload="auto" class="shorteraudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/audio/orig/MDDBBeethoven.mp3" type="audio/mp4"></audio></td>
-<td class="text-center align-middle"><br>
-<audio preload="auto" class="shorteraudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/audio/sup_samples/techno_MDDBBeethoven_ours_110.mp3" type="audio/mp4"></audio>
-<br>T<sub>start</sub>=90</td>
-<td class="text-center align-middle"><br>
-<audio preload="auto" class="shorteraudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/audio/sdedit/techno_MDDBBeethoven_sdedit_100.mp3" type="audio/mp4"></audio>
-<br>
-<audio preload="auto" class="shorteraudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/audio/sdedit/techno_MDDBBeethoven_sdedit_130.mp3" type="audio/mp4"></audio>
-<br>
-<audio preload="auto" class="shorteraudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/audio/sdedit/techno_MDDBBeethoven_sdedit_160.mp3" type="audio/mp4"></audio>
-</td>
-<td class="text-center align-middle"><audio preload="auto" class="shorteraudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/audio/musicgen/techno_MDDBBeethoven_musicgen.mp3" type="audio/mp4"></audio></td>
-<td class="text-center align-middle"><audio preload="auto" class="shorteraudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/audio/ddim/techno_MDDBBeethoven_ddim.mp3" type="audio/mp4"></audio></td>
-</tr>
-<tr class="align-top">
-<th scope="row">4</th>
-<td class="align-top">A high quality recording of <b>wind instruments and strings</b> playing.</td>
-<td class="align-top">A high quality recording of <b>a piano</b> playing.</td>
-<td class="text-center align-middle"><audio preload="auto" class="shorteraudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/audio/orig/MDDBBeethoven.mp3" type="audio/mp4"></audio></td>
-<td class="text-center align-middle"><br>
-<audio preload="auto" class="shorteraudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/audio/sup_samples/instrument_MDDBBeethoven_ours_130.mp3" type="audio/mp4"></audio>
-<br>T<sub>start</sub>=70</td>
-<td class="text-center align-middle"><br>
-<audio preload="auto" class="shorteraudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/audio/sdedit/instrument_MDDBBeethoven_sdedit_100.mp3" type="audio/mp4"></audio>
-<br>
-<audio preload="auto" class="shorteraudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/audio/sdedit/instrument_MDDBBeethoven_sdedit_130.mp3" type="audio/mp4"></audio>
-<br>
-<audio preload="auto" class="shorteraudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/audio/sdedit/instrument_MDDBBeethoven_sdedit_160.mp3" type="audio/mp4"></audio>
-</td>
-<td class="text-center align-middle"><audio preload="auto" class="shorteraudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/audio/musicgen/instrument_MDDBBeethoven_musicgen.mp3" type="audio/mp4"></audio></td>
-<td class="text-center align-middle"><audio preload="auto" class="shorteraudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/audio/ddim/instrument_MDDBBeethoven_ddim.mp3" type="audio/mp4"></audio></td>
-</tr>
-<tr class="text-center align-middle">
-<td colspan="8">
-<button class="btn btn-outline-secondary" type="button" id="supExamplesCompHearMoreBtn1" onclick="hearMore('supExamplesCompHearMoreBtn1', 5, 11)">
-<i class="fa fa-plus-square-o" aria-hidden="true"></i> I want to hear more!
-</button>
-</td>
-</tr>
-<tr class="align-top" hidden>
-<th scope="row">5</th>
-<td class="align-top text-center">—</td>
-<td class="align-top">A recording of an upbeat cool jazz song.</td>
-<td class="text-center align-middle"><audio preload="auto" class="shorteraudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/audio/orig/MDDBPunk.mp3" type="audio/mp4"></audio></td>
-<td class="text-center align-middle"><br>
-<audio preload="auto" class="shorteraudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/audio/sup_samples/jazz_MDDBPunk_ours_110.mp3" type="audio/mp4"></audio>
-<br>T<sub>start</sub>=90</td>
-<td class="text-center align-middle"><br>
-<audio preload="auto" class="shorteraudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/audio/sdedit/jazz_MDDBPunk_sdedit_100.mp3" type="audio/mp4"></audio>
-<br>
-<audio preload="auto" class="shorteraudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/audio/sdedit/jazz_MDDBPunk_sdedit_130.mp3" type="audio/mp4"></audio>
-<br>
-<audio preload="auto" class="shorteraudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/audio/sdedit/jazz_MDDBPunk_sdedit_160.mp3" type="audio/mp4"></audio>
-</td>
-<td class="text-center align-middle"><audio preload="auto" class="shorteraudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/audio/musicgen/jazz_MDDBPunk_musicgen.mp3" type="audio/mp4"></audio></td>
-<td class="text-center align-middle"><audio preload="auto" class="shorteraudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/audio/ddim/jazz_MDDBPunk_ddim.mp3" type="audio/mp4"></audio></td>
-</tr>
-<tr class="align-top" hidden>
-<th scope="row">6</th>
-<td class="align-top">A recording of an <b>old rock</b> song.</td>
-<td class="align-top">A recording of an <b>techno</b> song.</td>
-<td class="text-center align-middle"><audio preload="auto" class="shorteraudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/audio/orig/MDDBRockabilly.mp3" type="audio/mp4"></audio></td>
-<td class="text-center align-middle"><br>
-<audio preload="auto" class="shorteraudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/audio/sup_samples/techno_MDDBRockabilly_ours_110.mp3" type="audio/mp4"></audio>
-<br>T<sub>start</sub>=90</td>
-<td class="text-center align-middle"><br>
-<audio preload="auto" class="shorteraudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/audio/sdedit/techno_MDDBRockabilly_sdedit_100.mp3" type="audio/mp4"></audio>
-<br>
-<audio preload="auto" class="shorteraudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/audio/sdedit/techno_MDDBRockabilly_sdedit_130.mp3" type="audio/mp4"></audio>
-<br>
-<audio preload="auto" class="shorteraudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/audio/sdedit/techno_MDDBRockabilly_sdedit_160.mp3" type="audio/mp4"></audio>
-</td>
-<td class="text-center align-middle"><audio preload="auto" class="shorteraudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/audio/musicgen/techno_MDDBRockabilly_musicgen.mp3" type="audio/mp4"></audio></td>
-<td class="text-center align-middle"><audio preload="auto" class="shorteraudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/audio/ddim/techno_MDDBRockabilly_ddim.mp3" type="audio/mp4"></audio></td>
-</tr>
-<tr class="align-top" hidden>
-<th scope="row">7</th>
-<td class="align-top text-left">A recording of a <b>sneaky jazz song</b>.</td>
-<td class="align-top">A recording of a <b>tense classical music score</b>.</td>
-<td class="text-center align-middle"><audio preload="auto" class="shorteraudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/audio/orig/MDDBFreeJazz.mp3" type="audio/mp4"></audio></td>
-<td class="text-center align-middle"><br>
-<audio preload="auto" class="shorteraudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/audio/sup_samples/orchestra_MDDBFreeJazz_ours_90.mp3" type="audio/mp4"></audio>
-<br>T<sub>start</sub>=110</td>
-<td class="text-center align-middle"><br>
-<audio preload="auto" class="shorteraudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/audio/sdedit/orchestra_MDDBFreeJazz_sdedit_100.mp3" type="audio/mp4"></audio>
-<br>
-<audio preload="auto" class="shorteraudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/audio/sdedit/orchestra_MDDBFreeJazz_sdedit_130.mp3" type="audio/mp4"></audio>
-<br>
-<audio preload="auto" class="shorteraudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/audio/sdedit/orchestra_MDDBFreeJazz_sdedit_160.mp3" type="audio/mp4"></audio>
-</td>
-<td class="text-center align-middle"><audio preload="auto" class="shorteraudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/audio/musicgen/orchestra_MDDBFreeJazz_musicgen.mp3" type="audio/mp4"></audio></td>
-<td class="text-center align-middle"><audio preload="auto" class="shorteraudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/audio/ddim/orchestra_MDDBFreeJazz_ddim.mp3" type="audio/mp4"></audio></td>
-</tr>
-<tr class="align-top" hidden>
-<th scope="row">8</th>
-<td class="align-top text-center">—</td>
-<td class="align-top">A recording of a funky hip hop song.</td>
-<td class="text-center align-middle"><audio preload="auto" class="shorteraudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/audio/orig/MDDBFunkJazz.mp3" type="audio/mp4"></audio></td>
-<td class="text-center align-middle"><br>
-<audio preload="auto" class="shorteraudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/audio/sup_samples/hiphop_MDDBFunkJazz_ours_90.mp3" type="audio/mp4"></audio>
-<br>T<sub>start</sub>=110</td>
-<td class="text-center align-middle"><br>
-<audio preload="auto" class="shorteraudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/audio/sdedit/hiphop_MDDBFunkJazz_sdedit_100.mp3" type="audio/mp4"></audio>
-<br>
-<audio preload="auto" class="shorteraudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/audio/sdedit/hiphop_MDDBFunkJazz_sdedit_130.mp3" type="audio/mp4"></audio>
-<br>
-<audio preload="auto" class="shorteraudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/audio/sdedit/hiphop_MDDBFunkJazz_sdedit_160.mp3" type="audio/mp4"></audio>
-</td>
-<td class="text-center align-middle"><audio preload="auto" class="shorteraudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/audio/musicgen/hiphop_MDDBFunkJazz_musicgen.mp3" type="audio/mp4"></audio></td>
-<td class="text-center align-middle"><audio preload="auto" class="shorteraudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/audio/ddim/hiphop_MDDBFunkJazz_ddim.mp3" type="audio/mp4"></audio></td>
-</tr>
-<tr class="align-top" hidden>
-<th scope="row">9</th>
-<td class="align-top">A recording of an upbeat <b>gospel</b> song.</td>
-<td class="align-top">A recording of an upbeat <b>techno</b> song.</td>
-<td class="text-center align-middle"><audio preload="auto" class="shorteraudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/audio/orig/MDDBGospel.mp3" type="audio/mp4"></audio></td>
-<td class="text-center align-middle"><br>
-<audio preload="auto" class="shorteraudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/audio/sup_samples/techno_MDDBGospel_ours_100.mp3" type="audio/mp4"></audio>
-<br>T<sub>start</sub>=100</td>
-<td class="text-center align-middle"><br>
-<audio preload="auto" class="shorteraudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/audio/sdedit/techno_MDDBGospel_sdedit_100.mp3" type="audio/mp4"></audio>
-<br>
-<audio preload="auto" class="shorteraudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/audio/sdedit/techno_MDDBGospel_sdedit_130.mp3" type="audio/mp4"></audio>
-<br>
-<audio preload="auto" class="shorteraudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/audio/sdedit/techno_MDDBGospel_sdedit_160.mp3" type="audio/mp4"></audio>
-</td>
-<td class="text-center align-middle"><audio preload="auto" class="shorteraudio" controls><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/audio/musicgen/techno_MDDBGospel_musicgen.mp3" type="audio/mp4"></audio></td>
-<td class="text-center align-middle"><audio></audio>

 <!DOCTYPE html>
 <html lang="en">
 <head>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <title>Zero-Shot Unsupervised and Text-Based Audio Editing Using DDPM Inversion</title>
+  <link rel="shortcut icon" href="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/favicon.ico">
+  <meta property="og:image" content="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/teaser.png"/>
+  <meta property="og:title" content="Zero-Shot Unsupervised and Text-Based Audio Editing Using DDPM Inversion" />
+  <meta property="og:description" content="Zero-Shot Unsupervised and Text-Based Audio Editing Using DDPM Inversion" />
+  <!-- Tailwind CSS -->
+  <script src="https://cdn.tailwindcss.com"></script>
+  <!-- Google Fonts: Poppins -->
+  <link href="https://fonts.googleapis.com/css2?family=Poppins:wght@400;600;700&display=swap" rel="stylesheet">
+  <!-- Font Awesome -->
+  <script src="https://kit.fontawesome.com/ad96f96272.js" crossorigin="anonymous"></script>
+  <!-- Academicons -->
+  <link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/jpswalsh/academicons@1/css/academicons.min.css">
+  <style>
+    body {
+      font-family: 'Poppins', sans-serif;
+      background: linear-gradient(135deg, #1e293b 0%, #0f172a 100%);
+      color: #f1f5f9;
+      min-height: 100vh;
+    }
+    .glass {
+      background: rgba(30, 41, 59, 0.7);
+      box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37);
+      backdrop-filter: blur(8px);
+      border-radius: 1rem;
+      border: 1px solid rgba(255,255,255,0.08);
+    }
+    .gradient-btn {
+      background: linear-gradient(90deg, #2563eb 0%, #1e40af 100%);
+      color: #fff;
+      transition: transform 0.2s, box-shadow 0.2s;
+    }
+    .gradient-btn:hover {
+      transform: translateY(-2px) scale(1.03);
+      box-shadow: 0 4px 20px 0 rgba(37,99,235,0.25);
+      background: linear-gradient(90deg, #1e40af 0%, #2563eb 100%);
+    }
+    .audio-player {
+      width: 100%;
+      max-width: 260px;
+      background: #1e293b;
+      border-radius: 0.5rem;
+      box-shadow: 0 2px 8px rgba(16, 24, 39, 0.2);
+      padding: 0.5rem;
+    }
+    ::selection {
+      background: #2563eb;
+      color: #fff;
+    }
+  </style>
 </head>
 <body>
+  <!-- Navigation Bar -->
+  <nav class="glass sticky top-0 z-50 flex items-center justify-between px-6 py-4 shadow-lg">
+    <a href="#" class="text-2xl font-bold tracking-tight bg-gradient-to-r from-blue-400 to-indigo-500 bg-clip-text text-transparent">Zero-Shot Audio Editing</a>
+    <div class="hidden md:flex space-x-6">
+      <a href="#supsamples" class="hover:text-blue-400 transition">Text-based Editing</a>
+      <a href="#unsupsamples" class="hover:text-blue-400 transition">Unsup. Editing</a>
+      <a href="#supcomparisons" class="hover:text-blue-400 transition">Text-Based Editing Comp.</a>
+      <a href="#unsupcomparisons" class="hover:text-blue-400 transition">Unsup. Editing Comp.</a>
+    </div>
+    <button class="md:hidden text-2xl"><i class="fas fa-bars"></i></button>
+  </nav>
+  <!-- Header Section -->
+  <header class="max-w-3xl mx-auto mt-12 text-center glass py-10 px-6">
+    <h1 class="text-4xl md:text-5xl font-extrabold mb-4 bg-gradient-to-r from-blue-400 to-indigo-500 bg-clip-text text-transparent">
+      Zero-Shot Unsupervised and Text-Based Audio Editing Using DDPM Inversion
+    </h1>
+    <h4 class="text-xl md:text-2xl font-semibold mb-2">ICML 2024</h4>
+    <div class="flex flex-wrap justify-center gap-4 mb-2">
+      <a href="https://www.linkedin.com/in/hilamanor/" target="_blank" class="text-lg hover:text-blue-400 transition">Hila Manor</a>
+      <span class="text-gray-400">|</span>
+      <a href="https://tomer.net.technion.ac.il/" target="_blank" class="text-lg hover:text-blue-400 transition">Tomer Michaeli</a>
+    </div>
+    <p class="mb-4 text-gray-300">Technion - Israel Institute of Technology</p>
+    <div class="flex flex-wrap justify-center gap-4 mt-4">
+      <a class="gradient-btn px-5 py-2 rounded-lg font-semibold flex items-center gap-2" href="https://arxiv.org/abs/2402.10009" target="_blank"><i class="ai ai-arxiv"></i>ArXiv</a>
+      <a class="gradient-btn px-5 py-2 rounded-lg font-semibold flex items-center gap-2" href="https://github.com/HilaManor/AudioEditingCode/" target="_blank"><i class="fab fa-github"></i>Code</a>
+      <a class="gradient-btn px-5 py-2 rounded-lg font-semibold flex items-center gap-2" href="https://youtu.be/lBnldOQVbS4" target="_blank"><i class="fab fa-youtube"></i>Presentation</a>
+      <a class="gradient-btn px-5 py-2 rounded-lg font-semibold flex items-center gap-2" href="https://huggingface.co/spaces/hilamanor/audioEditing/" target="_blank">🤗 Text-Based Space</a>
+    </div>
+  </header>
+  <!-- Abstract and Teaser -->
+  <section class="max-w-3xl mx-auto my-12 glass py-8 px-6 text-center">
+    <img alt="Teaser" src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/teaser.png" class="mx-auto rounded-xl shadow-xl mb-6 w-full md:w-3/4"/>
+    <h2 class="text-2xl font-semibold mb-4">Abstract</h2>
+    <p class="text-lg leading-relaxed text-gray-200">
+      Editing signals using large pre-trained models, in a zero-shot manner, has recently seen rapid advancements in the image domain. However, this wave has yet to reach the audio domain.
+      In this paper, we explore two zero-shot editing techniques for audio signals, which use DDPM inversion on pre-trained diffusion models. The first, adopted from the image domain, allows text-based editing.
+      The second, is a novel approach for discovering semantically meaningful editing directions without supervision.
+      When applied to music signals, this method exposes a range of musically interesting modifications, from controlling the participation of specific instruments to improvisations on the melody.
+    </p>
+  </section>
+  <!-- Video Overview -->
+  <section class="max-w-3xl mx-auto my-12 glass py-8 px-6 text-center">
+    <h2 class="text-2xl font-semibold mb-2">Video Overview</h2>
+    <p class="text-gray-300 mb-4">For people in a hurry. Images generated by <a href="https://openai.com/dall-e-2" class="text-blue-400 hover:underline">DALL-E 2</a> and <a href="https://www.bing.com/copilot" class="text-blue-400 hover:underline">Copilot</a>.</p>
+    <video controls class="mx-auto rounded-xl shadow-xl w-full max-w-md">
+      <source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/overview.mp4" type="video/mp4">
+      Your browser does not support the video tag.
+    </video>
+  </section>
+  <!-- Samples of Editing -->
+  <section class="max-w-5xl mx-auto my-12 glass py-8 px-6">
+    <h2 class="text-2xl font-semibold text-center mb-4">1. Samples of Editing</h2>
+    <p class="text-center text-gray-300 mb-8">We present samples of audio editing using our proposed methods. The samples are organized into two sections: text-based editing and unsupervised editing.</p>
+    <!-- Text-Based Editing Table -->
+    <div>
+      <h3 id="supsamples" class="text-xl font-semibold mb-4">1.1. Samples of Text-Based Editing</h3>
+      <div class="overflow-x-auto">
+        <table class="min-w-full text-sm text-left text-gray-200">
+          <thead class="bg-blue-900/80">
+            <tr>
+              <th class="px-4 py-2">#</th>
+              <th class="px-4 py-2">Source Prompt</th>
+              <th class="px-4 py-2">Target Prompt</th>
+              <th class="px-4 py-2">Original Audio</th>
+              <th class="px-4 py-2">Edited Audio</th>
+              <th class="px-4 py-2">Edit T<sub>start</sub></th>
+            </tr>
+          </thead>
+          <tbody>
+            <tr class="hover:bg-blue-800/30 transition">
+              <td class="px-4 py-2">1</td>
+              <td class="px-4 py-2">A recording of a <b>sneaky jazz</b> song.</td>
+              <td class="px-4 py-2">A recording of a <b>tense classical</b> music score.</td>
+              <td class="px-4 py-2"><audio controls class="audio-player"><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/orig/MDDBFreeJazz.mp3" type="audio/mp4"></audio></td>
+              <td class="px-4 py-2"><audio controls class="audio-player"><source src="https://github.com/HilaManor/AudioEditingCode/raw/refs/heads/codeclean/docs/resources/audio/sup_samples/orchestra_MDDBFreeJazz_ours_90.mp3" type="audio/mp4"></audio></td>
+              <td class="px-4 py-2 text-center">110</td>
+            </tr>
+            <!-- Repeat for other rows as needed ... -->
+          </tbody>
+        </table>
+      </div>
+    </div>
+    <!-- Add more sections as needed -->
+  </section>
+  <!-- Back to Top Button -->
+  <button onclick="window.scrollTo({top: 0, behavior: 'smooth'});" class="fixed bottom-8 right-8 gradient-btn rounded-full p-4 shadow-xl hover:scale-110 transition hidden md:block" aria-label="Back to top">
+    <i class="fas fa-arrow-up"></i>
+  </button>
+  <script>
+    // Show back-to-top button on scroll
+    window.addEventListener('scroll', function() {
+      const btn = document.querySelector('.fixed.bottom-8.right-8');
+      if (window.scrollY > 300) {
+        btn.classList.remove('hidden');
+      } else {
+        btn.classList.add('hidden');
+      }
+    });
+  </script>
+</body>
+</html>