
.tenant {
	background-image: url('/img/background-tenant.webp');
	background-size: cover;
	background-position: -0% 20%;
	background-repeat: no-repeat;
	background-attachment: fixed;
	clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
}

.landlord {
	background-image: url('/img/background-landlord.webp');
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	background-attachment: fixed;
	clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
}

@media (max-width: 63.99rem) {
	.tenant,
	.landlord {
		background-position: 25% center;
	}
}

@media (min-width: 64rem) {
	.tenant::before {
		content: '';
		position: absolute;
		inset: 0;
		z-index: -1;
		background-image: url('/img/background-tenant.webp');
		background-size: cover;
		background-position: -0% 20%;
		background-repeat: no-repeat;
		clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
	}

	.landlord::before {
		content: '';
		position: absolute;
		inset: 0;
		z-index: -1;
		background-image: url('/img/background-landlord.webp');
		background-size: cover;
		background-position: center;
		background-repeat: no-repeat;
		clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
	}
}
