
.tile-aems-blue {
	/* used for contrast in the header and footer */
	--prd-clr-dark-H: 250;
	--prd-clr-dark-S: 50%;
	--prd-clr-dark-L: 20%;
	
	/* used for buttons and pane headers */
	--prd-clr-primary-H: 240;
	--prd-clr-primary-S: 23%;
	--prd-clr-primary-L: 46%;

	/* used used for borders and highlights */
	--prd-clr-secondary-H: 224;
	--prd-clr-secondary-S: 26%;
	--prd-clr-secondary-L: 60%;	
	
	--prd-color-offcolor: #f7ce69 !important;
	
}


.tile-aems-gray {
	/* used for contrast in the header and footer */
	--prd-clr-dark-H: 230;
	--prd-clr-dark-S: 7%;
	--prd-clr-dark-L: 22%;
	
	/* used for buttons and pane headers */
	--prd-clr-primary-H: 237;
	--prd-clr-primary-S: 5%;
	--prd-clr-primary-L: 45%;

	/* used used for borders and highlights */
	--prd-clr-secondary-H: 224;
	--prd-clr-secondary-S: 9%;
	--prd-clr-secondary-L: 71%;	
	
	--prd-color-offcolor: #f7ce69 !important;
}

.tile-aems-red {
	/* used for contrast in the header and footer */
	--prd-clr-dark-H: 0;
	--prd-clr-dark-S: 100%;
	--prd-clr-dark-L: 16%;
	
	/* used for buttons and pane headers */
	--prd-clr-primary-H: 0;
	--prd-clr-primary-S: 90%;
	--prd-clr-primary-L: 25%;

	/* used used for borders and highlights */
	--prd-clr-secondary-H: 0;
	--prd-clr-secondary-S: 70%;
	--prd-clr-secondary-L: 45%;	
	
	--prd-color-offcolor: #f7ce69 !important;
}

.tile-aems-desat {
	/* used for contrast in the header and footer */
	--prd-clr-dark-H: 235;
	--prd-clr-dark-S: 7%;
	--prd-clr-dark-L: 37%;
	
	/* used for buttons and pane headers */
	--prd-clr-primary-H: 0;
	--prd-clr-primary-S: 27%;
	--prd-clr-primary-L: 38%;

	/* used used for borders and highlights */
	--prd-clr-secondary-H: 0;
	--prd-clr-secondary-S: 70%;
	--prd-clr-secondary-L: 40%;	
	
	--brand-off-color: #d6d9dd;
	
}

.tile.tile-aems-desat .tile-overlay {
	background: linear-gradient(-45deg, 
		var(--prd-color-dark), var(--prd-color-dark) 12%, 
		var(--prd-color-secondary) 12.5%, var(--prd-color-secondary) 13%, 
		#00000022 13%, transparent 14%, transparent 72%, #00000022 73%, 
		var(--prd-color-secondary) 74%, var(--prd-color-secondary) 75.5%, 
		var(--prd-color-dark) 75%, var(--prd-color-dark));	
}
.tile.tile-aems-desat .image-wrapper {
	background: linear-gradient(0deg, var(--brand-off-color) 10%, var(--brand-off-color) 10%, var(--prd-color-primary) 50%, var(--prd-color-secondary) 100%);	
	outline-color: var(--prd-color-dark);
}

.tile.tile-aems-desat:hover {
	background: var(--brand-off-color);
}
.tile.tile-aems-desat:hover,
.tile.tile-aems-desat:hover h2, 
.tile.tile-aems-desat:hover h3 {
	color: var(--prd-color-secondary);
}
