Fonts and headlinesApproved

ShowCars default `font-family` is MakeItSans. Please use the predefined classes to increase or decrease the font size. You should not define explicit font sizes. To use the MakeItSans font, you don't have to do anything. #### Font sizes Several helper classes for font styling are available, the font sizes follow simple T-Shirt sizes. #### Headlines For styling `` elements please use `sc-font-*` classes directly. For example `

`

class font-size/line-height (viewport < 768px) font-size/line-height (viewport >= 768px)

`.sc-font-s` 0.8125rem (13px)
1.5 (19px) 0.8125rem (13px)
1.5 (19px)

`.sc-font-m` 1rem (16px)
1.5 (24px) 1rem (16px)
1.5 (24px)

`.sc-font-l` 1.25rem (20px)
1.4 (28px) 1.25rem (20px)
1.4 (28px)

`.sc-font-xl` 1.5rem (24px)
1.3 (31px) 1.75rem (28px)
1.3 (36px)

`.sc-font-xxl` 1.75rem (28px)
1.25 (35px) 2rem (32px)
1.25 (40px)

`.sc-font-hero` 1.5rem (24px)
1.3 (31px) 2.5rem (40px)
1.2 (48px)

class	font-size/line-height (viewport < 768px)	font-size/line-height (viewport >= 768px)
`.sc-font-s`	0.8125rem (13px) 1.5 (19px)	0.8125rem (13px) 1.5 (19px)
`.sc-font-m`	1rem (16px) 1.5 (24px)	1rem (16px) 1.5 (24px)
`.sc-font-l`	1.25rem (20px) 1.4 (28px)	1.25rem (20px) 1.4 (28px)
`.sc-font-xl`	1.5rem (24px) 1.3 (31px)	1.75rem (28px) 1.3 (36px)
`.sc-font-xxl`	1.75rem (28px) 1.25 (35px)	2rem (32px) 1.25 (40px)
`.sc-font-hero`	1.5rem (24px) 1.3 (31px)	2.5rem (40px) 1.2 (48px)