Custom webfonts not working

I followed two different questions/answers on this forum but my custom webfonts are not working (they are on the website, just not on the form). Here is the code I am using:

@import url("http://www.letourneauorgans.com/new2/fonts/calluna.css");

@font-face {

 font-family: "calluna_sansregular";

 src: url("http://www.letourneauorgans.com/new2/fonts/callunasansregular.eot") /* EOT file for IE */

}

@font-face {

 font-family: "calluna_sansregular";

 src: url("http://www.letourneauorgans.com/new2/fonts/callunasansregular.ttf") /* TTF file for CSS3 browsers */

}

.form-all {

 font-family: "calluna_sansregular", "Helvetica Neue", Helvetica, Arial, sans-serif !important;

}

Any hints?

Hi,

I'm currently testing the CSS for the webfont on this form. I will reply as soon as I found something.

As per further checking, I noticed that the reason why the form is not working is that our domain is not allowed to access the file.

Error message:

"Font from origin 'http://www.letourneauorgans.com' has been blocked from loading by Cross-Origin Resource Sharing policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://www.jotform.ca' is therefore not allowed access."

You need to allow us to access the files on your site so the font files will be loaded properly on your form.

This forum threads might help you in your configuration to allow

us to access your files:

http://webmasters.stackexchange.com/questions/71630/font-blocked-from-loading-by-cross-origin-resource-sharing-policy-no-access-co

http://stackoverflow.com/questions/25577981/font-from-origin-has-been-blocked-from-loading-by-cross-origin-resource-sharing