I am working on a Pardot landing page which shows a simple form. 
Now the customer wants us to use a custom font on the landing page for which a *.woff file was provided to us.

I uploaded the font file to Pardot (Marketing>Content>Files) and now am in the middle of editing the Layout Template for my landing page but I can't get the form on my landing page to start using my custom font.


Here are the first 14 lines of my Layout Template where I declare my uploaded font.

    <!DOCTYPE html>
    <html lang="en">
    <head>

    <!-- Loading custom fonts -->
    <style type="text/css">
    @font-face {
      font-family: "test_font";
        src: url('http://go.pardot.com/blahblahblah/blahblah/fontname.woff') format('woff');
    }
    #pardot-form {
    font-family:'test_font';
    }
    </style>

Any ideas as to why the form on my landing page is not using this font to display the names of the fields??

EDIT: Here are the errors I get from the console:

CSS3115: @font-face failed cross-origin request. No Access-Control-Allow-Origin header.

CSS3119: No fonts available for @font-face rule