/* =Child-Theme responsive styles starts here
-------------------------------------------------------------- */
@media (max-width: 991px){
	.red_mark mark {
		background: linear-gradient(
			to right,
			oklch(0.4938 0.1746 28.96 / 1) 50%,
			oklch(0.4938 0.1746 28.96 / 1) 50%
		);
		color: #ffffff;
	}

	.grey_mark mark {
		background: linear-gradient(
			to right,
			oklch(0.376 0.0122 273.08 / 1) 50%,
			oklch(0.376 0.0122 273.08 / 1) 50%
		);
		color: #ffffff;
	}
	.blue_mark mark {
		background: linear-gradient(
			to right,
			oklch(0.3581 0.1194 271.68 / 1) 50%,
			oklch(0.3581 0.1194 271.68 / 1) 50%
		);
		color: #ffffff;
	}

	.white_mark mark {
		background: linear-gradient(
			to right,
			oklch(1 0 0 / 1) 50%,
			oklch(1 0 0 / 1) 50%
		);
		color: #28347a;
	}	
}
@media (min-width: 992px) {
	.red_mark mark {
		animation: highlight linear forwards;
		animation-timeline: view(60% 20%);
		background: linear-gradient(
			to right,
			oklch(0.4938 0.1746 28.96 / 1) 50%,
			oklch(0.4938 0.1746 28.96 / 0) 50%
		);
		background-position: 100%;
		background-size: 200% 100%;
		border-radius: 0.125rem;
		padding-inline: 0.125rem;
		color: #28347a;
	}

	.grey_mark mark {
		animation: highlight linear forwards;
		animation-timeline: view(60% 20%);
		background: linear-gradient(
			to right,
			oklch(0.376 0.0122 273.08 / 1) 50%,
			oklch(0.376 0.0122 273.08 / 0) 50%
		);
		background-position: 100%;
		background-size: 200% 100%;
		border-radius: 0.125rem;
		padding-inline: 0.125rem;
		color: #28347a;
	}
	.blue_mark mark {
		animation: highlight linear forwards;
		animation-timeline: view(60% 20%);
		background: linear-gradient(
			to right,
			oklch(0.3581 0.1194 271.68 / 1) 50%,
			oklch(0.3581 0.1194 271.68 / 0) 50%
		);
		background-position: 100%;
		background-size: 200% 100%;
		border-radius: 0.125rem;
		padding-inline: 0.125rem;
		color: #28347a;
	}

	.white_mark mark {
		animation: highlightoverdark linear forwards;
		animation-timeline: view(60% 20%);
		background: linear-gradient(
			to right,
			oklch(1 0 0 / 1) 50%,
			oklch(1 0 0 / 0) 50%
		);
		background-position: 100%;
		background-size: 200% 100%;
		border-radius: 0.125rem;
		padding-inline: 0.125rem;
		color: #ffffff;
	}
	.skip_1{
		grid-column-start: 2;
	}

	@keyframes highlight {
		to {
			color: #ffffff;
			background-position: 0;
		}
	}
	@keyframes highlightoverdark {
		to {
			color: #28347a;
			background-position: 0;
		}
	}
}
@media (max-width: 1300px){
	h3{
		hyphens: auto!important;
	}
}