body.artist {
  overflow: auto;
  display: block;
  gap: 1rem;
  font-size: 1.5rem;
  padding: 1rem 0 1rem 1rem;

  h1 {
    font-size: 2.2rem;
    text-align: center;
    color: var(--color-fg-darker, darkgray);
    margin: 1rem 0;
  }

  h2 {
    font-size: 1.9rem;
    margin: 1.5rem 0;
  }

  h3 {
    font-size: 1.7rem;
    margin: 1.5rem 0.5rem;
  }

  h4 {
    font-size: 1.4rem;
    margin: 2rem 0.5rem 1rem 0.1rem;
  }

  h2,h3,h4 {
    color: var(--color-fg-dark, darkgray);
  }

  p {
    margin: 0.5rem;
  }

  ul {
    list-style-type: decimal;
    margin: 1rem 1rem 1rem 2rem;

    li {
      margin-top: 0.5rem;
    }
  }
 
  a {
    text-decoration: none;
    color: #1471d9;
  }

  a:hover, a:focus {
    color: #093260;
    background-color: var(--color-bg-light);
  }


  img.main-image {
    padding-right: 1rem;
  }

  .table {
    width: 1px;
    white-space: nowrap;
    border-collapse: collapse;

    thead {
      th.image {
        text-align: left;
      }
    }

    tbody {
      th {
        text-align: right;
      }
    }

    th {
      background-color: lightgray;
      font-weight: 200;
    }

    td, th {
      border-bottom: 1px solid var(--color-fg-light, lightgray);
      padding: 0.5rem 0.6rem;
    }

    .number {
      text-align: right;
    }

    a {
      padding-left: 0.3rem;
      padding-right: 0.3rem;
    }
  }

  section.art-work {
    margin-bottom: 5rem;
  }

}

body.welcome {
  max-width: 800px;
}

@media (max-width: 600px) {
  body.artist {

    img.main-image {
      width: 100%;
    }
  }
}