Headings

Heading 1 with small text and a link

Heading 2 with small text and a link

Heading 3 with small text and a link

Heading 4 with small text and a link

Heading 5 with small text and a link

Heading 6 with small text and a link

Paragraphs

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ergo, si semel tristior effectus est, hilara vita amissa est? Aperiendum est igitur, quid sit voluptas; Nulla profecto est, quin suam vim retineat a primo ad extremum. Sed nimis multa. Murenam te accusante defenderem.

An dolor longissimus quisque miserrimus, voluptatem non optabiliorem diuturnitas facit? Hoc enim constituto in philosophia constituta sunt omnia. Quis hoc dicit? Facile est hoc cernere in primis puerorum aetatulis. Non est ista, inquam, Piso, magna dissensio. Ego vero volo in virtute vim esse quam maximam;

Quorum altera prosunt, nocent altera. Egone non intellego, quid sit don Graece, Latine voluptas? Sic vester sapiens magno aliquo emolumento commotus cicuta, si opus erit, dimicabit. Duo Reges: constructio interrete.

Ordered Lists

1. list item 1
2. list item 1
   1. list item 2
   2. list item 2
      1. list item 3
      2. list item 3
   3. list item 2
   4. list item 2
3. list item 1
4. list item 1

Unordered Lists

• list item 1
• list item 1
  1. list item 2
  2. list item 2
     1. list item 3
     2. list item 3
  3. list item 2
  4. list item 2
• list item 1
• list item 1

.list-arrows

• list item 1
• list item 1
• list item 1

.list-angles

• list item 1
• list item 1
• list item 1

.list-checks

• list item 1
• list item 1
• list item 1

Mixed Content Example

Ex quo, id quod omnes expetunt, beate vivendi ratio inveniri et comparari potest.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ita graviter et severe voluptatem secrevit a bono. Sed tu istuc dixti bene Latine, parum plane. Hoc enim identidem dicitis, non intellegere nos quam dicatis voluptatem. Quo plebiscito decreta a senatu est consuli quaestio Cn. Quae cum ita sint, effectum est nihil esse malum, quod turpe non sit. Duo Reges: constructio interrete. Et nemo nimium beatus est; An tu me de L. Hoc tu nunc in illo probas.

Nemo igitur esse beatus potest. Quid enim? Nam Pyrrho, Aristo, Erillus iam diu abiecti. Quis enim potest ea, quae probabilia videantur ei, non probare? Recte, inquit, intellegis. Equidem etiam Epicurum, in physicis quidem, Democriteum puto. Quare ad ea primum, si videtur; Ea, quae dialectici nunc tradunt et docent, nonne ab illis instituta sunt aut inventa sunt? Ita multo sanguine profuso in laetitia et in victoria est mortuus. Confecta res esset.

• Non igitur de improbo, sed de callido improbo.
• Atqui, inquam, Cato, si istud optinueris, traducas me ad te totum licebit.

Ubet igitur nos Pythius Apollo noscere nosmet ipsos. Non est enim vitium in oratione solum, sed etiam in moribus. Aliter enim nosmet ipsos nosse non possumus.

Quid est, quod ab ea absolvi et perfici debeat?

At enim sequor utilitatem. Si quae forte-possumus. Sed ad rem redeamus; Quid turpius quam sapientis vitam ex insipientium sermone pendere? Aliter homines, aliter philosophos loqui putas oportere? Aliter homines, aliter philosophos loqui putas oportere? Nonne videmus quanta perturbatio rerum omnium consequatur, quanta confusio? Si stante, hoc natura videlicet vult, salvam esse se, quod concedimus.

Ut placet, inquit, etsi enim illud erat aptius, aequum cuique concedere.

Quid enim ab antiquis ex eo genere, quod ad disserendum valet, praetermissum est? Itaque vides, quo modo loquantur, nova verba fingunt, deserunt usitata. Nam quid possumus facere melius? Duarum enim vitarum nobis erunt instituta capienda. Quod ea non occurrentia fingunt, vincunt Aristonem; Sed ea mala virtuti magnitudine obruebantur.

1. Conferam tecum, quam cuique verso rem subicias;
2. At iam decimum annum in spelunca iacet.
3. Sed vos squalidius, illorum vides quam niteat oratio.
4. Apparet statim, quae sint officia, quae actiones.

Grid Width Values

Use your CSS inspector to look up the current value. Since CSS is a work in progress at the time this document was made, the values may change.

(1)

(11)

(2)

(10)

(3)

(9)

(4)

(8)

(5)

(7)

(6)

(6)

Progress Bars

Accordions

• Accordion Item
  • Sub Item 1
  • Sub Item 2
• Another Item
  • Sub Item 1
  • Sub Item 2

Icons

Image based

.icon-contact-bubble

.icon-benefits-medical

.icon-benefits-dental

.icon-benefits-vision

.icon-benefits-life

.icon-benefits-disability

.icon-arrow-right-green-lg

Font Awesome based

.fa .fa-angle-right

.fa .fa-arrow-right

.fa .fa-exclamation

Alternate styles

.icon-circle