# Ribbons

### Ribbons default

###### Add class: `.ribbon`. It must be inside `.ribbon-wrapper` class. Content should be inside `.ribbon-content` class.

Ribbon

Duis mollis, est non commodo luctus, nisi erat porttitor ligula

Ribbon

Duis mollis, est non commodo luctus, nisi erat porttitor ligula

Ribbon

Duis mollis, est non commodo luctus, nisi erat porttitor ligula

Ribbon

Duis mollis, est non commodo luctus, nisi erat porttitor ligula

Ribbon

Duis mollis, est non commodo luctus, nisi erat porttitor ligula

Ribbon

Duis mollis, est non commodo luctus, nisi erat porttitor ligula

### Ribbons right align

###### Add class: `.ribbon-right`

Ribbon

Duis mollis, est non commodo luctus, nisi erat porttitor ligula

Ribbon

Duis mollis, est non commodo luctus, nisi erat porttitor ligula

Ribbon

Duis mollis, est non commodo luctus, nisi erat porttitor ligula

Ribbon

Duis mollis, est non commodo luctus, nisi erat porttitor ligula

Ribbon

Duis mollis, est non commodo luctus, nisi erat porttitor ligula

Ribbon

Duis mollis, est non commodo luctus, nisi erat porttitor ligula

### Vertical ribbons

###### Add class: `.ribbon-vertical-l` to display on left. Add class: `.ribbon-vertical-r` to display on right.

Duis mollis, est non commodo luctus, nisi erat porttitor ligula

Duis mollis, est non commodo luctus, nisi erat porttitor ligula

Duis mollis, est non commodo luctus, nisi erat porttitor ligula

Duis mollis, est non commodo luctus, nisi erat porttitor ligula

Duis mollis, est non commodo luctus, nisi erat porttitor ligula

Duis mollis, est non commodo luctus, nisi erat porttitor ligula

### Bookmarked ribbons

###### Add class: `.ribbon-bookmark` right after the `.ribbon` class.

Ribbon

Duis mollis, est non commodo luctus, nisi erat porttitor ligula

Ribbon

Duis mollis, est non commodo luctus, nisi erat porttitor ligula

Duis mollis, est non commodo luctus, nisi erat porttitor ligula

Duis mollis, est non commodo luctus, nisi erat porttitor ligula