/*
 * BREAKPOINT TESTS
 */
/*
 * Assume $breakpoint-default-feature
 * if only a number
 * $single-pixel-value: 500px;
 * $single-em-value: 30em;
 */
/* $breakpoint-to-ems: true; */
/*
 * Single value with feature
 * $feature-first : height 500px;
 * $value-first : 500px height;
 * $arbitrary-feature : lion 500px;
 * $feature-value-both-strings : portrait orientation;
 */
/* $breakpoint-to-ems: true; */
/*
 * Set min-width/max-width
 * if both values are numbers
 * $min-max-default-feature : 500px 700px;
 */
/* $breakpoint-to-ems: true; */
/*
 * Set min/max of feature
 * if there are two numbers and a feature
 * $feature-min-max : height 300px 700px;
 * $min-max-feature : 300px 700px height;
 * $arbitrary-feature-min-max : lion 300px 700px;
 */
/* $breakpoint-to-ems: true; */
/*
 * Multidimensional lists,
 * assume each item is a feature value pair
 * $multidimensional : max-width 700px orientation portrait;
 */
/* $breakpoint-to-ems: true; */
/*
 * 'OR' mediaqueries.
 * tests separated by commas
 * $basic-or : 500px, tv 700px color;
 */
/* $breakpoint-to-ems: true; */
/*
 * One-sided features (ie. monochrome)
 * $monochrome : monochrome;
 * $monochrome-double : 300px monochrome;
 * $multidimensional-plus-one-sided : max-width 700px orientation portrait monochrome;
 */
/* $breakpoint-to-ems: true; */
/*
 * One-sided features (ie. monochrome)
 * $not : not screen;
 */
/*
 * Double string feature (i.e. string: string)
 * $aspect-ratio : "min-aspect-ratio" "300/250";
 * $device-aspect-ratio : "max-device-aspect-ratio" "320/480";
 */
/*
 * One-sided features (ie. monochrome)
 * $not : not screen;
 */
.no-mq .legacy {
  content: '$legacy';
  content: '@media not screen and (min-width: 500px)';
}

/*
 * Resolution queries, device pixel ratio and standard resolution
 * $device-pixel-ratio: "resolution" 2dppx
 * $resolution: "min-resolution" 192dpi
 */
/*
 * Queries to test Breakpoint Get Context
 * $context-simple: 500px
 * $context-single: monochrome
 * $context-and: 500px 700px
 * $context-max: max-width 700px
 * $context-string: orientation portrait
 * $context-triple: height 800px 1000px
 * $context-media-type: print
 * $context-or: 500px max-height 1200px, 600px 700px
 * $context-complex: 500px, screen 500px 700px, 300px monochrome
 */
#dynamic {
  content: 'No Context!';
}
