Layout

Hide classes
c-disp-block
c-disp-block--tablet
c-disp-block--mobile
c-disp-inline--block
c-disp-inline--text
c-disp-none
c-flex-h--wrap
c-flex-h
c-flex-h--reverse-mobile
c-flex-h--align-top
c-flex-h--align-center
c-flex-h--align-center--mobile
c-flex-h--align-bottom
c-flex-h--justify-left
c-flex-h--justify-center
c-flex-h--justify-center--tablet
c-flex-h--justify-right
c-flex-h--justify-between
c-flex-h--justify-space
c-flex-v--wrap
c-flex-v
c-flex-v--align-left
c-flex-v--align-center
c-flex-v--align-right
c-flex-v--justify-top
c-flex-v--justify-center
c-flex-v--justify-bottom
c-flex-v--justify-between
c-flex-grow
c-flex-static

Width mobile

Grids

Max width

Height

spacing mb (margin-bottom)

mb-auto
mb-0--mobile
mb-2-5--mobile
mb-5
mb-10
mb-10--mobile
mb-15
mb-15--mobile
mb-20
mb-20--mobile
mb-30
mb-30--tablet
mb-30--mobile
mb-40
mb-50
mb-50---tablet
mb-50---mobile
mb-60
mb-70
mb-100
mb-150

spacing pb (padding-bottom)

pb-5
pb-10
pb-15
pb-20
pb-30
pb-40
pb-50
pb-50--tablet
pb-50--mobile
pb-100
pb-150
pb-200
pb-250

spacing mt (margin-top)

mt-auto
mt-0--tablet
mt-0--mobile
mt-5
mt-10
mt-20
mt-30
mt-40
mt-50
mt-100

spacing pt (padding-top)

pt-0--mobile
pt-0--mobile
pt-5
pt-10
pt-20
pt-30
pt-40
pt-50
pt-60
pt-100
pt-100---mobile
pt-150
pt-180
pt-200

spacing mr-ml (margin left-right)

mr-auto
mr-0--mobile
mr-5
mr-10
mr-20
mr-30
mr-40
mr-50
mr-100
ml-auto
ml-0--mobile
ml-5
ml-10
ml-20
ml-30
ml-40
ml-50
ml-100

spacing mx (margin x-axis)

mx-auto
mx-10
mx-10--mobile
mx-20
mx-30

spacing pr-pl (padding left-right)

pr-0--tablet
pr-5
pr-10
pr-20
pr-30
pr-40
pr-50
pr-70
pr-100
pr-225
pl-5
pl-10
pl-20
pl-30
pl-40
pl-50
pl-70
pl-100

spacing pxy (padding x-y axis)

pxy-10
pxy-20
pxy-30

spacing px (padding x-axis)

px-0
px-0---mobile
px-5p--tablet
px-5p--mobile
px-10
px-20
px-20
px-30
px-30
px-50
px-75
px-100

spacing py (padding y-axis)

py-10
py-20
py-30
py-50--mobile
py-60
py-70--mobile
py-100
py-150
py-150

Position

c-static--tablet
c-static--mobile
c-relative
c-relative-z1
c-absolute
c-absolute--full
c-absolute--top-right

Text alignement

tx--align-left

tx--align-center

tx--align-center--mobile

tx--align-right

Text styles

Heading 1

Heading 2

Heading 2--mobile

Heading 3

Heading 4

Heading 5
Heading 6
Heading 6
p--subheading
p--subheading--mobile
p--subheading--sm

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.

tx--condensed

tx--bold

tx--underline

tx--strikethrough

tx--italic

tx--uppercase

  • this is a test
  • this is a placeholder
Play button

Rich text

This is an H1

The rich text element allows you to create and format headings, paragraphs, blockquotes, images, and video all in one place instead of having to add and format them individually. Just double-click and easily create content

This is an H2

The rich text element allows you to create and format headings, paragraphs, blockquotes, images, and video all in one place instead of having to add and format them individually. Just double-click and easily create content

This is an H3

The rich text element allows you to create and format headings, paragraphs, blockquotes, images, and video all in one place instead of having to add and format them individually. Just double-click and easily create content

This is an H4

The rich text element allows you to create and format headings, paragraphs, blockquotes, images, and video all in one place instead of having to add and format them individually. Just double-click and easily create content

This is an H5

The rich text element allows you to create and format headings, paragraphs, blockquotes, images, and video all in one place instead of having to add and format them individually. Just double-click and easily create content

This is an H6

The rich text element allows you to create and format headings, paragraphs, blockquotes, images, and video all in one place instead of having to add and format them individually. Just double-click and easily create content

This is a link

Caption

This is an un-ordered list

  • This is an item
  • This is an item
  • This is an item
  • This is an item
  • This is an item
  • This is an item

This is an ordered list

  1. This is an item
  2. This is an item
  3. This is an item
  4. This is an item
  5. This is an item
  6. This is an item

Text Colours

tx--white

tx--nectar-light

tx--nectar-60

tx--beige-10

tx--black

tx--earth

tx--love

tx--heart

tx--spirit

tx--essence

tx--beige-80

tx--beige-90

BG Colours

bg-gradient--nectara

bg--black

bg--earth

bg--love

bg--white

bg--nectar-light

bg--spirit-10

bg--spirit-20

bg--heart-10

bg--heart-40

bg--beige-10

bg--beige-20

bg--beige-80

bg--beige-90

Dropdowns

Dropdown

Images

Blonde Woman Profile
Blonde Woman Profile
Blonde Woman Profile
Blonde Woman Profile