:root{
  --loading-size: 100px;
  --fill-loading:  #5236AF;
  --loading-bg: #00041F;
}
.c-loading {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}
.loading > div svg path {
  fill: var(--fill-loading);
}
.c-loading > div,
.loading > div {
  position: absolute;
  top: calc(50% - (var(--loading-size) / 2));
  left: calc(50% - (var(--loading-size) / 2));
  width: var(--loading-size);
  height: var(--loading-size);
  max-width: 100%;
  max-height: 100%;
}
body > .c-loading {
  position: fixed;
  background-color: var(--loading-bg, #fff);
  z-index: 100000;
}



@media screen and (min-width: 640px) {
  .fancybox__container {
    flex-direction: row-reverse;
  }
}

.fancybox__thumbs.is-classic.is-horizontal {
  --f-thumb-width: 75px;
  --f-thumb-height: 55px;
  --f-thumb-gap: 8px;
}

.fancybox__thumbs.is-classic.is-vertical {
  --f-thumb-width: 100%;
  --f-thumb-height: 100px;
  width: 182px;
  /* outline: 1px solid #edeef0; */
  height: calc(100% - 60px);
  max-height: 100% !important;
  margin-top: 60px;
}
.fancybox__thumbs.is-classic.is-masked{
  display: none;
}
.fancybox__thumbs.is-classic.is-vertical .f-thumbs__track {
  padding: 0 16px;
}

.fancybox__toolbar {
  padding: 8px;
}

.fancybox__nav {
  --f-button-next-pos: 8px;
  --f-button-prev-pos: 8px;
}

.fancybox__carousel {
  min-width: 0;
  min-height: 0;
  order: 2;
}

.fancybox__slide {
  padding: 8px;
}
