.tii-card-slider-section {
	display: flex;
	flex-flow: wrap;
	padding: 3rem 0 3rem 3rem;
	width: 100%;
	overflow: hidden;

	.column-left {
		width: calc(30% - 3rem);
		display: flex;
		align-content: flex-start;
		margin-right: 3rem;
		flex-flow: wrap;

		h2 {
			color: var(--color-petrol);
			margin-bottom: 2rem;
		}

		.cover-heading {
			margin-bottom: 2rem;
		}
	}

	.column-right {
		width: 70%;
		min-width: 0;
	}

	.card-content {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 85%;
		z-index: 5;
		color: var(--color-white);
		display: flex;
		flex-flow: wrap;
		align-content: space-between;
		padding: 20px;
	}

	.card-overlay {
		position: absolute;
		top: 0;
		left: 0;
		background-color: rgba(0, 0, 0, 0.45);
		width: 100%;
		height: 100%;
		z-index: 4;
		border-radius: 20px;
	}



	.tii-card-slider-controls {
		display: flex;
		width: 100%;
		justify-content: flex-end;
		margin-bottom: 2rem;
		padding-right: 9rem;

		button:first-child {
			margin-right: 10px;
		}

		button {
			border-radius: 100%;
			border: 1px solid var(--color-petrol);
			padding: 5px;
			background-color: var(--color-petrol);
			color: var(--color-white);
		}

		button:disabled,
		button[disabled] {
			background-color: var(--color-white);
			color: #B3C5C8;
			border: 1px solid #B3C5C8;
		}
	}

	.card {
		width: 200px;
		height: 300px;
		position: relative;
		transition: all 0.2s ease-in-out;
		border-radius: 20px;

		img {
			position: absolute;
			top: 0;
			left: 0;
			object-fit: cover;
			width: 100%;
			height: 100%;
			border-radius: 20px;
		}

		a {
			border-bottom: none;
			text-decoration: none;
		}

		.card-heading,
		.card-text,
		.card-button {
			margin-bottom: 0;
		}

		.card-heading {
			font-size: 14px;
		}

		.card-text {
			font-size: 20px;
			letter-spacing: -0.025em;
		}

		.card-button {
			position: absolute;
			right: 20px;
			bottom: 20px;
			border-radius: 100%;
			background-color: var(--color-white);
			border: 1px solid var(--color-white);
			color: var(--color-petrol);
			padding: 5px;
			display: flex;
			z-index: 5;
		}
	}

	.tii-card-slider-content {
		display: grid;
		grid-template-columns: repeat(10, auto);
		grid-gap: 0px;
		column-gap: 3em;
		overflow-x: hidden;
		max-width: 100%;
	}
}

@media screen and (min-width: 1100px) {
	.tii-card-slider-section-items-3 {
		.tii-card-slider-controls {
			display: none;
		}
	}
}

@media screen and (max-width: 900px) {
	.tii-card-slider-section {
		.column-left {
			width: 100%;
			margin-right: 0;
			margin-bottom: 2rem;
			padding-right: 3rem;

			h2,
			.cover-heading {
				width: 100%;
			}
		}

		.column-right {
			width: 100%;
			order: 1;
		}

		.tii-card-slider-controls {
			order: 1;
			justify-content: flex-start;
		}
	}
}