diff --git a/2025-01-12_11-42.jpeg b/2025-01-12_11-42.jpeg
new file mode 100644
index 0000000..0bba676
Binary files /dev/null and b/2025-01-12_11-42.jpeg differ
diff --git a/index.html b/index.html
index 2a291e9..10e8f27 100644
--- a/index.html
+++ b/index.html
@@ -18,7 +18,7 @@
       color: white;
       text-align: center;
       padding: 1vh;
-      font-size: 1vw;
+      font-size: 1.5vw;
     }
 
     .container {
@@ -92,7 +92,7 @@
       box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
     }
     .checkbox-group label {
-      font-size: 1vw;
+      font-size: 1.5vw;
       color: #3498db;
       font-weight: bold;
     }
@@ -106,7 +106,7 @@
       padding: 2vh;
       background-color: #3498db;
       color: white;
-      font-size: 1vw;
+      font-size: 1.5vw;
       margin-top: 5vh;
     }
 
@@ -199,13 +199,22 @@
         <button id="resetButton" onclick="resetForm()">Zurücksetzen</button>
     </div>
 
+    <div id="popup-warning" style="display: none; background-color: #ffcc00; padding: 10px; text-align: center;">
+        <p>Pop-ups sind blockiert. Bitte erlaube Pop-ups für diese Webseite, um die Suchergebnisse in neuen Tabs zu öffnen.</p>
+        <a href="popup" style="text-decoration: none;">
+          <button style="background-color: #3498db; color: white; padding: 10px 20px; border: none; border-radius: 5px; cursor: pointer;">
+              Wie erlaube ich Pop-ups?
+          </button>
+      </a>
+    </div>
+
     </div>
 
     <div class="checkbox-container">
       <div class="checkbox-group">
         <label class="category-label">
             <input type="checkbox" id="masterKuecheCheckbox" onclick="toggleSubCheckboxes('masterKuecheCheckbox', 'kueche')">
-            <span>Küchen Artikel</span>
+            <u style="color: red; font-weight: bold;">Küchen Artikel</u> 
         </label>
         <br>
         <input type="checkbox" id="esmeyer" value="esmeyer" class="kueche-checkbox">
@@ -236,7 +245,7 @@
         <div class="checkbox-group">
           <label class="category-label">
               <input type="checkbox" id="masterHygieneCheckbox" onclick="toggleSubCheckboxes('masterHygieneCheckbox', 'hygiene')">
-              <span>Hygiene Artikel</span>
+              <u style="color: red; font-weight: bold;">Hygiene Artikel</u> 
           </label>
           <br>
           <input type="checkbox" id="hygi" value="hygi" class="hygiene-checkbox">
@@ -261,7 +270,7 @@
       <div class="checkbox-group">
         <label class="category-label">
             <input type="checkbox" id="masterBaumarktCheckbox" onclick="toggleSubCheckboxes('masterBaumarktCheckbox', 'baumarkt')">
-            <span>Baumarkt Artikel</span>
+            <u style="color: red; font-weight: bold;">Baumarkt Artikel</u> 
         </label>
         <br>
         <input type="checkbox" id="hornbach" value="hornbach" class="baumarkt-checkbox">
@@ -313,7 +322,7 @@
     <div class="checkbox-group" >
       <label class="category-label elektronik">
         <input type="checkbox" id="masterElektronikCheckbox" onclick="toggleSubCheckboxes('masterElektronikCheckbox', 'elektronik')">
-        <span>Elektronik Artikel</span>
+        <u style="color: red; font-weight: bold;">Elektronik Artikel</u> 
       </label>
       <br>
       <input type="checkbox" id="conrad" value="conrad" class="elektronik-checkbox">
@@ -329,7 +338,7 @@
     <div class="checkbox-group">
       <label class="category-label">
           <input type="checkbox" id="masterVerpackungenCheckbox" onclick="toggleSubCheckboxes('masterVerpackungenCheckbox', 'verpackungen')">
-          <span>Verpackungs Artikel</span>
+          <u style="color: red; font-weight: bold;">Verpackungs Artikel</u> 
       </label>
       <br>
       <input type="checkbox" id="papstar" value="papstar" class="verpackungen-checkbox">
@@ -345,7 +354,7 @@
     <div class="checkbox-group" >
         <label class="category-label">
             <input type="checkbox" id="masterSchilderCheckbox" onclick="toggleSubCheckboxes('masterSchilderCheckbox', 'schilder')">
-            <span>Schilder Artikel</span>
+            <u style="color: red; font-weight: bold;">Schilder Artikel</u> 
         </label>
         <br>
         <input type="checkbox" id="brewes" value="brewes" class="schilder-checkbox">
