/* Module media
======================================== */
.module-media{
	height: var(--height-viewport);
	display: grid;
	grid-auto-flow: column;
	grid-auto-rows: 100%;
	grid-auto-columns: 1fr;
	align-items: center;
}
.module-media:not(.cover, .contain){
	padding: var(--height-header) var(--page-sides) var(--height-footer);
}
.module-media:not(.cover, .contain)[data-size="2"]{
	grid-gap: var(--rows-gap) var(--cols-gap);
}
@media (orientation: portrait){
	.module-media[data-size="2"]{
		grid-auto-flow: row;
		align-content: center;
		justify-items: center;
	}
	.module-media.cover[data-size="2"],
	.module-media.contain[data-size="2"]{
		grid-auto-rows: 50%
	}
	.module-media:not(.cover, .contain)[data-size="2"]{
		grid-auto-rows: calc(50% - var(--rows-gap)/2);
	}
}
@media (max-width: 600px){
	.module-media:not(.cover, .contain)[data-size="2"]{
		column-gap: var(--page-sides);
	}
}

/* Thumbs */
.module-media .thumb{
	height: 100%;
	object-fit: contain;
}
.module-media.cover .thumb{
	object-fit: cover;
}
.module-media.medium .thumb{
	max-width: calc(100vmin - var(--m-top)*2);
	max-height: calc(100vmin - var(--m-top)*2);
}
.module-media.small .thumb{
	max-width: calc(100vmin - (var(--height-header) - var(--rows-gap) + var(--page-bottom))*2);
	max-height: calc(100vmin - (var(--height-header) - var(--rows-gap) + var(--page-bottom))*2);
}
@media (max-width: 600px){
	.module-media.medium .thumb,
	.module-media.small .thumb{
		max-width: calc(100vmin - var(--page-sides)*2);
		max-height: calc(100vmin - var(--page-sides)*2);
	}
}

/* Positions */
.module-media:not(.cover, .contain) .thumb:only-of-type{
	margin: auto;
}
@media (orientation: portrait){
	.module-media:not(.cover, .contain) .thumb:first-of-type:not(:only-of-type){
		align-self: flex-end;
		object-position: bottom;
	}
	.module-media:not(.cover, .contain) .thumb:last-of-type:not(:only-of-type){
		align-self: flex-start;
		object-position: top;
	}
}
@media (orientation: landscape){
	.module-media:not(.cover, .contain) .thumb:first-of-type:not(:only-of-type){
		justify-self: flex-end;
		object-position: right;
	}
	.module-media:not(.cover, .contain) .thumb:last-of-type:not(:only-of-type){
		justify-self: flex-start;
		object-position: left;
	}
}