Special Class Names

The theme has some useful class names that you can use in a “CSS class name” fields in the builder or anywhere else if you are writing an HTML code.

Lightbox

rt_lightbox Add the class name to an image or video link (YouTube and Vimeo only) to the linked media in a lightbox window.

Boxed Design & Shadows

boxed Boxed design
shadow Shadow 1
shadow-2 Shadow 2
shadow-3 Shadow 3

Hover Styles

hover-shadow Shadow style on mouse over
hover-opacity Lower opacity on mouse over

Alignments

aligncenter
alignleft
alignright

Text Alignments

text-left Left aligned text.
text-center Center aligned text.
text-right Right aligned text.
text-justify Justified text.
text-nowrap No wrap text.

Text Alignments for Small Screens

mobile-text-left Left aligned text.
mobile-text-center Center aligned text.
mobile-text-right Right aligned text.

Bootstrap Class Names

You can use Bootstrap responsive class names. http://getbootstrap.com/css/#responsive-utilities-classes For example to hide an element only on small devices like smartphones you can use “hidden-xs” class name.

Typography Class Names

There is a class name for each selected font from the Typography Options. For example, to use the same font family that selected for headings in a module like tabular contents you can just use “heading-font” class name inside the css class name field of the module.

heading-font – Heading Font
body-font – Body Font
secondary-font – Secondary Font
menu-font – Menu Font
sub-menu-font – Sub-Menu Font

Colors

body-font-color – Body Font Color
primary-font-color – Primary Font Color
light-font-color – Light Font Color
heading-color – Heading Font Color