body .gallery.slider ul.slick-dots li button::before {
  content: "•";
  background-color: transparent;
  width: 100%;
  height: 100%;
}

body .gallery.block .gallery-thumbnail::after {
  background-image: none;
    content: "visibility";
    color: #fff;
    font-family: 'Material Symbols Outlined';
    font-size: 2rem;
    transition: none;
    background-color: var(--color-functional-black)
}

body .gallery.block .gallery-thumbnail:hover::after {
    display: flex;
    align-items: center;
    justify-content: center;
}

#gallery-viewer-container {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  background-color: var(--grey-extra-light);
  width: 100vw;
  height: 100vh;
  z-index: 10000;
  --dark-grey: var(--color-functional-black);
}

.viewer-opened #gallery-viewer-container {
  display: block;
}

#gallery-viewer-container .slick-slide {
  transition: none;
  position: relative;
}

#gallery-viewer-container .slick-list {
  overflow: visible;
}

body #close-viewer {
  background-image: none;
  height: 2rem;
    width: 2rem;
}

body #close-viewer svg {
  display: block;
   width: 100%;
   height: 100%;   
}

body #close-viewer:hover svg path {
  fill: var(--color-700);
}

body #gallery-viewer-container .slick-arrow {
  font-size: 1.5rem;
  top: calc(50% - 0.75rem);
  cursor: pointer;
  display: flex;
  top: calc(50% - 0.75rem);
  align-items: center;
  justify-content: center;
  margin: auto;
  position: absolute;
  z-index: 1;
}

#gallery-viewer-container .slick-next {
  right: 5%;
}

#gallery-viewer-container .slick-prev {
  left: 5%;
}

#gallery-viewer-container .slick-arrow.slick-disabled {
  color: var(--color-functional-100);
  opacity: 1;
  pointer-events: none;
}

.gallery-caption a {
  display: inline-block;
}

@media (width < 1120px) {
  #gallery-viewer-container .slick-arrow {
    display: none !important;
  }
}

@media (orientation: portrait) {
  #gallery-viewer-container .slick-arrow {
    position: fixed;
    bottom: 0;
    top: unset;
  }
}