Menu alignment Help

[kaitlynwells]

 Hi! Bare with me, I'm not a dev, i know very basic HTML/CSS and that's it. I'm new to making templates in Hubspot, but alas I must do it. I have a 4 column menu in a footer I am trying to stylize. I originally started with one menu, but have now converted to 4 menus to feed into this template. I have disabled flyouts, as I want a list, but my child links are displaying to the right of my parent link. How do I get my child links to display UNDER the parent link???  I am also trying to get rid of the indent you can see to the left of the parent links. I applied the .custom-menu-primary class to each of my menus within the template. Here's what I'm working with: 

Picture of the menu as it is now:

Current CSS I have applied:

/* Parent List */
.custom-menu-primary .hs-menu-wrapper > ul{
background: #ecebeb;
font-size: 14px;
font-weight: bold;
line-height: 0.5em;
color: #5d5d5d;
margin-top: 20px;
padding: 0;
border-bottom: 1px solid;
border-color: #ccc;
text-indent: none;
display: block;
}
.custom-menu-primary .hs-menu-wrapper > ul > li{
color: #ccc;
text-indent: none;
}
.custom-menu-primary .hs-menu-wrapper > ul > li > a{
color: #ccc;
}
.custom-menu-primary .hs-menu-wrapper > ul > li > a:hover{
color: #009eff;
}

/* Child List */
.custom-menu-primary .hs-menu-wrapper > ul ul{
font-size: 14px;
font-weight: normal;
text-decoration: none;
display: block;
float: left;
}
.custom-menu-primary .hs-menu-wrapper > ul ul li{
}
.custom-menu-primary .hs-menu-wrapper > ul ul li a{
color: #cccccc;
}
.custom-menu-primary .hs-menu-wrapper > ul ul li a:hover{
color: #009eff;
}

[jennysowyrda]

Hi @kaitlynwells,

Do you have a sharable preview link to the page, or a link to the live page so we can take a look?

Thanks,
Jenny