/* -------------------------------------------------------------------- *
 *  Micro Clearfix 
 *  http://nicolasgallagher.com/micro-clearfix-hack/
 */
/* -------------------------------------------------------------------- */
@media (max-width: 400px) {
  .test {
    content: "Breakpoint 1 (A)";
  }
}
@media (max-width: 400px) {
  .test {
    content: "Breakpoint 1 (B)";
  }
}
.no-media-queries .test {
  /* Fallback for browsers not supporting media queries */
  content: "Breakpoint 1 (B)";
}
@media (min-width: 401px) and (max-width: 800px) {
  .test {
    content: "Breakpoint 2 (A)";
  }
}
@media (min-width: 401px) and (max-width: 800px) {
  .test {
    content: "Breakpoint 2 (B)";
  }
}
.no-media-queries .test {
  /* Fallback for browsers not supporting media queries */
  content: "Breakpoint 2 (B)";
}
@media (min-width: 801px) {
  .test {
    content: "Breakpoint 3 (A)";
  }
}
@media (min-width: 801px) {
  .test {
    content: "Breakpoint 3 (B)";
  }
}
.no-media-queries .test {
  /* Fallback for browsers not supporting media queries */
  content: "Breakpoint 3 (B)";
}
@media (min-width: 40em) and (max-width: 80em) {
  .test {
    content: "Breakpoint 4 (A)";
  }
}
@media (min-width: 40em) and (max-width: 80em) {
  .test {
    content: "Breakpoint 4 (B)";
  }
}
.no-media-queries .test {
  /* Fallback for browsers not supporting media queries */
  content: "Breakpoint 4 (B)";
}
@media (max-width: 400px) {
  .test {
    content: "Forcing legacy support";
  }
}
.no-media-queries .test {
  /* Fallback for browsers not supporting media queries */
  content: "Forcing legacy support";
}
@media (min-width: 401px) and (max-width: 800px) {
  .test {
    content: "Custom legacy selector";
  }
}
.ie8 .test {
  /* Fallback for browsers not supporting media queries */
  content: "Custom legacy selector";
}