@charset "utf-8";

.services-menu-container {
	margin: 20px auto;
	width: 100%;
	max-width: 1100px;
}

.services-menu-container.flex-columns {
	-webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
	gap: 20px;
}

.service-column {
	box-sizing: border-box;
	-webkit-flex: 0 0 auto;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
	line-height: 1;
	margin-bottom: 26px;
	position: relative;
	transition-duration: .3s;
	transition-property: transform;
}

.service-column img.service-image {
	border-radius: 6px;
	object-fit: cover;
	position: relative;
	width: 100%;
	max-width: 100%;
	height: 168px;
}

.service-column:hover {
	transform: scale(1.1);
}


.service-column .service-title {
	background-image: url("service-menu-background.png");
	background-repeat: repeat;
	border-bottom-right-radius: 6px;
	border-bottom-left-radius: 6px;
	bottom: 1px;
	color: #FFF;
	font-size: 18px;
	font-weight: bold;
	line-height: 34px;
	position: absolute;
	text-align: center;
	text-decoration: none;
	width: 100%;
}

.service-column a:hover {
	opacity: 1;
}


/* Responsive Styles */ 

@media screen and (min-width: 701px) and (max-width: 1100px) {

.service-column img.service-image {
	border-radius: 6px;
	object-fit: cover;
	position: relative;
	width: 100%;
	max-width: 300px;
	height: auto;
}

.flexcol-fifth.service-column {
	width: 31%;
}

}

@media screen and (min-width: 480px) and (max-width: 700px) {

.service-column img.service-image {
	border-radius: 6px;
	object-fit: cover;
	position: relative;
	width: 100%;
	max-width: 300px;
	height: auto;
}

.flexcol-fifth.service-column {
	width: 48%;
}

}

@media screen and (min-width: 320px) and (max-width: 480px) {

.service-column img.service-image {
	border-radius: 6px;
	object-fit: cover;
	position: relative;
	width: 100%;
	max-width: 300px;
	height: auto;
}


}