/**
 * Retina Images
 */
// sass-lint:disable-all
@mixin retina-image {
	@media (-webkit-min-device-pixel-ratio: 1.3),
	(min--moz-device-pixel-ratio: 1.3),
	(-o-min-device-pixel-ratio: 2.6/2),
	(min-device-pixel-ratio: 1.3),
	(min-resolution: 1.3dppx) {
		@content;
	}
}
// sass-lint:enable-all

@mixin background-image-2x($filepath, $width, $height, $extension: '.png') {
	background-image: url('#{$filepath}#{$extension}');
	background-repeat: no-repeat;
	background-size: $width $height;
	@include retina-image {
		background-image: url('#{$filepath}@2x#{$extension}');
	}
}