.gallery-grid{
	width:100%;
	display:flex;
	flex-wrap:wrap;
	flex-direction:row;
	align-items:center;
	justify-content:center;
	
	--gg-gap: 8px;
	--gg-columns: 3;
	
	gap: var(--gg-gap);
}
.gallery-thumbnail{
	background:#222;
	/*width: calc(var(--pages-actual-width) / round(calc(var(--pages-actual-width) / 80px)));*/
	/*width:  calc(var(--pages-actual-width) / 3);*/
	/*width: calc( (100% - ((var(--gg-columns)-1) * 8px)) / var(--gg-columns) );*/
	width: calc( 100% / var(--gg-columns) - ( var(--gg-gap) * ( var(--gg-columns) - 1 ) / var(--gg-columns) ) - 3px );
	aspect-ratio: 1.5;
	border: 1px solid var(--color-text-auto);
	border-radius: 8px;
	object-fit:contain;
	box-sizing: content-box;
}

/* Responsive Section */
/* Targeting down to 300px. */

/* Mobile mode */
@media (width<640px) {
}

/* Smaller Mobiles */
@media (width<480px) {
}

/* Ridiculously Small Mobiles */
@media (width<360px) {
}

@media (width>=720px) and (width<960px) {
	.gallery-grid{ --gg-columns:2; }
}
@media (width>=640px) and (width<720px) {
	.gallery-grid{ --gg-columns:1; }
}
/* Mobile ladder */
/* PC <-640-> Big Mobile <-480-> Small Mobile <-360-> Ridiculous <-300-> I give up */
@media (width>=480px) and (width<640px) {
  /* 640 ~ 480 : Big Mobiles */
  .gallery-grid{ --gg-columns:2; }
}
@media (width>=360px) and (width<480px) {
  /* 480 ~ 360 : Small Mobiles */
   .gallery-grid{ --gg-columns:1; }
}
@media (width<360px) {
  /* 360 ~ 300 : Ridiculously Small Mobiles */
   .gallery-grid{ --gg-columns:1; }
}