/*
 * WebFont use of Centra No1 pursuant to Sharp Type Web Font License Agreement, Version 3.0 (2019.05)
 * (https://vllg.com/sharp-type/licensing),
 * through Village (vllg.com) Order #1302129.
 */
*,
*::before,
*::after {
  box-sizing: border-box;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
html {
  width: 100%;
  font-size: 62.5%;
}
body {
  width: 100%;
}
body[data-gallery-shown] {
  overflow: hidden;
}
em {
  font-style: italic;
}
:root {
  --page-size-transition-timing-function: linear;
  --page-size-transition-duration: 0.2s;
  --gallery-horizontal-margin: 17.5vw;
  --gallery-transition-duration: 0.4s;
  --gallery-transition-timing-function: ease-in-out;
}
.mobile {
  display: none !important;
}
html {
  height: 100%;
}
body {
  height: 100%;
  background-color: white;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-image: url(../images/bg-desktop.jpg);
  background-size: auto 100%;
  background-position: right top;
}
body::after {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background-color: #ffffff;
  content: '';
  display: block;
  z-index: -1;
  opacity: 0;
  transition: opacity 0.6s ease;
}
body:not([data-current-page="home"])::after {
  opacity: 0.77;
}
#header {
  position: fixed;
  left: calc(29.5vw - 48.53rem);
  bottom: calc(30vh - 21rem);
  transition: left var(--page-size-transition-timing-function) var(--page-size-transition-duration);
}
@media only screen and (max-width: 1780px) {
  #header {
    left: calc(8vw - 5.74rem);
  }
}
@media only screen and (max-width: 1280px) {
  #header {
    left: 4.5rem;
  }
}
@media only screen and (max-height: 680px) {
  #header {
    bottom: -0.6rem;
  }
}
#signature-stamp {
  background-size: 100% 100%;
  display: block;
  cursor: pointer;
  width: 32.8rem;
  height: 16.3rem;
  transition: width var(--page-size-transition-timing-function) var(--page-size-transition-duration), height var(--page-size-transition-timing-function) var(--page-size-transition-duration);
}
@media only screen and (max-width: 1780px) {
  #signature-stamp {
    width: 22.3rem;
    height: 11.106rem;
  }
}
#subtitle {
  position: relative;
  margin: 0;
  font-family: "objektiv-mk1";
  font-weight: 300;
  user-select: none;
  -moz-user-select: none;
  -webkit-user-select: none;
  left: 23.4rem;
  top: -3.8rem;
  font-size: 4rem;
  color: #787878;
  transition: font-size var(--page-size-transition-timing-function) var(--page-size-transition-duration), top var(--page-size-transition-timing-function) var(--page-size-transition-duration), left var(--page-size-transition-timing-function) var(--page-size-transition-duration);
}
@media only screen and (max-width: 1780px) {
  #subtitle {
    font-size: 2.4rem;
    top: -3rem;
    left: 16rem;
  }
}
#menu {
  user-select: none;
  -moz-user-select: none;
  -webkit-user-select: none;
  margin-top: 1rem;
  margin-left: 5.2rem;
  transition: margin-left var(--page-size-transition-timing-function) var(--page-size-transition-duration);
}
#menu span,
#menu a {
  display: block;
  text-transform: uppercase;
  text-decoration: none;
  transition: color ease-in-out 0.3s;
}
@media only screen and (max-width: 1780px) {
  #menu {
    margin-left: 1.2rem;
  }
}
#menu span {
  cursor: pointer;
}
.top-menu-item {
  font-family: "Centra No1 J";
  font-weight: 500;
  color: #666666;
  letter-spacing: 0.05rem;
  font-size: 2.4rem;
  line-height: 1.75;
  transition: font-size var(--page-size-transition-timing-function) var(--page-size-transition-duration);
}
@media only screen and (max-width: 1780px) {
  .top-menu-item {
    font-size: 1.7rem;
    line-height: 1.88;
  }
}
.top-menu-item:hover,
body[data-current-page="about"] .top-menu-item[data-name="about"],
body[data-current-page="projects"] .top-menu-item[data-name="projects"] {
  color: #000000;
}
#top-menu-group,
.top-menu-item[data-name="story"] {
  text-align: right;
  width: 12.8rem;
}
#story-submenu {
  position: relative;
  border-left: 1px solid #999999;
  visibility: hidden;
  opacity: 0;
  transition: opacity 0.4s ease-in-out, visibility 0.4s ease-in-out;
  top: -3rem;
  padding: 5.6rem 0 0 1.4rem;
  margin-left: 14.6rem;
}
#story-submenu a,
#story-submenu span {
  font-family: "Centra No1 J";
  font-weight: 300;
  color: #777777;
  letter-spacing: 0.03rem;
}
#menu[data-story-submenu-visible] #story-submenu,
body[data-current-page="esquisse"] #story-submenu,
body[data-current-page="sanctuary"] #story-submenu {
  visibility: visible;
  opacity: 1;
}
@media only screen and (max-width: 1780px) {
  #story-submenu {
    top: -1.8rem;
    margin-left: 14.4rem;
    padding: 4.6rem 0 0 1.1rem;
  }
}
#story-submenu a,
#story-submenu span {
  font-size: 1.8rem;
  line-height: 1.44;
  transition: font-size var(--page-size-transition-timing-function) var(--page-size-transition-duration);
}
@media only screen and (max-width: 1780px) {
  #story-submenu a,
  #story-submenu span {
    font-size: 1.3rem;
    line-height: 1.615;
  }
}
#story-submenu a:hover,
#story-submenu span:hover,
body[data-current-page="esquisse"] #story-submenu a[data-name="esquisse"],
body[data-current-page="esquisse"] #story-submenu span[data-name="esquisse"],
body[data-current-page="sanctuary"] #story-submenu a[data-name="sanctuary"],
body[data-current-page="sanctuary"] #story-submenu span[data-name="sanctuary"] {
  color: #000000;
  font-weight: 400;
}
.page {
  position: absolute;
  left: calc(43.17vw + 0.72rem);
  right: 0;
  padding-bottom: 6rem;
  opacity: 1;
  transition: opacity 0.4s ease-in-out;
}
.page h2 {
  font-family: "objektiv-mk1";
  text-transform: uppercase;
  font-weight: 700;
  color: #222222;
}
.page p {
  font-family: "Archer SSm A", "Archer SSm B";
  font-weight: 600;
  color: #787878;
}
@media only screen and (max-width: 1780px) {
  .page {
    left: calc(20.2vw + 26.644rem);
  }
}
@media only screen and (max-width: 1280px) {
  .page {
    left: 52.5rem;
  }
}
.page.hidden {
  opacity: 0;
}
.page h2 {
  margin: 20.5vh auto 0 auto;
  font-size: 3rem;
}
@media only screen and (max-width: 1780px) {
  .page h2 {
    font-size: 2.4rem;
  }
}
.page p {
  font-size: 1.6rem;
  line-height: 1.5;
  margin: 1.4em 0 0;
}
@media only screen and (max-width: 1280px) {
  .page p {
    font-size: 1.4rem;
  }
}
.page[data-page="about"] {
  right: calc(-56.115vw + 131.141rem);
}
.page[data-page="about"] h3 {
  font-family: "objektiv-mk1";
  font-weight: 300;
  color: #999999;
  font-size: 1.8rem;
  margin: 1rem 0 4.6rem;
}
.page[data-page="about"] h3 a {
  color: #999999;
  text-decoration: none;
  transition: color ease-in-out 0.3s;
}
.page[data-page="about"] h3 a:hover,
.page[data-page="about"] h3 a:active,
.page[data-page="about"] h3 a:focus {
  color: #c2c2c2;
}
@media only screen and (min-width: 1921px) {
  .page[data-page="about"] {
    right: auto;
    width: 85.5rem;
  }
}
@media only screen and (max-width: 1780px) {
  .page[data-page="about"] {
    right: calc(44.8vw - 43.544rem);
  }
}
@media only screen and (max-width: 1280px) {
  .page[data-page="about"] {
    right: 13.8rem;
  }
}
.page[data-page="projects"] {
  width: 95.1rem;
  --ga-bringup: -5.1rem;
}
.page[data-page="projects"] h3 {
  font-family: "Centra No1 J";
  font-weight: 700;
  color: #444444;
}
@media only screen and (max-width: 1780px) {
  .page[data-page="projects"] {
    width: calc(47.5vw + 10.56rem);
  }
}
@media only screen and (max-width: 1280px) {
  .page[data-page="projects"] {
    width: 71.36rem;
  }
}
.page[data-page="projects"] h3 {
  font-size: 2.4rem;
  margin: 3rem 0 0;
}
@media only screen and (max-width: 1780px) {
  .page[data-page="projects"] h3 {
    font-size: 2rem;
  }
}
@media only screen and (max-width: 1280px) {
  .page[data-page="projects"] h3 {
    font-size: 1.8rem;
  }
}
.page[data-page="projects"] p {
  margin: 0.75em 0;
}
@media only screen and (max-width: 1780px) {
  .page[data-page="projects"] p {
    margin: 0.625em 0;
  }
}
@media only screen and (max-width: 1280px) {
  .page[data-page="projects"] p {
    margin: 0.5714em 0;
  }
}
@media only screen and (max-width: 1780px) {
  .page[data-page="projects"] {
    --ga-bringup: -4.7rem;
  }
}
@media only screen and (max-width: 1280px) {
  .page[data-page="projects"] {
    --ga-bringup: -4.5rem;
  }
}
.page[data-page="esquisse"] {
  right: calc(56.8345vw - 61.32rem);
}
.page[data-page="esquisse"] h2 {
  margin-bottom: 8.4rem;
}
@media only screen and (max-width: 1780px) {
  .page[data-page="esquisse"] {
    right: calc(65.33vw - 62.89rem);
  }
}
@media only screen and (max-width: 1280px) {
  .page[data-page="esquisse"] {
    right: 20.73rem;
  }
}
.page[data-page="sanctuary"] h3.subtitle {
  font-family: "objektiv-mk1";
  font-weight: 300;
  color: #999999;
  font-size: 1.8rem;
  margin: 1rem 0 4.6rem;
}
.page[data-page="sanctuary"] h3.subtitle a {
  color: #999999;
  text-decoration: none;
  transition: color ease-in-out 0.3s;
}
.page[data-page="sanctuary"] h3.subtitle a:hover,
.page[data-page="sanctuary"] h3.subtitle a:active,
.page[data-page="sanctuary"] h3.subtitle a:focus {
  color: #c2c2c2;
}
.page[data-page="sanctuary"] p {
  width: 66.3rem;
}
@media only screen and (max-width: 1780px) {
  .page[data-page="sanctuary"] p {
    width: calc(13.828vw + 41.687rem);
  }
}
@media only screen and (max-width: 1280px) {
  .page[data-page="sanctuary"] p {
    width: 59.387rem;
  }
}
.about-portrait {
  float: right;
  margin: -4.8rem 13.6rem 3rem 5.6rem;
  height: 22rem;
}
@media only screen and (max-width: 1780px) {
  .about-portrait {
    margin: -4.4rem 10.4rem 1.6rem 5.6rem;
  }
}
.projects-mosaic {
  font-size: 0;
  white-space: nowrap;
}
.projects-mosaic > div {
  background-size: 100% 100%;
  transition: filter ease-in-out 0.3s, opacity ease-in-out 0.3s, border-color ease-in-out 0.3s;
  cursor: pointer;
}
.projects-mosaic > div {
  display: inline-block;
  filter: saturate(100%) brightness(100%) contrast(100%);
}
.projects-mosaic > div[data-gallery-item-id="nl01"] {
  background-image: url(../images/projects/thumbnails/nl01.jpg);
}
.projects-mosaic > div[data-gallery-item-id="nl01"]:hover {
  filter: saturate(102%) brightness(112%) contrast(106%);
}
.projects-mosaic > div[data-gallery-item-id="nl02"] {
  background-image: url(../images/projects/thumbnails/nl02.jpg);
}
.projects-mosaic > div[data-gallery-item-id="nl02"]:hover {
  filter: saturate(95%) brightness(112%) contrast(103%);
}
.projects-mosaic > div[data-gallery-item-id="nl03"] {
  background-image: url(../images/projects/thumbnails/nl03.jpg);
}
.projects-mosaic > div[data-gallery-item-id="nl03"]:hover {
  filter: saturate(98%) brightness(108%) contrast(103%);
}
.projects-mosaic > div[data-gallery-item-id="kbs01"] {
  background-image: url(../images/projects/thumbnails/kbs01.jpg);
}
.projects-mosaic > div[data-gallery-item-id="kbs01"]:hover {
  filter: saturate(103%) brightness(112%) contrast(106%);
}
.projects-mosaic > div[data-gallery-item-id="kbs02"] {
  background-image: url(../images/projects/thumbnails/kbs02.jpg);
}
.projects-mosaic > div[data-gallery-item-id="kbs02"]:hover {
  filter: saturate(103%) brightness(110%) contrast(106%);
}
.projects-mosaic > div[data-gallery-item-id="kbs03"] {
  background-image: url(../images/projects/thumbnails/kbs03.jpg);
}
.projects-mosaic > div[data-gallery-item-id="kbs03"]:hover {
  filter: saturate(103%) brightness(110%) contrast(106%);
}
.projects-mosaic > div[data-gallery-item-id="ga01"] {
  background-image: url(../images/projects/thumbnails/ga01.jpg);
}
.projects-mosaic > div[data-gallery-item-id="ga01"]:hover {
  filter: saturate(101%) brightness(108%) contrast(108%);
}
.projects-mosaic > div[data-gallery-item-id="ga02"] {
  background-image: url(../images/projects/thumbnails/ga02.jpg);
}
.projects-mosaic > div[data-gallery-item-id="ga02"]:hover {
  filter: saturate(120%) brightness(116%) contrast(105%);
}
.projects-mosaic > div[data-gallery-item-id="ga03"] {
  background-image: url(../images/projects/thumbnails/ga03.jpg);
}
.projects-mosaic > div[data-gallery-item-id="ga03"]:hover {
  filter: saturate(103%) brightness(107%) contrast(113%);
}
.projects-mosaic > div[data-gallery-item-id="ga04"] {
  background-image: url(../images/projects/thumbnails/ga04.jpg);
}
.projects-mosaic > div[data-gallery-item-id="ga04"]:hover {
  filter: saturate(95%) brightness(108%) contrast(108%);
}
.projects-mosaic > div[data-gallery-item-id="jld01"] {
  background-image: url(../images/projects/thumbnails/jld01.jpg);
}
.projects-mosaic > div[data-gallery-item-id="jld01"]:hover {
  filter: saturate(90%) brightness(107%) contrast(105%);
}
.projects-mosaic > div[data-gallery-item-id="jld02"] {
  background-image: url(../images/projects/thumbnails/jld02.jpg);
  filter: contrast(100%) brightness(100%);
}
.projects-mosaic > div[data-gallery-item-id="jld02"]:hover {
  filter: contrast(97%) brightness(108%);
}
.projects-mosaic > div[data-gallery-item-id="jld03"] {
  background-image: url(../images/projects/thumbnails/jld03.jpg);
  filter: contrast(100%) brightness(100%);
}
.projects-mosaic > div[data-gallery-item-id="jld03"]:hover {
  filter: contrast(97%) brightness(108%);
}
#projects-section-nl {
  margin-top: 8.4rem;
}
#projects-section-nl p {
  width: 78rem;
}
@media only screen and (max-width: 1780px) {
  #projects-section-nl p {
    width: calc(42.08vw + 3.09rem);
  }
}
@media only screen and (max-width: 1280px) {
  #projects-section-nl p {
    width: 57rem;
  }
}
#projects-nl-mosaic {
  --w1: 27.54rem;
  --h: 21.3rem;
  --mr1: 9.4rem;
  --mr2: 2.03rem;
  --w2: 15.975rem;
}
@media only screen and (max-width: 1780px) {
  #projects-nl-mosaic {
    --w1: calc(13.79vw + 2.91rem);
    --h: calc(10.62vw + 2.394rem);
    --mr1: calc(4.69vw + 1.053rem);
    --mr2: calc(1.02vw + 0.211rem);
    --w2: calc(8.026vw + 1.69rem);
  }
}
@media only screen and (max-width: 1280px) {
  #projects-nl-mosaic {
    --w1: 20.57rem;
    --h: 16rem;
    --mr1: 7.06rem;
    --mr2: 1.52rem;
    --w2: 11.97rem;
  }
}
#projects-nl-mosaic div[data-gallery-item-id="nl01"] {
  width: var(--w1);
  height: var(--h);
  margin-right: var(--mr1);
}
#projects-nl-mosaic div[data-gallery-item-id="nl02"] {
  width: var(--w2);
  height: var(--h);
  margin-right: var(--mr2);
}
#projects-nl-mosaic div[data-gallery-item-id="nl03"] {
  width: var(--w2);
  height: var(--h);
}
#projects-section-kbs {
  margin-top: 8rem;
}
@media only screen and (max-width: 1780px) {
  #projects-section-kbs {
    margin-top: 6rem;
  }
}
#projects-section-kbs .projects-mosaic-container {
  float: right;
  margin-left: 1.8rem;
}
@media only screen and (max-width: 1780px) {
  #projects-section-kbs .projects-mosaic-container {
    margin-left: 2.6rem;
  }
}
#projects-section-kbs::after {
  clear: both;
}
#projects-kbs-mosaic {
  margin-bottom: 14.3rem;
  --w1: 15.975rem;
  --h: 21.3rem;
  --mr1: 2rem;
  --mr2: 4rem;
  --w2: 28.4rem;
}
@media only screen and (max-width: 1780px) {
  #projects-kbs-mosaic {
    margin-bottom: calc(-30.06vw + 67.21rem);
  }
}
@media only screen and (max-width: 1280px) {
  #projects-kbs-mosaic {
    margin-bottom: 17.8rem;
  }
}
@media only screen and (max-width: 1780px) {
  #projects-kbs-mosaic {
    --w1: calc(8vw + 1.724rem);
    --h: calc(10.67vw + 2.305rem);
    --mr1: calc(1vw + 0.216rem);
    --mr2: calc(2vw + 0.433rem);
    --w2: calc(14.23vw + 3.073rem);
  }
}
@media only screen and (max-width: 1280px) {
  #projects-kbs-mosaic {
    --w1: 11.98rem;
    --h: 15.975rem;
    --mr1: 1.5rem;
    --mr2: 3rem;
    --w2: 21.3rem;
  }
}
#projects-kbs-mosaic div[data-gallery-item-id="kbs01"] {
  width: var(--w1);
  height: var(--h);
  margin-right: var(--mr1);
}
#projects-kbs-mosaic div[data-gallery-item-id="kbs02"] {
  width: var(--w1);
  height: var(--h);
  margin-right: var(--mr2);
}
#projects-kbs-mosaic div[data-gallery-item-id="kbs03"] {
  width: var(--w2);
  height: var(--h);
}
#projects-section-ga {
  margin-top: 8rem;
  --w1: 37.02rem;
  --h1: 29.6rem;
  --spacing-hor-1: 2.04rem;
  --w2-3: 14.315rem;
  --h2: 13.8rem;
  --spacing-ver-2: 1.7rem;
  --h3-4: 21.3rem;
  --spacing-hor-3: 2.06rem;
  --w4: 28.4rem;
}
@media only screen and (max-width: 1280px) {
  #projects-section-ga {
    margin-top: 6rem;
  }
}
#projects-section-ga p {
  width: 78rem;
}
@media only screen and (max-width: 1780px) {
  #projects-section-ga p {
    width: calc(42.08vw + 3.09rem);
  }
}
@media only screen and (max-width: 1280px) {
  #projects-section-ga p {
    width: 57rem;
  }
}
#projects-section-ga p:not(:last-of-type) {
  margin-bottom: 0;
}
#projects-section-ga p:not(:first-of-type) {
  margin-top: 0.7rem;
}
@media only screen and (max-width: 1280px) {
  #projects-section-ga p:not(:first-of-type) {
    margin-top: 0.5rem;
  }
}
@media only screen and (max-width: 1780px) {
  #projects-section-ga {
    --w1: calc(18.53vw + 4.03rem);
    --h1: calc(14.79vw + 3.275rem);
    --spacing-hor-1: calc(1.02vw + 0.221rem);
    --w2-3: calc(7.164vw + 1.56rem);
    --h2: calc(6.928vw + 1.47rem);
    --spacing-ver-2: calc(0.842vw + 0.202rem);
    --h3-4: calc(10.66vw + 2.32rem);
    --spacing-hor-3: calc(1.02vw + 0.241rem);
    --w4: calc(14.23vw + 3.07rem);
  }
}
@media only screen and (max-width: 1280px) {
  #projects-section-ga {
    --w1: 27.77rem;
    --h1: 22.22rem;
    --spacing-hor-1: 1.53rem;
    --w2-3: 10.74rem;
    --h2: 10.343rem;
    --spacing-ver-2: 1.28rem;
    --h3-4: 15.98rem;
    --spacing-hor-3: 1.55rem;
    --w4: 21.3rem;
  }
}
#projects-section-ga .projects-mosaic-container {
  position: relative;
  width: calc(var(--w1) + var(--spacing-hor-1) + var(--w2-3) + var(--spacing-hor-3) + var(--w4));
  height: calc(var(--h2) + var(--spacing-ver-2) + var(--h3-4));
}
#projects-section-ga h3,
#projects-section-ga p {
  position: relative;
  top: var(--ga-bringup);
}
#projects-ga-mosaic div {
  position: absolute;
}
#projects-ga-mosaic div[data-gallery-item-id="ga01"] {
  width: var(--w1);
  height: var(--h1);
  top: 0;
  left: 0;
}
#projects-ga-mosaic div[data-gallery-item-id="ga02"] {
  width: var(--w2-3);
  height: var(--h2);
  top: 0;
  left: calc(var(--w1) + var(--spacing-hor-1));
}
#projects-ga-mosaic div[data-gallery-item-id="ga03"] {
  width: var(--w2-3);
  height: var(--h3-4);
  top: calc(var(--h2) + var(--spacing-ver-2));
  left: calc(var(--w1) + var(--spacing-hor-1));
}
#projects-ga-mosaic div[data-gallery-item-id="ga04"] {
  width: var(--w4);
  height: var(--h3-4);
  top: calc(var(--h2) + var(--spacing-ver-2));
  left: calc(var(--w1) + var(--spacing-hor-1) + var(--w2-3) + var(--spacing-hor-3));
}
#projects-section-jld {
  margin-top: calc(8rem + var(--ga-bringup));
}
#projects-section-jld p {
  width: 70.5rem;
}
@media only screen and (max-width: 1780px) {
  #projects-section-jld p {
    width: calc(38.08vw + 2.72rem);
  }
}
@media only screen and (max-width: 1280px) {
  #projects-section-jld p {
    width: 51.5rem;
  }
}
#projects-jld-mosaic {
  --w1: 28.4rem;
  --w2: 21.3rem;
  --h: 21.3rem;
  --mr1: 7.3rem;
  --mr2: 2rem;
}
@media only screen and (max-width: 1780px) {
  #projects-jld-mosaic {
    --w1: calc(14.23vw + 3.07rem);
    --w2: calc(10.67vw + 2.31rem);
    --h: calc(10.67vw + 2.31rem);
    --mr1: calc(3.61vw + 0.88rem);
    --mr2: calc(1vw + 0.2164rem);
  }
}
@media only screen and (max-width: 1280px) {
  #projects-jld-mosaic {
    --w1: 21.3rem;
    --w2: 15.976rem;
    --h: 15.976rem;
    --mr1: 5.5rem;
    --mr2: 1.5rem;
  }
}
#projects-jld-mosaic div[data-gallery-item-id="jld01"] {
  width: var(--w1);
  height: var(--h);
  margin-right: var(--mr1);
}
#projects-jld-mosaic div[data-gallery-item-id="jld02"] {
  width: var(--w2);
  height: var(--h);
  margin-right: var(--mr2);
}
#projects-jld-mosaic div[data-gallery-item-id="jld03"] {
  width: var(--w2);
  height: var(--h);
}
#esquisse-mosaic {
  font-size: 0;
  white-space: nowrap;
  position: relative;
  overflow: hidden;
  width: 60.6rem;
  height: 60.6rem;
  margin-top: 6.3rem;
  margin-bottom: 1rem;
  transition: width var(--page-size-transition-timing-function) var(--page-size-transition-duration), height var(--page-size-transition-timing-function) var(--page-size-transition-duration);
}
#esquisse-mosaic > div {
  background-size: 100% 100%;
  transition: filter ease-in-out 0.3s, opacity ease-in-out 0.3s, border-color ease-in-out 0.3s;
  cursor: pointer;
}
#esquisse-mosaic > div {
  position: absolute;
  filter: saturate(60%) brightness(100%) contrast(100%);
}
#esquisse-mosaic > div:hover {
  opacity: 1 !important;
}
#esquisse-mosaic > div[data-gallery-item-id="17"] {
  width: var(--b-17-w);
  height: var(--b-17-h);
  opacity: 0.7;
}
#esquisse-mosaic > div[data-gallery-item-id="17"]:hover {
  filter: saturate(100%);
}
#esquisse-mosaic > div[data-gallery-item-id="03"] {
  width: var(--b-03-w);
  height: var(--b-03-h);
}
#esquisse-mosaic > div[data-gallery-item-id="03"]:hover {
  filter: saturate(125%) brightness(82%) contrast(160%);
}
#esquisse-mosaic > div[data-gallery-item-id="10"] {
  width: var(--b-10-w);
  height: var(--b-10-h);
  opacity: 0.7;
}
#esquisse-mosaic > div[data-gallery-item-id="19"] {
  width: var(--b-19-w);
  height: var(--b-19-h);
  opacity: 0.9;
}
#esquisse-mosaic > div[data-gallery-item-id="19"]:hover {
  filter: saturate(102%) brightness(95%) contrast(102%);
}
#esquisse-mosaic > div[data-gallery-item-id="08"] {
  width: var(--b-08-w);
  height: var(--b-08-h);
  opacity: 0.7;
}
#esquisse-mosaic > div[data-gallery-item-id="15"] {
  width: var(--b-15-w);
  height: var(--b-15-h);
}
#esquisse-mosaic > div[data-gallery-item-id="15"]:hover {
  filter: saturate(100%);
}
#esquisse-mosaic > div[data-gallery-item-id="05"] {
  width: var(--b-05-w);
  height: var(--b-05-h);
}
#esquisse-mosaic > div[data-gallery-item-id="05"]:hover {
  filter: saturate(125%) brightness(82%) contrast(160%);
}
#esquisse-mosaic > div[data-gallery-item-id="01"] {
  width: var(--b-01-w);
  height: var(--b-01-h);
}
#esquisse-mosaic > div[data-gallery-item-id="01"]:hover {
  filter: saturate(125%) brightness(82%) contrast(160%);
}
#esquisse-mosaic > div[data-gallery-item-id="20"] {
  width: var(--b-20-w);
  height: var(--b-20-h);
  opacity: 0.9;
}
#esquisse-mosaic > div[data-gallery-item-id="20"]:hover {
  filter: saturate(102%) brightness(95%) contrast(102%);
}
#esquisse-mosaic > div[data-gallery-item-id="12"] {
  width: var(--b-12-w);
  height: var(--b-12-h);
  opacity: 0.7;
}
#esquisse-mosaic > div[data-gallery-item-id="14"] {
  width: var(--b-14-w);
  height: var(--b-14-h);
  opacity: 0.7;
}
#esquisse-mosaic > div[data-gallery-item-id="04"] {
  width: var(--b-04-w);
  height: var(--b-04-h);
}
#esquisse-mosaic > div[data-gallery-item-id="04"]:hover {
  filter: saturate(125%) brightness(82%) contrast(160%);
}
#esquisse-mosaic > div[data-gallery-item-id="18"] {
  width: var(--b-18-w);
  height: var(--b-18-h);
  opacity: 0.7;
}
#esquisse-mosaic > div[data-gallery-item-id="07"] {
  width: var(--b-07-w);
  height: var(--b-07-h);
}
#esquisse-mosaic > div[data-gallery-item-id="07"]:hover {
  filter: saturate(125%) brightness(82%) contrast(160%);
}
#esquisse-mosaic > div[data-gallery-item-id="09"] {
  width: var(--b-09-w);
  height: var(--b-09-h);
  opacity: 0.7;
}
#esquisse-mosaic > div[data-gallery-item-id="02"] {
  width: var(--b-02-w);
  height: var(--b-02-h);
}
#esquisse-mosaic > div[data-gallery-item-id="02"]:hover {
  filter: saturate(125%) brightness(82%) contrast(160%);
}
#esquisse-mosaic > div[data-gallery-item-id="13"] {
  width: var(--b-13-w);
  height: var(--b-13-h);
}
#esquisse-mosaic > div[data-gallery-item-id="13"]:hover {
  filter: saturate(125%) brightness(82%) contrast(160%);
}
#esquisse-mosaic > div[data-gallery-item-id="06"] {
  width: var(--b-06-w);
  height: var(--b-06-h);
}
#esquisse-mosaic > div[data-gallery-item-id="06"]:hover {
  filter: saturate(125%) brightness(82%) contrast(160%);
}
#esquisse-mosaic > div[data-gallery-item-id="13"] {
  background-image: url(../images/esquisse/thumbnails/13.jpg);
}
#esquisse-mosaic > div[data-gallery-item-id="17"] {
  background-image: url(../images/esquisse/thumbnails/17.jpg);
}
#esquisse-mosaic > div[data-gallery-item-id="03"] {
  background-image: url(../images/esquisse/thumbnails/03.jpg);
}
#esquisse-mosaic > div[data-gallery-item-id="10"] {
  background-image: url(../images/esquisse/thumbnails/10.jpg);
}
#esquisse-mosaic > div[data-gallery-item-id="19"] {
  background-image: url(../images/esquisse/thumbnails/19.jpg);
}
#esquisse-mosaic > div[data-gallery-item-id="07"] {
  background-image: url(../images/esquisse/thumbnails/07.jpg);
}
#esquisse-mosaic > div[data-gallery-item-id="15"] {
  background-image: url(../images/esquisse/thumbnails/15.jpg);
}
#esquisse-mosaic > div[data-gallery-item-id="05"] {
  background-image: url(../images/esquisse/thumbnails/05.jpg);
}
#esquisse-mosaic > div[data-gallery-item-id="02"] {
  background-image: url(../images/esquisse/thumbnails/02.jpg);
}
#esquisse-mosaic > div[data-gallery-item-id="08"] {
  background-image: url(../images/esquisse/thumbnails/08.jpg);
}
#esquisse-mosaic > div[data-gallery-item-id="09"] {
  background-image: url(../images/esquisse/thumbnails/09.jpg);
}
#esquisse-mosaic > div[data-gallery-item-id="01"] {
  background-image: url(../images/esquisse/thumbnails/01.jpg);
}
#esquisse-mosaic > div[data-gallery-item-id="20"] {
  background-image: url(../images/esquisse/thumbnails/20.jpg);
}
#esquisse-mosaic > div[data-gallery-item-id="12"] {
  background-image: url(../images/esquisse/thumbnails/12.jpg);
}
#esquisse-mosaic > div[data-gallery-item-id="06"] {
  background-image: url(../images/esquisse/thumbnails/06.jpg);
}
#esquisse-mosaic > div[data-gallery-item-id="14"] {
  background-image: url(../images/esquisse/thumbnails/14.jpg);
}
#esquisse-mosaic > div[data-gallery-item-id="04"] {
  background-image: url(../images/esquisse/thumbnails/04.jpg);
}
#esquisse-mosaic > div[data-gallery-item-id="18"] {
  background-image: url(../images/esquisse/thumbnails/18.jpg);
}
@media only screen and (max-width: 1780px) {
  #esquisse-mosaic {
    width: 50rem;
    height: 50rem;
  }
}
#esquisse-mosaic > div {
  --b-spacing: 0.4rem;
  --b-13-w: 14.7rem;
  --b-13-h: 4.9rem;
  --b-17-w: 9.9rem;
  --b-17-h: 25rem;
  --b-03-w: 9.9rem;
  --b-03-h: 9.8rem;
  --b-10-w: 14.7rem;
  --b-10-h: 9.8rem;
  --b-19-w: 9.8rem;
  --b-19-h: 9.8rem;
  --b-07-w: 14.7rem;
  --b-07-h: 24.6rem;
  --b-15-w: 25rem;
  --b-15-h: 25rem;
  --b-05-w: 9.8rem;
  --b-05-h: 25rem;
  --b-02-w: 14.7rem;
  --b-02-h: 9.8rem;
  --b-08-w: 9.9rem;
  --b-08-h: 9.8rem;
  --b-09-w: 14.7rem;
  --b-09-h: 9.9rem;
  --b-01-w: 9.9rem;
  --b-01-h: 14.8rem;
  --b-20-w: 14.7rem;
  --b-20-h: 14.8rem;
  --b-12-w: 20.1rem;
  --b-12-h: 14.8rem;
  --b-06-w: 14.7rem;
  --b-06-h: 9.8rem;
  --b-14-w: 25rem;
  --b-14-h: 9.8rem;
  --b-04-w: 9.9rem;
  --b-04-h: 9.8rem;
  --b-18-w: 9.8rem;
  --b-18-h: 9.8rem;
}
@media only screen and (max-width: 1780px) {
  #esquisse-mosaic > div {
    --b-spacing: 0.3rem;
    --b-13-w: 12.15rem;
    --b-13-h: 4.05rem;
    --b-17-w: 8.2rem;
    --b-17-h: 20.65rem;
    --b-03-w: 8.2rem;
    --b-03-h: 8.1rem;
    --b-10-w: 12.15rem;
    --b-10-h: 8.1rem;
    --b-19-w: 8.1rem;
    --b-19-h: 8.1rem;
    --b-07-w: 12.15rem;
    --b-07-h: 20.35rem;
    --b-15-w: 20.65rem;
    --b-15-h: 20.65rem;
    --b-05-w: 8.1rem;
    --b-05-h: 20.65rem;
    --b-02-w: 12.15rem;
    --b-02-h: 8.1rem;
    --b-08-w: 8.2rem;
    --b-08-h: 8.1rem;
    --b-09-w: 12.15rem;
    --b-09-h: 8.2rem;
    --b-01-w: 8.2rem;
    --b-01-h: 12.25rem;
    --b-20-w: 12.15rem;
    --b-20-h: 12.25rem;
    --b-12-w: 16.6rem;
    --b-12-h: 12.25rem;
    --b-06-w: 12.15rem;
    --b-06-h: 8.1rem;
    --b-14-w: 20.65rem;
    --b-14-h: 8.1rem;
    --b-04-w: 8.2rem;
    --b-04-h: 8.1rem;
    --b-18-w: 8.1rem;
    --b-18-h: 8.1rem;
  }
}
#esquisse-mosaic > div[data-gallery-item-id="13"] {
  left: 0;
  top: 0;
}
#esquisse-mosaic > div[data-gallery-item-id="17"] {
  left: calc(var(--b-13-w) + var(--b-spacing));
  top: 0;
}
#esquisse-mosaic > div[data-gallery-item-id="03"] {
  left: calc(var(--b-13-w) + var(--b-spacing) + var(--b-17-w) + var(--b-spacing));
  top: 0;
}
#esquisse-mosaic > div[data-gallery-item-id="10"] {
  left: calc(var(--b-13-w) + var(--b-spacing) + var(--b-17-w) + var(--b-spacing) + var(--b-03-w) + var(--b-spacing));
  top: 0;
}
#esquisse-mosaic > div[data-gallery-item-id="19"] {
  right: 0;
  top: 0;
}
#esquisse-mosaic > div[data-gallery-item-id="07"] {
  left: 0;
  top: calc(var(--b-13-h) + var(--b-spacing));
}
#esquisse-mosaic > div[data-gallery-item-id="15"] {
  left: calc(var(--b-07-w) + var(--b-spacing) + var(--b-17-w) + var(--b-spacing));
  top: calc(var(--b-03-h) + var(--b-spacing));
}
#esquisse-mosaic > div[data-gallery-item-id="05"] {
  right: 0;
  top: calc(var(--b-19-h) + var(--b-spacing));
}
#esquisse-mosaic > div[data-gallery-item-id="02"] {
  left: 0;
  top: calc(var(--b-13-h) + var(--b-spacing) + var(--b-07-h) + var(--b-spacing));
}
#esquisse-mosaic > div[data-gallery-item-id="08"] {
  left: calc(var(--b-02-w) + var(--b-spacing));
  top: calc(var(--b-17-h) + var(--b-spacing));
}
#esquisse-mosaic > div[data-gallery-item-id="09"] {
  left: 0;
  top: calc(var(--b-13-h) + var(--b-spacing) + var(--b-07-h) + var(--b-spacing) + var(--b-02-h) + var(--b-spacing));
}
#esquisse-mosaic > div[data-gallery-item-id="01"] {
  left: calc(var(--b-09-w) + var(--b-spacing));
  top: calc(var(--b-17-h) + var(--b-spacing) + var(--b-08-h) + var(--b-spacing));
}
#esquisse-mosaic > div[data-gallery-item-id="20"] {
  left: calc(var(--b-09-w) + var(--b-spacing) + var(--b-01-w) + var(--b-spacing));
  top: calc(var(--b-03-h) + var(--b-spacing) + var(--b-15-h) + var(--b-spacing));
}
#esquisse-mosaic > div[data-gallery-item-id="12"] {
  right: 0;
  top: calc(var(--b-19-h) + var(--b-spacing) + var(--b-05-h) + var(--b-spacing));
}
#esquisse-mosaic > div[data-gallery-item-id="06"] {
  left: 0;
  bottom: 0;
}
#esquisse-mosaic > div[data-gallery-item-id="14"] {
  left: calc(var(--b-06-w) + var(--b-spacing));
  bottom: 0;
}
#esquisse-mosaic > div[data-gallery-item-id="04"] {
  left: calc(var(--b-06-w) + var(--b-spacing) + var(--b-14-w) + var(--b-spacing));
  bottom: 0;
}
#esquisse-mosaic > div[data-gallery-item-id="18"] {
  right: 0;
  bottom: 0;
}
.sanctuary-mosaic {
  font-size: 0;
  white-space: nowrap;
  margin: 5rem 0;
}
.sanctuary-mosaic > div {
  background-size: 100% 100%;
  transition: filter ease-in-out 0.3s, opacity ease-in-out 0.3s, border-color ease-in-out 0.3s;
  cursor: pointer;
}
.sanctuary-mosaic > div {
  filter: saturate(100%) brightness(100%) contrast(100%);
}
.sanctuary-mosaic > div[data-gallery-item-id="01"] {
  background-image: url(../images/sanctuary/thumbnails/01.jpg);
}
.sanctuary-mosaic > div[data-gallery-item-id="02"] {
  background-image: url(../images/sanctuary/thumbnails/02.jpg);
}
.sanctuary-mosaic > div[data-gallery-item-id="03"] {
  background-image: url(../images/sanctuary/thumbnails/03.jpg);
}
.sanctuary-mosaic > div[data-gallery-item-id="04"] {
  background-image: url(../images/sanctuary/thumbnails/04.jpg);
}
.sanctuary-mosaic > div[data-gallery-item-id="05"] {
  background-image: url(../images/sanctuary/thumbnails/05.jpg);
}
.sanctuary-mosaic > div[data-gallery-item-id="06"] {
  background-image: url(../images/sanctuary/thumbnails/06.jpg);
}
.sanctuary-mosaic > div[data-gallery-item-id="07"] {
  background-image: url(../images/sanctuary/thumbnails/07.jpg);
}
.sanctuary-mosaic > div[data-gallery-item-id="08"] {
  background-image: url(../images/sanctuary/thumbnails/08.jpg);
}
.sanctuary-mosaic > div[data-gallery-item-id="09"] {
  background-image: url(../images/sanctuary/thumbnails/09.jpg);
}
.sanctuary-mosaic > div[data-gallery-item-id="10"] {
  background-image: url(../images/sanctuary/thumbnails/10.jpg);
  border: 0.5px solid #e8e8e8;
}
@media only screen and (max-width: 1280px) {
  .sanctuary-mosaic {
    margin: 4rem 0;
  }
}
.sanctuary-mosaic > div {
  display: inline-block;
}
#sanctuary-1-mosaic {
  --w1: 16.5rem;
  --h: 21.95rem;
  --mr: 2.05rem;
  --w2: 29.26rem;
}
#sanctuary-1-mosaic > div[data-gallery-item-id="01"]:hover {
  filter: saturate(106%) brightness(110%) contrast(103%);
}
#sanctuary-1-mosaic > div[data-gallery-item-id="02"]:hover {
  filter: saturate(106%) brightness(111%) contrast(103%);
}
@media only screen and (max-width: 1780px) {
  #sanctuary-1-mosaic {
    --w1: calc(8.2665vw + 1.79rem);
    --h: calc(10.972vw + 2.42rem);
    --mr: calc(1.02vw + 0.231rem);
    --w2: calc(14.66vw + 3.17rem);
  }
}
@media only screen and (max-width: 1280px) {
  #sanctuary-1-mosaic {
    --w1: 12.375rem;
    --h: 16.475rem;
    --mr: 1.54rem;
    --w2: 21.945rem;
  }
}
#sanctuary-1-mosaic div[data-gallery-item-id="01"] {
  width: var(--w1);
  height: var(--h);
  margin-right: var(--mr);
}
#sanctuary-1-mosaic div[data-gallery-item-id="02"] {
  width: var(--w2);
  height: var(--h);
}
#sanctuary-2-mosaic {
  --w1: 16.5rem;
  --h: 22rem;
  --mr1: 2.4rem;
  --mr2: 5rem;
  --w2: 29.32rem;
}
#sanctuary-2-mosaic > div:hover {
  filter: saturate(108%) brightness(108%) contrast(102%);
}
@media only screen and (max-width: 1780px) {
  #sanctuary-2-mosaic {
    --w1: calc(8.2745vw + 1.77rem);
    --h: calc(11.02vw + 2.38rem);
    --mr1: calc(1.2vw + 0.26rem);
    --mr2: calc(2.485vw + 0.577rem);
    --w2: calc(14.71vw + 3.14rem);
  }
}
@media only screen and (max-width: 1280px) {
  #sanctuary-2-mosaic {
    --w1: 12.371rem;
    --h: 16.5rem;
    --mr1: 1.8rem;
    --mr2: 3.76rem;
    --w2: 21.98rem;
  }
}
#sanctuary-2-mosaic div[data-gallery-item-id="03"] {
  width: var(--w1);
  height: var(--h);
  margin-right: var(--mr1);
}
#sanctuary-2-mosaic div[data-gallery-item-id="04"] {
  width: var(--w1);
  height: var(--h);
  margin-right: var(--mr2);
}
#sanctuary-2-mosaic div[data-gallery-item-id="05"] {
  width: var(--w2);
  height: var(--h);
}
#sanctuary-3-mosaic {
  --w: 29.333rem;
  --h: 22rem;
  --mr: 2.35rem;
  --mt: 3rem;
}
#sanctuary-3-mosaic > div:hover {
  filter: saturate(108%) brightness(108%) contrast(102%);
}
@media only screen and (max-width: 1780px) {
  #sanctuary-3-mosaic {
    --w: calc(14.7275vw + 3.12rem);
    --h: calc(11.046vw + 2.34rem);
    --mr: calc(1.18vw + 0.245rem);
    --mt: calc(1.483vw + 0.36rem);
  }
}
@media only screen and (max-width: 1280px) {
  #sanctuary-3-mosaic {
    --w: 21.984rem;
    --h: 16.488rem;
    --mr: 1.76rem;
    --mt: 2.26rem;
  }
}
#sanctuary-3-mosaic div[data-gallery-item-id="06"] {
  width: var(--w);
  height: var(--h);
  margin-right: var(--mr);
}
#sanctuary-3-mosaic div[data-gallery-item-id="07"] {
  width: var(--w);
  height: var(--h);
}
#sanctuary-3-mosaic div[data-gallery-item-id="08"] {
  display: block;
  width: var(--w);
  height: var(--h);
  margin-top: var(--mt);
}
#sanctuary-4-mosaic {
  --w1: 28.05rem;
  --h1: 37.4rem;
  --mr: 2.05rem;
  --w2: 41.64rem;
  --h2: 26.4rem;
}
#sanctuary-4-mosaic > div[data-gallery-item-id="09"]:hover {
  filter: saturate(130%) brightness(108%) contrast(95%);
}
#sanctuary-4-mosaic > div[data-gallery-item-id="10"]:hover {
  filter: saturate(120%) brightness(108%) contrast(101%);
  border-color: #e2e2e2;
}
@media only screen and (max-width: 1780px) {
  #sanctuary-4-mosaic {
    --w1: calc(14.053vw + 3.0355rem);
    --h1: calc(18.74vw + 4.05rem);
    --mr: calc(1.02vw + 0.231rem);
    --w2: calc(20.86vw + 4.51rem);
    --h2: calc(13.2265vw + 2.857rem);
  }
}
@media only screen and (max-width: 1280px) {
  #sanctuary-4-mosaic {
    --w1: 21.0375rem;
    --h1: 28.05rem;
    --mr: 1.54rem;
    --w2: 31.23rem;
    --h2: 19.8rem;
  }
}
#sanctuary-4-mosaic div[data-gallery-item-id="09"] {
  width: var(--w1);
  height: var(--h1);
  margin-right: var(--mr);
}
#sanctuary-4-mosaic div[data-gallery-item-id="10"] {
  width: var(--w2);
  height: var(--h2);
}
#sanctuary-book-info-subtitle {
  font-family: "Archer SSm A", "Archer SSm B";
  font-weight: 700;
  color: #666666;
  font-size: 1.6rem;
  letter-spacing: 0.07px;
  margin: 1em 0 0 0;
}
@media only screen and (max-width: 1280px) {
  #sanctuary-book-info-subtitle {
    font-size: 1.4rem;
  }
}
#sanctuary-book-info p {
  color: #999999;
}
#sanctuary-book-info p {
  font-size: 1.4rem;
  letter-spacing: 0.07px;
}
@media only screen and (max-width: 1280px) {
  #sanctuary-book-info p {
    font-size: 1.2rem;
  }
}
#sanctuary-book-info-blurb {
  margin-top: 0.5em;
  line-height: 1.4;
}
#sanctuary-book-info-publication {
  margin-top: 0.5em;
  line-height: 1.4;
}
#sanctuary-book-info-isbn {
  margin-top: 0.28em;
  line-height: 1.75;
}
#sanctuary-book-info-isbn-label {
  text-transform: uppercase;
  font-size: 1.2rem;
  letter-spacing: 0.3px;
}
@media only screen and (max-width: 1280px) {
  #sanctuary-book-info-isbn-label {
    font-size: 1rem;
  }
}
#sanctuary-book-info-isbn-number {
  letter-spacing: 0.3px;
}
#sanctuary-book-info-link {
  margin-top: -0.3em;
  line-height: 1.4;
  letter-spacing: 0.3px;
}
#sanctuary-book-info-link a {
  color: #999999;
  text-decoration: none;
  transition: color ease-in-out 0.3s;
}
#sanctuary-book-info-link a:hover {
  color: #c2c2c2;
}
#gallery {
  z-index: 1000;
  overflow: hidden;
  opacity: 0;
  visibility: hidden;
  transition: opacity var(--gallery-transition-duration) var(--gallery-transition-timing-function), visibility var(--gallery-transition-duration) var(--gallery-transition-timing-function);
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  pointer-events: none;
  background-color: rgba(255, 255, 255, 0.96);
}
body[data-gallery-shown] #gallery {
  opacity: 1;
  visibility: visible;
  pointer-events: fill;
}
.gallery-image-container {
  top: 0;
  width: 100vw;
  height: 100vh;
  position: fixed;
  left: 0;
  transition: opacity var(--gallery-transition-duration) var(--gallery-transition-timing-function), visibility var(--gallery-transition-duration) var(--gallery-transition-timing-function);
}
.gallery-image-container.hidden {
  opacity: 0;
  visibility: hidden;
}
.gallery-image,
.gallery-image-mini {
  position: fixed;
  background-size: 100% 100%;
}
.gallery-description {
  font-family: "Archer SSm A", "Archer SSm B";
  font-weight: 700;
  color: #222222;
  position: fixed;
  left: var(--gallery-horizontal-margin);
  padding-top: 2rem;
  font-size: 2.2rem;
  line-height: 1.3;
  transition: font-size var(--page-size-transition-timing-function) var(--page-size-transition-duration);
}
@media only screen and (max-width: 1780px) {
  .gallery-description {
    font-size: 1.7rem;
  }
}
@media only screen and (max-width: 1280px) {
  .gallery-description {
    font-size: 1.6rem;
  }
}
#gallery-nav {
  --button-size: 2.6rem;
  position: fixed;
  top: 18.5vh;
  right: calc(var(--gallery-horizontal-margin) - (var(--button-size) + 2rem));
  transition: right var(--page-size-transition-timing-function) var(--page-size-transition-duration);
}
@media only screen and (max-width: 1780px) {
  #gallery-nav {
    --button-size: 2.2rem;
  }
}
@media only screen and (max-width: 1280px) {
  #gallery-nav {
    --button-size: 2rem;
  }
}
#gallery-nav button {
  display: block;
  background-size: 100% 100%;
  background-color: transparent;
  border: none;
  line-height: 0;
  cursor: pointer;
  outline: none;
}
#gallery-nav button:hover {
  filter: drop-shadow(0 0 2px #999);
}
#gallery-nav button {
  width: var(--button-size);
  height: var(--button-size);
  margin-bottom: 2rem;
  transition: filter 0.3s ease-out, width var(--page-size-transition-timing-function) var(--page-size-transition-duration), height var(--page-size-transition-timing-function) var(--page-size-transition-duration);
}
#gallery-close {
  background-image: url('../images/gallery-close.svg');
}
#gallery-prev {
  background-image: url('../images/gallery-left.svg');
}
#gallery-next {
  background-image: url('../images/gallery-right.svg');
}