section.left {
    display: flex;
    justify-content: left;
}

nav#v_menu1 {
    border: 4px solid orangered;
    margin-top: 50px;
}

nav#v_menu1 > ul {
    list-style: none; /* get rid of them bullets */
    
}

nav#v_menu1 > ul > li {
    border: 4px solid yellow;
    margin: 4px;
    /* the main list item is the parent of the submenu */
    position: relative; /* i want to position the submenu absolute */
    min-width: 180px;
}

nav#v_menu1 a {
    border: 0px solid orangered;
    display: block;
    padding: 8px 16px;
    text-decoration: none;
}

nav#v_menu1 a:hover {
    background-color: #FFC;

}

nav#v_menu1 ul.submenu {
    position: absolute;
    top: 0px; left: 100%;
    width: 180px;
    display: none; /* remove the submenu from default view/display */
    padding-left: 12px;
    list-style: none;
}

nav#v_menu1 > ul > li:hover > ul.submenu {
    display: block;
}

nav#v_menu1 ul.submenu li {
    background-color: darkgreen;
    margin: 4px;
    list-style: none;
}