Firefox Cross-Site Access Error for Fonts - firefox

Question

We just started using Amazon Cloudfront's CDN to load our files and we are having trouble getting the #font-face fonts to load in Firefox. Per some recommendations, we added the following code to our htaccess file, but it doesn't seem to solve the problem.
<FilesMatch "\.(ttf|ttc|otf|eot|woff)$">
<IfModule mod_headers.c>
Header set Access-Control-Allow-Origin "*"
</IfModule>
</FilesMatch>
The fonts do show up sometimes, but we still see errors in the console for each font. You can check it out at http://wiredimpact.com.
Also, the main WordPress post I used to learn about this is http://wordpress.org/support/topic/plugin-w3-total-cache-font-face-not-working-in-firefox?replies=21.
Any suggestions on how to get the fonts to load in Firefox correctly?
Thanks.
Edit:
I adjusted the code used in htaccess to:
<FilesMatch "\.(ttf|ttc|otf|eot|woff|font.css)$">
<IfModule mod_headers.c>
Header set Access-Control-Allow-Origin "*.wiredimpact.com"
</IfModule>
</FilesMatch>
This not only adds the font.css file, which seems to help in Firefox, but it also only loads from our subdomains, which is better for security purposes. The fonts seem to be loading now in Firefox, but the errors are still showing up in the console.

Answer 1

As stated in icoMoon fonts doesn't show-up on Firefox by #meaganoff:
I was having issues with icomoon and Firefox as well. Have you tried
Paul Irish's 'bulletproof' #font-face syntax? It's a little
different than what icomoon outputs and I've had better luck with it -
no FF issues since.
#font-face {
font-family: 'Graublau Web';
src: url('GraublauWeb.eot?') format('eot'), url('GraublauWeb.woff') format('woff'), url('GraublauWeb.ttf')
format('truetype');
}
And worked like a charm!