Ver 1.1 - 03 02 2019

colors

heading h1.clr-1

heading h1.clr-2

heading h1.clr-3

hr

bkg-1

bkg-2

bkg-2

div.bkg-1

.light Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam pellentesque ante in neque sollicitudin pretium.

div.bkg-2

.light Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam pellentesque ante in neque sollicitudin pretium.

div.bkg-3

.light Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam pellentesque ante in neque sollicitudin pretium.

div.bkg-1

.light Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam pellentesque ante in neque sollicitudin pretium.

div.bkg-2

.light Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam pellentesque ante in neque sollicitudin pretium.

div.bkg-3

.light Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam pellentesque ante in neque sollicitudin pretium.

Typography

p Lorem ipsum dolor sit amet, EM consectetur STRONG adipiscing elit. Etiam pellentesque ante in neque sollicitudin pretium. Nullam sed nisi sagittis, volutpat arcu sed, semper nibh. Cras ac placerat nisi.

Salmple Link p Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam pellentesque ante in neque sollicitudin pretium. Nullam sed nisi sagittis, volutpat arcu sed, semper nibh. Cras ac placerat nisi.

Hi there! I'm a bike messenger by day, aspiring actor by night, and this is my website. I live in Los Angeles, have a great dog named Jack, and I like piña coladas. (And gettin' caught in the rain.)Steve Jobs

p Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam pellentesque ante in neque sollicitudin pretium. Nullam sed nisi sagittis, volutpat arcu sed, semper nibh. Cras ac placerat nisi.

p.lead headFusce dictum elit leo, non convallis felis placerat eu. In placerat ex at imperdiet ullamcorper.

p Lorem ipsum dolor sit amet, EM consectetur STRONG adipiscing elit. Etiam pellentesque ante in neque sollicitudin pretium. Nullam sed nisi sagittis, volutpat arcu sed, semper nibh. Cras ac placerat nisi.

Salmple Link.light p Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam pellentesque ante in neque sollicitudin pretium. Nullam sed nisi sagittis, volutpat arcu sed, semper nibh. Cras ac placerat nisi.

.light blockquote Hi there! I'm a bike messenger by day, aspiring actor by night, and this is my website. I live in Los Angeles, have a great dog named Jack, and I like piña coladas. (And gettin' caught in the rain.)Steve Jobs

.light p Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam pellentesque ante in neque sollicitudin pretium. Nullam sed nisi sagittis, volutpat arcu sed, semper nibh. Cras ac placerat nisi.

.light p.lead headFusce dictum elit leo, non convallis felis placerat eu. In placerat ex at imperdiet ullamcorper.

h1, .h1 Heading

h2, .h2 Heading

h3, .h3 Heading

h4, .h4 Heading

h5, .h5 Heading
h6, .h6 Heading

h1, .h1 Heading

h2, .h2 Heading

h3, .h3 Heading

h4, .h4 Heading

h5, .h5 Heading
h6, .h6 Heading

Heading .head-2

Heading .head-2

Heading .head-2

Heading .head-2

Heading .head-2
Heading .head-2

Heading .head-2

Heading .head-2

Heading .head-2

Heading .head-2

Heading .head-2
Heading .head-2

Heading .head-3

Heading .head-3

Heading .head-3

Heading .head-3

Heading .head-3
Heading .head-3

Heading .head-3

Heading .head-3

Heading .head-3

Heading .head-3

Heading .head-3
Heading .head-3

Lists

Aliquam posuere augue et sapien consequat iaculis.

  • ul li
  • Replenish Muscles
  • Anti-Oxidants(Anti-Aging)

Curabitur id fringilla diam, eget finibus magna.

Aliquam posuere augue et sapien consequat iaculis.

  • ul.lead
  • Replenish Muscles
  • Anti-Oxidants(Anti-Aging)

Curabitur id fringilla diam, eget finibus magna.

Aliquam posuere augue et sapien consequat iaculis.

  • .light ul li
  • Replenish Muscles
  • Anti-Oxidants(Anti-Aging)

Curabitur id fringilla diam, eget finibus magna.

Aliquam posuere augue et sapien consequat iaculis.

  • .light ul.lead
  • Replenish Muscles
  • Anti-Oxidants(Anti-Aging)

Curabitur id fringilla diam, eget finibus magna.

Aliquam posuere augue et sapien consequat iaculis.

  1. ol li
  2. Replenish Muscles
  3. Anti-Oxidants(Anti-Aging)

Curabitur id fringilla diam, eget finibus magna.

Aliquam posuere augue et sapien consequat iaculis.

  1. ol.lead
  2. Replenish Muscles
  3. Anti-Oxidants(Anti-Aging)

Curabitur id fringilla diam, eget finibus magna.

Aliquam posuere augue et sapien consequat iaculis.

  1. .light ol li
  2. Replenish Muscles
  3. Anti-Oxidants(Anti-Aging)

Curabitur id fringilla diam, eget finibus magna.

Aliquam posuere augue et sapien consequat iaculis.

  1. .light ol.lead
  2. Replenish Muscles
  3. Anti-Oxidants(Anti-Aging)

Curabitur id fringilla diam, eget finibus magna.

Aliquam posuere augue et sapien consequat iaculis.

  1. ol.num-list
  2. Curabitur id fringilla diam, eget finibus magna
  3. Curabitur id fringilla diam, eget finibus magna
  4. Curabitur id fringilla diam, eget finibus magna

Curabitur id fringilla diam, eget finibus magna.

Aliquam posuere augue et sapien consequat iaculis.

  1. ol.lead.num-list
  2. Curabitur id fringilla diam, eget finibus magna
  3. Curabitur id fringilla diam, eget finibus magna
  4. Curabitur id fringilla diam, eget finibus magna

Curabitur id fringilla diam, eget finibus magna.

Aliquam posuere augue et sapien consequat iaculis.

  1. ol.lead.num-list
  2. Curabitur id fringilla diam, eget finibus magna
  3. Curabitur id fringilla diam, eget finibus magna
  4. Curabitur id fringilla diam, eget finibus magna

Curabitur id fringilla diam, eget finibus magna.

Aliquam posuere augue et sapien consequat iaculis.

  1. ol.lead.num-list
  2. Curabitur id fringilla diam, eget finibus magna
  3. Curabitur id fringilla diam, eget finibus magna
  4. Curabitur id fringilla diam, eget finibus magna

Curabitur id fringilla diam, eget finibus magna.

Aliquam posuere augue et sapien consequat iaculis.

  • ul.featured
  • this list uses
  • font awesome
  • Feature item

Curabitur id fringilla diam, eget finibus magna.

Aliquam posuere augue et sapien consequat iaculis.

  • ul.featured.sub
  • this list uses
  • font awesome
  • Feature item

Curabitur id fringilla diam, eget finibus magna.

Aliquam posuere augue et sapien consequat iaculis.

  • ul.featured
  • this list uses
  • font awesome
  • Feature item

Curabitur id fringilla diam, eget finibus magna.

Aliquam posuere augue et sapien consequat iaculis.

  • ul.featured
  • this list uses
  • font awesome
  • Feature item

Curabitur id fringilla diam, eget finibus magna.

Buttons

.button .primary .secondary .success .alert .warning
.white
.button.hollow .primary.hollow .secondary.hollow .success.hollow .alert.hollow .warning.hollow
.white.hollow
.button.tiny .button.small .button .button.large .button.expand .button.small.expand

Fields & CF7 Forms

Icons Using Font Awesome

Structure Squeeze Containers

.squeeze-l

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

.squeeze-m

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

.squeeze-s

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.