body {
   background: #DDD ;
   font-family: sans-serif ;
   margin: 0px ;
}

DIV.top > TABLE { width: 100%; table-layout: fixed ; }

TT { font-weight: bold ; }

/* BOXES */

.box_title {
   font-weight: bold ;
   text-align: center; 
   white-space: nowrap;
   border: 1px solid black ;
   border-bottom: 0px ;
   margin-top: 0.3em ;
   }

table.box_content {
   border: 1px solid black ;
   width: 100% ;
   border-spacing: 0px ;
}

TABLE.information_table {
border-spacing: 0px ;
margin: 0.4em;
}

TABLE.information_table, TABLE.information_table TR TD, TABLE.information_table TR TH {
border: 1px solid #888 ;
    }

TABLE.information_table TD, TABLE.information_table TH {
background: #EEE ;
}


table > tbody > tr > td { vertical-align: top ; padding: 2px ; }

/* TIPS */

A.tips > SPAN, TT.tips > SPAN, DIV.tips > TT {
  font-size: 10pt ;
  text-align: left ;
  font-weight: 500 ;
  text-decoration: none ;
  position:absolute;
  background-image: url('tip.png');
  color:#000;
  border:2px solid #00F;
  padding:0.2em;
  white-space:normal;
  opacity: 0;
  visibility: hidden ;
  transition: opacity 1s;
  top: -2000px ;
  left: -2000px ;
  z-index: 1;
  margin-left: 1em ;
}

A.tips:hover > SPAN, TT.tips:hover > SPAN , DIV.tips:hover > TT {
  opacity:1;
  top: auto ;
  left: auto ;
  visibility: visible ;
}

A.tips > SPAN:hover, TT.tips > SPAN:hover , DIV.tips > TT:hover {
  opacity:0;
  top: -2000px ;
  left: -2000px ;
  visibility: hidden ;
}

A { text-decoration: none ; }
A[href]:hover { text-decoration: underline ; }
A.tips:hover { text-decoration: none ; }


/* Only here to fix a Chrome bug */
A { background-image: url('transparent.png'); }


