body {
  background-color: #fafafa;
  font-size: 1.2rem;
}

h2 {
  color: #19a2be;
  font-size: 3rem;
  font-weight: bold;
  font-family: "Work Sans", sans-serif;
}

h3 {
  font-family: "Roboto", sans-serif;
  font-size: 2.5rem;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  line-height: 2rem;
  span {
    color: #19a2be;
  }
}

header img {
  mask-image: linear-gradient(to bottom, black 70%, transparent 100%);
}

section,
article {
  margin: 1rem 0;
}

ul li {
  background: rgba(25, 162, 190, 0.05);
}

footer {
  background-color: #1e6ba6;
  color: white;
}

#contacto {
  background-color: #19a1bd;
  color: #fff;
  margin-top: 40px;
}

#convenios {
  span {
    font-size: 1.2rem;
    line-height: 1;
  }
  .card {
    height: 200px;
    .card-body {
      align-items: center;
      display: flex;
      justify-content: center;
    }
  }
}

#informacion {
  .informacion {
    font-size: 3rem;
  }
  h3 {
    color: #03b2a5;
    font-size: 2rem;
  }
}

#lateral {
  font-family: "Roboto", sans-serif;
  font-size: 2.2rem;
  text-transform: uppercase;
  /* transform: rotate(90deg); */
  white-space: nowrap;
  -webkit-text-stroke-color: #000;
  -webkit-text-fill-color: transparent;
  -webkit-text-stroke-width: 0.02em;
  transform-origin: left top 0;
  z-index: 4;
}

.menu a {
  color: #19a1bd;
  font-family: "Roboto", sans-serif;
  &:hover {
    background-color: #e5f3f7;
  }
}

.card {
  background-color: white;
}

.titulo {
  color: #19a1bd;
  font-weight: bold;
}

@media (min-width: 600px) {
  #lateral {
    font-size: 4.5rem;
    transform-origin: initial;
  }
}

@media (min-width: 960px) {
  #lateral {
    font-size: 3.5rem;
    margin-top: 35px;
  }
}