Dark Title Heading

With a subtitle, set as H3

 

Simple page intro. Section is given #576EA4 bg color in Divi, text color set to light in Design tab. Alternatively, there is at least one generic dark banner images uploaded in the media folder.

The breadcrumb at the top of the page is its own section. The section block needs a CSS class “breadcrumb” added in the section’s advanced section. The home icon should be added, set to 14px. Three spaces between each element. That’s all.

Button below has double chevron added to text. Shift+option+\ on mac.

There’s an extra wide space between this text and the button. I saved a handful of spacers as code objects to the global library.

Standard H2 Heading

Standard content section on white. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras vitae aliquam nisi, id feugiat sem. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.

Standard H3 Heading

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras vitae aliquam nisi, id feugiat sem. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.

Montserrat H2 Heading

I am using montserrat as a secondary sans serif font where it feels right. Generally for text I would like to specially call out, or sometimes in intro sections of a page. I find it easiest to apply montserrat to a section or block of text by giving it a CSS Class “montserrat” in the advanced tab.

Additionally, this section has a light bg, set to #F2F5FA.

Color swatches

<div style="display:block; width: 100px; height: 100px; background-color: #113459"></div>
<div class="space twenty"></div>

#113459

<div style="display:block; width: 100px; height: 100px; background-color: #576EA4"></div>
<div class="space twenty"></div>

#576EA4

<div style="display:block; width: 100px; height: 100px; background-color: #F2F5FA; border: 1px solid gray"></div>
<div class="space twenty"></div>

#F2F5FA

<div style="display:block; width: 100px; height: 100px; background-color: #F0D2AC;"></div>
<div class="space twenty"></div>

#F0D2AC