/* FORMULAIRES */
form{
	border:0px;
	margin:0px;
}

input, select, textarea {
	font-family: "Futura Book";
	padding:10px;
}

/* Titre des onglets de formulaire */
h3.field{
	font-family: 'Futura Medium';
	font-weight: 500;
	color:var(--blue);
	z-index:5;
	font-size: 1.2em;
	border-top:1px solid var(--border);
	padding: 20px 10px;
}

/* Premier titre sans séparateur ni marge*/
.corpsForm h3.field:first-child{
	padding: 10px 10px;
	margin-top: 0;
	border:0;
}

/* TODO : Controler si toujours utile*/
.deployF{
	font-size:1em;
	cursor: pointer;
	float:right;
	margin:0px;
	display:inline;
	display:none;
}

/* Fond en-tête onglet de formulaire*/
.corpsForm{
	padding:0px;
	box-shadow: 0 5px 10px 0 var(--shadow);
	background-color:var(--white);
	padding: 20px;
	border-radius: 10px;
}

.corpsForm.archived{
	border:5px solid red;
}

.mentionArchive{
	background-color: var(--red);
	color: var(--white);
	padding: 10px;
	border-radius: 5px;
	margin-bottom: 20px;
	font-weight: bold;
	text-align: center;
}

.corpsFormRessources{
	background:#fff;
	padding-left:5px;
	margin-bottom:5px;
	display: flex;
	flex-direction: column;
	flex-wrap: nowrap;
	justify-content: flex-start;
	align-items: center;
	row-gap: 20px;
}
.field_content{
	padding:10px;
	padding-top:10px;
	margin-bottom:5px;
}

#dgAction{
	padding:5px;
	margin:20px 0;
	box-shadow: 0 5px 10px 0 var(--shadow);
	background-color:var(--white);
	padding:20px 30px;
	border-radius:10px;
}

#dgAction > p.formEltInline{
	margin:1px;
	padding:0px;
	border:1px solid fuchsia;
	position:relative;
}

div.dgActionButton{
	display:inline-block;
}

#btDelete, #btVider{
	float:right;
	right:5px;
}

#btMdp{
	cursor:pointer;
	float: none;
}

#btLogin{
	cursor:pointer;
	float: none;
}

div.dgActionButton > button, 
div.dgActionButton > input[type="submit"], 
div.dgActionButton > input[type="reset"], 
.btNavTest > button {
	cursor: pointer;
	width: 120px;
	border: 2px solid var(--clearblue);
	border-radius: 5px;
	background-color: var(--clearblue);
	color: var(--black);
	padding: 5px 10px;
	margin-right: 5px;
	font-family: 'Futura Book';
	font-size: 0.9em;
}

div.dgActionButton > button:hover,
div.dgActionButton > input[type="reset"]:hover,
.btNavTest > button:hover {
	background-color:var(--white);
	color:var(--blue);
}

div.dgActionButton > input[type="submit"]{
	background-color: var(--blue);
	border: 2px solid var(--blue);
	color: var(--white);
}
div.dgActionButton > input[type="submit"]:hover{
	background-color: var(--white);
	border: 2px solid var(--blue);
	color: var(--blue);
}

#delete {
	border: 2px solid var(--red);
	background-color:var(--red);
	color: var(--white);
}
#delete:hover {
	background-color:var(--white);
	color:var(--red);
}

/* Vignettes d'illustrations, gestion des boutons */
.btActionForm {
    border: 1px solid var(--bluelogo);
    border-radius: 5px;
    background-color: var(--white);
    padding: 2px 8px;
    margin-right: 5px;
    font-size: 0.9em;
    cursor: pointer;
}

#files_add{
	margin:10px 0;
}
.btActionForm + #files_add{
	display:none;
}


legend{
	font-weight:bold;
	display: block;
	color:#066060;
}

select{
	width:250px;
	border: 1px solid var(--border);
	padding:10px;
}

.preInput{
	display: inline-block;
	min-width: 250px;
	padding-bottom:10px;
}

.apInput{
	display: inline-block;
	margin-bottom:10px;
}

.preArea{
	display: block;
	min-width:300px;
	margin-bottom:5px;
}

.apArea{
	display: block;
	margin-bottom:15px;
}

span.error {
	color: #A10A0A;
	font-size: smaller;
}

p.formElt {
	margin: 0;
	padding:0px;
}

