/* CSS Document */
.contentSimpleGallery  {
    --background: var(--logo-color-1-light);    /* background color */
    --font-color: var(--font-color-dark, #444);
    --gap-width: 5px;                           /* gap width */
	--columns: 4;
}

.contentSimpleGallery {
	display:  flex;
	flex: 0 1 auto;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: var(--gap-width);
}

.contentSimpleGallery .item {
	text-align: center;
	margin-bottom: 2em;
	vertical-align: top;
	/* flex-basis: calc((100/var(--columns)) - ((var(--columns)-1) * var(--gap-width))px); */
	flex-basis: calc(100% / var(--columns) - var(--gap-width) / var(--columns) * (var(--columns) - 1));
	background-color: var(--background);
	box-sizing: border-box;
}
/* .contentSimpleGallery .item a { cursor: url('../../images/layout/cursor_link.png') 0 35, auto; } */

.contentSimpleGallery .item.invisible.fake {
	visibility: hidden;
	line-height: 1px;
	font-size: 1px;
}

.contentSimpleGallery .item img {
	display: inline;
	max-width: 100%;
}

.contentSimpleGallery .item p, .contentSimpleGallery .item .title {
	margin: 0;
	padding: 0 10px;
	color: var(--font-color);
}
.contentSimpleGallery .item .title {
	margin-top: 5px;
	font-weight: bold;
}

@media all and (max-width: 1000px) { .contentSimpleGallery { --columns: 3; } }
@media all and (max-width: 700px) {	.contentSimpleGallery { --columns: 2; } }
@media all and (max-width: 400px) {	.contentSimpleGallery { --columns: 1; } }