header dropdown not finnish

web/themes/custom/eql/scss/partials/_header.scss

@@ -9,7 +9,7 @@ display: block;
 }
 
 #header-top {
-    height: 7rem;
+    height: fit-content;
     background-color: $white;
     box-shadow: 1px 0px 8px $black;
     display: flex;
@@ -28,10 +28,12 @@ display: block;
         font-weight: 800;
 
         ul{
+
             list-style: none;
             display: flex;
             flex-direction: row;
             li {
+                // background-color: red;
                 padding-right: 1rem;
                 a {
                     color: $black;
@@ -42,16 +44,32 @@ display: block;
             } 
             .ul2{
                 flex-direction: column;
+                display: none;
+            }
+            :hover{
+                color: $blue-light;
             }
         }
-        :hover{
-            color: $blue-light;
+
+        li:not(ul):not(.ul2){
+            display: block;
+            position: relative;
+
         }
+        :hover {
+            .ul2{
+                display: block;
+                position: relative;
+                transition: ease-in-out 2s;
+            }
+        }
+        
     }
 
-    li ul {
+    li .ul1 {
         display: flex;
         flex-direction: column;
+
     }
 
 
@@ -62,7 +80,7 @@ display: block;
         color: $white;
         display: block;
         width: 7rem;
-        height: 7rem;
+        height: 100%;
         margin-top: 0;
         :hover{
             cursor: pointer;