.apInput > input {
	border: 1px solid var(--border);
	font-size: 1em;
	width: 200px;
	padding: 10px;
}

.apInput > input[type=file] {
	border:1px solid #999;
	font-size: 0.9em;
	width:215px;
}

.apArea > textarea {
	border: 1px solid var(--border);
	/*margin:4px;
	font-size: 0.9em;*/
}

.apInput > input[type="checkbox"] {
	border:0px;
}

p.formEltInline{
	margin:1px;
	padding:0px;
	display:inline-block;
}
p.formEltInline:hover{
	margin:0px;
}

p.formEltInline > input[type="button"], 
p.formEltInline > input[type="submit"], 
p.formEltInline > input[type="cancel"] {
	border:1px solid #999;
	display: inline-block;
}
p.formEltInline > input[type="button"]:hover, p.formEltInline > input[type="submit"]:hover, p.formEltInline > input[type="cancel"]:hover {
	border:2px solid #900;
	/*background-color:#679609;*/
	cursor: pointer;
}

.focus{
	border:1px solid #900 !important;
	background-color:#e8e8e8;
	color:#333;
}

.normal{
	font-style: normal;
}

p.multiselectList{
	/*border:1px solid #0ff;*/
	display: table;
}

div.btMultiselect{
	display: table-cell;
	margin:1px;
	padding:0px;
	/*border:1px solid #00f;*/
}

.preMS{
	display: block;
	text-align:center;
	font-weight:bold;
	/* border:1px solid #f00; */
	margin-bottom: 10px;
}

.apMS{
	display: block;
	/*border:1px solid #0f0;*/
	
}

/* Listing des r�ponses pour les QRM et QRU */
ul.listReponse{
	margin:5px 0;
	padding:0 0 0 20px;
	list-style: none;
}

li.listReponse{
	border:1px dashed #c3c3c3;
	margin:0px;
	width:500px;/*v1.1.16 D�comment�*/
	margin-bottom:2px;
	cursor:move;
}

li.reponses{
	margin:0px;
	width:600px;/*v1.1.16 D�comment�*/
	margin-bottom:2px;
}

#listReponseA > li.reponses, #listReponseB > li.listReponse{
	width:300px;/*v1.1.16 D�comment�*/
}

li.listReponseTxtt{
	cursor:default;
}

/* Fiche TEST */
ul.btAddQuestion{
	padding-left:5px;
}

#zoneReponse{
	margin-bottom:10px;
}

li.btAddQuestion{
	float: left;
	width: 30px;
	height: 25px;
	margin: 0 5px 0 0;
	padding:5 0px;
	border: solid 1px #c3c3c3;
	position: relative;
	text-align:center;
	z-index: 1;
	overflow: hidden;
	font-weight:bold;
	cursor:pointer;
	vertical-align:middle;
}

img.delQuestion, img.addQuestion{
	cursor: pointer;
}
.libReponse, .libReponseA, .libReponseB{
	padding-right:10px;
}
.libReponseA{
	padding-left:5px;
}

.delReponse, .delAxe{
	cursor:pointer;
	float:right;
	/* padding-top:5px; */
	/* padding-left:20px; */
	/* left: 0; */
}

/*Cadre pour les zones activation s�ance, s�quence */
.cadreForm{
	text-align: center;
	padding: 10px;
	border: 1px solid var(--red);
	width:300px;
	font-weight:bold;
}

.unactivated > .preInput > label{
	color: #c3c3c3;
}

#tabs{
	/*float:left;*/
}

#tabsEDC{
	/*float:right;*/
	/*margin-right:14px;*/
}

#tabs > button, #tabsEDC > button {
	border:1px solid var(--border);
	cursor: pointer;
	color:var(--blue);
	padding:20px;
	margin-right: 5px;
	width: 200px;
	border-radius: 10px;
	background-color:var(--yellow);
}

#tabsEDC > button {
	color:#ffffff;
	background-color:var(--red);
}

#tabs > button.selected, #tabsEDC > button.selected {
	border:3px solid var(--blue);
}

/* Passage des tests */

#blocNavTest{
	display:table;
	width:200px;
	float:right;
}

.btNavTest{
	display:table-cell;
	width:100px;
	text-align:center;
}

.btNavTest > button{
	font-size:2em;
}
.btNavTest > button > span{
	font-size:0.5em;
	margin-left:10px;
	vertical-align: middle;
}

