.fancybox__backdrop {
	/* background-color: rgba(245, 245, 245, 0.6) !important; */
	background-color: rgba(245, 245, 245, 1.0) !important;
	background-color: #f0f0f0 !important;
	-webkit-backdrop-filter: blur(7px);
	backdrop-filter: blur(7px);
}
.f-button{
	width:45px;
	height:45px;
	overflow: hidden;
	border-radius: 50%;
	box-sizing: border-box;
	background-color: var(--colorWhite) !important;
	border: solid 1px var(--colorBlack) !important;
	transition: var(--buttonOverTransition);
}
.f-button{
	color:var(--colorBlack);
}
.f-button svg{
	width:18px !important;
	height:18px !important;
}
.f-button .material-icons{
	font-size: 20px;
}
.f-button:disabled{
opacity: 0.1;
}

body.hasHover .f-button:hover{
		box-shadow: var(--buttonOverOutline) !important;
		
}
.f-button::after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: var(--colorBlack);
	transform: scaleY(0);
	opacity: 0;
	transform-origin: top;
	transition: transform 0.3s ease, opacity 0.3s ease;
	z-index: -1;
}
body.hasHover .f-button:hover::after{
	transform: scaleY(1);
	opacity: 1;
}


.popupContent {
	color: black !important;
	background-color: white;
	padding: 5vh;
	overflow: hidden;
	display: none;

	/* min-height: 60%; */
    width: 60%;
    max-width: 95%;
	max-height: 90%;
}
.popupContent hr{
	background-color:var(--colorGrayDark);
	margin: 20px 0;
}

.popupCloseButton {
	top: 10px;
	right: 10px;
	position: absolute;
	background-color: var(--colorWhite);
	border: solid 1px var(--colorBlack50);
}
.popupCloseButton i {
	transform-origin: center;
	transition: transform 0.3s ease;
	color:var(--colorBlack);
	font-size: 1.2em;
}
body.hasHover .popupCloseButton:hover i{
	transform: translate(-50%, -50%) rotate(90deg);
}
.popupContent img{
	max-width: 100%;
	max-height: 100%;
    width: fit-content;
    margin: 0 auto;
}
.openPopupContent{
	cursor: pointer;
}
img.openPopupContent{
	cursor: zoom-in;
}