#lecteur_accomp {display: block; position: relative; width: 100%; padding:0; margin: 0; /*background-color: #f6490f;*/}
#lecteur_accomp button {cursor: pointer;}
#lecteur_accomp button:hover {background-color: #000000;}

button.btfullscreen {display: block; position: absolute; border: none; border-radius: 0 0 0.5em 0.5em; padding: 0.5em; background-color: #4363ff; color: #FFFFFF;}

#zSelecteur {
	position: relative;
	width: 100%;
	padding: 0;
	margin:0;
}

#zSelecteur h2 {
	margin: 0 0 0.5em 0;
	font-weight: normal;
	font-style: italic;
	padding: 0.25em 5% 0.25em 5%;
	border-bottom: 5px double #b2ab57;
}

#zAccomp {
	position: relative;
	width: 80%;
}



#zAudio {
	position: fixed;
	top:0;
	right:0;
	
	display: block; 
	width: 25%; 
	margin: 0;
	padding: 0.5em;
	background-color: rgb(21,21,21);
	overflow: hidden;
	z-index: 2;
}

#zAudio.small {
	


}

#audioCommand {
	width: 100%;
	/*background-color: #ed40fb;*/
	padding: 0;
	margin: 0;
}


div.zoneButtonDuree {position: relative; display: flex; justify-content: left; align-items: center; height: 3em; width: 100%; padding: 0; margin: 0; /*background-color: #b2ab57;*/}

div.zbtPlayStop {position:relative; display: flex; justify-content: space-between; width: 20%; margin-right: 2%}

#cadreProgress {position: relative; width: 56%; height: 0.5em; margin: 0.5em 1% 0.7em 1%; background-color: #555655; border-radius: 0.25em; overflow: hidden;}
#progressBar {position: absolute; height: 1em; background-color: #4363ff; width: 0;}

div.cadreDuree {display: block; position: relative; width: 20%; height: 2.5em; margin:0; line-height: 2em; text-align: left; color: #FFFFFF; overflow: hidden;}
span#zoneDurees {display: flex; align-items: left; position: relative; width: 100%; padding: 0.25em 0 0.25em 0; margin: 0 0 0 -100%; font-size: 1em; border-radius: 0 0.5em 0.5em 0; transition: 0.5s linear margin-left; /*background-color: #FFFFFF;*/}
span#infoProgress{display: block; position: relative; width: 42%; margin-right: 3%; text-align: right; /*background-color: #CF3E21;*/}
span#infoProgressTotale{display: block; position: relative; width: 55%; text-align: left; /*background-color: #2152CF;*/}



#zoneCommandProgress {
	display: flex; 
	position: relative; 
	width: 100%; 
	margin: 0;
	padding:0; 
	justify-content: left;
	align-items: center;
	flex-direction: row;
    flex-wrap: wrap;
	/*background-color: #FFFFFF;*/
}






#audioCommand h2 {
	display: block;
	position: relative;
	width: 90%;
	margin: 0 0 0.5em 0;
	padding: 0 2% 0 0;
	color: #FFFFFF;
	/*line-height: 1.5em;*/
	/*min-height: 3em;*/
	
	text-align: left;
	font-style: italic;
	font-size: 1.1em;
	border: none;
	text-shadow: 2px 2px 3px #f6490f;
	/*background-color: #555655;*/
}

#audioCommand p.songInfo{
	margin: 0;
	padding: 0 0 0 0.3em;
	color: #FFFFFF;
	text-align: left;
	font-size: 1.15em;
}



#zAudio button {
	display: block;
	position: relative;
	width: 48%;
	font-size: 1.3em;
	border-radius: 15%;
	background-color: #4363ff;
	border: none;
	color: #FFFFFF;
	padding: 0.25em;
}

#zAudio button#btplay:hover {color: #000000; background-color:#2cfe2f;}

#zAudio button#btstop:hover {color: #000000; background-color:rgb(255,0,0);}

#zAudio button.CtrlPause {background-color: #fc8d09;}
#zAudio button.CtrlPlay {background-color: #2cfe2f; color: #000000;}

#zAudio img {
	display: block;
	margin: 0;
	padding: 0;
	height: 5em;
}

#zAudio audio {
	width: 100%;
	line-height: 50px;
	margin: auto;
	background: transparent;
}

#zGrille {
	position: relative;
	/*background-color: #e2fc05;*/
	padding: 1em 0 1em 0;
}

#zGrille {
	
}

h2.titre_accompagnement { text-align: center; margin-top: 1.5em; font-size: 3.2em; text-shadow: 0.075em 0.075em 0.2em #4363ff;  }
p.comHarmoni {font-weight: bold; font-size: 1em;}

h3.sstitreAccomp {
	text-align: center;
	width: 60%;
	margin: auto;
	font-size: 1.5em;
	padding: 0.5em 0 0.5em 0;
	border-bottom: 1px solid #95904a;
}

#zGrille table.tabGrilleAccomp {
	position: relative;
	width: 90%;
	border: none;
	
	
}
#zGrille table.tabGrilleAccomp tr {

}

#zGrille table.tabGrilleAccomp td, #zGrille table.tabGrilleAccomp th { border: 1px solid #4363ff;}

#zGrille table.tabGrilleAccomp td {
	width: 20%;
	font-size: 3em;
	/*background-color: #95904a;*/	
}

#zGrille table.tabGrilleAccomp th {
	width: 20%;
	font-size: 1em;	
	color: #FFFFFF;
	background-color: #4363ff;
}


#zGrille table.tabGrilleAccomp td.selected {color: #FFFFFF; background-color: #000000;}

						
#zdetail {
	position: relative;

}

span.repetition {color: #000000; font-size: 1.5em;}


@media screen and (max-width: 992px)
{
	/*Lecteur*/
	div#zAudio {width: 96%; padding-left: 2%; padding-right: 2%; top: auto; bottom: 0; border-top: 1px solid #f6490f; z-index: 10;}
	
	/*div.zoneButtonDuree {width: 30%;}
	div.cadreDuree {margin-left: 30%;}
	span#zoneDurees {font-size: 1em;}
	#cadreProgress {width: 70%;}
	#audioCommand h2 {width: 73%; text-align: right; font-size: 1em; padding:0; margin: 0 0 -0.25em 25%;}*/
	
	
	
	
	
}