Website Style Guide

Typography

Aa

Averta Standard
Regular

Aa

Averta Standard
Semibold

Aa

Averta Standard
Bold

The quick brown fox jumps over the lazy dog

Heading 1: Averta Standard - Bold - 36px

The quick brown fox jumps over the lazy dog

Heading 2: Averta Standard - Bold - 28px

The quick brown fox jumps over the lazy dog

Heading 3: Averta Standard - Bold - 20px

The quick brown fox jumps over the lazy dog

Heading 4: Averta Standard - Semibold - 18px

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. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat officia deserunt mollit anim id est laborum.

Paragraph: Averta Standard - Regular - 16px

Colours

Brand Primary: #0098E7
Main Header: #293348
Main Footer: #1D2433
Brand Secondary: #00669b
Project Header: #2C3137
Project Footer: #1B1D20

Button Styles

Rich Text Element - Blog

Heading 1 + Paragraph

Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.

Heading 2 + Unordered List

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur sagittis, lacus quis semper convallis, ipsum eros hendrerit mauris, at suscipit neque enim ut arcu. Pellentesque arcu libero, viverra in lacus quis, mattis lobortis turpis. Nunc fringilla, augue id sagittis lacinia, arcu nunc finibus turpis, quis semper urna massa et nisi. Nullam nisl purus, posuere et pretium ut, scelerisque vitae erat. Cras eget ultricies nulla. Fusce aliquam, nibh commodo faucibus dapibus, lectus quam eleifend enim, ut viverra ipsum nisi quis quam. Donec sit amet aliquam metus.

  • Lorem ipsum dolor sit amet, consectetur adipiscing elit.
  • Sed condimentum orci hendrerit aliquam cursus.
  • Nam vulputate augue nec diam mollis, egestas rutrum risus dapibus.
  • Proin interdum justo at mauris venenatis, sed accumsan massa fringilla.
  • Nullam ut leo eu justo mollis gravida eleifend ac ipsum.

Heading 2 - Unordered List

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur sagittis, lacus quis semper convallis, ipsum eros hendrerit mauris, at suscipit neque enim ut arcu. Pellentesque arcu libero, viverra in lacus quis, mattis lobortis turpis. Nunc fringilla, augue id sagittis lacinia, arcu nunc finibus turpis, quis semper urna massa et nisi. Nullam nisl purus, posuere et pretium ut, scelerisque vitae erat. Cras eget ultricies nulla. Fusce aliquam, nibh commodo faucibus dapibus, lectus quam eleifend enim, ut viverra ipsum nisi quis quam. Donec sit amet aliquam metus.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur sagittis, lacus quis semper convallis, ipsum eros hendrerit mauris, at suscipit neque enim ut arcu. Pellentesque arcu libero, viverra in lacus quis, mattis lobortis turpis. Nunc fringilla, augue id sagittis lacinia, arcu nunc finibus turpis, quis semper urna massa et nisi. Nullam nisl purus, posuere et pretium ut, scelerisque vitae erat. Cras eget ultricies nulla. Fusce aliquam, nibh commodo faucibus dapibus, lectus quam eleifend enim, ut viverra ipsum nisi quis quam. Donec sit amet aliquam metus.

Something goes here

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur sagittis, lacus quis semper convallis, ipsum eros hendrerit mauris, at suscipit neque enim ut arcu. Pellentesque arcu libero, viverra in lacus quis, mattis lobortis turpis. Nunc fringilla, augue id sagittis lacinia, arcu nunc finibus turpis, quis semper urna massa et nisi. Nullam nisl purus, posuere et pretium ut, scelerisque vitae erat. Cras eget ultricies nulla. Fusce aliquam, nibh commodo faucibus dapibus, lectus quam eleifend enim, ut viverra ipsum nisi quis quam. Donec sit amet aliquam metus.

Heading 3 + Paragraph + Image

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur sagittis, lacus quis semper convallis, ipsum eros hendrerit mauris, at suscipit neque enim ut arcu. Pellentesque arcu libero, viverra in lacus quis, mattis lobortis turpis. Nunc fringilla, augue id sagittis lacinia, arcu nunc finibus turpis, quis semper urna massa et nisi. Nullam nisl purus, posuere et pretium ut, scelerisque vitae erat. Cras eget ultricies nulla. Fusce aliquam, nibh commodo faucibus dapibus, lectus quam eleifend enim, ut viverra ipsum nisi quis quam. Donec sit amet aliquam metus.

Something goes here

Heading 2 + Orded List

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur sagittis, lacus quis semper convallis, ipsum eros hendrerit mauris, at suscipit neque enim ut arcu. Pellentesque arcu libero, viverra in lacus quis, mattis lobortis turpis. Nunc fringilla, augue id sagittis lacinia, arcu nunc finibus turpis, quis semper urna massa et nisi. Nullam nisl purus, posuere et pretium ut, scelerisque vitae erat. Cras eget ultricies nulla. Fusce aliquam, nibh commodo faucibus dapibus, lectus quam eleifend enim, ut viverra ipsum nisi quis quam. Donec sit amet aliquam metus.

  1. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
  2. Sed condimentum orci hendrerit aliquam cursus.
  3. Nam vulputate augue nec diam mollis, egestas rutrum risus dapibus.
  4. Proin interdum justo at mauris venenatis, sed accumsan massa fringilla.
  5. Nullam ut leo eu justo mollis gravida eleifend ac ipsum.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur sagittis, lacus quis semper convallis, ipsum eros hendrerit mauris, at suscipit neque enim ut arcu. Pellentesque arcu libero, viverra in lacus quis, mattis lobortis turpis. Nunc fringilla, augue id sagittis lacinia, arcu nunc finibus turpis, quis semper urna massa et nisi. Nullam nisl purus, posuere et pretium ut, scelerisque vitae erat. Cras eget ultricies nulla. Fusce aliquam, nibh commodo faucibus dapibus, lectus quam eleifend enim, ut viverra ipsum nisi quis quam. Donec sit amet aliquam metus.

Heading 4 + Blockquote

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur sagittis, lacus quis semper convallis, ipsum eros hendrerit mauris, at suscipit neque enim ut arcu. Pellentesque arcu libero, viverra in lacus quis, mattis lobortis turpis. Nunc fringilla, augue id sagittis lacinia, arcu nunc finibus turpis, quis semper urna massa et nisi. Nullam nisl purus, posuere et pretium ut, scelerisque vitae erat. Cras eget ultricies nulla. Fusce aliquam, nibh commodo faucibus dapibus, lectus quam eleifend enim, ut viverra ipsum nisi quis quam. Donec sit amet aliquam metus.

The rich text element allows you to create and format headings, paragraphs, block quotes, images, and video all in one place instead of having to add and format them individually. Just double-click and easily create content.

Heading 2 + Images + Paragraph

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur sagittis, lacus quis semper convallis, ipsum eros hendrerit mauris, at suscipit neque enim ut arcu. Pellentesque arcu libero, viverra in lacus quis, mattis lobortis turpis. Nunc fringilla, augue id sagittis lacinia, arcu nunc finibus turpis, quis semper urna massa et nisi. Nullam nisl purus, posuere et pretium ut, scelerisque vitae erat. Cras eget ultricies nulla. Fusce aliquam, nibh commodo faucibus dapibus, lectus quam eleifend enim, ut viverra ipsum nisi quis quam. Donec sit amet aliquam metus.

This is a caption between images

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur sagittis, lacus quis semper convallis, ipsum eros hendrerit mauris, at suscipit neque enim ut arcu. Pellentesque arcu libero, viverra in lacus quis, mattis lobortis turpis. Nunc fringilla, augue id sagittis lacinia, arcu nunc finibus turpis, quis semper urna massa et nisi. Nullam nisl purus, posuere et pretium ut, scelerisque vitae erat. Cras eget ultricies nulla. Fusce aliquam, nibh commodo faucibus dapibus, lectus quam eleifend enim, ut viverra ipsum nisi quis quam. Donec sit amet aliquam metus.

Rich Text Element - Projects

Heading 1 + Paragraph

Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.

Heading 2

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur sagittis, lacus quis semper convallis, ipsum eros hendrerit mauris, at suscipit neque enim ut arcu. Pellentesque arcu libero, viverra in lacus quis, mattis lobortis turpis. Nunc fringilla, augue id sagittis lacinia, arcu nunc finibus turpis, quis semper urna massa et nisi. Nullam nisl purus, posuere et pretium ut, scelerisque vitae erat. Cras eget ultricies nulla. Fusce aliquam, nibh commodo faucibus dapibus, lectus quam eleifend enim, ut viverra ipsum nisi quis quam. Donec sit amet aliquam metus.

Heading 2 + Image Caption

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur sagittis, lacus quis semper convallis, ipsum eros hendrerit mauris, at suscipit neque enim ut arcu. Pellentesque arcu libero, viverra in lacus quis, mattis lobortis turpis. Nunc fringilla, augue id sagittis lacinia, arcu nunc finibus turpis, quis semper urna massa et nisi. Nullam nisl purus, posuere et pretium ut, scelerisque vitae erat. Cras eget ultricies nulla. Fusce aliquam, nibh commodo faucibus dapibus, lectus quam eleifend enim, ut viverra ipsum nisi quis quam. Donec sit amet aliquam metus.

This is a caption after an image before a heading

Heading 2 + Images

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur sagittis, lacus quis semper convallis, ipsum eros hendrerit mauris, at suscipit neque enim ut arcu. Pellentesque arcu libero, viverra in lacus quis, mattis lobortis turpis. Nunc fringilla, augue id sagittis lacinia, arcu nunc finibus turpis, quis semper urna massa et nisi. Nullam nisl purus, posuere et pretium ut, scelerisque vitae erat. Cras eget ultricies nulla. Fusce aliquam, nibh commodo faucibus dapibus, lectus quam eleifend enim, ut viverra ipsum nisi quis quam. Donec sit amet aliquam metus.

This is a caption between images
This is a caption after an image