:root {
    --header-height: 40px;
    --video-kynnys: 0.85; /* Kuinka iso osa median videosta tulee olla viewportissa, jotta se toistuu. */

	--body-width: max(80vw, min(100vw, 600px));

	--media-thumb-min-width: 8vw;
	--media-thumb-min-height: 8vh;


    --media-thumb-width: max(150px, var(--media-thumb-min-width));
    --media-thumb-height: max(150px, var(--media-thumb-min-height));

	--media-r-it-w: min(10vw, 200px);
	--media-r-it-h: min(10vw, 200px);

	--v_ttu: 200px;


	--media-r-it-w: 42%;

	--front-r-it-w: 160px;
	--front-r-it-h: 160px;

	--caru-it-w: 180px;
	--caru-it-r: 180px;

	--paginated-it-w: 170px;
	--paginated-it-h: 170px;
	


	--spoiler-image: url("https://kamat.luolasto.org/img/spoiler.png");

	--media-carouse-display: "none";
	--mpage-caru-levitys: 0; /* Annetaan 100% leveys ja irrotetetaan media-näkymien väliin. */
}
/**/
/* #media-list.medias-page-right-items { */
/* 	--media-thumb-width: max( */
/* 			var(--media-r-it-w), */
/* 			170px */
/* 	); */
/* 	--media-thumb-height: var(--media-r-it-h, 150px);  */
/* } */
/**/
/* #media-list.font-page-right-medias { */
/* 	--media-thumb-width: var(--front-r-it-w, 150px); */
/* 	--media-thumb-height: var(--front-r-it-h, 150px);  */
/* } */
/**/
/* #media-list.carousel-row { */
/* 	--media-thumb-width: var(--caru-it-w, 180px); */
/* 	--media-thumb-height: var(--caru-it-h, 180px); */
/* } */
/**/
/* #media-list.paginated-medias { */
/* 	--media-thumb-width: var(--paginated-it-w, 200px); */
/* 	--media-thumb-height: var(--paginated-it-h, 200px); */
/* } */

#media-list.medias-page-right-items {

	/*
	--media-thumb-width: max(
			var(--media-r-it-w, 170px),
			min(var(--media-thumb-min-width, 5vw)
		)
	);
    --media-thumb-height: max(
			var(--media-r-it-h, 150px),
			var(--media-thumb-min-height)
	);*/

	--v_ttu: min(
		max(4vw, 150px),
		20vw
	);

	--media-thumb-width: var(--v_ttu);
	--media-thumb-height: var(--v_ttu);

}

#media-list.font-page-right-medias {
    --media-thumb-width: max(var(--front-r-it-w, 150px)/*, var(--media-thumb-min-width)*/);
    --media-thumb-height: max(var(--front-r-it-h, 150px)/*, var(--media-thumb-min-height)*/);
}
#media-list.carousel-row {
    --media-thumb-width: max(var(--caru-it-w, 150px), var(--media-thumb-min-width));
    --media-thumb-height: max(var(--caru-it-h, 150px), var(--media-thumb-min-height));
}
#media-list.paginated-medias {
    --media-thumb-width: max(var(--paginated-it-w, 200px), var(--media-thumb-min-width));
    --media-thumb-height: max(var(--paginated-it-h, 200px), var(--media-thumb-min-height));
}
