Styles

Styles are an additional tool that may be used to customize the look of content. Please note, not all styles will work with all types of content; the type of content each style will work with is provided in parenthesis. 

To apply a style, place your cursor in the specified location for that particular content type and then select the style from the drop-down menu.

Text and Image Styling

To use text styles, place your cursor anywhere in the line of text the style needs to be assigned and then select the style to apply it. Please note, these styles are assigned to the entire section of content, not just a single section of content (i.e., a single word in a paragraph cannot be isolated to style, the entire paragraph will be styled.

HEADING STYLE (H1)

Lead (Text)

Fine Print (Text)

Clear Left-Right (Text)
This style is used to clear text beneath an image, so that any text following the image and its associated text will not wrap around the image. 

To use this style:

1. Place cursor in the last line of text that needs to appear next to the image
2. From the "Styles" dropdown menu, select "Clear Left-Right (Text)"

Make Responsive (Image)
Any image inserted inline with surrounding content (i.e., images inserted directly into content or into a "Grid"), should have the the style "Make Responsive (Image)" applied. This style does not need to be added to images inserted into the pre-stylized Snippets. Adding the style ensures that the image retain it's original height-width ratio when resized across most devices. 

To use this style:

1. Insert image.
2. In the "Insert/Edit Image" dialog box, from the "Class" dropdown menu, select "Make Responsive (Image)"

Hero Condensed (Image)
There may be instances when you want to display a hero on a page, but you need a reduced height. 

To use this style:

1. Insert the Hero
2. Insert the image to be used in the Hero.
3. In the "Insert/Edit Image" dialog box, from the "Class" dropdown menu, select "Hero Condensed (Image)"

Please note, when in "Edit" mode, you may have an inaccurate visual display of the image height. Use the "Preview" tab to verify actual image height.

List Styling

List Unstyled and List Styling
There may be instances in which you need to encode text as an unordered list so that the information is presented as a grouped item for assistance technology, but the visual list item indicator needs to be removed. This need typically only arises for sections of navigation, but other unique instances may arise.

Each item in the list must have the style manually applied.

• Item One
• Item Two - the style "List Unstyled (List)" is applied
• Item Three

Tables

The following styles are available as pre-styled "Snippets." The style can be changed after a table is inserted.

To change the a table style after it is inserted:

1. Please your cursor anywhere in the table.
2. For the editing ribbon, select "Table"
3. From the dropdown menu, select "Table Properties"
4. From the "Class" dropdown, select a new table style

Condensed (Table)