media-queries.scss

//
//  Media Queries
//  —·—·—·—·—·—·—·—·—·—·—·—

// NOTE: a 93.75% reduction in full resolution width was 
//       made for the desktop breakpoints to accommodate 
//       browser chrome and small vertical spaces in 
//       approximating a full-screen browser on that
//       specific resolution.

// 1 pixel TO —>
$break-mobile-landscape: "screen and (min-width: 480px)";  // Mobile devices in landscape TO —>
$break-tablet-portrait: "screen and (min-width: 768px)";   // Tablets in portrait TO —>
$break-computer-safe: "screen and (min-width: 960px)";     // Old or small desktops (1024) and landscape tablets TO —>
$break-computer-common: "screen and (min-width: 1280px)";  // Most common desktop resolution (1366) TO —>
$break-computer-wide: "screen and (min-width: 1575px)";    // Other desktop resolutions (1680, 1600, 1440) TO —>
$break-computer-large: "screen and (min-width: 1800px)";   // Large screen desktops (1920) TO —>
$break-computer-pro: "screen and (min-width: 2250px)";     // Retina iMacs and such TO —> ∞!