PRE { background-color: #FF0 ; border: 1px solid black ; }

DIV.about{ font-size: 60% ; }
DIV.about_questions>A:first-child.content> SPAN:before{ content: "Nom du répertoire contenant la définition du questionnaire" ; }
DIV.about_time>A:first-child.content:after{ content: "secondes" ; }
DIV.about_time>A:first-child.content> SPAN:before{ content: "Temps CPU utilisé pour générer cette page" ; }
DIV.about_version>A:first-child.content> SPAN:before{ content: "Version de QUENLIG utilisée" ; }

DIV.action>A:first-child.content> SPAN:before{ content: "Choisissez ce que vous voulez faire" ; }
DIV.action>A:first-child.content>.box_title:before{ content: "Actions" ; }
DIV.action_destroy_student>A:first-child.content:before{ content: "Détruit étudiants" ; }
DIV.action_destroy_student>A:first-child.content> SPAN:before{ content: "Détruit tous les étudiants qui n'ont donné aucune bonne réponse" ; }
DIV.heart_content .action_destroy_student .deleted:before{ content: "Ces étudiants ont été enlevés du système. Le nombre entre parenthèses indique le nombre de bonnes réponses qu'ils ont donnés" ; }
A.delete_one:before {content:'Détruit toutes les réponses données par cet étudiant'}
DIV.action_help>A:first-child.content:before{ content: "Aide/Explication" ; }
DIV.action_help>A:first-child.content> SPAN:before{ content: "Voir une page d'aide concernant le TP" ; }
DIV.heart_content .action_help .object_unsupported:before{ content: "Votre navigateur ne supporte pas la balise OBJECT" ; }
DIV.analyse>A:first-child.content> SPAN:before{ content: "Divers outils pour analyser le travail" ; }
DIV.analyse>A:first-child.content>.box_title:before{ content: "Analyser" ; }
DIV.answered>A:first-child.content:before{ content: "Le travail fait" ; }
DIV.answered>A:first-child.content> SPAN:before{ content: "Voir toutes les questions et réponses qui ont été faites" ; }
DIV.heart_content .answered .an_answer:before{ content: "Votre réponse : " ; }
DIV.heart_content .answered .comment TD:before{ content: "Votre commentaire : " ; }
DIV.heart_content .answered .answered_by:before{ content: "Réponses de : " ; }
DIV.answered TABLE.good_answer .an_answer { background: #DFD ; }
DIV.answered TABLE.bad_answer  .an_answer { background: #FDD ; }
DIV.answered .comment     { background: #DDD ; }
DIV.answered DIV.an_answer, PRE.an_answer { font-weight: bold ; }
DIV.answered_other>A:first-child.content:before{ content: "Le travail fait par les autres" ; }
DIV.answered_other>A:first-child.content> SPAN:before{ content: "Voir toutes les questions et réponses qui ont été faites" ; }
DIV.heart_content .answered_other .an_answer:before{ content: "Votre réponse : " ; }
DIV.heart_content .answered_other .comment TD:before{ content: "Votre commentaire : " ; }
DIV.heart_content .answered_other .answered_by:before{ content: "Réponses de : " ; }
DIV.answered_other TABLE.good_answer .an_answer { background: #DFD ; }
DIV.answered_other TABLE.bad_answer  .an_answer { background: #FDD ; }
DIV.answered_other .comment     { background: #DDD ; }
DIV.answered_other DIV.an_answer, PRE.an_answer { font-weight: bold ; }
DIV.answers>A:first-child.content:before{ content: "Les bonnes réponses" ; }
DIV.answers>A:first-child.content> SPAN:before{ content: "Voir les réponses" ; }
DIV.answers TABLE { border: 1px solid black ; }
DIV.autoeval .intro_problem:before{ content: "Les problèmes sont en temps limité (moins d'une heure) et ne peuvent être suspendus. Les seuls moyens de changer de problème sont d'abandonner ou bien de réussir. Cliquer sur le bouton pour le lancer :" ; }
DIV.autoeval .start_problem:before{ content: "Démarrer un nouveau problème" ; }
DIV.autoeval .giveup_problem:before{ content: "J'abandonne : je ne pourrais plus faire ce problème." ; }
DIV.autoeval .nomore_problem:before{ content: "Il n'y a plus de problèmes à faire pour le moment." ; }
DIV.autoeval .give_solution:before{ content: "Saisissez la réponse au dessus et tapez sur la touche 'Entrée'." ; }
DIV.autoeval .autoeval_good:before{ content: "Bravo, vous pouvez continuer si vous le désirez." ; }
DIV.autoeval_stats>A:first-child.content> SPAN:before{ content: "Les '.' sont les personnes, les 'x' les questions et le carré jaune, c'est vous. Verticalement c'est le niveau et horizontalement, c'est le temps de réflexion." ; }
DIV.autoeval_stats { position: relative; height: 35em }
DIV.autoeval_stats DIV { position: absolute; font-family: monospace }
DIV.autoeval_stats .me { background: #FF0; }
DIV.autoeval_stats .bad { color:red }
DIV.autoeval_stats .ok { color:green  }
DIV.autoeval_stats A.tips:hover TT { left:30em; width:24em; top: -3em; font-size: 100% }
DIV.autoeval_stats SPAN { top: 5em; left:20em; width:20em }
A.change_acl:before { content:'Editer les droits d\'accès (ACL)' }
BUTTON.change_acl_save:before { content:'Sauvegarder les droits' }
tt.roles { font-size: 70%; font-weight: normal ; }
.doc { font-size: 70%; }
.nowrap { white-space: nowrap ; }
BUTTON.change_acl_save { font-size: 130% }
DIV.cheaters>A:first-child.content:before{ content: "Copieurs" ; }
DIV.cheaters>A:first-child.content> SPAN:before{ content: "Cherche les copieurs" ; }
DIV.cheaters .no_pairs_found:before{ content: "Aucun copieur n'a été trouvé." ; }
DIV.heart_content .cheaters .c0:before{ content: "Étudiant 1" ; }
DIV.heart_content .cheaters .c1:before{ content: "Étudiant 2" ; }
DIV.heart_content .cheaters .c2:before{ content: "1 copie su 2" ; }
DIV.heart_content .cheaters .c3:before{ content: "2 copie sur 1" ; }
DIV.heart_content .cheaters .c4:before{ content: "% de bonne réponse copiées par 1" ; }
DIV.heart_content .cheaters .c5:before{ content: "% de bonne réponse copiées par 2" ; }
DIV.heart_content .cheaters .c0>SPAN:before{ content: "Un des étudiants" ; }
DIV.heart_content .cheaters .c1>SPAN:before{ content: "L'autre étudiant" ; }
DIV.heart_content .cheaters .c2>SPAN:before{ content: "Nombre de bonne réponses saisies par 1 moins d'une minute après une bonne réponse saisie par 2" ; }
DIV.heart_content .cheaters .c3>SPAN:before{ content: "Nombre de bonne réponses saisies par 2 moins d'une minute après une bonne réponse saisie par 1" ; }
DIV.heart_content .cheaters .c4>SPAN:before{ content: "Pourcentage de bonne réponses copiées sur 2" ; }
DIV.heart_content .cheaters .c5>SPAN:before{ content: "Pourcentage de bonne réponses copiées sur 1" ; }
DIV.heart_content .cheaters .CAPTION:before{ content: "Étudiants travaillant à plusieurs" ; }
DIV.cheaters_quick>A:first-child.content:before{ content: "Copieur liste" ; }
DIV.cheaters_quick>A:first-child.content> SPAN:before{ content: "Cherche ceux qui répondent trop vite (liste bonne réponses)" ; }
DIV.heart_content .cheaters_quick .c0:before{ content: "Étudiant" ; }
DIV.heart_content .cheaters_quick .c1:before{ content: "10*+rapide" ; }
DIV.heart_content .cheaters_quick .c2:before{ content: "20*+rapide" ; }
DIV.heart_content .cheaters_quick .c3:before{ content: "40*+rapide" ; }
DIV.heart_content .cheaters_quick .CAPTION:before{ content: "Étudiants répondant trop rapidement. Nombre de questions répondues en 10, 20, 40 fois moins de temps que le temps moyen de réponse." ; }
DIV.comment>A:first-child.content> SPAN:before{ content: "S'il y a un problème dans l'énoncé de la question (ambiguïté, grammaire, ...).\A Si les indices ne sont pas suffisants.\A Si une réponse que vous considérez bonne n'est pas acceptée.\A Alors : laissez un commentaire." ; }
DIV.comment>A:first-child.content>.box_title:before{ content: "Commentaire" ; }
DIV.comment .comment_button:before{ content: "Envoyer votre commentaire" ; }
DIV.comment .comment_given:before{ content: "Votre commentaire : " ; }
DIV.comment TEXTAREA { font-size: 80% ; width: 100% }
DIV.comment FORM {
    max-height: 0px ;
    margin: 0px;
    transition: max-height 1s;
    webkit-transition: max-height 1s;
    overflow: hidden ;
    }
DIV.comment FORM.highlight { max-height: initial ; }
DIV.comment FORM.highlight BUTTON P { background: #CFC ; }
DIV.comment:hover FORM { max-height: 20em }
DIV.comment BUTTON { width: 100% ; white-space: normal }
DIV.comment .comment_given { white-space: normal;}
DIV.comment A.tips > SPAN { white-space: pre ; }
DIV.competences>A:first-child.content> SPAN:before{ content: "Cliquez sur une compétence au dessous,\A ou ouvrez-là ou bien cliquez sur le graphique" ; }
DIV.competences>A:first-child.content>.box_title:before{ content: "Compétences" ; }
DIV.competences .char_recycle>SPAN:before{ content: "Effacer votre réponse pour recycler la question" ; }
DIV.competences .openclose>SPAN:before{ content: "Ouvre/ferme la liste des questions" ; }
DIV.competences .nice_results>SPAN:before{ content: "Rouge : Mauvais, Bleu : Bon, Vert : Super\A Cliquez pour essayer une autre version de la question.\A Bord complet : toutes les versions ont été vues." ; }
DIV.competences .bad_answer_given>SPAN:before{ content: "Vous avez donné une mauvaise réponse" ; }
DIV.competences .answered>SPAN:before{ content: "Vous avez bien répondu" ; }
DIV.competences .suspended_until>SPAN:before{ content: "Question bloquée car vous avez trop fait d'essai" ; }
DIV.competences .perfect_answer>SPAN:before{ content: "Réponse parfaite, prêt pour l'examen" ; }
DIV.competences .not_answerable>SPAN:before{ content: "Vous ne l'avez pas encore débloquée" ; }
DIV.competences .not_seen>SPAN:before{ content: "Vous ne l'avez jamais lue" ; }
DIV.competences .question_given>SPAN:before{ content: "Vous n'avez pas encore répondu" ; }
DIV.competences .resigned>SPAN:before{ content: "Vous n'avez pas encore répondu" ; }
DIV.competences .question_erase P:before{ content: "Effacer votre réponse" ; }
.competences CANVAS { height: 1em ; width: 1em }
.competences .competences { display: inline-block ; height: 1em ; width: 1em }
DIV.competences .line CANVAS { height: 1em ; opacity: 0.6 }
DIV.competences .line:hover CANVAS { opacity: 1 }
DIV.competences .line:hover A { color: #000 }
DIV.competences .line * { vertical-align: top }
DIV.competences .line { height: 1.1em ; }
DIV.competences .line:hover A { position: absolute ; background: #FFF }
DIV.competences A.max_descendants { font-weight: bold; }
DIV.competences A.question_given  {color:#888;}
DIV.competences A.bad_answer_given{color:#F00;}
DIV.competences A.answered        {color:#040;}
DIV.competences A.not_seen        {color:#00F;}
DIV.competences A.perfect_answer  {color:#0A0;}
DIV.competences A.suspended_until {background:#FDD;}
DIV.competences A.indice_given    {font-style:italic;}
DIV.competences A.current_question{text-decoration:underline;}
DIV.competences A.not_answerable  {color:#DDD;}
DIV.competences A.highlight  { background: black; color: white;text-decoration: blink; }
DIV.competences VAR { font-style: normal }
DIV.competences .nice_results { display: inline-block; vertical-align: bottom; border-spacing: 1px }
DIV.competences .box_title CANVAS:hover, .openclose:hover CANVAS, .nice_results:hover CANVAS {
    transform: scale(2.5,2.5) ;
    z-index: 1 ;
    }

DIV.competences .box_title CANVAS, .openclose CANVAS, .nice_results CANVAS {
    webkit-transition: transform 0.5s;
    transition: transform 0.5s;
    position: relative ;
    transform: scale(1.,1.) ;
    }
DIV.competences .nice_results TD { width: 5px; height: 5px; padding: 0px ; }
.title_bar DIV.competences .nice_results TD { width: 9px; height: 9px}
.title_bar DIV.competences .nice_results { border-spacing: 2px;}
DIV.competences .nice_results .good    { background: #00F ; }
DIV.competences .nice_results .bad     { background: #F00 ; }
DIV.competences .nice_results .perfect { background: #0F0 ; }
DIV.competences .box_title TT { font-weight: normal; font-size: 80% }
DIV.competences .box_title { padding-top: 0.5em; padding-bottom: 0.5em; }
DIV.competences A.tips > SPAN { white-space: pre ; }
DIV.courses>A:first-child.content:before{ content: "Support de cours" ; }
DIV.courses>A:first-child.content> SPAN:before{ content: "Voir le support de cours complet" ; }
@media screen { .hide_on_screen { display: none ; }} 
@media print { .hide_on_print { display: none ; }
                                     BODY, H1,
                                     TABLE.information_table TD,
                                     TABLE.information_table TH
                                     { background: #FFF }
                                     DIV.heart { margin-left: -1em }
                  }
DIV.courses .question_title { margin-top: 1.5em ; margin-bottom: 0em }/BODY { orphans: 3; widows: 3; }
H2 { page-break-after: avoid }
H3 { page-break-after: avoid }
.course_question { page-break-before: avoid }
DIV.debug>A:first-child.content:before{ content: "Débuggage" ; }
DIV.debug>A:first-child.content> SPAN:before{ content: "Activation du débuggage sur cette page" ; }
DIV.debug a.tips > div.tips > div { white-space: pre; }

DIV.evaluate>A:first-child.content> SPAN:before{ content: "Taper du code Python ici" ; }
DIV.evaluate>A:first-child.content>.box_title:before{ content: "Evaluateur" ; }
DIV.evaluate .evaluate_button:before{ content: "Exécuter" ; }
DIV.evaluate .evaluate_result:before{ content: "Résultat : " ; }
DIV.evaluate TEXTAREA { font-size: 80% ; width: 100% }
DIV.evaluate FORM.highlight BUTTON P { background: #CFC ; }
DIV.evaluate BUTTON { width: 100% ; }
DIV.exportcsv>A:first-child.content:before{ content: "Export CSV des notes" ; }
DIV.exportcsv>A:first-child.content> SPAN:before{ content: "Tableau intégrable dans un tableur avec pour chaque étudiant :\A Nom de l'étudiant\A #bonnes réponses\A #mauvaises réponses\A #indices affichés\A Temps passé en TP en heures\A Les différentes valeurs sont normalisées 0 c'est aucun et 1 c'est le maximum." ; }
DIV.exportcsv A.tips > SPAN { white-space: pre ; }
DIV.grade_recompute>A:first-child.content:before{ content: "Recalcule des notes" ; }
DIV.grade_recompute>A:first-child.content> SPAN:before{ content: "Attention : NE PAS FAIRE SI LA NOTATION EST CONTEXTUELLE. C'est seulement utile dans le cas où vous avez modifié le test de notation automatique" ; }
DIV.heart_content .grade_recompute .grade_recompute:before{ content: "Le recalcul des notations automatique est terminé" ; }
DIV.grade_recompute A { color: red }
DIV.heart .box_title { padding: 2px;}
DIV.heart > DIV { margin-top: 0.7em;}
DIV.heart > DIV > TABLE.box_content { background: #EEE ; }

DIV.hide>A:first-child.content:before{ content: "Visibilité" ; }
DIV.hide>A:first-child.content> SPAN:before{ content: "Gestion des vues" ; }
TT.hide { background:yellow }
TT.hide:before { content:'×' }
DIV.histogramgood>A:first-child.content:before{ content: "Histo. # bonnes réponses" ; }
DIV.histogramgood>A:first-child.content> SPAN:before{ content: "Voir l'histogramme du nombre de bonnes réponses par étudiants" ; }
DIV.heart_content .histogramgood .histogram:before{ content: "L'histogramme du nombre de bonnes réponses" ; }
DIV.histogramgood .histobad:before{ content: "L'histogramme du nombre de mauvaises réponses" ; }
DIV.identity>A:first-child.content> SPAN:before{ content: "Ce bloc dont le titre est votre nom contient toutes les informations concernant votre identité et votre session en cours" ; }

DIV.log_age>A:first-child.content:before{ content: "Charge les anciens" ; }
DIV.log_age>A:first-child.content> SPAN:before{ content: "Charge les anciens, même ceux qui n'ont pas travaillé depuis longtemps" ; }
DIV.map>A:first-child.content> SPAN:before{ content: "Il y a un carré par question, on part de la gauche on doit arriver à droite.\A     Jaune : la question affichée sur l'écran\A    Vert : question à laquelle vous avez répondu correctement\A    Rouge : question pour laquelle votre dernière réponse était fausse\A    Bleu foncé : question qu'il est possible de regarder\A    Bleu clair : Question abandonnée\A La couleur est plus pâle si des indices ont été demandés." ; }
DIV.map IMG { width: 100% ; margin-top: 0.3em ; }
DIV.map A.tips > SPAN { white-space: pre ; }
DIV.menu > DIV { overflow: hidden; max-width: 100% ; min-width: 100% ; transition: width 0.5s; webkit-transition: width 0.5s; display: inline-block; z-index: 1 ; }
DIV.menu > DIV > TABLE > TBODY > TR > TD { white-space: nowrap ; }
DIV.menu .box_title { display: block ; }
@media print { DIV.menu { display: none ; } ; }

DIV.options>A:first-child.content:before{ content: "Options de la session" ; }
DIV.options>A:first-child.content> SPAN:before{ content: "Affiche ou modifie les options de la session" ; }
DIV.heart_content .options .c0:before{ content: "Option de ligne de commande et plugin" ; }
DIV.heart_content .options .c1:before{ content: "Documentation" ; }
DIV.heart_content .options .c2:before{ content: "Valeur par défaut" ; }
DIV.heart_content .options .c3:before{ content: "Valeur courante" ; }
BUTTON.save_options:before { content:'Sauver les options' }
DIV.question>A:first-child.content> SPAN:before{ content: "La question que l'on vous pose et à laquelle vous devez répondre" ; }
DIV.question>A:first-child.content>.box_title:before{ content: "Question" ; }
DIV.question_answer>A:first-child.content> SPAN:before{ content: "Pensez à tester votre réponse dans la réalité avant de la saisir ici, afin d'éviter des erreurs bêtes" ; }
DIV.question_answer .answer_button:before{ content: "Envoyer la réponse" ; }
DIV.question_answer .maximum_bad_answer:before{ content: "Vous ne pouvez plus répondre à cette question, choisissez en une autre" ; }
DIV.question_answer .nr_try:before{ content: "Nombre d'essais que vous pouvez encore faire : " ; }
DIV.question_answer .missing_required:before{ content: "Vous devez avancer dans le questionnaire avant de pouvoir répondre à cette question" ; }
DIV.question_answer .suspended_until:before{ content: "Vous avez fait trop de mauvaises réponses, vous devez maintenant attendre avant de faire une autre proposition. Attention le temps d'attente augmente à chaque mauvaise réponse :" ; }
DIV.question_answer INPUT { width: 100% ; font-family: times; font-size:120%}
DIV.question_answer INPUT.checkbox { width: auto}
DIV.question_answer TEXTAREA { width: 100% ; }
DIV.question_answer FORM { margin: 0px }
DIV.question_answer BUTTON { margin-top: 0.5em }
DIV.question_answer BUTTON P { margin: 0px ; }
DIV.question_answer .show_on_hover { overflow: hidden ; max-height: 0px ; transition: max-height 1s ;  webkit-transition: max-height 1s ;  }
DIV.question_answer:hover .show_on_hover { max-height: 10em }
DIV.question_bad>A>EM.box_title{ background: #F88 ; }
DIV.question_bad>TABLE>TBODY>TR>TD{ background: #FCC ; }
DIV.question_bad>A:first-child.content>.box_title:before{ content: "Mauvaise réponse" ; }
DIV.question_bads>A:first-child.content>.box_title:before{ content: "Les mauvaises réponses données à cette question" ; }
DIV.question_bads .c0:before{ content: "Question" ; }
DIV.question_bads .c1:before{ content: "Mauvaise réponse donnée par l'étudiant" ; }
DIV.question_bads .c2:before{ content: "Les étudiants" ; }
DIV.question_bads .c0>SPAN:before{ content: "Texte de la question posée." ; }
DIV.question_bads .c1>SPAN:before{ content: "Si la mauvaise réponse est sur fond rouge\A cela veux dire que l'étudiant n'a pas eu de commentaire.\A\AS'il y a des '!!!' c'est que sa réponse a été comptabilisée comme bonne\A mais que suite à une modification du système elle est maintenant considérée comme valide" ; }
DIV.question_bads .c2>SPAN:before{ content: "Les étudiants ayant donné cette mauvaise réponse\A En gras s'ils n'ont pas trouvé la bonne réponse\A En italique s'ils ont demandé un indice" ; }
DIV.question_bads DIV.uncommented { background: #FAA; display: inline-block }
DIV.question_bads DIV.uncommented PRE { background-color: #FAA ; }
DIV.question_bads A.tips > SPAN { white-space: pre ; }
DIV.question_before>A:first-child.content> SPAN:before{ content: "Les informations affichées ici sont des rappels de cours et/ou des actions que vous devez effectuer avant de répondre à la question." ; }
DIV.question_before>A:first-child.content>.box_title:before{ content: "Avant de répondre" ; }
A.question_change_answer:before { content:' (Changer votre réponse)' }
A.question_change_answer { font-size: 60% ; }
DIV.question_comments>A:first-child.content>.box_title:before{ content: "Les commentaires qui ont été déposés à propos de cette question" ; }
DIV.question_comments .c0:before{ content: "Commentaire" ; }
DIV.question_comments .c1:before{ content: "Étudiant" ; }
DIV.question_comments .c2:before{ content: "Date" ; }
DIV.question_comments .c0>SPAN:before{ content: "Le texte du commentaire déposé par l'étudiant" ; }
DIV.question_comments .c1>SPAN:before{ content: "Le login de l'étudiant, vous pouvez cliquer pour lui envoyer un mail avec le rappel de la question et le contenu de son commentaire" ; }
DIV.question_comments .c2>SPAN:before{ content: "La date de dépôt du commentaire" ; }
DIV.question_correction>A:first-child.content>.box_title:before{ content: "Correction" ; }
DIV.question_correction .c0:before{ content: "Réponse de l'étudiant" ; }
DIV.question_correction .c1:before{ content: "Note" ; }
DIV.question_correction .c2:before{ content: "Commentaire" ; }
DIV.question_correction .c0>SPAN:before{ content: "Réponse de l'étudiant" ; }
DIV.question_correction .c1>SPAN:before{ content: "Cliquer pour indiquer la note à lui donner" ; }
DIV.question_correction .c2>SPAN:before{ content: "Saisissez un commentaire sur sa réponse.\A Ces commentaire peuvent être envoyés aux étudiants.." ; }
DIV.question_correction .question_correction_comment:before{ content: "Un commentaire laissé par : " ; }
.question_correction_table IMG { width: 8px; height: 8px; background: #F00; border: 0px }
.question_correction_table SPAN { white-space: pre ; }
.question_correction_comment { text-decoration: underline; }
DIV.question_correction A.tips > SPAN { white-space: pre ; }
DIV.question_good>A>EM.box_title{ background: #8F8 ; }
DIV.question_good>TABLE>TBODY>TR>TD{ background: #CFC ; }
DIV.question_good>A:first-child.content>.box_title:before{ content: "Bonne réponse !" ; }
DIV.question_good .key_enter P:before{ content: "Autre question" ; }
DIV.question_good .key_enter SPAN:before{ content: "Appuyez sur «Entrée» pour avoir la prochaine question" ; }
DIV.question_good button, p { margin: 0.5em }
DIV.question_grades>A:first-child.content> SPAN:before{ content: "Pour chaque enseignant ou compétence, indique le nombre de points en négatif ou positif." ; }
DIV.question_grades>A:first-child.content>.box_title:before{ content: "Notes pour cette question" ; }

DIV.question_indices>A:first-child.content> SPAN:before{ content: "Si vous n'avez aucune idée sur la manière de répondre à la question, demandez un indice" ; }
DIV.question_indices>A:first-child.content>.box_title:before{ content: "Des indices pour vous aider" ; }
DIV.question_indices .first_indice:before{ content: "Donnez-moi un indice" ; }
DIV.question_indices .next_indice:before{ content: "Donnez-moi un autre indice" ; }
DIV.question_redo>A:first-child.content> SPAN:before{ content: "Effacer votre réponse pour pouvoir répondre à une version différente de cette question" ; }
DIV.question_redo .question_redo SPAN:before{ content: "Effacer votre réponse pour pouvoir répondre à une version différente de cette question" ; }
DIV.question_redo BUTTON P:before { content:'Autre version' }
DIV.question_required>A:first-child.content> SPAN:before{ content: "Souvent vous trouverez ici des informations pouvant vous aider à répondre à la question que l'on vous pose. Si vous êtes bloqué, pensez à relire les informations qui sont affichées ici." ; }
DIV.question_required>A:first-child.content>.box_title:before{ content: "Questions auxquelles vous avez déjà répondues" ; }
DIV.question_required .answer:before{ content: "Votre réponse : " ; }
DIV.question_required .box_content { padding: 0.5em }
DIV.question_required DIV.tabs { height: 1.1em; }
DIV.question_required DIV.tabs DIV.content { display: none }
DIV.question_required DIV.tabs DIV.answer { display: none }
DIV.question_required DIV.tab { display: inline ; }
DIV.question_required #display_tab { height: 9em;
         overflow: auto;
         background: #FFF ;
         padding-top: 0.4em ;
    }
DIV.question_required DIV.name { border: 1px solid #BBB ;
    display: inline ;
    border-top-right-radius: 0.4em ;
    border-top-left-radius: 0.4em ;
    border-bottom: 0px ;
    margin-right: 0.2em ;
    }
DIV.question_required DIV.content { position: relative; }
DIV.question_required DIV.before { position: absolute;top: 0px; left: 50% ; }
DIV.question_required DIV.question { position: absolute; top: 0px; left: 0px ; right: 50% ; }
BUTTON.save_source:before { content:'Sauvegarder ce code dans le fichier source des questions' }
PRE.python_error { background: #F88; font-size:150% }
DIV.question_stat>A:first-child.content> SPAN:before{ content: "Entre parenthèses ce sont les moyennes pour tous les étudiants ayant vu la question" ; }
DIV.question_stat>A:first-child.content>.box_title:before{ content: "Statistiques sur cette question" ; }
DIV.question_stat .given:before{ content: "Vues par " ; }
DIV.question_stat .view:before{ content: "Affichages " ; }
DIV.question_stat .good:before{ content: "Bonnes réponse " ; }
DIV.question_stat .bad:before{ content: "Mauvaises réponse " ; }
DIV.question_stat .indice:before{ content: "Indices demandés " ; }
DIV.question_stat .time:before{ content: "Temps moyen " ; }
DIV.question_stat .comment:before{ content: "Commentaires " ; }
DIV.question_stat > TABLE > TR { vertical-align: top ; }
DIV.question_stat P { margin: 0.1em ; }
DIV.questions>A:first-child.content> SPAN:before{ content: "Vous devez choisir une question parmi les suivantes" ; }
DIV.questions>A:first-child.content>.box_title:before{ content: "Les questions" ; }
DIV.questions A.max_descendants { font-weight: bold; }
DIV.questions A.question_given  {color:#888;}
DIV.questions A.bad_answer_given{color:#F00;}
DIV.questions A.indice_given    {font-style:italic;}
DIV.questions A.current_question{text-decoration:underline;}
DIV.questions A.highlight       { background: black; color: white;text-decoration: blink; }
DIV.questions_all>A:first-child.content> SPAN:before{ content: "Choix de la liste des questions à afficher :\A    * Toutes les questions qui existent.\A    * Celles accessibles normalement avec les prérequis." ; }
DIV.questions_all .all:before{ content: "Toutes" ; }
DIV.questions_all .normal:before{ content: "Normal" ; }
DIV.questions_all A.tips > SPAN { white-space: pre ; }
DIV.questions_comments>A:first-child.content:before{ content: "Les commentaires déposés" ; }
DIV.questions_comments>A:first-child.content> SPAN:before{ content: "L'ensemble des commentaires qui ont été déposés par l'ensemble des étudiants" ; }
DIV.heart_content .questions_comments .c0:before{ content: "La question" ; }
DIV.heart_content .questions_comments .c1:before{ content: "Commentaire" ; }
DIV.heart_content .questions_comments .c2:before{ content: "Étudiant" ; }
DIV.heart_content .questions_comments .c3:before{ content: "Date" ; }
DIV.heart_content .questions_comments .c0>SPAN:before{ content: "La question pour laquelle l'étudiant à déposé un commentaire. Il y a None si aucune question n'était affichée lors du dépôt du commentaire" ; }
DIV.heart_content .questions_comments .c1>SPAN:before{ content: "Le texte du commentaire déposé par l'étudiant" ; }
DIV.heart_content .questions_comments .c2>SPAN:before{ content: "Voir les réponses de l'étudiant" ; }
DIV.heart_content .questions_comments .c3>SPAN:before{ content: "La date de dépôt du commentaire" ; }
DIV.heart_content .questions_comments .CAPTION:before{ content: "Les commentaires déposés par les étudiants" ; }
DIV.questions_next>A:first-child.content:before{ content: "Question suivante" ; }
DIV.questions_next>A:first-child.content> SPAN:before{ content: "Passez à la question suivante dans l'ordre alphabétique" ; }
DIV.questions_nomore>A:first-child.content:before{ content: "Plus de questions !!!" ; }
DIV.questions_nomore>A:first-child.content> SPAN:before{ content: "Vous êtes arrivé au bout du questionnaire, félicitations !" ; }

DIV.questions_svg>A:first-child.content:before{ content: "Vue SVG session" ; }
DIV.questions_svg>A:first-child.content> SPAN:before{ content: "Affiche un fichier SVG représentant graphiquement la façon dont le groupe répond à l'ensemble des questions." ; }

DIV.reload_plugins>A:first-child.content:before{ content: "Recharge plugins" ; }
DIV.reload_plugins>A:first-child.content> SPAN:before{ content: "Recharge les plugins du serveur s'ils ont été modifié\A Cela ne recharge pas les questions" ; }
DIV.reload_plugins A.tips > SPAN { white-space: pre ; }
DIV.reload_questions>A:first-child.content:before{ content: "Recharge la question" ; }
DIV.reload_questions>A:first-child.content> SPAN:before{ content: "Relit le fichier Python contenant la définition de la question" ; }
DIV.role>A:first-child.content:before{ content: "Role " ; }
DIV.role>A:first-child.content> SPAN:before{ content: "Permet de choisir votre role" ; }
DIV.session_activity>A:first-child.content> SPAN:before{ content: "Qui a travaillé pendant les 10 dernières minutes en fonction du role" ; }
DIV.session_deconnection>A{ color: red ; }
DIV.session_deconnection{ font-size: 70% ; }
DIV.session_deconnection>A:first-child.content:before{ content: "Déconnexion" ; }
DIV.session_deconnection>A:first-child.content> SPAN:before{ content: "La déconnexion empêche quiconque d'utiliser votre navigateur pour continuer à répondre au questionnaire" ; }
DIV.session_duration>A{ color: #999 ; }
DIV.session_duration{ font-size: 70% ; }
DIV.session_duration>A:first-child.content:before{ content: "Temps restant : " ; }
DIV.session_duration>A:first-child.content> SPAN:before{ content: "Temps restant jusqu'à la fin de la session" ; }
DIV.session_graph>A:first-child.content:before{ content: "Graphe des questions." ; }
DIV.session_graph>A:first-child.content> SPAN:before{ content: "Affiche le graphe des questions avec les statistique de la session. Cliquez pour voir le fichier SVG" ; }
DIV.session_informations{ font-size: 70% ; }
DIV.session_informations>A:first-child.content> SPAN:before{ content: "Dates de début et fin de session" ; }
DIV.session_once .session_stopped:before{ content: "La session est terminée" ; }
DIV.session_start>A{ color: #999 ; }
DIV.session_start{ font-size: 70% ; }
DIV.session_start>A:first-child.content:before{ content: "Début : " ; }
DIV.session_start>A:first-child.content> SPAN:before{ content: "Date de début de la session" ; }
DIV.session_start .session_not_started:before{ content: "La session n'a pas encore commencée" ; }
DIV.session_stop>A{ color: #999 ; }
DIV.session_stop{ font-size: 70% ; }
DIV.session_stop>A:first-child.content:before{ content: "Fin : " ; }
DIV.session_stop>A:first-child.content> SPAN:before{ content: "Date de fin de la session." ; }
DIV.session_stop .session_stopped:before{ content: "La session est terminée" ; }
DIV.spoiler .spoil:before{ content: "📦" ; }
DIV.spoiler .spoil_less:before{ content: "est trop courte de" ; }
DIV.spoiler .spoil_more:before{ content: "est trop longue de" ; }
DIV.spoiler .spoil_ok:before{ content: "est de la bonne longueur" ; }
DIV.spoiler .spoil_char:before{ content: "caractères" ; }
DIV.spoiler .spoil_diff:before{ content: "comparée à chacune des réponses attendues :" ; }
DIV.spoiler .spoil_miss:before{ content: "Il manque" ; }
DIV.spoiler .spoil_unexpected:before{ content: "En trop" ; }
DIV.spoiler .spoil_diff_ok:before{ content: "contient les bons caractères" ; }
DIV.spoiler { display: inline }
DIV.spoiler .spoil { display: inline ; position: relative; margin-left: 1em }
DIV.spoiler .spoil:hover .spoil_tip { opacity: 1 ; transition: opacity 8s; webkit-transition: opacity 8s;  }
DIV.spoiler .spoil_tip { opacity: 0; pointer-events: none ; position:absolute; bottom:1.5em; left: 0px; padding-right: 1em; transition: opacity 0.5s; webkit-transition: opacity 0.5s;  }
DIV.spoiler .spoil_tip *, .spoil_tip { background: #FFE ; }
DIV.statmenu>A:first-child.content> SPAN:before{ content: "Informations concernant les exercices à faire et votre progression dans le groupe" ; }
DIV.statmenu>A:first-child.content>.box_title:before{ content: "Statistiques" ; }
DIV.statmenu_bad>A{ color: red ; }
DIV.statmenu_bad>A:first-child.content:after{ content: "mauvaises réponses" ; }
DIV.statmenu_bad>A:first-child.content> SPAN:before{ content: "Nombres de mauvaises réponses que vous avez donné, évitez de répondre au hasard si vous avez la possibilité de tester." ; }
DIV.statmenu_good>A{ color: green ; }
DIV.statmenu_good>A:first-child.content:after{ content: "bonnes réponses" ; }
DIV.statmenu_good>A:first-child.content> SPAN:before{ content: "Nombres de bonnes réponses que vous avez donné" ; }
DIV.statmenu_indice>A:first-child.content:after{ content: "indices donnés" ; }
DIV.statmenu_indice>A:first-child.content> SPAN:before{ content: "Nombres d'indices différents que vous avez regardés" ; }
DIV.statmenu_nr_questions>A:first-child.content:after{ content: "questions en tout" ; }
DIV.statmenu_nr_questions>A:first-child.content> SPAN:before{ content: "Nombres de questions que le système contient." ; }
DIV.statmenu_questions>A:first-child.content:before{ content: "Questions" ; }
DIV.statmenu_questions>A:first-child.content> SPAN:before{ content: "Pour chaque question affiche les statistiques concernant l'ensemble des étudiants" ; }
DIV.heart_content .statmenu_questions .c0:before{ content: "La question" ; }
DIV.heart_content .statmenu_questions .c1:before{ content: "Vue" ; }
DIV.heart_content .statmenu_questions .c2:before{ content: "Posées" ; }
DIV.heart_content .statmenu_questions .c3:before{ content: "Répondus" ; }
DIV.heart_content .statmenu_questions .c4:before{ content: "Mauvaise" ; }
DIV.heart_content .statmenu_questions .c5:before{ content: "Indices" ; }
DIV.heart_content .statmenu_questions .c6:before{ content: "Temps" ; }
DIV.heart_content .statmenu_questions .c7:before{ content: "Commentaire" ; }
DIV.heart_content .statmenu_questions .c8:before{ content: "P.Time" ; }
DIV.heart_content .statmenu_questions .c0>SPAN:before{ content: "La question pour laquelle on donne les statistiques" ; }
DIV.heart_content .statmenu_questions .c1>SPAN:before{ content: "0: Personne ne la connaît, 1: tous le monde la connaît" ; }
DIV.heart_content .statmenu_questions .c2>SPAN:before{ content: "Nombre de fois quelle a été posée / Nombre de personne qui la connaisse" ; }
DIV.heart_content .statmenu_questions .c3>SPAN:before{ content: "0: Personne n'a répondu, 1: tous ceux qui la connaisse ont répondu" ; }
DIV.heart_content .statmenu_questions .c4>SPAN:before{ content: "Nombre de mauvaises réponses / Nombre de personnes qui la connaisse" ; }
DIV.heart_content .statmenu_questions .c5>SPAN:before{ content: "Nombre d'indices / Nombre de personnes qui la connaisse" ; }
DIV.heart_content .statmenu_questions .c6>SPAN:before{ content: "Temps total HH:MM:SS passé pour répondre à la question" ; }
DIV.heart_content .statmenu_questions .c7>SPAN:before{ content: "Nombre de commentaires déposés" ; }
DIV.heart_content .statmenu_questions .c8>SPAN:before{ content: "Temps courant pour avoir une réponse parfaite" ; }
DIV.heart_content .statmenu_questions .CAPTION:before{ content: "Pour chaque question affiche les statistiques concernant l'ensemble des étudiants" ; }
DIV.statmenu_rank>A:first-child.content:before{ content: "Classement : " ; }
DIV.statmenu_rank>A:first-child.content> SPAN:before{ content: "Votre classement dans le groupe (ceci n'est pas votre note)" ; }
DIV.statmenu_smiley .statmenugood-2:before{ content: "Vous êtes très en retard, faites vous aider" ; }
DIV.statmenu_smiley .statmenugood-1:before{ content: "Vous êtes en retard" ; }
DIV.statmenu_smiley .statmenugood1:before{ content: "Bien, continuez" ; }
DIV.statmenu_smiley .statmenugood2:before{ content: "Très bien !" ; }
DIV.statmenu_smiley .statmenubad-2:before{ content: "Vous répondez vraiment trop souvent des bétises !" ; }
DIV.statmenu_smiley .statmenubad-1:before{ content: "Testez votre réponse avant de la donner" ; }
DIV.statmenu_smiley .statmenubad1:before{ content: "Bien, vous donnez peu de mauvaises réponses" ; }
DIV.statmenu_smiley .statmenubad2:before{ content: "Vous vous trompez vraiment pas souvent !" ; }
DIV.statmenu_smiley .statmenuindice-2:before{ content: "Vous demandez systématiquement les indices, c'est pas bien" ; }
DIV.statmenu_smiley .statmenuindice-1:before{ content: "Vous regardez trop les indices" ; }
DIV.statmenu_smiley .statmenuindice1:before{ content: "Bien, vous regardez peu les indices" ; }
DIV.statmenu_smiley .statmenuindice2:before{ content: "Vous utilisez très peu les indices !" ; }
DIV.statmenu_smiley .statmenutime-2:before{ content: "Vous passez trop de temps sans question affichée" ; }
DIV.statmenu_smiley .statmenutime-1:before{ content: "Après avoir répondu, passez rapidement à une autre question" ; }
DIV.statmenu_smiley .statmenutime1:before{ content: "Vous devriez lire ce qui est affiché après avoir répondu" ; }
DIV.statmenu_smiley .statmenutime2:before{ content: "Vous ne lisez pas les explications affichées après avoir répondu" ; }
DIV.statmenu_students>A:first-child.content:before{ content: "Étudiants" ; }
DIV.statmenu_students>A:first-child.content> SPAN:before{ content: "Pour chaque étudiant affiche les statistiques concernant l'ensemble de son travail" ; }
DIV.heart_content .statmenu_students .c0:before{ content: "Nom" ; }
DIV.heart_content .statmenu_students .c1:before{ content: "Bon" ; }
DIV.heart_content .statmenu_students .c2:before{ content: "Posé" ; }
DIV.heart_content .statmenu_students .c3:before{ content: "Mau." ; }
DIV.heart_content .statmenu_students .c4:before{ content: "Ind." ; }
DIV.heart_content .statmenu_students .c5:before{ content: "//" ; }
DIV.heart_content .statmenu_students .c6:before{ content: "Cherche" ; }
DIV.heart_content .statmenu_students .c7:before{ content: "Après" ; }
DIV.heart_content .statmenu_students .c8:before{ content: "Première" ; }
DIV.heart_content .statmenu_students .c9:before{ content: "Dernière" ; }
DIV.heart_content .statmenu_students .c10:before{ content: "Sim." ; }
DIV.heart_content .statmenu_students .c11:before{ content: "Var." ; }
DIV.heart_content .statmenu_students .c12:before{ content: "IP" ; }
DIV.heart_content .statmenu_students .c0>SPAN:before{ content: "Pointeur sur les statistiques de l'étudiant" ; }
DIV.heart_content .statmenu_students .c1>SPAN:before{ content: "Nombre de bonnes réponses (vert si en avance et rouge si en retard)" ; }
DIV.heart_content .statmenu_students .c2>SPAN:before{ content: "Nombre de questions connues" ; }
DIV.heart_content .statmenu_students .c3>SPAN:before{ content: "Nombre de mauvaises réponses (vert si peu de mauvaises réponses par rapport au nombre de questions connues. Pour rouge, c'est qu'il y a trop de mauvaises réponses)" ; }
DIV.heart_content .statmenu_students .c4>SPAN:before{ content: "Nombre d'indices vus (vert si peu d'indices demandés par rapport au nombre de questions connues. Pour rouge, c'est qu'il y a trop d'indices demandés)" ; }
DIV.heart_content .statmenu_students .c5>SPAN:before{ content: "Nombre de commentaires laissés" ; }
DIV.heart_content .statmenu_students .c6>SPAN:before{ content: "Temps total passé à chercher les réponses" ; }
DIV.heart_content .statmenu_students .c7>SPAN:before{ content: "Temps total passé avant de passer à la question suivante en cas de bonne réponse (rouge : l'étudiant passe trop de temps sans question affiché sur l'écran. Vert: l'étudiant passe à la question suivante sans même lire ce qui est affiché sur l'écran)" ; }
DIV.heart_content .statmenu_students .c8>SPAN:before{ content: "Première connexion" ; }
DIV.heart_content .statmenu_students .c9>SPAN:before{ content: "Dernière connexion" ; }
DIV.heart_content .statmenu_students .c10>SPAN:before{ content: "Taux de réponses simultanés (sans intérêt)" ; }
DIV.heart_content .statmenu_students .c11>SPAN:before{ content: "Variance du temps de réflexion sur l'ensemble des questions" ; }
DIV.heart_content .statmenu_students .c12>SPAN:before{ content: "Dernière IP utilisée" ; }
DIV.heart_content .statmenu_students .CAPTION:before{ content: "Pour chaque étudiant affiche les statistiques concernant l'ensemble de son travail" ; }
DIV.statmenu_time>A:first-child.content:after{ content: "de travail" ; }
DIV.statmenu_time>A:first-child.content> SPAN:before{ content: "Le temps que vous avez passé à travailler" ; }
DIV.statmenu_time .no_more_time:before{ content: "Temps de réflexion dépassé, vous ne pouvez plus répondre" ; }
DIV.student_work>A:first-child.content:before{ content: "Question répondues" ; }
DIV.student_work>A:first-child.content> SPAN:before{ content: "Statistiques sur les questions auxquelles un étudiant a répondu" ; }
DIV.heart_content .student_work .c0:before{ content: "Date" ; }
DIV.heart_content .student_work .c1:before{ content: "OK" ; }
DIV.heart_content .student_work .c2:before{ content: "#Vus" ; }
DIV.heart_content .student_work .c3:before{ content: "#Mau." ; }
DIV.heart_content .student_work .c4:before{ content: "Indices" ; }
DIV.heart_content .student_work .c5:before{ content: "#Com." ; }
DIV.heart_content .student_work .c6:before{ content: "Temps" ; }
DIV.heart_content .student_work .c7:before{ content: "Question" ; }
DIV.heart_content .student_work .c0>SPAN:before{ content: "Le moment ou la question a été vue la dernière fois" ; }
DIV.heart_content .student_work .c1>SPAN:before{ content: "True si la bonne réponse a été donnée" ; }
DIV.heart_content .student_work .c2>SPAN:before{ content: "Nombre de fois que la question a été vue" ; }
DIV.heart_content .student_work .c3>SPAN:before{ content: "Nombre de mauvaises réponses données" ; }
DIV.heart_content .student_work .c4>SPAN:before{ content: "Nombre d'indices vue / nombre d'indice total" ; }
DIV.heart_content .student_work .c5>SPAN:before{ content: "Nombre de commentaire déposés" ; }
DIV.heart_content .student_work .c6>SPAN:before{ content: "Temps passé avec la question affichée sur l'écran" ; }
DIV.heart_content .student_work .c7>SPAN:before{ content: "Le nom de la question avec un lien vous dirigeant vers la question" ; }
DIV.heart_content .student_work .CAPTION:before{ content: "Pour chaque question, indique comment l'étudiant a répondu" ; }
DIV.title{ font-size: 200% ; }
DIV.title{ text-align: center ; }
DIV.title>A:first-child.content> SPAN:before{ content: "C'est le nom de la question ou le titre de la page si vous n'êtes pas en train de répondre à une question" ; }

DIV.title_time{ text-align: right ; }
DIV.title_time>A:first-child.content> SPAN:before{ content: "Temps de réflexion moyen de l'ensemble du groupe pour cette question" ; }
DIV.top .int_required:before{ content: "La réponse à cette question doit être un nombre entier écrit en décimal." ; }
DIV.top .string_expected:before{ content: "Dans votre réponse, on devrait trouver : " ; }
DIV.top .string_rejected:before{ content: "Dans votre réponse, on ne doit pas trouver : " ; }
DIV.top .answer_with_linefeed:before{ content: "VOTRE REPONSE CONTIENT DES RETOURS A LA LIGNE" ; }
DIV.top .answer_with_nbsp:before{ content: "VOTRE REPONSE CONTIENT UN ESPACE INSÉCABLE" ; }
DIV.top .yes_or_no:before{ content: "La réponse doit être OUI ou NON." ; }
DIV.top .possible_answers:before{ content: "Les réponses autorisées sont : " ; }
DIV.top .heart > DIV P { max-width: 45em ; }
DIV.top .heart > DIV UL { max-width: 45em ; }
DIV.ttl>A:first-child.content> SPAN:before{ content: "Temps restant pour répondre à la question" ; }
DIV.ttl #ttl { font-size: 70%; font-weight: bold }

.box_title { background: #E8E8E8 ;
    border-top-right-radius: 0.4em ;
    border-top-left-radius: 0.4em ;
    }
table.box_content { background: #EEE ; }
    /*
DIV.question_good > A:first-child.content > .box_title:before {
    content: "Bonne réponse. Appuyez sur «Entrée» pour voir une autre question." ;
}
*/

BODY { overflow: scroll ; }

KEY { font-weight: bold ; text-decoration: underline }

TT { white-space: pre ; }

I { font-weight: bold ;
    background: #FFF ;
    font-style: normal ;
    text-decoration: underline ;
}

DIV.tester ~ PRE {
    overflow: auto ;
    max-width: 50% ;
}

PRE, TT, .monospace { font-family: monospace, monospace ; }
.monospace { white-space: pre ; }

.varname { color: #00F;
	   font-family: monospace ;
	   font-size: 130% ;
	   font-weight: bold ;
	 }

.pattern { color: #808 }

.redirect { color: #088; font-weight: bold }

UL { margin-top: 0.3em ; margin-bottom: 0.3em }

P { margin-bottom: 0.3em ; }

A.tips > SPAN, TT.tips > SPAN, DIV.tips > TT {
    border: 2px solid #AAA
}

SHELL { display: inline-block }

#sheexp_editor {
    height: 15em ;
    overflow-y: scroll ;
}
#sheexp_input, #sheexp_output {
}

EM.box_title { font-style: normal }

.box_title, TABLE.box_content { border-color: #CCC }

TABLE.information_table,
TABLE.information_table TR TD,
TABLE.information_table TR TH {
    border-color: #CCC ;
}

PRE {
    background-color: #FF8 ;
    margin-top: 0px ;
    margin-bottom: 0px ;
    border: 0px ;
}

.title_time:after { content: '⌚' }

DIV.question          TT:before,
DIV.question_good     TT:before,
DIV.question_bad      TT:before,
DIV.question_before   TT:before,
DIV.question_required TT:before,
DIV.question_history  TT:before,
DIV.course_question   TT:before,
LABEL                 TT:before
{ content: '« ' }


DIV.question          TT:after,
DIV.question_bad      TT:after,
DIV.question_good     TT:after,
DIV.question_before   TT:after,
DIV.question_required TT:after,
DIV.question_history  TT:after,
DIV.course_question   TT:after,
LABEL                 TT:after
{ content: ' »' }

DIV.question          VAR,
DIV.question_bad      VAR,
DIV.question_good     VAR,
DIV.question_before   VAR,
DIV.question_required VAR,
DIV.question_history  VAR,
DIV.course_question   VAR,
LABEL                 VAR
{ font-style: normal ;
  font-weight: bold ;
  font-family: monospace, monospace;
  background: #FFF ;
  border: 1px solid #888 ;
}

/* Pour la boite 'Pour tester' */

.question_required .tester {
    display: none ;
}

.tester {
    float: right ;
    width: 50% ;
    opacity: 0.3 ;
    margin: 0.2em ;
    margin-top: 0.4em ;
    margin-left: 1em ;
    background: #EEE ;
}

.tester TT {
    white-space: normal ;
}

.tester TEXTAREA {
    margin: 0px ;
    font-size: 100% ;
    width: 100% ;
    display: block ;
}

.tester:hover {
    opacity: 1 ;
}

.copypaste:before { content: "Les commandes à faire pour configurer votre session de façon à pouvoir tester votre réponse. Sélectionnez toutes ces commandes avec le bouton de gauche et collez-les avec le bouton du milieu dans un terminal." }
.tester .copypaste {
    opacity: 0 ;
    pointer-events: none ;
    position: absolute ;
    z-index: 1 ;
    background: #DDD ;
    font-size: 80% ;
    text-align: justify ;
    padding: 0.2em ;
    border: 2px solid #AAA ;
    transition: opacity 1s;
}
.tester:hover .copypaste { opacity: 1 }


#sheexp_editor {
    position: relative ;
    overflow : auto ;
    border: 1px solid #CCC ;
    padding: 0px ;
    width: 100% ;
    min-height: 20em ;
}

#sheexp_input, #sheexp_output {
    padding: 0px ;
    border: 0px ;
    margin: 0px ;
    margin-bottom: 0.5em ;
}

#sheexp_input, #sheexp_output, SHELL > .Line {
    font-family: Courier New;
    font-size: 120% ;
    font-weight: bold ;
}

#sheexp_input, #sheexp_output , #sheexp_help {
    width: 200em ;
}    

#sheexp_output {
    position: absolute ;
    top: 0px ;
    white-space: pre ;
    pointer-events:none;
}

.Parsed {
    display: inline ;
    white-space: pre ;
}

.help {
    margin-bottom: 0.6em ;
    /* border: 1px solid #AAA ; */
    max-width: 25em ;
    border-bottom-left-radius: 1em ;
    border-bottom-right-radius: 1em ;
    padding-left: 0.5em ;
    padding-right: 0.5em ;
    padding-top: 1px ;
    padding-bottom: 2px ;
    font-family: Arial ;
    position: relative ;
}

.help > DIV {
    display: inline ;
}
.help .Parsed {
    line-height: 1em ;
}

.help_RegExpTree UL, .help_RegExpGroup UL { margin: 0px ; }

.link {
    position: absolute ;
    border: 0px ;
    max-width: 200em ;
    padding-left: 0px ;
    padding-right: 0px ;
}

.Redirection, .Fildes, .Direction {
    color: #0FF ;
}

#help {
    margin-top: 1em ;
}

.command_help {
    font-size: 80% ;
}

.command_help_error {
    background: #F00 ;
    color: #FFF ;
}