Hello @designbythink,
Your Menu Parent Page item issue is caused by your custom CSS. You have added this in Cornerstone > Theme Options > CSS:
.m1uj-h.x-anchor:hover .x-anchor-text-primary, .m1uj-h.x-anchor[class*="active"] .x-anchor-text-primary, [data-x-effect-provider*="colors"]:hover .m1uj-h.x-anchor .x-anchor-text-primary {
border-bottom: 3px solid #282828;
margin-bottom: -3px;
font-weight: 500 !important;
}
.m1ul-e.x-anchor:hover .x-anchor-text-primary, .m1ul-e.x-anchor[class*="active"] .x-anchor-text-primary, [data-x-effect-provider*="colors"]:hover .m1ul-e.x-anchor .x-anchor-text-primary {
border-bottom: 3px solid #282828;
margin-bottom: -3px;
}
.m1un-e.x-anchor:hover .x-anchor-text-primary, .m1un-e.x-anchor[class*="active"] .x-anchor-text-primary, [data-x-effect-provider*="colors"]:hover .m1un-e.x-anchor .x-anchor-text-primary {
border-bottom: 3px solid #282828;
margin-bottom: -3px;
}
.m1uk-e.x-anchor:hover .x-anchor-text-primary, .m1uk-e.x-anchor[class*="active"] .x-anchor-text-primary, [data-x-effect-provider*="colors"]:hover .m1uk-e.x-anchor .x-anchor-text-primary {
border-bottom: 3px solid #282828;
margin-bottom: -3px;
}
.m1uo-j.x-anchor:hover .x-anchor-text-primary, .m1uo-j.x-anchor[class*="active"] .x-anchor-text-primary, [data-x-effect-provider*="colors"]:hover .m1uo-j.x-anchor .x-anchor-text-primary {
border-bottom: 3px solid #282828;
margin-bottom: -3px;
}
.m1um-j.x-anchor:hover .x-anchor-text-primary, .m1um-j.x-anchor[class*="active"] .x-anchor-text-primary, [data-x-effect-provider*="colors"]:hover .m1um-j.x-anchor .x-anchor-text-primary {
border-bottom: 3px solid #282828;
margin-bottom: -3px;
}
Actually, you do not need to add any custom CSS to style your navigation menu parent. You can simply set a bottom order for the Top Links or in the Sublinks to be able to accomplish what you have in mind. Kindly check out the example pages I have created for you to demonstrate how it should be done without using any custom CSS.
See the secure note below.
Best Regards.