@media all and (min-width: 960px) {
  b {
    font-weight: normal;
  }
}
@media (min-width: 980px) {
  a {
    color: red;
  }
}
@media all {
  /* hey */
  p {
    color: blue;
  }
  p a {
    color: green;
  }
  p a:after {
    content: ">>";
  }

  span {
    display: inline-block;
  }
}
a b c {
  /* a */
  blee: blee;
  /* b */
  /* c */
  /* d */
  blah: blah;
}
a b c d e f {
  blah: blah;
  bloo: bloo;
}
@media print and (foo: 1 2 3), (bar: 3px hux(muz)), not screen {
  a b c g h, a b c i j {
    /* aa */
    hey: ho;
    /* bb */
    /* cc */
    haa: hoo;
    /* dd */
  }
  a b c g h k l m, a b c i j k l m {
    hee: fee;
  }
}

body {
  border-color: "#ccc";
}
@media only screen and (max-width: 900px) and (min-width: 400px) {
  body {
    border-color: black;
  }
}

@media only screen and (max-width: 23) and (min-width: 45) {
  hey {
    ho: hoo;
  }
}
@media (max-width: 200) and (min-width: 100) {
  div {
    color: red;
  }
}
@media not blah and (width: 200px) {
  div {
    color: brown, blue, black;
  }
}
@media screen and (max-device-width: 500px) {
  foo {
    bar: "works";
  }
}
div {
  color: red;
}
div span {
  color: blue;
}
@media screen {
  div span p {
    color: green;
  }
}