.text-flex{
	text-align: center;/*pour centrer la liste des mots*/
}
.text-flex p{
	text-align: justify;
}
.gril-letr{
	position: relative;
	display: grid;
	grid-template-columns: repeat(15, 5.75vw);/*nombre de colonnes, largeur de colonne (à reporter en dessous)*/
	gap: 0.25vw;/*espace autour de la cellule*/
	justify-content: center;
	margin: 0 auto;/*auto = centrer*/
	color: var(--blec);
}
.boit{
	position: relative;
	display: flex;
	height: 5.75vw;/*hauteur de la cellule dans la colonne de grid-template-columns et .lign*/
	width: 5.75vw;/*largeur de la cellule dans la colonne de grid-template-columns et .lign*/
	align-items: center;
	justify-content: center;
	border: 0.25vw solid var(--blec);
	border-radius: 25%;/*arrondi les cases*/
	font-weight: bold;
	background-color: var(--blef);
	cursor: pointer;
}
.boit.coch{/*case cochée*/
	background-color: var(--roug);
}
.boit.truv{/*case d'un mot trouvé*/
	border-color: var(--roug);
}
.lign{/*ligne (div) barrant un mot trouvé dans la grille*/
	position: absolute;/*le point d'origine est le centre du div par défaut*/
	height: 5vw;
	border: 0.25vw solid var(--oran);
	border-radius: 2.5vw;
	transform-origin: 2.87vw 50%;/*point origine à X 2.5*5.75/5 du bord gauche et Y au centre. Le décalage en hauteur est fait avec dec1 et dec2 dans le javascript*/
	pointer-events: none;/*empêche que les cases surligné soient non clicables*/
}
.gril-mots{
	display: inline-block;
	columns: 3 auto;/*nombre de colonne - largeur de colonne*/
	column-rule: 0.25vw solid var(--blec);/*trait de séparation des colonnes*/
	list-style: none;
	margin: 0;
	padding: 0;
	text-align: left;
}
.gril-mots li{
	margin: .5vw 0;
	list-style-image: none;
}
.gril-mots li.trai{/*ligne barrant un mot trouvé dans la liste de mots*/
	text-decoration: line-through;
}
.gril-fini{
	display: none;
}
.gril-fini h2{
	text-align: center;/*pour centrer le texte*/
}