Custom CSS classes

Change the appearance and behavior quickly and simply using these special predefined CSS classes.
All of these classes are conveniently available in page builder as dropdown list.

The classes on this page are ordered by popularity/usage.

Please note that the video is for a different theme, but the principle is the same.

set-colors-TYPE

Affecting row/column colors

Apply on column or row to set the predefined colors on it automatically, without needing to remember any color hex value. Use one of predefined color types for TYPE (all of these can be set in theme customizer): accent, header, navigation, header-info-widgets,content, sidebar, footer, footer-info-widgets, credits, error, info, neutral, success or warning.

Accent

Navigation

Sidebar

Error

Info

Neutral

Success

Warning

hover-color-TYPE

Affecting row/column colors

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

color-simple
color-simple light
color-simple dark
form-button-simple

Affecting buttons only

Apply on a button module or shortcode. Clears the button background color creating a simple outlined button. When only color-simple class applied, the button inherits the row/column text color. When simple light applied, white (light) button is displayed. With color-simple dark the button becomes dark outlined.

Apply the form-button-simple on a module, column or a row that contains a form. The submit button in the form will be styles as simple button (see above).

text-center
text-right

Affecting various elements

Centers text in the element or aligns it to the right respectively.

Easy Customization No coding required

Easy Customization No coding required

The theme is completely customizable and you can match it to your branding. Integrates with WordPress Customizer seamlessly.

Easy Customization No coding required

Easy Customization No coding required

The theme is completely customizable and you can match it to your branding. Integrates with WordPress Customizer seamlessly.

Easy Customization No coding required

Easy Customization No coding required

The theme is completely customizable and you can match it to your branding. Integrates with WordPress Customizer seamlessly.

inline
hide-title
bordered

Affecting Content Modules

Apply inline class on icon boxes to display the horizontal layout.
Apply hide-title class to hide the module title (the title will still be accessible).
Apply bordered class on posts list to draw border around items.

Easy Customization No coding required

Easy Customization No coding required

The theme is completely customizable and you can match it to your branding. Integrates with WordPress Customizer seamlessly.

Easy Customization No coding required

Easy Customization No coding required

The theme is completely customizable and you can match it to your branding. Integrates with WordPress Customizer seamlessly.

Custom Page Templates

Custom Page Templates

Choose from a selection of pre-made page templates to build your site. With Beaver Builder page builder plugin you can build a lot more!

Print Ready

Print Ready

The theme contains styles for effective printing of your website's pages in case your visitor decides to do so.

masonry

Affecting posts lists

Apply this class onto WM Content Module, WM Posts (custom posts) or WM Testimonials page builder module when displaying multiple items to apply masonry layout on them.

Jordan Ward

I'm very thankful to Polyclinic! Web accessibility refers to the inclusive practice of removing barriers that prevent interaction with, or access to websites, by people with disabilities.

Alt description of the image is required for accessibilityJordan Ward

Cynthia Munoz

Polyclinic was great. I needed a medical help and was very afraid to have my blood taken as all other medical professionals had said that my veins were deep.

Alt description of the image is required for accessibilityCynthia Munoz

Polyclinic definition

A clinic, hospital, or health care facility that treats a wide variety of diseases and injuries. When this is a hospital, it is also called a general hospital.

Alt description of the image is required for accessibilityJudy Ford

Accessible theme

This WordPress theme is fully accessible, ready for the widest range of your website visitors. It passes WordPress accessibility requirements.

Bobby Guzman

Albert Edwards

Polyclinic was great. I needed a medical help and was very afraid to have my blood taken as all other medical professionals had said that my veins were deep.

Alt description of the image is required for accessibilityAlbert Edwards

Kimberly Davidson

This WordPress theme is fully accessible, ready for the widest range of your website visitors. It passes WordPress accessibility requirements.

Kimberly Davidson
hide-media

Affecting posts list

Apply on WM Posts (custom posts) page builder module (for standard posts) to hide the post media (featured image, video or audio).

hide-excerpt

Affecting Staff posts list

Apply on WM Posts (custom posts) page builder module (for Staff posts) to hide the post excerpt text (if set). This will make sure only the basic info of Staff is displayed.

fullwidth

Affecting various elements

Apply on button to stretch it the whole width of the column.
Apply on photo module to stretch the small image the full width of the column (note that this is great for keeping images stretched on mobile devices).
Apply on element which contains a form and the form fields will be stretched to the column width.

button

Altering navigation items

Apply this class on a navigation menu item. Example can be seen in the website header.
* You will need to enable menu item classes in Screen Options in your WordPress admin beforehand, probably.

size-TYPE

Affecting divider only

Apply on WM Divider / Gap page builder module to set its width. Use one of predefined size types for TYPE: small, medium, large or extra-large.

Normal divider size:


Divider size altered with size class:





last
first

Affecting columns only

These classes change the alignment of columns. Apply on column to alter its large and medium screen (desktop and tablets landscape orientation) alignment. On mobile devices the columns will be stacked normally. Very useful for altering layouts (see the example below). Usually you will find yourself using last class only. The first class is added for completion.
(Tip: try to resize browser's window to see the effect bellow.)

No last class applied here. This is standard columns layout.

The last class is applied on the image column here. However, on mobile devices the columns are stacked as expected.