html, body, .container {
  width: 100%;
  height: 100%;
}

.container {
  background: #ecf0f1;
  position: relative;
}

#logo_wrapper {
  width: 256px;
  height: 128px;
  position: absolute;
  left: 50%;
  top: 30%;
  transform: translate3d(-50%, -50%, 0);
}

#logo {
  width: 256px;
  height: 128px;
  position: absolute;
  transform-style: preserve-3d;
}

#logo_grey, #logo_white {
  position: absolute;
}

#logo_grey {
  background: url('../img/logo-main-grey.png') no-repeat;
  width: 256px;
  height: 128px;
  transform: scale(0.99);
}

#logo_white {
  background: url('../img/logo-main-white.png') no-repeat;
  width: 256px;
  height: 128px;
  transform: translateZ(10px);
}
html, body, .container {
  width: 100%;
  height: 100%;
}

.container {
  background: #ecf0f1;
  position: relative;
}

#logo_wrapper {
  width: 256px;
  height: 128px;
  position: absolute;
  left: 50%;
  top: 30%;
  transform: translate3d(-50%, -50%, 0);
}

#logo {
  width: 256px;
  height: 128px;
  position: absolute;
  transform-style: preserve-3d;
}

#logo_grey, #logo_white {
  position: absolute;
}

#logo_grey {
  background: url('../img/logo-main-grey.png') no-repeat;
  width: 256px;
  height: 128px;
  background-size: 256px 128px;
  transform: scale(0.99);
}

#logo_white {
  background: url('../img/logo-main-white.png') no-repeat;
  width: 256px;
  height: 128px;
  background-size: 256px 128px;
  transform: translateZ(10px);
}

@media all and (-webkit-min-device-pixel-ratio: 1.5) {
  #logo_grey {
    background-image: url('../img/logo-main-grey@2x.png');
  }
  
  #logo_white {
    background-image: url('../img/logo-main-white@2x.png');
  }
}

Make background-image work on Retina.
Make background-image work on Retina.