@@ -361,7 +370,7 @@
     <div class="checkbox-group" >
         <label class="category-label">
             <input type="checkbox" id="masterLandwirtschaftCheckbox" onclick="toggleSubCheckboxes('masterLandwirtschaftCheckbox', 'landwirtschaft')">
-            <span>Landwirtschaft</span>
+            <u style="color: red; font-weight: bold;">Landwirtschaft</u> 
         </label>
         <br>
         <input type="checkbox" id="siepmann" value="siepmann" class="landwirtschaft-checkbox">
@@ -377,7 +386,7 @@
     <div class="checkbox-group" >
         <label class="category-label">
             <input type="checkbox" id="masterArbeitsschutzCheckbox" onclick="toggleSubCheckboxes('masterArbeitsschutzCheckbox', 'arbeitsschutz')">
-            <span>Arbeitsschutz</span>
+            <u style="color: red; font-weight: bold;">Arbeitsschutz</u> 
         </label>
         <br>
         <input type="checkbox" id="engelbert" value="engelbert" class="arbeitsschutz-checkbox">
@@ -393,7 +402,7 @@
     <div class="checkbox-group" >
         <label class="category-label">
             <input type="checkbox" id="masterMedCheckbox" onclick="toggleSubCheckboxes('masterMedCheckbox', 'med')">
-            <span>Med. Artikel</span>
+            <u style="color: red; font-weight: bold;">Med. Artikel</u> 
         </label>
         <br>
         <input type="checkbox" id="oekonomed" value="oekonomed" class="med-checkbox">
@@ -409,7 +418,7 @@
     <div class="checkbox-group" >
         <label class="category-label">
             <input type="checkbox" id="masterStahlCheckbox" onclick="toggleSubCheckboxes('masterStahlCheckbox', 'stahl')">
-            <span>Stahl</span>
+            <u style="color: red; font-weight: bold;">Stahl</u> 
         </label>
         <br>
         <input type="checkbox" id="stahlshop" value="stahlshop" class="stahl-checkbox">
@@ -422,7 +431,7 @@
     <div class="checkbox-group" >
         <label class="category-label">
             <input type="checkbox" id="masterDekoCheckbox" onclick="toggleSubCheckboxes('masterDekoCheckbox', 'deko')">
-            <span>Deko Artikel</span>
+            <u style="color: red; font-weight: bold;">Deko Artikel</u> 
         </label>
         <br>
         <input type="checkbox" id="frankflechtwaren" value="frankflechtwaren" class="deko-checkbox">
@@ -438,7 +447,7 @@
     <div class="checkbox-group" >
         <label class="category-label">
             <input type="checkbox" id="masterSaatgutCheckbox" onclick="toggleSubCheckboxes('masterSaatgutCheckbox', 'saatgut')">
-            <span>Saatgut Artikel</span>
+            <u style="color: red; font-weight: bold;">Saatgut Artikel</u> 
         </label>
         <br>
         <input type="checkbox" id="saatgutshop" value="saatgutshop" class="saatgut-checkbox">
@@ -451,7 +460,7 @@
     <div class="checkbox-group" >
         <label class="category-label">
             <input type="checkbox" id="masterSonstige ArtikelCheckbox" onclick="toggleSubCheckboxes('masterSonstige ArtikelCheckbox', 'sonstige')">
-            <span>Sonstige Artikel</span>
+            <u style="color: red; font-weight: bold;">Sonstige Artikel</u> 
         </label>
         <br>
         <input type="checkbox" id="labelident" value="labelident" class="sonstige-checkbox">
@@ -466,37 +475,54 @@
     </div>
   </div>
 
+
+
   <footer>
     <p>&copy; 2025 Einkauf Suche - Alle Rechte vorbehalten</p>
   </footer>
 
+  
+
   <script>
