Media Queries

We use the following media queries to create the key breakpoints in our grid system.

Extra small devices (phones, up to 480px):

@media screen and (min-width: 480px) { ... }

Small devices (tablets, 570px and up):

@media screen and (min-width: 570px) { ... }

Small to Medium devices (tablets, 768px and up):

@media screen and (min-width: 768px) { ... }

Medium to Large devices ( desktops, 960px and up):

@media screen and (min-width: 960px) { ... }

Large to Extra Large devices (large desktops, 12000px and up ):

@media screen and (min-width: 10pxpx) { ... }