Page Style Guide – Overview

This Style Guide outlines the core design elements used across the website to ensure consistency, clarity, and a polished user experience. These standards apply to typography, buttons, and color usage throughout all pages.

Typography

Typography sets the tone and readability of the site. Our font styles are chosen for both professionalism and legibility across devices.

Headings (H1–H6):
- Used to structure content clearly and visually
- Bold and spaced appropriately for hierarchy

Paragraph Text:
- Clean and easy to read on all screen sizes
- Consistent font size and line height for body content
- Supports bold, italic, and links as needed

Buttons

Buttons are styled to be clear, clickable, and consistent, guiding users through key actions like submitting forms, navigating pages, or registering for events.

Colors

Our color palette is designed to reflect the your brand while remaining accessible and professional.

This guide ensures all visual elements stay on-brand and consistent across every page, making the site look polished and feel intuitive.

Typography
Buttons
Colors

Sample Title Text Using Heading 1

Sample Title Text Using Heading 2

Sample Title Text Using Heading 3

Sample Title Text Using Heading 4

Sample Title Text Using Heading 5

Sample Title Text Using Heading 6

General Sample Text

Leverage agile frameworks to provide a robust synopsis for high level overviews. Iterative approaches to corporate strategy foster collaborative thinking to further the overall value proposition. Organically grow the holistic world view of disruptive innovation via workplace diversity and empowerment.

List Styles

Sample Item Sample Item Sample Item	Sample Item Sample Item Sample Item	Sample Sample Sample	Sample Sample Sample
Sample Sample Sample	Sample Sample Sample	Sample Sample Sample	Sample Sample Sample
Sample Sample Sample

Button Styles

Button styles can be used throughout the website. When creating a insert/edit a link you can select from 5 different types of button styling.

Default	Primary
Secondary	Tertiary
Link	Sample Link

Button Styles that automatically detect if a document is linked:

There is a script designed to enhance document download links that are styled with the sui-sf-c-btn class. It specifically targets links that end with common document file extensions such as .pdf, .doc, .docx, .ppt, .pptx, .xls, and .xlsx. For each matching link, the script performs the following actions:

Link with Adobe PDF	Link with PowerPoint
Link with Microsoft Excel	Tertiary

Site Colors

The following colors were used within the site, these can be used as a override on the text colors within the editor.

Primary Colors

Main - Usage primary used links or buttons

#8f66b9

Primary Alternative Colors

Dark- Alternative
#F8D200