@charset "UTF-8";
/* CSS Document */

			#gallery {
				box-sizing: border-box;
				min-height: 100vh;
				min-height: 100dvh;
				min-height: 100svh;
			}
			#gallery .titles {
				position: relative;
				height: var(--copies);
				outline: 1px solid orange;
				outline: none;
			}
			#gallery .copies {
				position: relative;
				height: calc(100% - var(--copies));
				outline: 1px solid orange;
				outline: none;
			}
			#gallery h2 {
				position: relative;
				padding-top:100px;
				padding-top:0;
				padding-bottom: 25px;
			}
			#gallery .mirror {
				height: 100%;
				color: white;
			}
			#gallery .background {
			}

			#gallery {
			}
			#gallery .videos,
			#gallery .video-gallery {
				width: 100%;
				margin-top: 20px;
				display: grid;
				justify-items: center;
				gap: 50px;
			}
			#gallery .video-slider {
				margin-bottom: calc(110px * var(--zoom_block_scale));
				width: 100%;
				display: flex;
				flex-direction: column;
				align-items: center;
			}
			#gallery .video-gallery .video-embed,
			#gallery .videos .video-embed {
				position: relative;
				width: calc(100% * var(--video_embed_scale));
				margin-left: auto;
				margin-right: auto;
				aspect-ratio: 16 / 9;
				overflow: hidden;
				box-shadow:0 0 15px 0 #ffffff82;
				border-radius:calc(25px * var(--zoom_block_scale));
			}
			#gallery .video-gallery .video-embed.ratio-4-3,
			#gallery .videos .video-embed.ratio-4-3 {
				aspect-ratio: 4 / 3;
			}
			#gallery .video-gallery .video-embed iframe,
			#gallery .videos .video-embed iframe {
				position: absolute;
				inset: 0;
				width: 100%;
				height: 100%;
				border: 0;
			}
			#gallery .video-gallery .video-embed.ratio-4-3 iframe,
			#gallery .videos .video-embed.ratio-4-3 iframe {
				/* top: 50%; */
				/* left: 50%; */
				/* transform: translate(-50%, -50%) scale(1.333,1.0); */
				/* transform-origin: center; */
			}

			#gallery .video-slider .video-slides {
				display: grid;
				width: 100%;
			}
			#gallery .video-slider .video-slide {
				grid-area: 1 / 1;
				position: relative;
				opacity: 0;
				transform: translateX(120px);
				will-change: transform, opacity;
				pointer-events: none;
			}
			#gallery .video-slider .video-slide.is-active {
				opacity: 1;
				transform: translateX(0);
				pointer-events: auto;
				z-index: 2;
			}
			#gallery .video-slider .video-slide.is-leaving {
				opacity: 0;
				transform: translateX(0);
				z-index: 1;
			}
			#gallery .video-slider .video-nav {
				display: flex;
				align-items: center;
				justify-content: center;
				gap: 12px;
				margin-top: calc(16px * var(--zoom_block_scale));
				width: 100%;
			}
			#gallery .video-slider .video-dots {
				display: flex;
				align-items: center;
				gap: 8px;
			}
			#gallery .video-slider .video-dot {
				appearance: none;
				width: calc(10px * var(--zoom_block_scale));
				height: calc(10px * var(--zoom_block_scale));
				border-radius: 999px;
				border: none;
				padding: 0;
				background-color: rgba(255,255,255,0.4);
				cursor: pointer;
			}
			#gallery .video-slider .video-dot.is-active { background-color: rgba(255,255,255,0.95); }
			#gallery .video-slider .video-arrow {
				appearance: none;
				width: calc(36px * var(--zoom_block_scale));
				height: calc(36px * var(--zoom_block_scale));
				border-radius: 999px;
				display: flex;
				align-items: center;
				justify-content: center;
				padding: 0;
				cursor: pointer;
				background-color: transparent;
				border: none;
			}
			#gallery .video-slider .video-arrow .arrow {
				display: block;
				width: calc(15px * var(--zoom_block_scale));
				height: calc(15px * var(--zoom_block_scale));
				border-right: calc(3px * var(--zoom_block_scale)) solid #fff;
				border-bottom: calc(3px * var(--zoom_block_scale)) solid #fff;
				transform: rotate(-45deg);
			}
			#gallery .video-slider .video-prev .arrow { transform: rotate(135deg); }

			#gallery .gallery-controls {
				display: flex;
				justify-content: center;
				margin: 10px 0 20px 0;
			}
			#gallery .gallery-header {
				display: flex;
				flex-direction: column;
				gap: 12px;
				padding-top: 100px;
				padding-top: 50px;
				padding-bottom: 25px;
			}
			#gallery .gallery-header .titles {
				height: auto;
			}
			#gallery .gallery-header h2 {
				padding: 0;
				margin: 0;
			}
			#gallery .gallery-title-group {
				display: flex;
				align-items: center;
				gap: 30px;
			}
			#gallery .gallery-meta {
				display: flex;
				flex-direction: column;
				gap: 4px;
			}
			#gallery .gallery-meta-title {
				font-size: 1.1rem;
				font-weight: 600;
				color: white;
			}
			#gallery .gallery-meta-counts {
				display: flex;
				gap: 16px;
				font-size: 0.95rem;
				color: rgba(255,255,255,0.85);
			}
			#gallery .gallery-meta-counts strong {
				font-weight: 700;
				color: #ffffff;
			}
			#gallery .gallery-switch {
				--switch-thumb-size: 25px;
				--switch-gap: 4px;
				position: relative;
				display: inline-flex;
				align-items: center;
				gap: 10px;
				height: 38px;
				padding: 0;
				border-radius: 999px;
			}
			#gallery .gallery-switch .switch-label {
				background: transparent;
				border: 0;
				color: rgba(255,255,255,0.7);
				font-size: 0.9rem;
				font-weight: 600;
				padding: 0;
				cursor: pointer;
				white-space: nowrap;
			}
			#gallery .gallery-switch .switch-label.is-active {
				color: #ffffff;
			}
			#gallery .gallery-switch .switch-track {
				position: relative;
				width: 68px;
				height: 34px;
				align-items: center;
				padding: 0;
				border-radius: 999px;
				background: rgba(255,255,255,0.14);
				border: 1px solid rgba(255,255,255,0.35);
				box-shadow: inset 0 0 0 1px rgba(0,0,0,0.1);
				touch-action: pan-y;
			}
			#gallery .gallery-switch .switch-thumb {
				position: absolute;
				top: var(--switch-gap);
				left: var(--switch-gap);
				width: var(--switch-thumb-size);
				height: var(--switch-thumb-size);
				border-radius: 999px;
				background: #ffffff;
				box-shadow: 0 6px 15px rgba(0,0,0,0.25);
				transition: left 0.25s ease;
			}
			#gallery .gallery-switch[data-animate="0"] .switch-thumb {
				transition: none;
			}
			#gallery .gallery-switch[data-view="videos"] .switch-thumb {
				left: calc(100% - var(--switch-gap) - var(--switch-thumb-size));
			}

			#gallery .gallery-panels {
				display: grid;
				margin-top: 10px;
			}
			#gallery .gallery-panel {
				display: none;
				grid-area: 1 / 1;
				will-change: transform, opacity;
			}
			#gallery[data-gallery-view="photos"] .gallery-panel.gallery-photos {
				display: block;
			}
			#gallery[data-gallery-view="videos"] .gallery-panel.gallery-videos {
				display: block;
			}
			#gallery .photo-galleries {
				display: grid;
				gap: 30px;
			}
			#gallery .photo-gallery {
				position: relative;
				margin-bottom: 100px;
			}
			#gallery .gallery-title {
				font-size: 1.4rem;
				margin-bottom: 15px;
				color: white;
			}
			#gallery .photo-grid {
				--thumb-gap: 22px;
				--thumb-columns: 8;
				display: grid;
				grid-template-columns: repeat(var(--thumb-columns), minmax(0, 1fr));
				grid-auto-rows: auto;
				gap: var(--thumb-gap);
				justify-content: start;
				align-content: start;
				padding: var(--thumb-gap);
				margin: calc(-1 * var(--thumb-gap));
			}
			/* Zoom alapjan thumbnail meretek (desktop) */
			html[data-tzm="1"] #gallery .photo-grid { --thumb-columns: 10; }
			html[data-tzm="2"] #gallery .photo-grid { --thumb-columns: 9; }
			html[data-tzm="3"] #gallery .photo-grid { --thumb-columns: 8; }
			/*   TABLET     */ @media screen and (min-width: 520px) and (max-width: 959.8px) {
				#gallery .photo-grid {
					--thumb-columns: 6;
				}
				html[data-tzm="1"] #gallery .photo-grid { --thumb-columns: 8; }
				html[data-tzm="2"] #gallery .photo-grid { --thumb-columns: 7; }
				html[data-tzm="3"] #gallery .photo-grid { --thumb-columns: 6; }
			}
			/*   MOBILE     */ @media screen and (min-width:   0px) and (max-width: 519.8px) { 
				#gallery .photo-grid {
					--thumb-columns: 4;
					--thumb-gap: 10px;
					grid-template-columns: repeat(4, minmax(0, 1fr));
					grid-auto-rows: auto;
					align-items: start;
				}
				#gallery .photo-thumb,
				#gallery .photo-placeholder {
					display: block;
					width: 100%;
					height: auto !important;
					aspect-ratio: 1 / 1 !important;
					min-width: 0;
					min-height: 0;
				}
				#gallery .photo-grid > .photo-thumb,
				#gallery .photo-grid > .photo-placeholder {
					width: 100%;
					height: auto !important;
					aspect-ratio: 1 / 1 !important;
				}
				#gallery .photo-thumb {
					padding: 8px;
					background: #ffffff;
					box-sizing: border-box;
				}
				#gallery .photo-thumb .thumbnail {
					width: 100%;
					height: 100%;
					margin: 0;
					aspect-ratio: 1 / 1;
					background-size: contain;
					background-repeat: no-repeat;
					background-position: center;
					border-radius: 8px;
				}
				#gallery .photo-thumb .thumbnail::before {
					display: none;
				}
			}
			#gallery .photo-thumb {
				display: block;
				position: relative;
				width: 100%;
				height: auto;
				aspect-ratio: 1 / 1;
				min-width: 0;
				min-height: 0;
				padding: 0;
				border: 0;
				background: #EEEEEE;
				cursor: pointer;
				border-radius: calc(12px * var(--zoom_block_scale));
				overflow: hidden;
				box-shadow: 0 6px 15px rgba(0,0,0,0.25);
				transition: transform 0.2s ease, box-shadow 0.2s ease;
				box-sizing: border-box;
				touch-action: pan-y;
			}
			#gallery .photo-thumb .thumbnail {
				position: relative;
				width: calc(100% - (10px * var(--zoom_block_scale)));
				height: calc(100% - (10px * var(--zoom_block_scale)));
				background-image: none;
				background-size: contain;
				background-repeat: no-repeat;
				background-position: center;
				overflow: hidden;
				margin: 0 0 0 calc(5px * var(--zoom_block_scale));
			}
			#gallery .photo-thumb .thumbnail::before {
				content: '';
				position: absolute;
				inset: 0;
				background-image: inherit;
				background-size: 150%;
				background-repeat: no-repeat;
				background-position: center;
				filter: blur(25px);
				transform: scale(1);
				transform-origin: center center;
				z-index: 0;
				pointer-events: none;
				display: none;
			}
			#gallery .photo-thumb:hover,
			#gallery .photo-thumb:focus-visible {
				transform: scale(1.15);
				box-shadow: 0 5px 15px 0 #000000;
				z-index: 100;
			}
			#gallery .photo-thumb .thumbnail img {
				position: relative;
				visibility: hidden;
				max-width: 100%;
				max-height: 100%;
				display: block;
				z-index: 1;
			}
			#gallery .photo-placeholder {
				display: flex;
				align-items: center;
				justify-content: center;
				width: 100%;
				height: 100%;
				min-width: 0;
				min-height: 0;
				aspect-ratio: 1 / 1;
				box-sizing: border-box;
				border-radius: 12px;
				background: rgba(255,255,255,0.15);
				border: 1px dashed rgba(255,255,255,0.45);
				color: #ffffff;
				font-weight: 600;
				font-size: 0.95rem;
				line-height: 1.25;
				text-align: center;
				padding: 8px;
				overflow: hidden;
				word-wrap: break-word;
				overflow-wrap: break-word;
				white-space: normal;
			}
			.photo-lightbox {
				position: fixed;
				inset: 0;
				background: rgba(3,22,96,0.92);
				display: none;
				align-items: center;
				justify-content: center;
				z-index: 9999;
			}
