Add divider/separator between specific hamburger menu pages?

I need some help with getting a simple CSS code that adds a divider/separator between my 4.th and 5.th menu page. I have a total of 8 pages on the hamburger menu and need to separate half of them from the other half. I have squarespace 7.1. This modification would only apply to the mobile version of the site. 

Can you share site url? We can help easier

I did some research in CSS and managed to pull it off. Thanks for offering help tho! This was the kind of code I was looking for:

.header-menu-nav-item:nth-child(4) {
border-bottom: 1px solid;
padding-bottom: 1em;
}
.header-menu-nav-item:nth-child(5) {
padding-top: 1em;
}

HOWEVER... how do I make this not apply to subfolders?

On 10/2/2021 at 9:48 PM, veahkki said:

I did some research in CSS and managed to pull it off. Thanks for offering help tho! This was the kind of code I was looking for:

.header-menu-nav-item:nth-child(4) {
border-bottom: 1px solid;
padding-bottom: 1em;
}
.header-menu-nav-item:nth-child(5) {
padding-top: 1em;
}

HOWEVER... how do I make this not apply to subfolders?

Can you share site url? We can check easier