Skip to Main Content
 Menu
Close

Examples

Overview

Your custom WordPress theme uses several open source frontend frameworks to simplify building a mobile responsive website. The primary frameworks are Bootstrap 4 and Font Awesome 5.

CSS/HTML features within these frameworks should work on your website. We highly recommend familiarizing yourself with the bootstrap documentation. On top of these frameworks are custom CSS classes that give a range of access to branding colors and other tools to maintain a consistent website. If you need help always remember that you can email support@fullmedia.com. Full Media support can always add additional custom CSS in the future.

 

H1 Title Tag

 font-size: 2.6rem;
font-weight: 600;
color: #5b98af;
font-family: brandon-grotesque,sans-serif;

H2 Title Tag

 font-size: 2.2rem;
font-weight: 400;
color: #9ecfca;
font-family: brandon-grotesque,sans-serif;

H3 Title Tag

 font-size: 2.0rem;
font-weight: 400;
color: #7cbeb7;
font-family: brandon-grotesque,sans-serif;

H4 Title Tag

 font-size: 1.8rem;
font-weight: 400;
color: #c3beb5;
font-family: brandon-grotesque,sans-serif;
H5 Title Tag
 font-size: 1.6rem;
font-weight: 400;
color: #aca599;
font-family: brandon-grotesque,sans-serif;
H6 Title Tag
 font-size: 1.4rem;
font-weight: 400;
color: #958d7d;
font-family: brandon-grotesque,sans-serif;

Boostrap Grid / Rows & Columns

You can use the boostrap grid for highly customized rows and columns to better position your content within larger sections. Bootstrap 4 Grid

Two Column Row

Block
Block

Three Column Row

Block
Block
Block

Four Column Row

Block
Block
Block
Block

Boostrap Padding & Margins

Your site uses the standard padding (inner spacing) and marging (outer spacing) to better position elements and text. Bootstrap Layout Utilities
Padding 5
Padding 4
Padding 3
Padding 2
Padding 1
Padding 0
Margin 5
Margin 4
Margin 3
Margin 2
Margin 1
Margin 0

Font Awesome 5 - Icon Set

Font Awesome 5 Docs

Connection Icons

Social Icons



Using Font Awesome in WordPress

One quick tip on Font Awesome. The Gutenberg and WYWISG editors in the site will disappear/strip your icons in visual mode that are "empty". FontAwesome website will give you this:


Always turn that into this:


The editors strip/remove empty tags. The "sr-only" class means "Screen Reader Only". So the text in the middle is visually hidden, but helps with readability for the visually impaired.
Gainesville Ballet Company © 2025
Website by Full Media