Hiding Dashicons on sub menu items

Hello all,

I inserted a Dashicon down arrow on my main menu items that have dropdown sub menus. The CSS I used is:

.menu-item-has-children a:after {
	font: normal 1.9rem/1 'dashicons';
	content: " \f347" !important;
	display: inline-block;
	padding-left: 5px;
	vertical-align: middle;
}

To hide the down arrow on the sub menu items, I followed the above code with:

.menu-item-has-children .sub-menu li a:after {
	content: "";
}

I have used this CSS on several websites without problems, but for some reason, on this website, it’s not working.

I need a fresh set of eyes. Can anyone identify what’s going wrong?

The page I need help with: [log in to see the link]