Dot Dash Graphic

The Grid
The brand graphic is a dot-dash graphic created based on a grid. The height of the grid is the height of one dash. The brand graphic should be adjusted compositionally based on the layout and elements on the rest of the page. The goal is to create a well balanced composition based on the layout.
Ensure the measurement and alignment
follows the demonstrated example:
: The horizontal space between a dot and a dash is half of the width of one dot.
: Where the dotted dash overlaps a solid dash, the overlapping area doesn’t exceed 4 columns of dots and should align as suggested.

On navy
When using the dot dash graphic on a dark navy background, use 50% opacity gray as the base color and evenly distribute teal, citron, blue, and white as highlight color.

On white
When using the dot dash graphic on a white background, use gray with opacity as the base color and sprinkle in teal as the only highlight color.

Over photography
When using the dot dash graphic over photography, use white with opacity as the base color and use solid white as the highlight color.