/* html{background-color: #ddeeff;} */


html{background-color: #a24fbd; font-size:100%;} /* Fond violet */
body{
	font-size:18px; 
    width: 80%;
    margin : 10px auto ;
    padding:2em;
    background-color : #fff;
	border-radius: 1em;
	box-shadow: 0 0 15px rgba(0,0,0, .65);
}

fieldset{
    border-radius: 5px;
	margin:.5em;
}

.visible{display : block}
.invisible{display:none}


header{
	display: flex;
	flex-direction: row;
}

form{
	display: flex;
	flex-direction: column;
}

button, input[type=button], input[type=submit], input[type=reset], .button-link{ 
	background-color:#7030a0; 
	color: white;
	padding:8px;
	border-radius: 8px;
}
h1 { color:#7030a0; 
	text-align:center;
}

p{
	text-align:justify;
	text-indent:1em;
}


tbody tr:nth-child(odd) {
  background-color: #fff;
}

tbody tr:nth-child(even) {
  background-color: #f7e0ff;
}

tbody tr:hover {
	/*box-shadow: 0 0 8px rgba(0,0,0, .65);*/
	background-color: #e7d0ef;
	transition: 0.25s ease-in-out;
}
tbody tr {
	transition: 0.25s ease-in-out;
}

td, th {
	padding:0 0.5em;
}
table {
  background-color: #f7e0ff;
  margin:auto;
}

.headSpan{
	font-weight: bold;
	color:#7030a0;
}

#donnee_eleve{
	flex: 1 1 auto;
}

#choix_dictee{
	flex: 1 1 auto;
}

.audioplayer{
	display: flex;
	flex-direction: column;
}
.audioplayer > *:not(legend) {
	margin: 1em auto;
}
/*
#btn_start{
	width:10em;
	padding:0.5em;
}
*/

#txt_rendu{
	width:100%;
	height:15em;
}
.buttonList{
	float:right;
}
.buttonList > * {
	padding:0.5em;
	margin:0.5em;
}





legend{
    background-color: #ddd;
    font-weight: bold;
    font-style: italic;
    padding:7px;
    border-radius: 5px;
    border: dashed 1px
}