Skip to main content

Image sizes

Homepage header image

  • Anchor point: Bottom center of header image location
  • Size: 1170px wide × 375px high

The image will be scaled to the following sizes at responsive stop-points:

  • xs: 750px × 240px (clipped at left & right on smaller displays)
  • sm: 750px × 240px
  • md: 970px × 311px
  • lg: 1170px × 375px

Not supported for xl or 2xl viewports (if enabled)

Masthead bleed

  • Anchor point: Top left of container (under cut-out)
  • Size: 1170px wide × 110px high (default)
  • Size: 1570px wide × 110px high (if xl viewport enabled)
  • Size: 1870px wide × 110px high (if 2xl viewport enabled)

The image should be the largest of these based on the enabled viewport.

Border images

Note that on displays wider than 1920px (xl: 2320px, 2xl: 2620px) or taller than 1200px, border images will scale (so they do not need to fade to a solid colour or tile).

Left border

  • Anchor point: Left edge of container
  • Size: 375px wide × 1200px high

Right border

  • Anchor point: Right edge of container
  • Size: 375px wide × 1200px high