Row 1

Content on Top of Row 2

Call Out #1

These boxes should stack under Rows 1 & 3

Call Out #2

These boxes should stack under Rows 1 & 3

Row #2, with four Callout Modules
Content is on Bottom of Row 1 & 3
Negative margins on Row 2 & 4, z-index used for stacking

Call Out #3

These boxes should stack under Rows 1 & 3

Call Out #4

These boxes should stack under Rows 1 & 3

Row #3

Content on Top of Row #2 & on Bottom of Row #4

Call Out #1

These boxes should stack on Top of Rows 3 & 5

Call Out #2

These boxes should stack on Top of Rows 3 & 5

Row #4, with four Callout Modules
Content on Top of Row 3 & 5
Negative margins one Rows 2 & 4, z-index used for stacking

Call Out #3

These boxes should stack on Top of Rows 3 & 5

Call Out #4

These boxes should stack on Top of Rows 3 & 5

Row #5

Content on Bottom of Row #4

Here's the CSS used on this page:

/* Create a box around the Callout modules and set background-color */
div.fl-callout {background-color: #FEE; padding:80px 20px;
border-radius:10px; border:1px solid #000;}

/* Position & Z-Index to set Stacking */
#row1, #row2, #row3, #row4, #row5 {position:relative;}
#row1, #row3 {z-index: 2;}
#row4 {z-index: 4;}

/* Create negative top & bottom margins for Rows 2 & 4 */
#row2, #row4 {margin-top: -60px; margin-bottom: -60px;}