.artwork_page {
  overflow: hidden;
}

.artwork_page .top_image_cont .image_cont {
  /*top of selecta letters is 17.5% from top of line. left M is 88px, 48@1260, 32(1.1)@768 = */
  margin-top: calc(1rem + 15.4px);
}

@media (max-width: 1260px) {
  .artwork_page .top_image_cont .image_cont {
    margin-top: calc(1rem + 8.4px);
  }
}

@media (max-width: 768px) {
  .artwork_page .top_image_cont .image_cont {
    margin-top: calc(1rem + 6.16px);
  }
}

.artwork_page .top_image_cont .image {
  /* baseline to bottom of glyph is 180 units out of 1000 units = 0.18
   * 0.18 * 88 = 15.84
   * max-height = top of sidebar M to bottom of sidebar A
   *            = sidebar height - top font offset - bottom font offset
   *            = 100vh - 6rem - 15.4px - 0.18*88px
   *            = 100vh - 6rem - 15.4px - 15.84px
   *margin top is calc(1rem + 15.4px);*/
  max-height: calc(100vh - 6rem - 15.4px - 15.84px);
  object-fit: contain;
  object-position: left center;
  display: block;
  width: 100%;
  height: auto;
}

@media (max-width: 1260px) {
  .artwork_page .top_image_cont .image {
    /* 8.4 from above */
    /* 180/1000*48px = 8.64px */
    max-height: calc(100vh - 6rem - 8.4px - 8.64px);
  }
}

@media (max-width: 768px) {
  .artwork_page .top_image_cont .image {
    /* 6.16px from above */
    /* 180/1000*32px*1.1 = 6.336px */
    max-height: calc(100vh - 6rem - 6.16px - 6.336px);
  }
}

.artwork_page .top_image_cont .image.clickable {
  cursor: pointer;
}



.artwork_page__artist {
  margin-top: 2rem;
}

.artwork_page__artist h2 {
  color: inherit;
  font-size: inherit;
  line-height: inherit;
  margin: inherit;
}

.artwork_page__title h1 {
  color: inherit;
  font-size: inherit;
  line-height: inherit;
  margin: 0;
}


/*
 * Breadcrumb
 */

.artwork_page__breadcrumb_cont {
  margin-top: 0.5rem;
}

.artwork_page__breadcrumb_link {
  text-decoration: none;
  display: inline-block;
}

.artwork_page__breadcrumb_link:hover {
  opacity: 0.655;
}

.artwork_page__breadcrumb_sep {
  display: inline-block;
  margin: 0 0.6em;
  user-select: none;
}



/*
 * Body
 */

.artwork_page__body {
  margin-top: 5rem;
}

@media (max-width: 768px) {
  .artwork_page__body {
    margin-top: 3rem;
  }

}

/*
 * Quote
 */

.artwork_page__quote {
  margin-bottom: 2rem;
}

@media (max-width: 768px) {
  .artwork_page__quote {
    margin-top: 2rem;
  }
}

.artwork_page__quote p:first-child {
  margin-top: 0;
}

.artwork_page__attribution {
  margin-top: 1rem;
}


/*
 * Meta
 */

@media (max-width: 768px) {
  .artwork_page__meta {
    margin-top: 2rem;
  }
}

.artwork_page__label {
  margin-top: 0.5rem;
  opacity: 0.655;
}

.artwork_page__meta > div:first-child .artwork_page__label {
  margin-top: 0;
}


/*
 * on display badge
 */

.artwork_page .on_display_cont {
  margin: 3rem auto 0;
  display: flex;
}

.artwork_page .on_display_cont .on_display_box {
  display: inline-block;
  width: 2.8rem;
}

.artwork_page .on_display_cont .on_display_circle {
  width: 0.5rem;
  height: 0.5rem;
  margin: 0.5rem;
  background: #222;
  border-radius: 50%;
}

.artwork_page .on_display_cont .on_display_text {
  display: inline-block;
  margin-left: 0.5rem;
}
