examples/css/colors.css
@media (max-width: 499px) {
  body {
    background-color: green;
  }
}

@media (min-width: 500px) and (max-width: 800px) {
  body {
    background-color: red;
  }
}
@media (min-width: 801px) {
  body {
    background-color: blue;
  }
}

examples/css/media-query-colors.html
<html>
<head>
<title>Media Query: Colors</title>
<link rel='stylesheet' href='colors.css' />
</head>
<body>
</body>
</html>