• Click 'Add layout style' in 'Fonts' tab of Design panel.
• Name: Add a specific name for a font style.
• Font: Where you can set the font-face, there are some standard font-face for your choice, but you can add upload your own font by clicking 'Upload font' button.
• Variants: You can set link styles for your font, new tabs will appear when checking on options. You can set style for specific link states. We usually use this for styling menus or buttons.
• Fallback font: The system hold several font names as a "fallback" system, if the browsers do not support the first font, it tries the next fonts.
• Size - Line height - Letter spacing: set the font-size and line-height for font, there are 4 units that we can set 'px', 'pt', 'em' and '%'. Letter-spacing is usually set for heading, we shouldn't set this for body text.  
• Color: Colour can be set directly or set up in Colors setting 
• Text transform - Alignment: Set up the text transform and the alignment.
• Visible for admins in text module: Check if you want to show in text module edit.

• Open 'Headings' in Design panel to add a new heading
• Title: set a name for heading
• Font: here we can add a font style which created in 'Fonts' settings. 
• H1 to H6 tag: set the html tag for heading. Be careful of using H1 tag, one page should have only one H1 for seo optimization. 
• Colors tab: It's different from setting up color for font, we can select multiple colours from Colors setting, we can switch colors in Heading edit. 
• Background tab: where we can add a background color/image for heading.
• Margin and padding tag: add margin to other elements or padding for itself.
• Border: heading usually has border, this is where we can set this.

We can change the font setting for Responsive steps by Font Overrides

• Click Add font overrides button on Fonts tab setting
• 'Name': set a name, normally we should use name of Layout steps (e.g., Desktop, Tablet, Mobile ...)
• Below are the created font styles, set the new font-size or line-height for font-style that you want to change in Responsive layout steps
• Go to 'Adaptations' tab in Advanced layout settings, set the font overrides at 'Select font overrides'.