Styling bullets in main menu

Hello!

This might not be a strictly Customizr related question, but as this is the theme I am using and knowing many of you are CSS experts, I’d like you to please help in this question:

Here’s the website: https://lafede.tecnolongia.org

In the main menu you may see white/orange bullets depending on the active/non-active/hover status of the menu item. This bullets are built with the following code:

header .nav > li > a:before {
	margin-right: -5px;
	font-family: genericons;
	content: '\f428';
	font-size: 40px;
	vertical-align: middle;
}

In Firefox this looks ok, but in Chrome and IE bullets are smaller and badly placed.

Could anyone explain me why this happens and/or provide another solution for this?

Thank you very much!!!

Jaume