Tout Modules

Layered Touts

1. Right
   Tout module with a gradient fill, call to action on the left and product image on the right.
2. Left
   Tout module with a gradient fill, product image on the left and call to action on the right.
3. Bottom
   Tout module with a gradient fill, product image in the middle and a call to action with positioning based on viewport.
4. Middle
   Tout module with a dark solid fill, product image horizontally aligned in the middle, but flush to the top. Call to action is placed below.
5. Middle Left
   Tout module with a dark solid fill, product image horizontally aligned in the middle, but aligned to the left. Call to action is aligned right.
6. Middle Right
   Tout module with a dark solid fill, product image horizontally aligned in the middle, but aligned to the right. Call to action is aligned left.

---

Fill Touts

1. Right
   Tout module with a full bleed image background, call to action text on the right.
2. Left
   Tout module with a full bleed image background, call to action text on the left.
3. Center
   Tout module with a full bleed image background, call to action text center(ish).

---

Light Touts

1. Center
   Tout module light version, centered content.
2. Left
   Tout module light version, left content.
3. Right
   Tout module light version, right content.