#services {
  align-items: flex-start;
  > p {
    text-align: justify;
  }
  > #container {
    display: flex;
    flex-direction: column;
    @media (max-width: 600px) {
      width: 100%;
    }
    > .list {
      display: flex;
      flex-direction: column;
      > a {
        cursor: pointer;
        font-weight: bold;
        padding: 10px 20px 10px 20px;
        margin: 10px 0px 10px 0px;
        text-decoration: none;
        @media (pointer: fine) {
          border: 1px solid var(--colorBlue);
          &:hover {
            background-color: var(--colorBlue);
            color: white;
          }
        }
        @media (pointer: coarse) {
          box-shadow: 1px 1px 3px var(--colorBlue);
        }
      }
    }
    > .title {
      align-items: flex-start;
      display: flex;
      flex-direction: column;
      margin: 30px 0px 30px 0px;
    }
  }
}