Skip to content Skip to navigation

Site Retired

As of March, 2022, this website is no longer updated and has been replaced with a static copy.

Media Queries Code

If you want to override any of the Open Framework breakpoint styles, here are the media queries you should use:

/* Wider than desktop */
@media (min-width: 1200px) { ... }

/* Landscape phone to desktop */
@media (max-width: 1199px) { ... }

/* Landscape phone to landscape tablet */
@media (max-width: 979px) { ... }

/* Small desktop */
@media (min-width: 980px) and (max-width: 1199px) { ... }

/* Portrait tablet to landscape tablet */
@media (min-width: 768px) and (max-width: 979px) { ... }

/* Landscape phone to portrait tablet */
@media (max-width: 767px) { ... }

/* Landscape phones and smaller */
@media (max-width: 480px) { ... }