.photo-lightbox.is-animating {
	pointer-events: none;
}
.photo-lightbox-anim {
	display: block;
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	box-shadow: 0 20px 40px rgba(0,0,0,0.35);
}
			.photo-lightbox.is-open {
				display: flex;
			}
.photo-lightbox-slides {
	display: grid;
	width: 90vw;
	height: 90vh;
	place-items: center;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	box-shadow: none;
}
			.photo-lightbox-slide {
				grid-area: 1 / 1;
				position: relative;
				width: 100%;
				height: 100%;
				max-width: 100%;
				max-height: 100%;
				opacity: 0;
				transform: translateX(120px);
				will-change: transform, opacity;
				pointer-events: none;
				display: flex;
				align-items: center;
				justify-content: center;
				overflow: visible;
			}
			.photo-lightbox-slide.is-active {
				opacity: 1;
				transform: translateX(0);
				pointer-events: auto;
				z-index: 2;
			}
			.photo-lightbox-slide.is-leaving {
				opacity: 0;
				transform: translateX(0);
				z-index: 1;
			}
			.photo-lightbox-frame {
				position: relative;
				display: inline-block;
				max-width: 90vw;
				max-height: 90vh;
				background-size: contain;
				background-repeat: no-repeat;
				background-position: center;
				border-radius: 18px;
				box-shadow: 0 20px 40px rgba(0,0,0,0.6);
			}
			.photo-lightbox-frame img {
				visibility: hidden;
				width: auto;
				height: auto;
				max-width: 90vw;
				max-height: 90vh;
				display: block;
			}
			.photo-lightbox-close {
				position: absolute;
				top: 20px;
				right: 20px;
				width: 44px;
				height: 44px;
				border-radius: 999px;
				border: none;
				background: rgba(255,255,255,0.9);
				color: #031660;
				font-size: 26px;
				font-weight: 700;
				cursor: pointer;
				z-index: 5;
			}
			.photo-lightbox-arrow {
				position: absolute;
				top: 50%;
				transform: translateY(-50%);
				width: 50px;
				height: 50px;
				border-radius: 999px;
				border: none;
				background: rgba(255,255,255,0.9);
				cursor: pointer;
				display: flex;
				align-items: center;
				justify-content: center;
				z-index: 5;
			}
			.photo-lightbox-prev { left: 20px; }
			.photo-lightbox-next { right: 20px; }
			.photo-lightbox-arrow .arrow {
				display: block;
				width: 16px;
				height: 16px;
				border-right: 3px solid #031660;
				border-bottom: 3px solid #031660;
				transform: rotate(-45deg);
			}
			.photo-lightbox-prev .arrow { transform: rotate(135deg); }
			body.lightbox-open {
				overflow: hidden;
			}


	/*   DESKTOP    */ @media screen and (min-width: 960px)                          { 
	}
	/*   TABLET     */ @media screen and (min-width: 520px) and (max-width: 959.8px) {
		section#gallery  { min-height:0; }
		#gallery .titles { height:auto; }
		#gallery h2 {padding-top: 25px;padding-bottom: 15px;}
		#gallery .gallery-header { padding-top: 25px; padding-bottom: 15px; }
		.photo-lightbox-close { top: 15px; right: 15px; }
		.photo-lightbox-prev { left: 10px; }
		.photo-lightbox-next { right: 10px; }
		.photo-lightbox-slide.is-landscape .photo-lightbox-frame img {
			width: 90vw;
			height: auto;
		}
		.photo-lightbox-slide.is-portrait .photo-lightbox-frame img {
			height: 90vh;
			width: auto;
		}
		#gallery .gallery-title-group {
			display: block;
		}
		#gallery .gallery-meta {
			display: block;
			text-align:center;
		}
		#gallery .gallery-meta-title {
			margin-top:15px;
			margin-bottom:15px;
			text-wrap:balance;
		}
		#gallery .gallery-meta-counts {
			display: block;
			text-align:center;
		}
	}
	/*   MOBILE     */ @media screen and (min-width:   0px) and (max-width: 519.8px) { 
		#gallery  {min-height: 0; padding-bottom: 40px;}
		#gallery .titles { height:auto; }
		#gallery h2 {padding-top: 25px;padding-bottom: 15px;}
		#gallery .gallery-header { padding-top: 25px; padding-bottom: 15px; }
		#gallery .photo-gallery { margin-bottom: 120px; }
		#gallery .photo-placeholder { font-size: 0.8rem; padding: 6px; line-height: 1.2; }
		.photo-lightbox-close { top: 15px; right: 15px; }
		.photo-lightbox-prev { left: 10px; }
		.photo-lightbox-next { right: 10px; }
		.photo-lightbox-slide.is-landscape .photo-lightbox-frame img {
			width: 90vw;
			height: auto;
		}
		.photo-lightbox-slide.is-portrait .photo-lightbox-frame img {
			height: 90vh;
			width: auto;
		}
		#gallery .gallery-title-group {
			display: block;
		}
		#gallery .gallery-meta {
			display: block;
			text-align:center;
		}
		#gallery .gallery-meta-title {
			margin-top:15px;
			margin-bottom:15px;
			text-wrap:balance;
		}
		#gallery .gallery-meta-counts {
			display: block;
			text-align:center;
		}
	}

	/* Desktop layout for header */
	@media screen and (min-width: 960px) {
		#gallery .gallery-header {
			flex-direction: row;
			align-items: center;
			justify-content: space-between;
		}
		#gallery .gallery-controls {
			margin: 0;
			justify-content: flex-end;
		}
	}
