.tableau_responsive_wrapper
{
  display: grid;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  overflow: auto;
}

:root
{
	--taille_tableau: 0px;
	--taille_col1: 0px;
	--taille_col2: 0px;
	--taille_col3: 0px;
	--taille_col4: 0px;
	--taille_col5: 0px;
	--taille_col6: 0px;
	--text_size: 0;
	--border_color: black;
}

.tableau_responsive
{
	background-color: rgb(255,255,255);
	border-spacing: 0px;
	border-collapse: collapse;
	border-color: var(--border_color);
	border-style: solid;
	border-width: 0px;
	font-size: var(--text_size);
	width: var(--taille_tableau);
}

.tableau_responsive th, .tableau_responsive tr
{
	height: calc(2 * var(--text_size));
	border-color: var(--border_color);
	border-style: solid;
	border-width: 1px;
}

.tableau_responsive th
{
	font-weight: normal;
}

.tableau_responsive tr td:nth-child(1) { width: var(--taille_col1); }
.tableau_responsive tr td:nth-child(2) { width: var(--taille_col2); }
.tableau_responsive tr td:nth-child(3) { width: var(--taille_col3); }
.tableau_responsive tr td:nth-child(4) { width: var(--taille_col4); }
.tableau_responsive tr td:nth-child(5) { width: var(--taille_col5); }
.tableau_responsive tr td:nth-child(6) { width: var(--taille_col6); }

.tableau_responsive td
{
	height: calc(2 * var(--text_size));
	border-color: var(--border_color);
	border-style: solid;
	border-width: 0px 1px;
}

.tableau_responsive .noborder
{
	border: none !important;
	padding-left: 5px;
	padding-right: 5px;
}

.tableau_responsive .headcol
{
	position: -webkit-sticky;
	position: sticky;
	background-color: #DDD;
	left: 0px;
	border-color: var(--border_color);
	border-style: solid;
	border-width: 1px 1px;
}

.tableau_responsive .headcol_white
{
	background-color: #FFF;
}