Border classes follow the following syntax:

size - type - [direction] - [media-query]

size - Seven options definied in variables: xxl, xl, lg, md, sm, xs, xxs or no for none
type - For border this is bor
direction - Direction the border should be applied: t, r, b, l (optional)
media-query - Breakpoint below which the class is active: lg, md, sm, xs (optional)


Styling the borders (i.e. colour and style) should be done inside a component.



.no-bor .lg-bor-l
.no-bor .lg-bor-r
.no-bor .lg-bor-l .lg-bor-r .lg-bor-b

.no-bor .xl-bor .lg-bor-on-md .md-bor-on-sm