Top C

Top-c with its default module styling.

Top D

Top-d with its title4 module suffix.

Top E

Top-e with its title5 module suffix.

Top F

Top-f using its title6 module class suffix.

Header A

Header-a with its default styling.

Header B

Header-b with its box1 class suffix.

Header C

Header-c with its default styling.

Header D

Header-d with its box2 class suffix.

Header E

Header-e with its default styling.

Header F

Header-f with its box3 class suffix.

Feature A

Feature-a with its default styling.

Feature B

Feature-b with its default styling.

Feature C

Feature-c with its box4 class suffix.

Feature D

Feature-d with its default styling.

Feature E

Feature-e with its box5 class suffix.

Feature F

Feature-f with its default styling.

Utility A

Utility-a with its title6 class suffix.

Utility B

Utility-b with its default styling.

Utility C

Utility-c with its default styling.

Utility D

Utility-d with its title4 class suffix.

Utility E

Utility-e with its default styling.

Utility F

Utility-f with its title5 class suffix.

Showcase A Module

Showcase-a, using the box1 bottomshadow module class suffix.

Showcase B Module

Showcase-b, using the box2 shadow1 module class suffix.

Showcase D Module

Showcase-d, using the box4 module class suffix.

MainTop A Module

The MainTop-a module position, using its default module styling.

MainTop B Module

The MainTop-b module position, using its default module styling.

MainTop D Module

The MainTop-d module position, using its default module styling.

Content Top C

Content-Top-c using its title2 module class suffix.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec sit amet nibh. Vivamus non arcu.

Module Variations

Module Variations allow you to individually style a module Enter any available suffixes at Extensions → Module Manager → Module → Module Class Suffix

There are 30 suffixes: box1-5, title1-6, shadow1-9, notice1-4; flush, flushtop, flushbottom; plus standardcase, uppercase and lowercase.

Box: 5 variations to change the background of the module.
Title: 6 suffixes that vary the appearance of the module title.
Shadow: 9 suffixes which adds a drop shadow to the module.
Notice: 4 suffixes to match custom typography notices.
Standard/Upper/Lower Case: change the case style of the module title.
Flush/FlushTop/FlushBottom: removes the margin/padding around the module surround.

Content Bottom C

The Content-Bottom-c module position, using its title3 module class suffix.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec sit amet nibh. Vivamus non arcu.

Sidebar A

All Sidebar positions can be alternated, such as Side Main Side.

This is done via a sliding configuration option in the template manager.

Sidebar A

Sidebar-a using its title5 module suffix.

Sidebar A

Sidebar-a using its box3 shadow3 module class suffix.

Sidebar A

Sidebar-a using its box4 shadow6 module class suffix.

Sidebar B

Sidebar-b using its title4 module suffix.

Sidebar B

Sidebar-b using its default module styling.

Sidebar B

Sidebar-b using its title6 module suffix.

Sidebar B

Sidebar-b using its default module styling.

Sidebar B

Sidebar-b using its box5 shadow9 suffix.

The MainBottom-a module position, using its notice1 module suffix.

The MainBottom-b module position, using its notice2 module suffix.

The MainBottom-d module position, using its notice3 module suffix.

Features Menu

Sidepanel

The Sidepanel position appears on every page. Therefore, the Mainbody grid is forced from full width to a distribution of 9.

There is a legacy function to force a full mainbody width if that is necessary. You will need to append ?layoutmode=component to the URL, such as via RokNavMenu.

Suffix Combinations

Note: You can compound multiple suffixes together such as title2 standardcase flush. There are over 200 possible stylistic combos. The order must be box → title → icon → button for style combos, such as box2 title2 shadow2

Sidepanel

The Sidepanel module position, using its default module styling.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec sit amet nibh. Vivamus non arcu.

Sidepanel

The Sidepanel module position, using its default module styling.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec sit amet nibh. Vivamus non arcu.

The Bottom-a module position, using its notice4 module suffix.

Bottom B

Bottom-b using its default module styling.

Bottom E

Bottom-e using its default module styling.

Bottom F

Bottom-f using its default module styling.

Footer A

Footer-a using its default module styling.

Footer B

Footer-b using its default module styling.

Footer C

Footer-c using its default module styling.

Footer D

Footer-d using its default module styling.

Footer E

Footer-e using its default module styling.

Footer F

Footer-f using its default module styling.

Copyright - Default Module Styling

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum at sem ut ipsum vestibulum euismod. Mauris et massa porta leo facilisis feugiat. Suspendisse id neque a sem facilisis blandit. Aliquam sem leo, commodo ut, rutrum auctor, iaculis nec, eros. Aenean massa. Mauris tincidunt. Vivamus consectetur, tortor sit amet dictum sagittis, urna lectus dapibus metus, ut congue ligula odio sed nunc. Suspendisse potenti.