Retina Detection Media Query for working with Retina Background Images.

retina-media-query.css

div.logo {
    margin:0 auto;
    border:1px solid #666;
    width:400px;
    height:215px;
    background:url(james-n-nick.jpg) no-repeat;
 }
 
@media  only screen and (-webkit-min-device-pixel-ratio: 2),
        only screen and (-webkit-min-device-pixel-ratio: 1.5),
        only screen and (-moz-min-device-pixel-ratio: 2),
        only screen and (-o-min-device-pixel-ratio: 3/2),
        only screen and (-o-min-device-pixel-ratio: 2/1),
        only screen and (min--moz-device-pixel-ratio: 1.5),
        only screen and (min-device-pixel-ratio: 1.5),
        only screen and (min-device-pixel-ratio: 2) {
        /* Add your Retina Image Replacement Classes here. */
          div.logo {
            background:url([email protected]) no-repeat;
            background-size: 400px;
          }
        }