Custom CSS

Hea­dings title
Cus­tom CSS Class = accent-title-color

Hea­dings subtitle
Cus­tom CSS Class = accent-subtitle-color

Hea­dings icon
Cus­tom CSS Class = accent-icon-color

Hea­dings sepa­ra­tor (solid)
Cus­tom CSS Class = accent-border-color

Info Box (icons back­ground color)
Cus­tom CSS Class = accent-icon-bg

Info box (title)
Cus­tom CSS Class = accent-title-color

Info Box (sub­tit­le)
Cus­tom CSS Class = accent-subtitle-color

Just Icon (icon back­ground color)
Cus­tom CSS Class = accent-icon-bg

Just Icon (icons color)
Cus­tom CSS Class =accent-icon-color

Advan­ced Carou­sel (arrows back­ground color)
Cus­tom CSS Class = accent-arrow-bg

Add cus­tom class to rever­se colum­ns order on mobi­le device
hor-tablet-rever­se-col
vert-tablet-reverse-col
phone-reverse-col

Accent color:
Cus­tom CSS Class=“paint-accent-color”

Secon­da­ry color:
Cus­tom CSS Class=“color-secondary”

Title color:
Cus­tom CSS Class=“color-title”

High­light text:

Pas­te “.mas­thead” in “Con­tai­ners” field on Revo­lu­ti­on Slider set­tings page.

Extra class name for VC row or column: 

text-cen­te­red

Menu back­ground
.sub-nav,
.dt-mega-menu-wrap {
‑web­kit-bor­der-radi­us: 10px;
bor­der-radi­us: 10px;
}

Hover back­grounds
.top-hea­der .sub-nav.hover-style-bg li:not(.dt-mega-parent) > a,
.top-hea­der .hover-style-click-bg li:not(.dt-mega-parent) > a,
.top-hea­der .hover-style-click-bg li:not(.dt-mega-parent) > a .ripp­le­Ani­ma­te,
.top-hea­der .dt-mega-menu .sub-nav .dt-mega-parent .sub-nav a:hover {
‑web­kit-bor­der-radi­us: 10px;
bor­der-radi­us: 10px;
}

.sub-down­wards .main-nav .sub-nav .sub-nav {
pad­ding-left: 20px;
pad­ding-right: 20px;
}

.page-tem­p­la­te-tem­p­la­te-micro­si­te .top-bar {
dis­play: none;
}

Sin­gle img — Extra class name = layzr-bg-off

Cus­tom CSS settings :
.layzr-bg-off .layzr-bg {
back­ground-color: transparent;
}

.pro­ject-navi­ga­ti­on {
top: 30px;
right: 110px;
}