Cacher is the code snippet organizer for pro developers

@media
only screen and (-webkit-min-device-pixel-ratio: 2),
only screen and (   min--moz-device-pixel-ratio: 2), /* Looks like a bug, so may want to add: */
only screen and (   -moz-min-device-pixel-ratio: 2),
only screen and (     -o-min-device-pixel-ratio: 2/1),
only screen and (        min-device-pixel-ratio: 2),
only screen and (                min-resolution: 192dpi),
only screen and (                min-resolution: 2dppx) { 
    /* Your retina specific stuff here */
}

@media screen and (min-width: 800px) { ... }
@media screen and (device-aspect-ratio: 16/9) { ... }
@media screen and (resolution: 2dppx) { ... }

@media screen and (orientation: portrait) {}
@media screen and (orientation: landscape) {}


#visible-square {
  width: 20vmin;
  height: 20vmin;
}

/*
  1vw = 1% of the viewport width
  1vh = 1% of viewport height
*/