Below are examples of the three variations of the component Tandem. All of these work best in a single column section, edge to edge, with no default top or bottom margin.
- Fade, where the text is one one side, and fades into photo on the other side.
- Stack, where the image is used as a background and a text box is stacked on top of it.
- Basic, where you have a text component on one side, and photo on the other. There are several drop shadow options for the photo.
Examples of these three are below.
Optional Overline
Left Fade Example
Optional Subhead
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec finibus eros a mi ornare pharetra. Proin faucibus odio ut sapien sollicitudin, eu efficitur augue aliquet. Integer id lorem eget ligula viverra posuere a ac nisl. Donec finibus nec purus eget congue. In hac habitasse platea dictumst. Vivamus maximus mauris eros, vitae finibus risus suscipit quis. Donec et elit tempor, ornare dolor suscipit, porttitor eros. Etiam neque diam, molestie ut nunc ac, gravida commodo dolor. Etiam sagittis, lectus non consequat mollis, leo odio fringilla nibh, eu bibendum lacus felis et tellus. Nam luctus in quam at egestas. Cras efficitur condimentum ligula ac posuere. Praesent ut pharetra elit. Nunc ultrices arcu ac lacus ultrices posuere. Mauris pretium a ipsum non scelerisque. Fusce risus ex, efficitur non dignissim non, sollicitudin vitae metus.
Optional Overline
Left Stack Example
Optional Subhead
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec finibus eros a mi ornare pharetra. Proin faucibus odio ut sapien sollicitudin, eu efficitur augue aliquet. Integer id lorem eget ligula viverra posuere a ac nisl. Donec finibus nec purus eget congue. In hac habitasse platea dictumst. Vivamus maximus mauris eros, vitae finibus risus suscipit quis. Donec et elit tempor, ornare dolor suscipit, porttitor eros. Etiam neque diam, molestie ut nunc ac, gravida commodo dolor. Etiam sagittis, lectus non consequat mollis, leo odio fringilla nibh, eu bibendum lacus felis et tellus. Nam luctus in quam at egestas. Cras efficitur condimentum ligula ac posuere. Praesent ut pharetra elit. Nunc ultrices arcu ac lacus ultrices posuere. Mauris pretium a ipsum non scelerisque. Fusce risus ex, efficitur non dignissim non, sollicitudin vitae metus.
Optional Overline
(Image Left) Basic Tandem Example
Optional Subhead
Praesent eget nunc pulvinar, fermentum sapien ut, suscipit justo. Suspendisse efficitur egestas libero venenatis tristique. In vel egestas ante. Sed finibus ipsum hendrerit, malesuada sapien sit amet, scelerisque velit. Aenean vulputate diam vitae mi imperdiet, eget ultrices ante tempus. Vestibulum accumsan elit non nunc sagittis commodo. Suspendisse accumsan suscipit nibh nec tempus. Cras quis ligula et lacus porta consectetur. Duis felis nisi, ullamcorper sed gravida a, vestibulum id eros. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
