/* ==================================================

	Skin combination states

	Both skins on: leopard sits under the flagwave, so the ground is layered in one declaration. Two-class scope outranks either skin's body rule.

	@related colors

================================================== */

@media ( min-width: 1077px ) {

	.has-skin-deel.has-skin-bombay body {
		background-color: var(--bombay-beige);

		background-image:
			url("../../images/deel-flagwave.gif"),
			url("../../images/leopard-print.png");

		/* @match leopard_tile_size - leopard ground tile width */
		background-size:
			560px auto,
			457.5px auto;

		background-repeat:
			repeat,
			repeat;
	}

}

/* -------------------------------------
	=Mobile

	Flagwave is a fixed sheet here, so only the leopard goes back on the ground - against the Deel rule that blanks it.
------------------------------------- */

@media ( max-width: 1076px ) {

	.has-skin-deel.has-skin-bombay .profile-card__cover {
		background-image: url("../../images/leopard-print.png");
		background-image: image-set(url("../../images/leopard-print.webp") type("image/webp"), url("../../images/leopard-print.png") type("image/png"));
		background-color: transparent;
	}

	.has-skin-deel.has-skin-bombay body {
		background-color: var(--bombay-beige);

		background-image: url("../../images/leopard-print.png");
		background-image: image-set(url("../../images/leopard-print.webp") type("image/webp"), url("../../images/leopard-print.png") type("image/png"));

		/* @match leopard_tile_size_mobile - leopard tile width on mobile, shared with the profile cover */
		background-size: 230px auto;
		background-repeat: repeat;
	}

	.has-skin-deel.has-skin-bombay .site-header {
		background-color: transparent;
		border-bottom-color: transparent;
	}

}