/*

  IMGBOXINLINE - responsive, jquery ONLY image gallery

*/

.imgboxinline 

{

	display: inline-block;

	vertical-align: top;

	margin: 0 20px 18px 0;

}

.imgboxinlineimgwrap 

{

	display: inline-block;

	position: relative;

	vertical-align: top;

	line-height: 0;

}

.imboxinlineheadtitle 

{

	/* font-size: 17px;*/

	position: absolute;

	top: 5px;

	left: 0;

	color: #eee;

	font-weight: bold;

	margin: 5px 5px 10px 0px;

	padding: 5px 5px 5px 5px;

	background: rgba(250, 250, 250, 0.7);

	background: var(--ubs-green-invert);

}

.imgboxinlinepictitle 

{

	position: absolute;

	bottom: 0;

	left: 0;

	right: 0;

	color: #eee;	

	min-height: 1em;

	max-width: none;

	margin: 0;

	padding: 8px 10px;

	box-sizing: border-box;



	background: rgba(250, 250, 250, 0.7);

	background: var(--ubs-green-invert);

}

.imgboxinlineimgwrap:has(> .nav) .imgboxinlinepictitle

{

	right: auto;

	max-width: 65%;

}

.imgboxinlinepictitle:empty

{

	display: none;

}





.imgboxinlineimgwrap  > img 

{

	display: none;

}

.imgboxinlineimgwrap  > img.show 

{

	display: block;

	width: auto;

	height: auto;

	max-width: 100%;

	border-radius: var(--ubs-image-radius) !important;

}

.imgboxinlineimgwrap > .navfs 

{

	position: absolute;

	top: 10px;

	right: 10px;

}

.imgboxinlineimgwrap > .navfs > span

{

	display: inline-block;

	opacity: 0.7;

}

.imgboxinlineimgwrap > .navfs > span:hover

{

	opacity: 0.95;

}

.imgboxinlineimgwrap > .nav

{

	position: absolute;

	bottom: 10px;

	right: 20px;

	display: flex;

	align-items: center;

	gap: 6px;

}

.imgboxinlineimgwrap > .nav > .imgboxinline-counter

{

	display: inline-block;

	margin: 0;

	padding: 0 8px;

	font-size: 14px;

	line-height: 24px;

	height: 24px;

	box-sizing: border-box;

	font-weight: bold;

	color: #fff;

	background: rgba(0, 0, 0, 0.45);

	border-radius: 3px;

	user-select: none;

}

.imgboxinlineimgwrap .nav > span.rsArrowIcn

{

	display: inline-block;

	opacity: 0.8;

	width: 24px;

	height: 24px;

	margin: 0;

	cursor: pointer;

	flex-shrink: 0;

}

.imgboxinlineimgwrap .nav > span.rsArrowIcn:hover

{

	opacity: 0.95;

}



.rsArrowIcn {		

	width: 24px;

	height: 24px;

	margin-top: 3px;

	margin-left: 3px;

/*	position: absolute; */

	cursor: pointer;	

	background: url('/p/css/rs/minimal-white/rs-minimal-white.png') transparent;

	border-radius: 2px;

}



.rsArrowLeft { background-position: -68px -36px; }

.rsArrowRight { background-position: -68px -68px; }

.rsFullscreen {	background-position: -6px -4px; }







.mfp-title 

{

	font-family: "Roboto Condensed", sans-serif;

	font-size: 16px;

	color: #888;		

}

.mfp-counter 

{

	font-family: "Roboto Condensed", sans-serif;

	font-size: 16px;

	color: #888;	

}



@media screen and (max-width: 400px) {

/*

	.navfs {

		display: none;

	}

	*/



	.imboxinlineheadtitle 

	{

		font-size: 12px;

	}

	.imgboxinlinepictitle 

	{

		font-size: 12px;

	}

	.imgboxinline-counter {

		font-size: 12px;

		line-height: 24px;

		height: 24px;

		padding: 0 6px;

	}

}