Trying to use a font with Web Projects and it won't show up

While trying to use Sweet-Sans-Pro on a website I used https://use.typekit.net/jfa0afd.css as the call to get the code. The link was provided through the Web Project.

@11220649-face {

  font-family:"sweet-sans-pro";
src:url("https://use.typekit.net/af/48b521/00000000000000007735c634/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n9&v=3") format("woff2"),url("https://use.typekit.net/af/48b521/00000000000000007735c634/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n9&v=3") format("woff"),url("https://use.typekit.net/af/48b521/00000000000000007735c634/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n9&v=3") format("opentype");

I included this in my sites CSS and then referenced it in the H1 tag

h1 {
  font-family:'sweet-sans-pro';
  font-size:30px;
}

But the font doesn't populate.

Am I missing something? I have another font on the site that I'm including in the same exact way and that is functioning correctly.