Images should be the max height of the grid col they will reside in.

Here are full, 2, and 3 col sizes

• container width = 1140 x any height. mobile = 544px x any height
• 2 col desktop stacked on mobile = 570px x any height for each image (code example below)
• 3 col desktop stacked on mobile = 380px x any height for each image - for this one there needs to be extra work. when they stack their cols will be 544px but they are only 380 so you can do one of two things. change class from img-fluid to img-full to stretch the width OR - use a picture tag and make sure the mobile version is 544px

You can apply the same picture tag to any of the images in the other col structures as well or just use img tags.

COMPRESS ALL IMAGES BEFORE PLACING ON THE CDN

You can put any HTML tags you would like in these pages as well but assuming you will mostly use images

Here are some text color classes if you need some color changes

• text-white / text-black = white and black
• text-brand-primary = plum
• text-brand-secondary = teal
• text-brand-gray = simon gray
• text-gray = #757575

Wanna hide stuff? use hidden-[breakpoint]-[up/down] as a class to hide an element. So hidden-sm-down on this element will hide it on mobile. breakpoints include - xl, lg, md, sm, xs - hidden-xs-up or down hides it across the board

There are other utils. Ask Alex for more details

Here's some tables - add class table-responsive to make a table responsive (horiz scroll if necessary on mobile)