Eu apenas tropeceiessa questão e notei que o usuário está usando alguma notação que nunca vi antes:

@font-face {
   /* CSS HERE */
}

Então é isso@ símbolo algo novo no CSS3, ou algo antigo que de alguma forma eu esqueci? Isso é algo como onde, com um ID, você usa#e com uma classe que você usa.? O Google não me deu bons artigos relacionados a isso. Qual é o objetivo do@ símbolo em CSS?