/* Résultat des tests */
div.titreQuestion{
	font-weight:bold;
	background-color:rgb(188, 187, 179);
	padding:5px;
	padding-left:30px;
	margin-top:10px; /* v1.1.12 */
}
p.note{
	font-weight:bold;
	margin-left:20px;	
}
div.enonce{
	display:table-cell;
	width:50%;
	margin:5px;
	padding:5px;
	border-bottom:1px solid rgb(188, 187, 179);
	border-right:1px solid rgb(188, 187, 179);
}
div.com{
	display:table-cell;
	width:50%;
	margin:5px;
	padding:5px;
}
div.commentaire{
	border: 1px solid grey;
	background-color:rgb(213, 213, 210);
	padding:5px;
}
span.correction{
	padding: 0 5px;
	color:red;
	font-style:italic;
	font-size:0.9em;
}

span.good{
	color:green;
}

/* Fenêtre de consultation des ressources ressource/play */
#cadrePlay{
	border-radius:10px;
	background-color:var(--white);
	padding:20px;
	margin:20px;
	display:flex;
	flex-direction:column;
	align-content:normal;
	gap:20px;
	box-shadow:0 5px 10px 0 var(--shadow);
	margin-bottom: 150px;
}

#warningPlay{
	padding: 10px 0;
	background-color:var(--yellow);
	color: var(--black);
	font-weight: 600;
	text-align: center;
	display: none;
}

#warningPlay .icon-attention {margin:0 10px;}

.categorieRessource{
	padding: 2px 10px;
	margin: 5px 10px;
	border-radius: 20px;
	line-height: 20px;
	font-size: 0.9em;
	color: var(--white);
	text-transform: uppercase;
}

.categorieRessource.cours {
	background-color: var(--yellow);
}
.categorieRessource.document {
	background-color: var(--bluelogo);
}
.categorieRessource.lien {
	background-color: var(--clearblue);
}
.categorieRessource.test {
	background-color: var(--red);
}
.categorieRessource.formulaire {
	background-color: var(--green);
}

div.dgActionButton > #open{
	background-color: var(--blue);
	border: 2px solid var(--blue);
	color: var(--white);
	width:250px;
}
div.dgActionButton > #open > span{
	margin-left:15px;
}
div.dgActionButton > #open:hover{
	background-color: var(--white);
	border: 2px solid var(--blue);
	color: var(--blue);
}

#btGerer{
	width:250px;
}

#navigationPlay{
	height:70px;
	background-color: var(--clearblue);
	margin: 0;
	/* padding: 0 20px; */
	box-shadow: 0px -8px 10px -3px var(--shadow);
	position:fixed;
	bottom: 0;
	width: 100%;
	display: flex;
	align-items: center;
	flex-direction: row;
	justify-content: space-between;
}

#prevNextPlay {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	/* gap: 10px; */
}

#allContentPlay{
	display:flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: flex-start;
	align-items: stretch;
	/* height: calc(100vh + 70px); 
	margin-bottom: 70px;*/
}
	#navRessource{
		background-color: var(--parcours);
		padding: 10px;
		width: 300px;
	}
		#navRessource a, #navRessource h3{
			color: var(--white);
		}
		#navRessource a.current{
			color: var(--yellow);
			font-weight:bold;
		}
		.playRessource{
			margin:5px 0;
		}

	#corpsPlay{
		width: 100%;
	}
/*
#instructions+div{
	
}*/
/*Axes de positionnement */
#nom_axe{width:150px;}
#desc_axe{width: 500px;}
li.listAxe{width:500px;height: 30px;}
.libAxe{color: var(--black);}
.descAxe{color: var(--inactive);min-width: 200px;background-color: var(--border);padding: 2px 10px;white-space: nowrap;}
.descAxe.empty{font-style: italic;font-size: smaller;background-color: transparent;}
li.listAxe.remove{display:none;}
li.listAxe.new{color: var(--green);list-style: circle;}

#btPonderation{width:250px;}
#tabPonderation input {width:50px;}
#tabPonderation .libReponse {padding-right:25px;}
.zonePonderation{position: relative;   float: right;    top: -70px;}
#fieldAxes, .indexAxes{display: none;}
#listReponse .ponderationAxes {display:none;}

/*Réponse qui a été supprimée*/
.listReponse.del {display:none;}