Typography
Always use the FAO.org fonts to maintain consistency and ensure a professional appearance.
Font
If your service is on fao.org subdomain you must use the Open Sans font.
You should use an alternative typeface like Helvetica or Arial for services that are publicly available on different domains.
Headings
Ensure that headings are marked up semantically with the correct <h#> level HTML element. Apply Bootstrap styling using the appropriate heading class to maintain a consistent visual hierarchy throughout your service.
Heading 1
Heading 2
Heading 3
Heading 4
Heading 5
Heading 6
FAO Headings
Site title
Page title
Subtitle / Section
Subtitle / Section
Highlight title
Category
26/11/2020 Rome time
Paragraph
The default paragraph font size is inherited from Bootstrap (no need for class).
Paragraph
Photo caption, notes
Used mainly in news details and details pages.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A aliquid aperiam, aspernatur autem consequatur.
Blockquote
A blockquote can be inserted between two paragraphs. This will create a floating box of text. If you set a bold text at the end of the quote, it will be treated as an author
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras mattis sollicitudin imperdiet. Cras id porttitor nisl, vitae interdum metus. Cras sagittis orci consequat, lobortis felis id, vehicula justo.
Cras sagittis orci consequat, lobortis felis id, vehicula justo. Nulla suscipit magna sed aliquet tincidunt. Cicero Maecenas pretium libero dolor. Suspendisse fringilla odio nulla, tincidunt euismod eros sodales gravida. Sed vitae tincidunt lectus. Nulla suscipit magna sed aliquet tincidunt. Vestibulum eget ex vehicula, tempus nunc ac, ultrices arcu. Quisque non eros at quam dictum consectetur. Vestibulum elementum arcu sit amet consectetur pellentesque. Aliquam faucibus felis elit, ut euismod dui sodales a.
Duis vitae ligula quis ipsum scelerisque posuere. Morbi mollis, augue at pharetra facilisis, sapien risus elementum ligula, in tristique ante dolor vel ipsum. Vestibulum faucibus, turpis quis tincidunt consequat, ligula purus fringilla dolor, ac tempus risus tellus sit amet tellus. Vestibulum at tortor vel est condimentum ornare ut vitae ante. Vestibulum maximus tristique tempor. Cras accumsan diam nibh, vulputate facilisis dolor malesuada vel.