.pagination span {
  cursor: pointer;
}

/* artist popup carousel */
.popup {
  margin: 0;
  padding: 0;
  width: 100%;
  overflow: hidden;
}

.carousel, .inner-carousel {
  list-style: none;
  display: flex;
  padding: 0;
  position: relative;
  transition: left 0.5s ease-in-out;
  left: 0;
  height: 100%;
}

.carousel li {
  display: flex;
  flex: 1 0 100%;
  overflow: hidden;
  justify-content: center;
  top: 0;
  left: 0;
  position: relative;
}

/* artist carousel */
.carousel li[id^=slide-] {
  position: relative;
  flex-direction: column;
}

.carousel li[id^=slide-] > figure {
  margin: auto;
  width: min(100%, 1280px);
}

.carousel li[id^=slide-] > header {
  flex: 10% 0 0;
  margin: auto;
  width: min(100%, 1280px);

  display: flex;
  justify-content: space-between;
  padding-top: var(--default-margin);
}

.inner-carousel {
  flex: 80% 0 0;
}

figcaption.caption-hover {
  position: absolute;
  width: 33%;
  --page-width: min(100%, 1280px);
  left: calc(calc(100% - var(--page-width)) / 2);
  opacity: 0;
  transition: opacity .5s linear;
}

figcaption.caption-hover p {
  font-size: var(--default-font-size) !important;
}


/* artist sub-carousel */
.carousel .thumbs {
  flex: 10% 0 0;
  text-align: center;
  margin: auto;
  width: min(100%, 1280px);
  opacity: 1;
}

.carousel figure {
  margin: 0;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  opacity: 1;
}

.carousel li img {
  max-height:100%;
  max-width: 100%; 
}

.carousel figure img, .carousel figure iframe {
  width: 100%;
  object-fit: contain;
  margin-bottom: 0px;
}

.popup .carousel figure img, .popup .carousel figure iframe {
  width: min(1200px, 100%);
  width: min(1200px, 100%);
}

.carousel .thumbs img {
  cursor: pointer;
  max-width: 60px;
  max-height: 60px;
  object-fit: contain;
  opacity: .5;
  margin: 0px 2px;
}

.thumbs img.active {
  opacity: 1;
}

.caption-toggler:before {
  content: "[+]";
  cursor: pointer;
  font-family: monospace;
}

.caption-on .caption-toggler::before {
  content: "[-]";
}


.carousel header nav a {
  margin-left: 20px;
}

.carousel figcaption h2, .carousel figcaption h3 {
  font-weight: normal;
  font-size: 1.6em;
  line-height: 1.2em;
  margin: 0;
  text-align: left;
}

.arrows span {
  cursor: pointer;
  font-size: 1.6em;
  line-height: 1.6em;
  transition: padding 0.5s ease-in-out;
}

.arrows .hidden {
  opacity: 0;
}

.arrows .prev {
  padding-left: 5px;
  padding-right: 0px;
}

.arrows .prev:hover {
  padding-left: 0px;
  padding-right: 5px;
}

.arrows .next {
  padding-left: 0px;
  padding-right: 5px;
}

.arrows .next:hover {
  padding-left: 5px;
  padding-right: 0px;
}

/* POPUP FULL PAGE CAROUSEL */
.popup .carousel figure img, .popup .carousel figure iframe {
  height: calc(80vh - 40px);
}

.popup .arrows {
  position: absolute;
  height: 20vh;
  top: 40vh;
  display: flex;
  align-items: center;
  margin: auto;
  width: 100%;
  padding: var(--default-margin) calc(calc(100% - 1280px) / 2);
  justify-content: space-between;
  z-index: 2;
}

/* caption transition */
figcaption, figure, .thumbs {
  transition: opacity 0.5s ease-in-out;
}

.caption-on figcaption {
  opacity: 1;
}

.caption-on figure, .caption-on .thumbs {
  opacity: .3;
}

/* home carousel */
.home .carousel-container {
  overflow: hidden;
  --max-width: min(100%, 1280px);
  --width: calc(var(--max-width) - var(--default-margin) * 2);
  margin-left: calc(calc(100% - var(--width)) / 2);
  width: var(--width);
  position: relative; /* for pagination */
}

.home .carousel li {
  flex-direction: column;
  justify-content: flex-end;
}

.home .carousel img {
  width: 100%;
  height: 70vh;
  object-fit: contain;
  /* object-position: 0 0; */
}

.home .carousel .date {
  font-size: 2em;
  line-height: 1.2em;
  color: #707070;
}

.home .pagination {
  position: absolute;
  right: 0;
  bottom: 0;
  background: white;
}

.home .pagination > * {
  color: #707070;
  text-transform: uppercase;
  margin-left: 10px;
  cursor: pointer;
}

.home .pagination .active {
  color: black;
}

.home .pagination a:hover {
  color: black;
  text-decoration: none;
}

/* exhibition views carousel */
.single-exhibition .carousel figure {
  flex: 90% 0 0;
}

.single-exhibition .carousel figcaption.caption-hover {
  width: calc(0.33 * var(--page-width));
  top: 10vh;
}

/* project views carousel */
.projects .carousel figure {
  flex: 90% 0 0;
}

.projects .carousel figcaption.caption-hover {
  width: calc(0.33 * var(--page-width));
  top: 10vh;
}

.projects .carousel figcaption.caption-hover p {
  font-size: var(--default-font-size);
}

/* store carousel */
.store .carousel-container {
  overflow: hidden;
  padding-bottom: 20px;
  position: relative; /* for pagination */
}

.store .carousel figure {
  flex-direction: row;
  align-items: flex-start;
}

.store .carousel figcaption {
  padding: var(--default-margin);
  flex: 40% 0 0;
}

.store .carousel a.cover {
  flex: 60% 0 0;
}

.store .carousel figcaption h2, .store .carousel figcaption h3 {
  font-size: 2.5em;
  line-height: 1.4em;
}

.store .carousel figcaption h5, .store .carousel figcaption p {
  /* font-size: 1.125em; */
  font-size: 0.9em;
  line-height: 1.6em;
  text-transform: uppercase;
}

.store .carousel img {
  max-height: 400px;
  object-position: left;
}

.store .pagination {
  position: absolute;
  right: var(--default-margin);
  background: white;
}

.store .pagination > * {
  color: #707070;
  text-transform: uppercase;
  margin-left: 10px;
  pointer: cursor;
}

.store .pagination .active {
  color: black;
}

.store .pagination a:hover {
  color: black;
  text-decoration: none;
}

/* ITEM CAROUSEL */
.single-store .carousel .desc main {
  overflow: hidden;
  position: relative;
}

.single-store .carousel .desc main img {
  margin-bottom: 0;
}

.single-store .carousel figure {
  margin: 0 var(--default-margin);
}

.single-store .carousel figcaption {
  margin: .5em 0 var(--default-margin) 0;
  color: #999;
  width: 100%;
}

.single-store .arrows {
  position: absolute;
  top: 0;
  height: 100%;
  display: flex;
  align-items: center;
  width: 100%;
  justify-content: space-around;
  z-index: 2;
}