-    async function performSearch() {
-      const query = document.getElementById('query').value;
-      const checkboxes = document.querySelectorAll('input[type="checkbox"]:checked');
-      const selectedWebsites = Array.from(checkboxes).map(checkbox => checkbox.value);
-  
-      if (!query || selectedWebsites.length === 0) {
-        alert('Bitte Suchbegriff und mindestens eine Webseite auswählen.');
-        return;
-      }
-  
-      // Für jede ausgewählte Website eine Anfrage senden
-      for (const website of selectedWebsites) {
-        try {
-          const response = await fetch(`/search?query=${query}&websites=${website}`);
-          const data = await response.json();
-  
-          // Überprüfe, ob die Such-URL existiert und öffne sie in einem neuen Fenster
-          if (data && data.length > 0 && data[0].searchUrl) {
-            window.open(data[0].searchUrl, '_blank');
-          } else {
-            console.error(`Keine gültige URL für ${website} gefunden.`);
-          }
-        } catch (error) {
-          console.error(`Fehler bei der Suche für ${website}:`, error);
+    function checkPopupBlocked() {
+        const popup = window.open('about:blank', '_blank');
+        if (!popup || popup.closed || typeof popup.closed === 'undefined') {
+            document.getElementById('popup-warning').style.display = 'block';
+        } else {
+            popup.close();
+        }
+    }
+
+    // Beim Laden der Seite überprüfen
+    window.onload = checkPopupBlocked;
+
+    async function performSearch() {
+        const query = document.getElementById('query').value;
+        const checkboxes = document.querySelectorAll('input[type="checkbox"]:checked');
+        const selectedWebsites = Array.from(checkboxes).map(checkbox => checkbox.value);
+
+        if (!query || selectedWebsites.length === 0) {
+            alert('Bitte Suchbegriff und mindestens eine Webseite auswählen.');
+            return;
+        }
+
+        for (const website of selectedWebsites) {
+            try {
+                const response = await fetch(`/search?query=${query}&websites=${website}`);
+                const data = await response.json();
+
+                if (data && data.length > 0 && data[0].searchUrl) {
+                    const link = document.createElement('a');
+                    link.href = data[0].searchUrl;
+                    link.target = '_blank';
+                    link.click();
+                } else {
+                    console.error(`Keine gültige URL für ${website} gefunden.`);
+                }
+            } catch (error) {
+                console.error(`Fehler bei der Suche für ${website}:`, error);
+            }
         }
-      }
     }
 
         function toggleSubCheckboxes(masterCheckboxId, subCheckboxClass) {
diff --git a/main.go b/main.go
index 60f0ad9..f234c5c 100644
--- a/main.go
+++ b/main.go
@@ -23,7 +23,7 @@ func main() {
 	// Set up routes
 	http.HandleFunc("/", handleRoot)
 	http.HandleFunc("/config", handleConfig)
-
+	http.HandleFunc("/popup", handlePopupInstructions)
 	http.HandleFunc("/search", handleSearch)
 	http.HandleFunc("/favicon.ico", handleFavicon)
 
@@ -75,6 +75,13 @@ func handleFavicon(w http.ResponseWriter, r *http.Request) {
 	w.WriteHeader(http.StatusNoContent)
 }
 
+func handlePopupInstructions(w http.ResponseWriter, r *http.Request) {
+	tmpl := template.Must(template.ParseFiles("popup.html"))
+	if err := tmpl.Execute(w, nil); err != nil {
+		http.Error(w, err.Error(), http.StatusInternalServerError)
+	}
+}
+
 func generateSearchUrl(website, query string) string {
 	searchUrls := map[string]string{
 		// ----- Eletronik ----
diff --git a/popup.html b/popup.html
new file mode 100644
index 0000000..efb008a
--- /dev/null
+++ b/popup.html
@@ -0,0 +1,170 @@
+<!DOCTYPE html>
+<html lang="de">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Pop-ups erlauben</title>
+    <style>
+        /* Allgemeine Stile */
+        body {
+            font-family: 'Arial', sans-serif;
+            margin: 0;
+            padding: 0;
+            background-color: #f0f2f5;
+        }
+
+        header {
+            background-color: #3498db;
+            position: relative;
+            color: white;
+            text-align: center;
+            padding: 1vh;
+            font-size: 1vw;
+        }
+
+        ul {
+            list-style-type: disc;
+            margin-left: 20px;
+        }
+
+        .browser-instructions {
+            background-color: white;
+            padding: 15px;
+            border-radius: 10px;
+            box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
+            margin: 1vh;
+        }
+
+        .container {
+            width: 70%;
+            margin: 0 auto;
+            padding: 1vh 0;
+        }
+
+            /* Responsive Bild */
+        .responsive-image {
+            max-width: 100%; /* Bild wird nie breiter als sein Container */
+            height: auto;    /* Höhe wird proportional angepasst */
+            display: block;  /* Entfernt unnötigen Abstand unter dem Bild */
+            margin: 10px 0;  /* Optional: Abstand oben und unten */
+        }
+
+        footer {
+        text-align: center;
+        padding: 2vh;
+        background-color: #3498db;
+        color: white;
+        font-size: 1.5vw;
+        margin-top: 5vh;
+        }
+
+        /* Tablet-Layout (Bildschirmbreite bis 1200px) */
+        @media (max-width: 1200px) {
+            .container {
+                width: 80%;
+            }
+
+            header {
+                font-size: 2vw;
+            }
+
+            .browser-instructions {
+                padding: 12px;
+            }
+        }
+
+        /* Mobile-Layout (Bildschirmbreite bis 768px) */
+        @media (max-width: 768px) {
+            .container {
+                width: 90%;
+            }
+
+            header {
+                font-size: 3vw;
+                padding: 2vh;
+            }
+
+            .browser-instructions {
+                padding: 10px;
+                margin: 2vh;
+            }
+        }
+
+        /* Sehr kleine Bildschirme (Bildschirmbreite bis 480px) */
+        @media (max-width: 480px) {
+            .container {
+                width: 95%;
+            }
+
+            header {
+                font-size: 4vw;
+                padding: 3vh;
+            }
+
+            .browser-instructions {
+                padding: 8px;
+                margin: 3vh;
+            }
+        }
+    </style>
+
+</head>
+<body>
+    <header>
+        <h1>Pop-ups erlauben</h1>
+    </header>
+    
+    <div class="browser-instructions">
+        <p> Wenn du bei der ersten Suche mehrere Webseiten auswählst wird oben in der Adressleiste eine Meldung erscheinen das die Pop-Ups blockiert wurden. Damit alle suchergebnisse angezeigt werden musst du die Pop-Ups erlauben.</p>
+        <p>Wenn die Pop-Ups erlaubt wurden lade die Seite neu.</p>
+    </div>
+    <div class="browser-instructions">
+        <h2>Google Chrome</h2>
+        <ul>
+            <li>Klicke auf das Pop-Up-Symbol in der Adressleiste.</li>
+            <img src="https://einkauf.diefleckenbuehler.de/public/chrome-popup.jpg" alt="Pop-ups in Firefox erlauben" class="responsive-image">
+            <li>Hier <strong>Pop-ups und Weiterleitungen</strong> immer zulassen.</li>
+            <img src="https://einkauf.diefleckenbuehler.de/public/chrome.jpg" alt="Pop-ups in Firefox erlauben" class="responsive-image">
+        </ul>
+    </div>
+    
+
+    <div class="browser-instructions">
+        <h2>Mozilla Firefox</h2>
+        <ul>
+            <li>Klicke auf das Einstellungen-Symbol in der Adressleiste.</li>
+            <img src="https://einkauf.diefleckenbuehler.de/public/firefox-popup.jpg" alt="Pop-ups in Firefox erlauben" class="responsive-image">
+            <li>Scrolle zu <strong>Pop-ups blockieren</strong> und stelle es auf <strong>Erlauben</strong>.</li>
+
+            <img src="https://einkauf.diefleckenbuehler.de/public/firefox.jpg" alt="Pop-ups in Firefox erlauben" class="responsive-image">
+        </ul>
+
+    </div>
+
+    <div class="browser-instructions">
+        <h2>Microsoft Edge</h2>
+        <ul>
+            <li>Klicke auf das Pop-Up-Symbol in der Adressleiste.</li>
+            <img src="https://einkauf.diefleckenbuehler.de/public/edge-popup.jpg" alt="Pop-ups in Firefox erlauben" class="responsive-image">
+            <li>Hier <strong>Pop-ups und Weiterleitungen</strong> immer zulassen.</li>
+            <img src="https://einkauf.diefleckenbuehler.de/public/edge.jpg" alt="Pop-ups in Firefox erlauben" class="responsive-image">
+
+        </ul>
+    </div>
+
+    <div class="browser-instructions">
+        <h2>Safari (macOS)</h2>
+        <ul>
+            <p>Klicke auf das Pop-Up-Symbol in der Adressleiste. Damit werden die Pop-Ups erlaubt</p>
+            <img src="https://einkauf.diefleckenbuehler.de/public/safari.jpg" alt="Pop-ups in Firefox erlauben" class="responsive-image">
+
+        </ul>
+    </div>
+
+    <footer>
+        <p>&copy; 2025 Einkauf Suche - Alle Rechte vorbehalten</p>
+      </footer>
+    
+
+</body>
+</html>
\ No newline at end of file
diff --git a/public/chrome-popup.jpg b/public/chrome-popup.jpg
new file mode 100644
index 0000000..fae6fd2
Binary files /dev/null and b/public/chrome-popup.jpg differ
diff --git a/public/chrome.jpg b/public/chrome.jpg
new file mode 100644
index 0000000..3d23f2d
Binary files /dev/null and b/public/chrome.jpg differ
diff --git a/public/edge-popup.jpg b/public/edge-popup.jpg
new file mode 100644
index 0000000..890801d
Binary files /dev/null and b/public/edge-popup.jpg differ
diff --git a/public/edge.jpg b/public/edge.jpg
new file mode 100644
index 0000000..e141d9c
Binary files /dev/null and b/public/edge.jpg differ
diff --git a/public/firefox-popup.jpg b/public/firefox-popup.jpg
new file mode 100644
index 0000000..bf4c9ff
Binary files /dev/null and b/public/firefox-popup.jpg differ
diff --git a/public/firefox.jpg b/public/firefox.jpg
new file mode 100644
index 0000000..8fb7757
Binary files /dev/null and b/public/firefox.jpg differ
diff --git a/public/safari.jpg b/public/safari.jpg
new file mode 100644
index 0000000..2cfbe35
Binary files /dev/null and b/public/safari.jpg differ