@media (min-width: 768px) {

/* Responsive square logo container, no rounding, no padding */
body #menu_container #logo a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: hidden !important;

  /* clamp between 40px and 80px based on viewport width */
  width:  clamp(40px, 10vw, 80px) !important;
  height: clamp(40px, 10vw, 80px) !important;

  /* no inner padding */
  padding: 0 !important;

  /* enforce a square container */
  aspect-ratio: 1 / 1 !important;
}

/* Let the image scale to fit the square without distortion */
body #menu_container #logo a img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
}


/* 1. Force header to float over gallery */
body.gallery #menu_container {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  z-index: 9998 !important;

 /* Example background, tweak RGB & alpha to your taste */
  background-color: rgba(255, 255, 255, 0) !important;
}

/* 2. Make the gallery assets wrapper fill the full viewport height */
body.gallery #assets_wrap {
  height: 100vh !important;
}

/* 3. Remove any automatic top margin/padding so images truly reach top */
body.gallery #content {
  margin-top: 0 !important;
  padding-top: 0 !important;
}
/* 4. Padding to images within the gallery container for padding */
body.gallery #assets_wrap {
  padding-top:    0px !important;  /* Change 20px to whatever you need */
  padding-bottom: 0px !important;
}

/* 1. Nuke the built-in left padding on the flex wrapper */
body.gallery #assets_wrap {
  padding-left: 0 !important;
  margin-left: 0 !important;
}

/* 2. Stretch the outer container full-width & remove its gutters */
body.gallery .container,
body.gallery #content .container {
  width: 100vw !important;
  max-width: 100vw !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* 3. (Just in case) remove any left margin on .assets itself */
body.gallery .assets {
  margin-left: 0 !important;
}



/* Pull the footer forward above the gallery */
body.gallery .footer_text {
  position: fixed !important;   /* keep it in view */
  z-index: 9999 !important;     /* higher than gallery images */
}
}

