@charset "utf-8";
/* CSS Document */
body{
	background-repeat: repeat-y;
	background-size: contain;
	overflow-x: hidden;
	background-color: black;
	color: red;
}

.title {
  margin-top: auto;
  text-align: center;
  vertical-align: middle;
  color: whitesmoke;
}

.title h1 {
  padding-top: 5vh;
  text-align: center;
  vertical-align: middle;
  color: whitesmoke;
  font-size: 3rem;
  font-family: "Bitcount Grid Double", system-ui;
  font-optical-sizing: auto;
  font-weight: 325;
  font-style: normal;
  font-variation-settings:
    "slnt" 0,
    "CRSV" 0.5,
    "ELSH" 0,
    "ELXP" 0;
}

.subtitle {
  text-align: center;
  vertical-align: middle;
  color: whitesmoke;
}

.subtitle h2 {
  text-align: center;
  vertical-align: middle;
  color: whitesmoke;
  font-size: 2rem;
  font-family: "Bitcount Grid Double", system-ui;
  font-optical-sizing: auto;
  font-weight: 325;
  font-style: normal;
  font-variation-settings:
    "slnt" 0,
    "CRSV" 0.5,
    "ELSH" 0,
    "ELXP" 0;
}

.description{
  text-align: center;
  vertical-align: middle;
  color: whitesmoke;
  font-size: 1.5rem;
  font-family: "Bitcount Grid Double", system-ui;
  font-optical-sizing: auto;
  font-weight: 325;
  font-style: normal;
  font-variation-settings:
    "slnt" 0,
    "CRSV" 0.5,
    "ELSH" 0,
    "ELXP" 0;
}

.email{
  text-align: center;
  vertical-align: middle;
  color: whitesmoke;
  font-size: 1.5rem;
  font-family: "Bitcount Grid Double", system-ui;
  font-optical-sizing: auto;
  font-weight: 325;
	text-decoration: none;
  font-style: normal;
  font-variation-settings:
    "slnt" 0,
    "CRSV" 0.5,
    "ELSH" 0,
    "ELXP" 0;
}
/* === Gallery (Masonry-style layout) === */

.gallery {
  column-count: 4;
  column-gap: 8px;
  padding: 0 10px;
}

.gallery img {
  width: 100%;
  height: auto;
  display: block;
  margin-bottom: 8px;
  border-radius: 8px;
  break-inside: avoid;
  object-fit: cover;
  transition: transform 0.3s ease;
}

.gallery img:hover {
  transform: scale(1.05);
}

/* === Responsive Gallery Columns === */

@media (max-width: 1200px) {
  .gallery {
    column-count: 3;
  }
}

@media (max-width: 768px) {
  .gallery {
    column-count: 2;
  }
}

@media (max-width: 480px) {
  .gallery {
    column-count: 1;
  }
}

/* === Modal === */

.modal-xl {
	--bs-modal-width: 2140px !important;
}


#imageModal .modal-dialog {
  touch-action: auto !important;
}


#zoomContainer {
	overflow: auto;
	-webkit-overflow-scrolling: touch;
	touch-action: pinch-zoom!important;
	max-height: 90vh;
}


#modalImage {
	touch-action: pinch-zoom!important;
	height: auto!important;
	max-height: 84vh!important;
	margin: auto!important;
}

.gps-caption{
	text-align: center;
	vertical-align: middle;
	color: whitesmoke;
	font-size: 1.5rem;
	font-family: "Bitcount Grid Double", system-ui;
}