Custom CSS classes
Change the appearance and behavior simply
center-vertically CSS class
Apply on a row or a column. Centers columns content vertically in a row.
No vertical centering applied.
No vertical centering applied.
No vertical centering applied.
No vertical centering applied.
No vertical centering applied.
No vertical centering applied.
center-vertically on a row.
center-vertically on a row.
center-vertically on a row.
center-vertically on a row.
center-vertically on a row.
center-vertically on a row.
color-text-alt CSS class
Apply on a row or a column. The row/column content text colors will change according to alternative content text color setting in Customizer. You can use it for dark background elements, for example.
Lorem ipsum dolor sit amet
Consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.
Duis autem vel eum iriure dolor
Hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi.
Nam liber tempor cum soluta nobis eleifend facer assum.
Typi non habent claritatem insitam; est usus legentis in iis qui facit eorum claritatem. Investigationes demonstraverunt lectores legere me lius quod ii legunt saepius. Claritas est etiam processus dynamicus, qui sequitur putamus parum claram, anteposuerit litterarum formas humanitatis per seacula qui nunc nobis videntur parum clari, fiant sollemnes in futurum.
cubic CSS class
Apply on Posts module when displaying Projects posts. The class will apply a special mouse hover effect on the projects display.
fullwidth CSS class
Apply on Button to stretch it the whole width of the column. Apply it on Photo module to stretch the small image the full width of the column. Apply it on an element containing a form and the form fields will be stretched to the column width.
hover-color-TYPE CSS class
Apply on column to change it's colors on mouse hover. Use one of predefined color types for TYPE: error, info, neutral, success or warning.
Hover me.
Error
Hover me.
Info
Hover me.
Neutral
Hover me.
Success
Hover me.
Warning
inline CSS class
Apply on list widget (page builder module). Or wrap a list in DIV.inline to display the list items inline instead of each list item on a new line.
intro CSS class
When you disable the default intro heading, you can apply the intro class on the first row of your page builder layout. The automatic parallax effect will be applied on this row's content.
masonry CSS class
Apply this class onto Content Module, Posts or Testimonials module when displaying multiple items to apply masonry layout on them.
Taxpayers reclaim £493m from HMRC
HMRC has had to return nearly half-a-billion pounds to taxpayers since April…
Self-employed workers ‘failing to prepare financially’
Many self-employed workers and small businesses lack adequate savings, according to research.…
Employers face stricter rules over workers’ rights
A series of major reforms are set to change employment laws and…
3 in 4 SME owners plan to work past retirement age
Most leaders of small and medium-sized businesses plan to work past the…
Tax-free childcare fully rolled out
The government has announced its tax-free childcare scheme is open to all…
State pension ‘worst in the developed world’
The state pension in the UK falls behind all other developed countries,…
simple, simple light and simple dark
Apply on a Button module. Clears the button background color creating a simple outlined button. When only simple class applied, the button inherits the row/column text color. When simple light applied, white (light) button is displayed. With simple dark the button becomes dark outlined.
Column text color is set to blue.
sticky CSS class
Apply on page builder row only. This will stick the row below the sticky header once you scroll down to it.
Example can be seen on this page.
text-center CSS class
Centers text in the element. Plus changes layout for Content Module and Testimonials modules.