@Media



/* CSS Document */
// Small screens 
@media only screen { } /* Define mobile styles */ 
@media only screen and (max-width: 40em) { } /* max-width 640px, mobile-only styles, use when QAing mobile issues */ 
// Medium screens 
@media only screen and (min-width: 40.063em) { } /* min-width 641px, medium screens */ 
@media only screen and (min-width: 40.063em) and (max-width: 64em) { } /* min-width 641px and max-width 1024px, use when QAing tablet-only issues */ 
// Large screens @media only screen and (min-width: 64.063em) { } /* min-width 1025px, large screens */ 
@media only screen and (min-width: 64.063em) and (max-width: 90em) { } /* min-width 1025px and max-width 1440px, use when QAing large screen-only issues */ 
// XLarge screens 
@media only screen and (min-width: 90.063em) { } /* min-width 1441px, xlarge screens */ 
@media only screen and (min-width: 90.063em) and (max-width: 120em) { } /* min-width 1441px and max-width 1920px, use when QAing xlarge screen-only issues */ 
// XXLarge screens 
@media only screen and (min-width: 120.063em) { } /* min-width 1921px, xxlarge screens */

@highdensity:  ~"only screen and (-webkit-min-device-pixel-ratio: 1.5)",
               ~"only screen and (min--moz-device-pixel-ratio: 1.5)",
               ~"only screen and (-o-min-device-pixel-ratio: 3/2)",
               ~"only screen and (min-device-pixel-ratio: 1.5)";

@small:        ~"only screen and (max-width: 750px)";
@medium:       ~"only screen and (min-width: 751px) and (max-width: 900px)";
@large:        ~"only screen and (min-width: 901px) and (max-width: 1280px)";
@extra-large:  ~"only screen and (min-width: 1281px)";

@print:        ~"print";
Tagged: