Help needed troubleshooting dropdown menu issue in HTML and CSS. Using :hover to switch from display:none; to display:flex;. Want submenu to appear when hovering over "Unsere Produkte". Grateful for any assistance. Thank you.
/* Desktop Navigation Bar fixed*/
.hidden{
display:none;
flex-direction: column;
position: absolute;
z-index: -5;
background-color: #FFFEF9;
padding-left:2%;
padding-right:2%;
transition: all .375s;
}
.hidden a{
margin-top: 5%;
margin-bottom: 5%;
background-color: #FFFEF9;
}
.hidden a:hover{
color: #BF9D1D;
}
#produkt:hover > .hidden {
display:flex;
z-index: 888;
flex-direction: column;
position: absolute;
z-index: -5;
background-color: #FFFEF9;
padding-left:2%;
padding-right:2%;
transition: all .375s;
}<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link rel="stylesheet" type="text/css" href="styles.css">
</head>
<body>
<div class="fixed-nav">
<div class="header">
<div class="col-1 head-1"></div>
<div class="col-3"></div>
<div class="col-1 sans-serif-caption xy">
<div class="header-box1 col-4 sans-serif-caption">
<li class="space"><a href="#UeberUns">Über Uns</a></li>
<li class="space hidden-1">
<a id="produkt">Unsere Produkte</a>
<ul class="hidden">
<a href="#">Unterfußdüngung mit KS NP MIX</a>
<a href="#">HARMI-SOIL 8.0/15 </a>
<a href="#">Agrimax Konzentrat</a>
</ul>
</li>
</div>
<div class="header-box2 col-4">
<li>
<image src="media/logo_2.svg" alt="logo"/>
</li>
</div>
<div class="header-box1 sans-serif-caption col-4">
<li class="sans-serif-caption space"><a href="#Kontakt">Kontakt</a></li>
<div class="search sans-serif-caption">
<input type="text" placeholder="Suche">
<image src="media/search-24px.svg" alt="search-icon" />
</div>
<div class="language-button row sans-serif-caption">
<image src="media/language-24px.svg" alt="language-icon" width="14px" height="14px"/>
<a>de</a>
</div>
</div>
</div>
</div>
</div>
</body>
</html>