.flex,
.row,
.column,
.stack
{
	display					: flex;
	flex-direction			: row;
}

.row,
.stack
{
	width					: 100%;
	align-content			: space-between;
	align-items				: flex-start;
	justify-content			: flex-start;
	gap						: 1rem;
}

.g-0
{
	gap						: 0;
}

.g-1
{
	gap						: 1rem;
}

/* Just one line */
.row
{
	flex-wrap				: nowrap;
	flex-direction			: row;
	justify-content			: space-between;
	margin					: 1rem 0;
}

/* As many lines as needed */
.stack
{
	flex-wrap				: wrap;
	/*align-items				: center;*/
}

.stretch
{
	align-items				: stretch;
}

.between
{
	justify-content			: space-between;
}
/* Imbrications */
.row .row,
/*.row .stack,*/
.stack .stack,
.stack .row
{
	margin					: 0;
	gap						: 0;
}

.flex > DIV,
.stack > DIV
{
	flex-grow				: 1;
	flex-shrink				: 1;
	flex-basis				: 50px;
}

.flex.half > DIV,
.stack.half > DIV
{
	flex-basis				: 50%;
}

.flex.third > DIV,
.stack.third > DIV
{
	flex-basis				: 32%;
}

.flex.quarter > DIV,
.stack.quarter > DIV
{
	flex-basis				: 24%;
}

#left .row,
#center .row,
#right .row
{
	margin					: 0;
}

.column,
.row.column,
.stack.column
{
	flex-direction			: column;
}

.row.start,
.stack.start
{
	align-content			: flex-start;
	justify-content			: flex-start;
}

.row.around,
.stack.around
{
	align-content			: space-around;
}

.flex.center,
.row.center
{
	align-content			: center;
	align-items				: center;
}

.row.middle
{
	align-items				: center;
}

.col1, .col2, .col3, .col4, .col5, .col6, .col7
{
	flex-shrink				: 1;
	flex-grow				: 1;
	flex-basis				: 100px;
}

.col1 { flex-basis			: 100%; }
.col2 { flex-basis			: 48%; }
.col3 { flex-basis			: 32%; }
.col4 { flex-basis			: 24%; }
.col5 { flex-basis			: 20%; }
.col6 { flex-basis			: 15%; }
.col7 { flex-basis			: 10%; }
.col8 { flex-basis			: 7.5%; }
.col9 { flex-basis			: 5%; }

/*
@media (max-width:1200px)
{
	.col2,
	.col3,
	.col4,
	.col5,
	.col6
	{
		display:block;
		flex:0 0 100%;
		width:100%;
		padding:0;
		background:red;
	}
}
*/

@media (max-width: 992px) {
	.flex,
	.row
	{
		flex-direction: column;
	}
	.col3,
	.col4,
	.col5,
	.col6,
	.col7,
	.col8
	{
		flex-basis			: 50%;
	}
}

@media (max-width: 768px) {
	.flex,
	.row
	{
		flex-direction: column;
	}
	.col3,
	.col4,
	.col5,
	.col6,
	.col7,
	.col8
	{
		flex-basis			: 50%;
	}
}

@media (max-width: 576px) {
	.col2,
	.col3,
	.col4,
	.col5,
	.col6,
	.col7,
	.col8
	{
		flex-basis			: 100%;
	}
}