Tom Mollerus' Weblog

If you load up some stylin' web fonts on your server, call them in your stylesheet inside of a media declaration, and then view them in Chrome, Safari, or IE9, you'll be pleased with the results. Instead of the usual system fonts, your page with be rendered with the beautiful new fonts you called. Now try it in Firefox. Do you see those nice fonts? Nope. Gone.

The issue is with the use of both the media declaration and the web fonts. Which media values cause a problem? Looks like all of them (all, screen, print, etc.). Remove the media declaration and your web pages will then show the fonts your designer specified:

@media all { /* Remove this media declaration and start brace */
     @font-face { 
          font-family:"Frutiger";
          src:url("/fonts/frutiger.eot?iefix") format("eot");
     }
     @font-face {
          font-family:"Frutiger";
          src:url("/fonts/frutiger.eot?iefix");
          src:url("/fonts/frutiger.woff") format("woff"),
               url("/fonts/frutiger.ttf") format("truetype"),
               url("/fonts/frutiger.svg#frutiger") format("svg");
     }
} /* Remove this end brace */

If you need to keep your media declaration in your stylesheet, then I suggest that you just move all of your font-face calls to a new stylesheet.