.ux2 {
	color:black;
	padding:4px 0px;
	font-face:prata;
	font-size:13px;
	letter-spacing:0px;
	line-height:1.3;
}

#thumb_table {
	table-layout:fixed;
	min-width:208px;
}

#thumb_table .thumb-cell {
	min-width:208px;
	text-align:center;
	vertical-align:middle;
	cursor:pointer;
}

#thumb_table .thumb-cell img {
	max-width:100%;
}
.thePopupFont {
	color:black;
	padding:4px 0px;
	font-face:prata;
	font-size:16px;
	letter-spacing:2px;
	line-height:1.4;
}
.thePopopPhoneFont {
	font-face:Prata;
	font-size:24px;
	margin-top:14px;
	color:white;
}




.theImgArrow {
	background:rgb(255,255,255,0);
	cursor:pointer;
}
.theImgArrow:hover {
	background:rgb(0,0,0,0.5);
}

#mySlidePage1,#mySlidePage2,#newpage1,#newpage2 {
	position: absolute;
	transition: left 0.5s ease-out;
	white-space: nowrap;
	user-select: none;
	width:100%;
	z-index:4;
}

.mySlidingTable {
	position:relative;
	overflow:hidden;
	width:100%;
	height:100%;
	user-select: none;
	min-height:200px;
	padding:0px;
	margin:0px;
	xborder-radius:14px;
}

.mySlidingTable:hover {	
}

.viewFullscreen {
	color:black;
}
.viewFullscreen:hover {	
	outline: 2px solid rgb(0,0,0,0.1);
	background: rgb(0,0,0,0.1);
	display: inline-block; 
	border-radius:6px;
}

.carousel-indicators {
	padding-inline-start:0;margin-block-start:4px;margin-block-end:4px;margin:0;padding:0;
	width:100%;text-align:center;list-style:none;vertical-align:middle;
}
.carousel-indicators li {
	display:inline-block;width:10px;height:10px;margin:1px;background-color:rgba(10,0,0,0.3);border:1px solid rgba(255,255,255,0.4);border-radius:10px}
.carousel-indicators .active {
	background-color:rgba(0,0,0,0.9) }


.kruisje {
	position:absolute;top:6px;right:6px;width:24px;height:24px;	
	padding:4px;
	border-radius:4px;
 }

.popup-shell-narrow > .kruisje,
.popup-shell-fullscreen > .kruisje {
	top:calc(6px + env(safe-area-inset-top));
	right:calc(6px + env(safe-area-inset-right));
}
.kruisje:hover {
	background: rgb(0,0,0,0.1);
}


.popup-shell {
	position:fixed;
	min-width:920px;
	top:50%;
	left:50%;
	background:white;
	transform:translate(-50%, -50%);
	z-index:1000;
	cursor:pointer;
	box-sizing:border-box;
}

.popup-layout {
	box-sizing:border-box;
	width:100%;
	height:100%;
	padding:30px;
	display:flex;
	gap:30px;
	align-items:stretch;
}

.popup-image-area {
	position:relative;
	flex:1 1 auto;
	min-width:0;
	min-height:0;
	display:flex;
	align-items:center;
	justify-content:center;
}

.popup-main-image {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	display:block;
	object-fit:contain;
}

.popup-main-preview {
	z-index:1;
}

.popup-main-large {
	z-index:2;
	opacity:0;
	transition:opacity 0.2s ease-in;
}

.popup-main-large.popup-image-loaded {
	opacity:1;
}

.popup-info-box {
	box-sizing:border-box;
	flex:0 0 clamp(195px, 25%, 290px);
	min-width:195px;
	max-width:290px;
	height:100%;
	min-height:65vh;
	display:flex;
	flex-direction:column;
	justify-content:center;
	align-items:stretch;
	gap:24px;
}

.popup-info-text {
	flex:0 0 160px;
	height:160px;
	text-align:left;
}

.popup-info-bar {
	display:grid;
	grid-template-columns:repeat(4, 1fr);
	flex:0 0 80px;
	height:80px;
	background:transparent;
}

.popup-scale-area {
	display:flex;
	flex-direction:column;
	align-items:center;
	gap:12px;
	text-align:center;
}

.popup-scale-image {
	position:relative;
	display:inline-block;
	width:180px;
	height:180px;
}

.popup-scale-image img:first-child {
	display:block;
}

.popup-shell-narrow {
	width:100%;
	height:100%;
	min-width:0;
}

.popup-narrow-divider {
	display:none;
}

.popup-shell-narrow .popup-layout {
	flex-direction:column;
	width:100%;
	height:100%;
	padding:calc(30px + env(safe-area-inset-top)) calc(30px + env(safe-area-inset-right)) calc(30px + env(safe-area-inset-bottom)) calc(30px + env(safe-area-inset-left));
	gap:0;
}

.popup-shell-narrow .popup-image-area {
	flex:1 1 auto;
}

.popup-shell-narrow .popup-narrow-divider {
	display:grid;
	grid-template-columns:repeat(4, 1fr);
	flex:0 0 80px;
	height:80px;
	margin-top:8px;
	background:transparent;
}

.popup-bar-cell {
	display:flex;
	align-items:center;
	justify-content:center;
}


.popup-bar-close-cell {
	grid-column:span 2;
}

.popup-bar-close {
	font-family:Arial, sans-serif;
	font-size:16px;
	letter-spacing:1px;
	line-height:1;
	color:black;
	background:rgb(0,0,0,0.08);
	border:0;
	border-radius:8px;
	padding:10px 22px;
	cursor:pointer;
}

.popup-bar-close:hover {
	background:rgb(0,0,0,0.16);
}

.popup-shell-phone .popup-bar-close {
	font-size:28px;
}
.popup-bar-arrow {
	height:80px;
	width:auto;
	opacity:0.2;
	cursor:pointer;
}

.popup-shell-narrow .popup-info-box {
	flex:0 1 208px;
	width:100%;
	max-width:none;
	min-width:0;
	height:208px;
	min-height:0;
	max-height:208px;
	flex-direction:row;
	align-items:center;
	justify-content:space-between;
	gap:30px;
}

.popup-shell-narrow .popup-info-text {
	flex:1 1 auto;
	min-width:0;
	height:auto;
	text-align:left;
}
.popup-shell-phone .thePopupFont,
.popup-shell-phone .viewFullscreen {
	font-size:28px;
}

.popup-shell-narrow .popup-info-bar {
	display:none;
}

.popup-shell-narrow .popup-scale-area {
	flex:0 0 210px;
	width:210px;
	align-items:flex-end;
	text-align:right;
}


.popup-shell-fullscreen {
	width:100%;
	height:100%;
	min-width:0;
	max-width:none;
	max-height:none;
	box-shadow:none;
}

.popup-fullscreen-layout {
	box-sizing:border-box;
	width:100%;
	height:100%;
	padding:calc(30px + env(safe-area-inset-top)) calc(30px + env(safe-area-inset-right)) calc(30px + env(safe-area-inset-bottom)) calc(30px + env(safe-area-inset-left));
	display:flex;
	align-items:center;
	justify-content:center;
}

.popup-fullscreen-image {
	max-width:100%;
	max-height:100%;
	width:auto;
	height:auto;
	display:block;
	object-fit:contain;
}