diff --git a/dev/js/src/init.js b/dev/js/src/init.js
index 7f6dce6..25fb06b 100644
--- a/dev/js/src/init.js
+++ b/dev/js/src/init.js
@@ -267,6 +267,9 @@
         });
       };
     });
+
+    // Media Query for adjusting dynamically added elements (e.g. hint)
+    const isSmallScreen = window.matchMedia('(max-width: 768px)').matches;
     
     // Function to toggle the shifted class on elements
     function shiftContent() {
@@ -277,7 +280,7 @@
       const results = document.querySelector('.found');
       const aside = document.querySelector('aside');
 
-      if (aside && aside.classList.contains('active')) {
+      if (aside && aside.classList.contains('active') && !isSmallScreen) {
         header.classList.add('shifted');
         if (!results) {
           main.classList.add('shifted');
@@ -296,11 +299,42 @@
     // when user types into the searchbar and clicks the sidebar (or anywhere
     // outside the searchbar) afterwards
     function adjustHintPosition() {
-      if (KorAP.Hint != undefined) {
-        KorAP.Hint.inputField().reposition();
-        KorAP.Hint.update();
-      };
-    };
+      const hint = document.querySelector('#hint');
+      const searchInput = document.querySelector('#q-field');
+      const aside = document.querySelector('aside');
+
+      if (hint && searchInput) {
+        // Create a temporary span to measure the exact text width
+        const span = document.createElement('span');
+        span.style.visibility = 'hidden';
+        span.style.position = 'absolute';
+        span.style.whiteSpace = 'pre';
+        // Copy the input's font properties
+        const inputStyle = window.getComputedStyle(searchInput);
+        span.style.font = inputStyle.font;
+        span.style.fontSize = inputStyle.fontSize;
+        span.style.fontFamily = inputStyle.fontFamily;
+        span.textContent = searchInput.value;
+        document.body.appendChild(span);
+
+        // Get the actual width of the text
+        const inputWidth = searchInput.value.length > 0 ? span.offsetWidth : 0;
+        document.body.removeChild(span);
+        let hintLeftPosition = inputWidth;
+
+        // TODO: This shouldn't be a fixed position!
+        if (aside && aside.classList.contains('active') && !isSmallScreen) {
+          hintLeftPosition += 230;
+        }
+        
+        hint.style.left = `${hintLeftPosition}px`;
+      }
+    }
+    //Can be solved more elegant witch ES6 (see optional chaining operator)
+    let qlf = document.querySelector('#q-field');
+      if(qlf != null){
+      qlf.addEventListener('blur', adjustHintPosition);
+    }
  
     // MutationObserver to detect when #hint is injected into the DOM
     const observer = new MutationObserver((mutationsList, observer) => {