#services_section{
  padding: 70px 0;
  background-color: var(--primary-color);
}
#services_section h2{
  font-size: 50px;
  text-align: center;
}
.flex_container{
  margin-top: 50px;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 40px;
}
.card{
  width: 350px;
  max-width: calc(90% - 40px);
  background-color: var(--secondary-color);
  border-radius: 100px;
  padding: 60px 20px;

  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 20px;
  box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
}
.card *{
  text-align: center;
}
.card a{
  background-color: var(--main-brand-color);
  width: min-content;
  padding: 15px 40px;
  border-radius: 50px;
  margin: 0 auto;
  text-decoration: none;
  color: var(--text-color);
  border: 4px solid var(--main-brand-color);
  transition: 200ms ease-in-out;
}
.card a:hover{
  background: transparent;
}
.card img{
  border-radius: 10%;
}

@media (max-width: 500px){
  #services_section h2{
      font-size: 12vw;
  }
}