.dnav-horz ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    color: pink;
    background-color: lightgrey;
}
  
.dnav-horz li {
    display: inline-block;
    width: 100px;
    text-align: center;
    padding: 5px 5px;
    color: black;
}

.dnav-horz li a {
    display: block;
    color: black;
    text-align: center;
    padding: 5px 5px;
    text-decoration: none;
    font-family: sans-serif;
}

.dnav-horz li:hover a:hover
{
    color: lightgrey;
    background-color: black;
}

.dnav-vert ul, .dnav-sub ul {
    list-style: none;
    padding: 0;
    margin: 0;
  }
  
  .dnav-vert li {
    display: block;
    background-color: lightgrey;
    text-decoration: none;
    padding: 5px;
    color: black;
  }
  
  .dnav-vert li:hover {
      background-color: black;
      color: lightgrey;
  }
  
  .dnav-vert li:hover .dnav-sub {
    display: block;
    max-height: 200px;
  }
  
  .dnav-sub li {
    background-color: lightgrey;
  }
  
  .dnav-sub li:hover {
    background-color: black;
    color: lightgrey;
  }
  
  .dnav-sub {
    overflow: hidden;
    max-height: 0;
    transition: all 0.5s ease-out;
  }