// All high DPI styles go here

@media only screen and (-webkit-min-device-pixel-ratio: 1.3),
	only screen and (	min--moz-device-pixel-ratio: 1.3),
	only screen and (	  -o-min-device-pixel-ratio: 1.3/1),
	only screen and (		 min-device-pixel-ratio: 1.3),
	only screen and (				 min-resolution: 125dpi),
	only screen and (				 min-resolution: 1.3dppx) {
	// Base high DPI styles (all widths)

	// Note: When overriding a background-image that is defined outside of a media query with a different image inside a media query,
	// the default Android browser on versions 3.0 or lower will download both the "normal" and "media-query" images.
	// This bug that can be fixed by buying a decent phone/tablet.

	// Defining everything within this Modernizr .backgroundsize style so the image is resized appropriately.

	.backgroundsize {

		.nav-toggle {
			span {
				background-image: image-url("hamburger-icon@2x.gif");
				@include background-size(17px 50px);
			}
		}

		.site-header-topbar .logo {
			@include replace-text("logo@2x.png");
			@include background-size(contain);
		}

		.video-loading {
			.graphic {
				background: image-url('logo-anim@2x.gif');
				@include background-size(contain);
			}
		}

		.block-alt-3 {
			background-image: image-url('bg-grid@2x.png');
			@include background-size(457px 261px);
		}

		&.multiplebgs .block-alt-3 {
			background-image: image-url('bg-grid.png'), bg-noise();
			@include background-size(457px 261px, auto);
		}

	}
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.3)	and (min-width: 48em),
	only screen and (	min--moz-device-pixel-ratio: 1.3)		and (min-width: 48em),
	only screen and (	  -o-min-device-pixel-ratio: 1.3/1)		and (min-width: 48em),
	only screen and (		 min-device-pixel-ratio: 1.3)		and (min-width: 48em),
	only screen and (				 min-resolution: 125dpi)	and (min-width: 48em),
	only screen and (				 min-resolution: 1.3dppx)	and (min-width: 48em) {
	// Styles for 768px and up (48*16), high DPI
	.backgroundsize {

	}
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.3)	and (min-width: 67.5em),
	only screen and (	min--moz-device-pixel-ratio: 1.3)		and (min-width: 67.5em),
	only screen and (	  -o-min-device-pixel-ratio: 1.3/1)		and (min-width: 67.5em),
	only screen and (		 min-device-pixel-ratio: 1.3)		and (min-width: 67.5em),
	only screen and (				 min-resolution: 125dpi)	and (min-width: 67.5em),
	only screen and (				 min-resolution: 1.3dppx)	and (min-width: 67.5em) {
	// Styles for 1080px and up (67.5*16), high DPI
	.backgroundsize {

	}
}