#hero{
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    flex-direction: column;
    height: 20vh;
    background: rgb(16,78,47);
    background: linear-gradient(90deg, rgb(190, 209, 190) 0%, rgb(159, 199, 173) 20%, rgb(89, 179, 134) 100%);
}

#hero h1{
    color: #fff;
    font-size: 4vw;
}

.container_services{
	width: 100%;
	display: grid;
	max-width: 1600px;
	margin: auto;
}

.container_services .card{
    padding: 10px;
	width: auto;
	margin: 15px 30px;
	border-radius: 6px;
	overflow: hidden;
	background:#fff;
	box-shadow: 0px 1px 10px rgba(0,0,0,0.2);
	transition: all 400ms ease-out;
	cursor: default;
}

.container_services .card h1{
    text-align: center;
}
.container_services .card .contenido{
    display: flex;
    justify-content: space-evenly;
}
.container_services .card p{
    padding: 20px 40px;
    max-width: 700px;
    text-align: justify;
}
.container_services .card img{
    padding-left:30px ;
    padding-bottom: 15px;
    width: auto;
}

@media screen and (max-width: 720px) {
    #hero h1{
      font-size: 30px;
    }
    
    .container_services .card .contenido{
        display: block;
    }

}