Colors

These are the colors used throughout the site. Each has been assigned to a variable in the framework/variables.scss file.

Theme

Monotone Spectrum

Typography

These are our basic typographic styles. Make updates in the framework/typography.scss file.

Oswald

H1. The quick brown fox jumps over the lazy dog.

H2. The quick brown fox jumps over the lazy dog.

H3. The quick brown fox jumps over the lazy dog.

H4. The quick brown fox jumps over the lazy dog.

H5. The quick brown fox jumps over the lazy dog.

H6. The quick brown fox jumps over the lazy dog.

Montserrat

H1. The quick brown fox jumps over the lazy dog.

H2. The quick brown fox jumps over the lazy dog.

H3. The quick brown fox jumps over the lazy dog.

H4. The quick brown fox jumps over the lazy dog.

H5. The quick brown fox jumps over the lazy dog.

H6. The quick brown fox jumps over the lazy dog.

Large Paragraph

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec et justo sed dui feugiat cursus. Phasellus pharetra dui lobortis odio efficitur suscipit. Aenean condimentum ullamcorper ullamcorper. Nunc a tempus neque. Pellentesque nec pharetra purus. Proin fermentum purus non tortor posuere, vel convallis dolor interdum. Suspendisse aliquet felis metus, vel tempus purus tincidunt eget.

Base Paragraph

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec et justo sed dui feugiat cursus. Phasellus pharetra dui lobortis odio efficitur suscipit. Aenean condimentum ullamcorper ullamcorper. Nunc a tempus neque. Pellentesque nec pharetra purus. Proin fermentum purus non tortor posuere, vel convallis dolor interdum. Suspendisse aliquet felis metus, vel tempus purus tincidunt eget.

Small Paragraph

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec et justo sed dui feugiat cursus. Phasellus pharetra dui lobortis odio efficitur suscipit. Aenean condimentum ullamcorper ullamcorper. Nunc a tempus neque. Pellentesque nec pharetra purus. Proin fermentum purus non tortor posuere, vel convallis dolor interdum. Suspendisse aliquet felis metus, vel tempus purus tincidunt eget.

Blockquote

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam at porttitor sem. Aliquam erat volutpat. Donec placerat nisl magna, et faucibus arcu. John Doe

Lists

• Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ligula est, aliquam eu blandit ac, dictum nec erat.
• Nulla quis sapien non lacus rutrum mollis suscipit scelerisque velit. In hac habitasse platea dictumst.
• Duis in justo tincidunt, luctus ligula sed, placerat diam. Morbi eget tellus ipsum. Fusce iaculis maximus sem eget tincidunt.

1. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ligula est, aliquam eu blandit ac, dictum nec erat.
2. Nulla quis sapien non lacus rutrum mollis suscipit scelerisque velit. In hac habitasse platea dictumst.
3. Duis in justo tincidunt, luctus ligula sed, placerat diam. Morbi eget tellus ipsum. Fusce iaculis maximus sem eget tincidunt.

Buttons

These are our basic button styles. Make updates in the framework/buttons.scss file.

Cards

These are our card styles. Make updates in the framework/cards.scss file.

Basic Cards

Banner Cards

Accordions

These are our accordion styles. Make updates in the framework/accordions.scss file.

This is an accordion header.

Adipisicing aliqua proident occaecat do do adipisicing adipisicing ut fugiat culpa. Pariatur ullamco aute sunt esse adipisicing. Excepteur eu non eiusmod occaecat commodo commodo et ad ipsum elit. Pariatur sit adipisicing sunt excepteur enim nostrud pariatur incididunt.

This is an accordion header.

Adipisicing aliqua proident occaecat do do adipisicing adipisicing ut fugiat culpa. Pariatur ullamco aute sunt esse adipisicing. Excepteur eu non eiusmod occaecat commodo commodo et ad ipsum elit. Pariatur sit adipisicing sunt excepteur enim nostrud pariatur incididunt.

This is an accordion header.

Adipisicing aliqua proident occaecat do do adipisicing adipisicing ut fugiat culpa. Pariatur ullamco aute sunt esse adipisicing. Excepteur eu non eiusmod occaecat commodo commodo et ad ipsum elit. Pariatur sit adipisicing sunt excepteur enim nostrud pariatur incididunt.

Tiles

These are our tile styles. Make updates in the framework/tile.scss file.

Image Tiles

Image Tiles (Featured Display)

Heroes

These are our hero styles. Make updates in the hero.scss file.

Carousels

These are our table styles. Make updates in the framework/carousel.scss file.

We use Slick.js for carousels. For full documentation and options visit http://kenwheeler.github.io/slick/.

Full-Width Slider

Tabs

These are our tab styles. Make updates in the framework/tabs.scss file.

Notices

These are our basic notice styles. Make updates in the framework/notices.scss file.

Custom

Pagination

These are our pagination styles. Make updates in the framework/pagination.scss file.

• 1
• 2

• 1
• 2

• 1
• 2

• 1
• 2

• 1
• 2

• 1
• 2

• 1
• 2

Icons

A custom font set has been created using the IcoMoon App.

User Interactions & Social

We have some built-in functions that make use of data attributes to make sharing on common social networks easier. You can find out more by viewing the lib/wl-share.js file. Make updates in the social-links.scss or social.php files.

White Horizontal

Favicons

These are our website favicons and app icons.

Modals

These are our modal styles. Make updates in the framework/modals.scss file.

Loading Elements

These are our built-in options to add loaders to a section or page. Make updates in the loading.scss file.