.services > p {
	text-align: center;
	width: 50%;
	margin: 16px auto;
}

.servicesGrid {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: center;
}

.service {
	flex: 0 1 25%;
	min-width: 320px;
	max-width: 600px;
	max-height: fit-content;
	padding: 12px;
	border-radius: 32px;
	margin: 16px;
	background-color: rgba(238, 238, 238);
	position: relative;
	transition: background-color 0.3s ease-in-out, transform 0.3s ease-in-out;
	overflow: hidden;
	cursor: pointer;
}

.service:hover {
	background-color: #DBAA6F;
}

.service.active {
	background-color: #DBAA6F;
	transform: scale(1.05);
}

.service > h4 {
	font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
	text-align: center;
}

.service.active > h4 {
	display: none;
}

.serviceContent {
	display: none;
}

.service.active .serviceContent {
	display: flex;
	flex-direction: column;
	width: 100%;
	min-width: 320px;
	max-width: 600px;
}

.serviceContent > h3 {
	text-align: center;
	padding: 0;
}

.serviceContent > .ctaButton {
	background-color: black;
	color:whitesmoke;
}

.serviceContent > .ctaButton.ctaButton:hover {
	background-color: whitesmoke;
	color:black;
}

.price {
	font-size: larger;
	color: whitesmoke
}

#servicesHighlight {
	text-transform: uppercase;
	font-family:'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
	font-style: italic;
}

@media screen and (max-width: 845px) {
	.services > p {
		text-align: center;
		width: 100%;
		margin: 16px auto;
	}

	.service {
		min-width: 250px;
	}

	.service.active .serviceContent {
		min-width: 250px;
	}
}