:root{--blur:3px;--unblur:0;--scale:1.5;--unscale:1;--grayscale:100%;--ungrayscale:0%;--transition:0.3s ease-in-out}

.hs-image__grid__list {
	display:flex;
	flex-wrap:wrap;
	gap:10px;
	justify-content:center;
	list-style-type:none;
	padding-left:0
	}

.hs-image__grid__list__item { 
	flex-basis:calc(30% - 10px);
	margin:0;
	overflow:hidden;
	position:relative
	}

button.hs-image__grid__list__item__button {
	all:unset;box-sizing:border-box;cursor:pointer;display:inline-block
	}

button.hs-image__grid__list__item__button:focus { 
	outline:3px solid #0bf;outline-offset:3px
	}

button.hs-image__grid__list__item__button:focus:not(:focus-visible){
	outline:none
	}

.hs-image__grid__list__item__image {
	height:100%;
	-o-object-fit:cover;
	object-fit:fill;
	position:relative;
	vertical-align:middle;width:100%
	}

.hs-image__grid__item__overlay { 
	align-items:center;
	background-color:hsla(0,0%,100%,0);
	box-sizing:border-box;
	display:flex;
	height:100%;
	justify-content:center;
	left:0;
	opacity:0;
	overflow:hidden;
	padding:1rem;
	position:absolute;
	top:0;
	transition:background-color .5s,opacity .5s;width:100%
	}

.hs-image__grid__item__overlay:hover {
	background-color:hsla(0,0%,100%,.6);opacity:1
	}

.hs-image__grid__item__overlay__content {
	max-height:100%;opacity:1;
	text-align:center;width:100%
	}

.hs-image__grid__item__overlay__content *{
	margin:initial;padding:initial
	}

.hs-image__grid__item__overlay__content--fit {
	display:inline-block;white-space:nowrap;width:100%
	}

.hs-image__grid__item__overlay__content .hs-image__grid__item__overlay__content--fit *{
	font-size:inherit!important
	}

.hs-image__grid__item__image--zoom_out {
	transform:scale(var(--scale));
	transition:var(--transition)
	}

.hs-image__grid__list__item:hover .hs-image__grid__item__image--zoom_out {
	transform:scale(var(--unscale))
	}

.hs-image__grid__item__image--blur {
	filter:blur(var(--unblur));transition:var(--transition)
	}

.hs-image__grid__list__item:hover .hs-image__grid__item__image--blur {
	filter:blur(var(--blur))
	}

.hs-image__grid__item__image--grayscale {
	filter:grayscale(var(--ungrayscale));
	transition:var(--transition)
	}

.hs-image__grid__list__item:hover .hs-image__grid__item__image--grayscale {
	filter:grayscale(var(--grayscale))
	}

.hs-image__grid__lightbox {
	align-items:center;display:flex;justify-items:center
	}

.hs-image__grid__lightbox__image {
	max-height:90vh;max-width:90vw
	}

.hs-image__grid__lightbox__button {
	height:48px;width:48px
	}

.hs-image__grid__lightbox__button,.hs-image__grid__lightbox__button__icon {
	align-items:center;display:flex;justify-items:center
	}

.hs-image__grid__lightbox__button--close {
	all:unset;background:none;color:#fff;cursor:pointer;font-size:1.5rem;height:48px;
	position:absolute;right:-40px;text-align:center;top:-40px;width:48px
	}

button.hs-image__grid__lightbox__button--close:focus {
	outline:3px solid #0bf;outline-offset:3px
	}

button.hs-image__grid__lightbox__button--close:focus:not(:focus-visible){
	outline:none
	}

button.hs-image__grid__lightbox__button {
	align-items:center;background:#ccc;
	border:0;border-radius:50%;cursor:pointer;
	display:flex;height:2em;justify-content:center;
	padding:0;position:absolute;top:50%;width:2em;z-index:1;
	-ms-flex-align:center;-ms-flex-pack:center;opacity:.7;
	transform:translateY(-50%)
	}

button.hs-image__grid__lightbox__button svg {
	height:1.2em;width:1.2em;fill:#000
	}

button.hs-image__grid__lightbox__button:hover:not(:disabled){
	opacity:.9
	}

button.hs-image__grid__lightbox__button:disabled {
	opacity:.3
	}

button.hs-image__grid__lightbox__button:focus {
	outline:3px solid #0bf;outline-offset:3px
	}

button.hs-image__grid__lightbox__button:focus:not(:focus-visible){
	outline:none
	}

button.hs-image__grid__lightbox__button--prev
	{left:1em}

button.hs-image__grid__lightbox__button--next {
	right:1em
	}

button.hs-image__grid__lightbox__button--hide{display:none}