You may want to use a specific font in your web, CATI web screens or CAPI survey. For this, there are a few steps to follow (based on an Askia internet template):

1/ Make sure that you get a few different versions of your font. Some browsers are able to handle some specific font extensions while some others not. So, basically, to cover all the needs, you will need to have your font in the following format(s). You can use an online font converter for this:

*.woff
*.woff2
*.eot
*.otf
*.svg

2/ Add the different font as miscellaneous files in resources.

3/ In Design > Internet Options > Main CSS, add the following piece of code (where 'fightt' = the name of the font you will use):

@font-face {
font-family: 'my_font';
src: url('??ResPath??fightt.eot');
src: url('??ResPath??fightt.otf') format('truetype'),
url('??ResPath??fightt.woff') format('woff'),
url('??ResPath??fightt.eot?#iefix') format('embedded-opentype'),
url('??ResPath??fightt.svg#QuadrantaBold') format('svg');
font-weight: normal;
font-style: normal;
}

4/ In Design > Internet Options > Header/Footer > Head, add this in your CSS properties:

/* Global font family - font size and color for the responses*/
body, td, th, div, p, pre, a, span, li, input, select, textarea, label, legend {
font-family: "my_font";
font-size: 1.0em;
line-height: 1.0em;
outline: none;
text-decoration: none;
}

5/ On the web server side, on IIS, please ensure that you add MIME types for the font extensions you will use:

.eot -> application/vnd.ms-fontobject
.woff -> application/font-woff 
.svg -> image/svg+xml 
.otf -> application/font-sfnt .eot

With these options, you will get your specific font on all data collection modes that use web screens.

Web:

CATI (with the web screens option):

Tablets (iOS / Android):