/*PRINCIPALES SERVICIOS*/
#servicios {
	max-width: 1500px;
	margin: auto;
	background: #eee;
}
#servicios .titulo {
	text-align: center;
}
.grupo-servicios {
	max-width: 1100px;
	margin: auto;
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
}
.columna-servicios {
	background: #000;
	position: relative;
	overflow: hidden;
	width: 48%;
	height: 200px;
	margin: 1%;
	margin-bottom: 10px;
	border-radius: 10px;
	
	display: flex;
	flex-direction: column;
	justify-content: center;
}
.servicios-txt {
	text-align: center;
	font-size: 1em;
	max-width: 960px;
	margin: auto;
}
.servicios-fondo {
	background: #000;
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	object-fit: cover;
	opacity: 0.7;
	transition: .5s all;
}
.servicios-fondo:hover {
	transform: scale(1.3);
}
.servicios-titulos {
  position: relative;
	z-index: 10;
	text-align: center;
	font-size: 1.4em;
	color: #fff;
}
.servicios-titulos::after,
.servicios-titulos::before {
  content: '';
  position: absolute;
  width: 100%;
  height: 4px;
  background: linear-gradient(to right, #1D4279, #2776C3);
  bottom: -5px;
  left: 0;
  transform: scaleX(0);
  transform-origin: right;
  transition: transform 0.4s ease-out;
}

.servicios-titulos::before {
  top: -5px;
  transform-origin: left;
}

.servicios-titulos:hover::after,
.servicios-titulos:hover::before {
  transform: scaleX(1);
}




/*-------------ESTILOS RESPONSIVE WEB DESIGN-------------*/
@media (min-width: 768px) {


	/* BENEFICIOS*/
.beneficios-subtitulo {
  font-size: 2em;
}

/*	SERVICIOS*/
	.columna-servicios {
		width: 25%;
		height: 250px;
	}
}

@media (min-width: 1024px) {

}