diff --git a/components/themeselector.tsx b/components/themeselector.tsx
index e3e6ec1..8e771a6 100644
--- a/components/themeselector.tsx
+++ b/components/themeselector.tsx
@@ -45,9 +45,16 @@ export const StyleSelector = () => {
 
   const [test, setTest] = useState(false);
 
+  function  handleBlur(event:any) {
+    console.log(event)
+    if (!event.currentTarget.contains(event.relatedTarget)) {
+      setTest(false);
+    }
+  }
+
   return (
 
-    <ThemeDropDown>
+    <ThemeDropDown onBlur={(event) => handleBlur(event)}>
       <ThemeDropDownButton onClick={() => setTest(test => !test)}>{selectedTheme.themeName}</ThemeDropDownButton>
       <ThemeDropDownOptions id="themesDropdown" show={test}>
         {themes.map((theme) => (