Menu

Style Guide

Basic Typography

Headings

Open Sans old - h1

Open Sans Light - h2

Open Sans Bold - h3

Open Sans Bold - h4

Open Sans Bold - h5
Open Sans Bold- h6

Paragraphs

Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo.

Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo.

Lists

  • Text
  • Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo.
  • Text
  • Text
  1. Text
  2. Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo.
  3. Text
  4. Text

HTML Elements

UI Elements

Link Text


Form Elements







Display Elements

Column 1 Column 2 Column 3
Table Cell Table Cell Table Cell
Table Cell Table Cell Table Cell
Table Cell Table Cell Table Cell

Blockquote - Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Quote - Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Citation

Editions CEC Specifics

Colours

UI Elements

Standard buttons

Anchor w/ .button

Colour Modifiers

Size Modifiers - large

Size Modifiers - small

Using the anchor tag

.button .button--primary .button .button--secondary .button .button--cta

With Icon


.button .button--secondary

Just Icon