Teaser

The teaser component promotes a piece of content and provides a call to action.

Note: There's also a modifier that can be applied to the parent container. .teaser--four-colors. By default blue, green and red are alternated if there are multiple teasers side by side. The .teaser--four-colors modifier adds in $midnight-blue to the mix.

.teaser--sbs
Side by side variation of the teaser component.
.teaser--pacific-blue
$color-pacific-blue color variation.
.teaser--apple-green
$color-apple-green color variation.
.teaser--stiletto-red
$color-stiletto-red color variation.
.teaser--midnight-blue
$color-midnight-blue color variation.
.teaser--hot-orange
$color-hot-orange color variation.