.planner-toolkit {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	background-image: url(/includes/public/assets/shared/planner-toolkit-background.png);
	background-position: center;
	background-size: cover;
	padding: 27px;
}

.planner-toolkit .content-section {
	width: 100%;
}

.planner-toolkit .title {
	display: flex;
}

.planner-toolkit .asterisk {
	flex-shrink: 0;
	width: 24px;
	height: 24px;
	margin-right: 10px;
	margin-top: 6px;
}

.planner-toolkit h4 {
	font: 700 25px 'ibm-plex-sans-condensed', sans-serif;
	color: #191b39;
	line-height: 1em;
	text-transform: uppercase;
	margin-right: 10px;
	margin-bottom: 15px;
}

.planner-toolkit p {
	font: 900 14px 'ibm-plex-sans-condensed', sans-serif;
	letter-spacing: 1.8px;
	letter-spacing: 1.8px;
	line-height: 1.1em;
	color: #e40046;
	text-transform: uppercase;
	margin-left: 35px;
	margin-bottom: 0;
}

.planner-toolkit p i {
	margin-left: 7px;
}

@media screen and (min-width: 1024px) {
	.planner-toolkit {
		padding-top: 35px;
		position: relative;
	}

	.planner-toolkit::after {
		content: '';
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background-color: #999797;
		opacity: 0;
		transition: opacity 200ms ease;
		pointer-events: none;
	}

	.planner-toolkit:hover::after {
		opacity: 0.3;
	}

	.planner-toolkit .content-section {
		z-index: 2;
		margin-left: 55px;
		margin-right: 60px;
	}

	.planner-toolkit p {
		font-size: 15px;
		margin-left: 40px;
	}

	.planner-toolkit .asterisk {
		width: 27px;
		height: 27px;
		margin-right: 13px;
	}
}