.placeholder
{
	display:inline-block;
	background-color: #eee;
	border:solid #aaa 1px;
	box-sizing: content-box;
	margin:5px;
	text-align:center;
	border: solid #aaa 2px;
	border-radius:4px;
}

.correct, input.correct:focus
{
	border-color: #0C0;
	outline-color: #0C0 !important;
}

.wrong, input.wrong:focus
{
	border-color: #C00;
	outline-color: #C00 !important;
}

#namesMenu
{
	padding:0;
	height:300px;
	overflow-y:scroll;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
	grid-auto-rows: min-content; /* la hauteur minimale suffisante */
	align-items: stretch;
	gap:4px;
}

#namesMenu li
{
	height: 100%;
	display: flex;
	align-items: center;   /* centre verticalement */
	justify-content: center; /* optionnel : centre horizontalement aussi */
	list-style:none;
	padding:5px 10px;
	background-color:#EEE;
	cursor: pointer;
	text-align:center;
	border-radius:5px;
}

#namesMenu li:hover
{
	background-color:#ccc;
}

#phrase
{
	display: inline-block;
	padding:20px;
	border: solid #ddd 1px;
	width:100%;
	text-align:center;
}

#phrase, #phrase *
{
	font-size:24px;
}

#buttons
{
	text-align:center;
}

.button
{
	color:#FFF;
	display: inline-block;
	text-align:center;
	padding:10px 20px;
	margin:20px 20px 20px 0;
	box-sizing: content-box;
	cursor: pointer;
	background-color:#9E6850;
	border-radius:10px;
}

.disabled
{
	cursor: not-allowed;
	background-color:#cfb5ab;
}

#feedback
{
	text-align:center;
}

#feedback div
{
	border-radius: 5px;
	padding:5px 15px 5px 5px;
	color:#fff;
}

#feedback div img
{
    margin: 0 5px;
    vertical-align: middle;
}

#feedback div a
{
    color:#FFF;
	text-decoration:none;
	font-size:18px;
}

#success
{
	background-color:#0C0;
	display:none;
}

#failure
{
	background-color:#C00;
	display:none;
}

#start
{
	background-color:#DDD;
	text-align:center;
	padding:20px;
}

#start a
{
	font-weight:bold;
}

#start a
{

}

#scores
{
	width:100%;
	overflow: hidden;
	display: flex;
}

#scores div
{
	flex:auto;
	/* padding:5px; */
}

#globalScore
{
	text-align:center;
}

#avgScore
{
	text-align:right;
}

/*
#numHoles, #globalScore
{
	background-color:#eee;
}
*/

#name_zone
{
	padding:10px;
	border: dotted #aaa 1px;
	border-radius:20px;
}

#certif
{
	text-align:center;
}

#certif p
{
	font-size:13px;
}

#numTrousMinCertif
{
	font-weight:bold;
}