html {
	background-color: var(--fond);
}
.normal {
	font-size: 50% !important;
}
#definition {
/*	border: 1px solid red;*/

}
a.bouton,
input[type="submit"] {
	border: 2px solid #2965c1;
	border-radius: 8px;
	padding-left: 8px;
	padding-right: 8px;
	text-decoration: none;
	padding-top: 3px;
	padding-bottom: 4px;
	margin-top: 9px;
	display: block;
	width: max-content;
	font-weight: 600 !important;
	color: #333;
	font-size: 100%;
}
a.bouton {
	margin-left: 361px;
	background-color: #e9e9ed;
}
input[type="submit"] {
	margin-left: 0px;
}
#note {
	width: max-content;
	font-size: 100%;
	position: relative;
	display: block;
	/* top: calc(1.5*var(--hautBase)); */
	top: 50px;
	left: 45px;
	clear: both;
	width: max-content;
}
#tierce {
	/* border: 1px solid green; */
	position: relative;
	display: inline-block;
	top: 55px;
	left: 155px;
	width: max-content;
}
#quinte {
	/* border: 1px solid orange; */
	position: relative;
	top: -12px;
	left: 214px;
	width: max-content;
}
#septime {
	/* border: 1px solid blue; */
	position: relative;
	top: -36px;
	left: 144px;
	width: max-content;
}
#arpège {
	position: relative;
	font-size: 200%;
	margin-top: 32px;
}
.genre {
	display: block;
	font-size: 40%;
}
#valide {
	position: relative;
	top: 0px;
	left: 350px;
}
.sr-only {
	border: 0 !important;
	clip: rect(1px, 1px, 1px, 1px) !important; 
	clip-path: inset(50%) !important; 
	height: 1px !important;
	margin: -1px !important;
	overflow: hidden !important;
	padding: 0 !important;
	position: absolute !important;
	width: 1px !important;
	white-space: nowrap !important;
}

.sr-only-focusable:focus,
.sr-only-focusable:active {
	clip: auto !important;
	clip-path: none !important;
	height: auto !important;
	margin: auto !important;
	overflow: visible !important;
	width: auto !important;
	white-space: normal !important;
	outline: none;
}


/* ========== V2 ========= */
body {
	color: var(--texte);
	background-color: var(--fond);
	text-decoration: none;
	height: 100%;
	font: 18px/100% var(--typo), Helvetica, Arial, sans-serif;
	min-width: var(--minPage);
	margin: auto;
	max-width: 98vw;
	width: 98vw;
	padding: 0px;
	border-left: 1px solid var(--souligneTrèsClair);
	border-right: 1px solid var(--souligneTrèsClair);
	margin-left: 2vw;
	overflow-x: hidden;
}
header, footer {
	width: 98%;
	margin-left: calc(-1 * var(--padding));
	padding: var(--padding);
}
header {
	position: relative;
	padding: calc(2*var(--padding));
	height: calc(1.2*var(--hautTete));
	background-color: var(--fondEcran);
	min-width: calc(2.1*var(--minPage));
	width: 98vw;
	margin-top: 0px;
	top: 0px;
	margin-left: 0px;
	padding-right: 0px;
	padding-left: 0px;
}
main {
	position: relative;
	padding-left: var(--padding) !important;
	padding-top: calc(1*var(--padding));
/*	max-width: var(--maxPageContenu);*/
	max-width: var(--maxPage);
	height: fit-content;
	background-color: transparent;
	z-index: 20;
	min-width: var(--minPage);
	width: 87%;
	z-index: 110;
	margin-top: 0px;
	margin-left: 0px;
	width: 99%;
	margin: auto;
}
#pied {
	border-top: 1px solid var(--souligneLéger);
	background-color: transparent;
	color: var(--couleurBase);
	max-width: var(--maxPage);
	padding-top: var(--padding);
	position: absolute;
	/* bottom: -113px; */
	min-width: var(--minPage);
}
h1,h2,h3,h4,h5 {
	font-weight: var(--entetePoids);
}
h1 {
	color: var(--entete1);
	margin-top: var(--entete1MargeHaute);
	margin-left: var(--entete1MargeGauche);
	font-size: var(--entete1Taille) !important;
	font-weight: normal;
	font-weight: 500;
}
h2 {
	color: var(--entete2);
	font-size: var(--entete2Taille);
	clear: both;
	font-weight: 500;
}
h3 {
	font-size: var(--entete3Taille);
	color: var(--entete3);
	clear: both;
	font-weight: 800;
	z-index: 222222222222222222222;
	position: relative;
	text-align: left;
}
h4 {
	font-size: var(--entete4Taille);
	color: var(--entete4);
	font-weight: 500;
	text-align: left;
}
