#menu  ul {
    list-style: none;
    margin: 0;
    padding: 0;
    background: blue;
    display: flex;
}
#menu ul li {
    position: relative;
    border-bottom: 1px solid #fff;
}

#menu ul li a {
    display: block;
    color: #fff;
    padding: 10px;
    text-decoration: none;
}


#menu ul li a:hover {
    background: darkgray;
}


#menu ul ul {
    display: none;
    position: absolute;
    left: 0px;
    top: 100%;
    width: max-content;
    background:blue ;
}

#menu ul li:hover > ul {
    display: block;
}
#menu ul ul ul {
    top: 0;
    left: 100%; 
}


.menu ul ul li {
    display: block;
    border-bottom: 1px solid white;
}