.bleu {
	color: darkblue;
}
.rose {
	color: #b90e6a;
}
.vert {
	color: green;
}
body {
	margin: 0;
	
}
.entete {
	padding: 2px 5px;
}
.msg {
	font-family: Verdana,Arial,Helvetica,sans-serif;
	font-size: 16pt;
}
TD {
	font-size: 14pt;
	padding:1px 0 0 0;
}
.grid_page {
	display: grid;
	grid-template-columns: repeat(12, [col-start] 1fr);
	font-size: 14pt;
	padding:4px;
}
.cl1 {
	grid-column: col-start 1 / span 1;
}	
.cl2 {
	grid-column: col-start 2 / span 4;
}
.cl3 {
	grid-column: col-start 6 / span 1;

}
.cl5 {
	grid-column: col-start 7 / span 1;

}
.cl6 {
	grid-column: col-start 8 / span 2;

}
.cl7 {
	grid-column: col-start 10 / span 2;

}
.cl8 {
	grid-column: col-start 12 / span 1;

}

.cl9 {
	grid-column: col-start 2 / span 10;

}

.cc1 {
	grid-column: col-start 1 / span 6;
}
.cc2 {
	grid-column: col-start 7 / span 6;
}

.cr1 {
	grid-column: col-start 1 / span 1;
}
.cr2 {
	grid-column: col-start 2 / span 1;
}
.cr3 {
	grid-column: col-start 3 / span 4;
}
.cr4 {
	grid-column: col-start 7 / span 2;
}
.cr5 {
	grid-column: col-start 9 / span 2;
}
.cr6 {
	grid-column: col-start 11 / span 2;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}
.cr8 {
	grid-column: col-start 1 / span 12;
}
.grid_fine {
	border-width:1px; 
	border-style: none none solid; 
	border-color:black;
	font-size: 12pt;
	padding:1px;
}


.gris {
	background-color: #f0f0f0;
}
.blanc {
	background-color: #ffffff;
}
.gris:hover {
  background-color: gold;
}
.blanc:hover {
  background-color: gold;
}

@media only screen and (max-width:450px)
{
TD {
/*
	font-size: 27pt;
*/
	padding:1px 0 0 0;
}
	.grid_page {
		display: grid;
		grid-template-columns: repeat(12, [col-start] 1fr);
		font-size: 12pt;
		padding: 1px;
	}
	.cl1 {
		grid-column: col-start 1 / span 2;
	}	
	.cl2 {
		grid-column: col-start 3 / span 7;
	}
	.cl3 {
		grid-column: col-start 10 / span 3;
	
	}
	.cl6 {
		grid-column: col-start 1 / span 5;
	
	}
	.cl7 {
		grid-column: col-start 6 / span 4;
	
	}
	.cl8 {
		grid-column: col-start 10 / span 3;
	}
	
	.cc1 {
		grid-column: col-start 1 / span 12;
	}
	.cc2 {
		grid-column: col-start 1 / span 12;
	}
	
	.cr1 {
		grid-column: col-start 1 / span 3;
	}
	.cr2 {
		grid-column: col-start 4 / span 3;
	}
	.cr3 {
		grid-column: col-start 7 / span 6;
	}
	.cr4 {
		grid-column: col-start 1 / span 3;
	}
	.cr5 {
		grid-column: col-start 4 / span 3;
	}
	.cr6 {
		grid-column: col-start 7 / span 6;
	}
	.cr8 {
		grid-column: col-start 1 / span 12;
	}
}