SECTION { margin-left: 1em ; margin-top: 1em ; padding: 0.2em }
SECTION SECTION:hover { border: 1px solid #888 ; }
SECTION SECTION { border: 1px solid transparent ; }
.Textual P, .Textual H1, .Textual H2, .Textual H3, .Textual H4 {
    white-space: nowrap
}
.Textual H1, .Textual H2, .Textual H3, .Textual H4 {
    margin-bottom: 0.1em ; margin-top: 0.1em ;
}
.Textual { width: 100% }

.Textual .DisplayT_LinksTable IMG.small { display: none }

.CellBox[onmouseenter] * { pointer-events: none }

/*********************** Normal CSS ***********************/

BODY {
       background-position: top right ;
       background-image: none ;
       background-repeat: repeat-y;
       margin-bottom: 10em;
}

.CellBox > .Display, .DisplayUE > .Display {
    display: block ;
}

.Top, .User, .Body, .Grades, .Private, .Preamble, .Message, .Messages, .UEHeader {
    width: 100% ; }
.TopLine { font-size: 200% ; }
DIV.tipped DIV.text IMG.small { height: 1.5em ;}
.User * { vertical-align: middle }
.YearSemester { text-align: center }
.IdentityR { float: right ; }
.Logout { text-align: right }
.Explanation, .Preferences {
    font-size: 200% ;
    font-weight: bold ;
    text-align: center ;
    margin-left: 0.4em ;
}
.explanations_popup A {
    float: right ;
    font-size: 60% ;
    margin-right: 4em ;
    font-weight: normal ;
}

BODY DIV.preferences_popup, BODY DIV.explanations_popup {
    right: 0 ;
    top: 2.3em ;
    left: auto ;
    width: 20em ;
    opacity: 0.9 ;
    max-width: 95% ;
}
DIV.preferences_popup IMG { width: 1em }


BODY DIV.explanations_popup {
    width: 40em ;
    text-align: justify ;
}

.preferences_popup LI { margin-top: 0.2em }

.Logo IMG { height: 2.4em ; border: 1px solid white }
.Logo IMG:hover { border: 1px solid black }
DIV.logo_popup { top: 2.2em ; left: 0px ; right: auto }

.RSS IFRAME { position: absolute; left: -100px ; }
.displayRSS IMG { height: 1em }
.BodyLeft {
    width: 100% ;
}
.RightClip {
    width: 21em ;
    overflow: hidden ;
    right: 0px ;
    position: absolute ;
    z-index: 1 ;
}
.BodyRight { width: 21em ; }
.BodyRight TABLE, .BodyRight .Display { width: 100% ; }
.BodyRight TABLE { margin-top: 1em }
.BodyRight .Semesters TABLE { margin-top: 0em }
.GetStudent IMG { height: 1em ; }
.Semesters IMG { height: 1.3em ;}
.Preamble {
    background-color: #000;
    text-align: center ;
    color: #FFF
}
.Message {
    padding: 0.2em;
    background-color: #80FF80;
    text-align: center ;
}
.Messages {
    padding: 0.2em;
    color: white ;
    background-color: #FF0000;
}
.GrpMessages > DIV {
    border: 1px solid #CCC ;
    margin: 1em ;
    padding: 0.1em ;
    background: #FFF ;
}
.DisplayNames { white-space: nowrap ; }
.Grades H3 { margin-bottom: 0px; }
.UE { display: block; margin-top: 1em ; }
.UEHeader > .Display { display: inline ; }
.UETitle { font-weight: bold ; }
.UEComment { overflow-wrap: anywhere; }
.MoreOnSuivi { background: white }
.Cell {
    overflow: auto ;
}
.CellTop, .CellBottom {
    font-size: 60% ;
}
SPAN.displaygrey { color: #555 }
.CellBox INPUT {
    width: 20em;
    opacity: 1 ; /* Do not work */
}
.CellBox INPUT[type=checkbox],
.CellBox INPUT[type=radio],
TABLE INPUT[type=checkbox],
TABLE INPUT[type=radio]
 { width: 1em; }

.CellBox INPUT, .CellBox SELECT, .CellBox TEXTAREA {
    margin-top: -3px;
    margin-bottom: -4px;
    margin-left: -4px;
    margin-right: -4px;
    font-size: 100%;
}
.CellBox .CellValue SELECT {
    margin-top: 0px;
}

.CellBox {
    max-width: 8em ;
    border: 1px solid black ;
    overflow: hidden ;
    margin-top: 0.2em ;
    margin-bottom: 0.2em ;
    margin-right: 0.4em ;
    margin-left: 0px ;
    white-space: nowrap ;
    max-height: 3.5em ;
}
.CellBox .CellValue {
    padding: 2px ;
}
.CellBox {
    padding: 3px ;
}
.CellBox TEXTAREA {
    resize: both;
    font-family: sans-serif;
}

.CellTitle { font-size: 60% ; }

.DisplayTypeMoy { font-style: italic }

.CellAuthorLine       .CellMTime { display: none }
.CellAuthorLine:hover .CellMTime { display: inline }

.CellStatLine         .CellAvg { display: none }
.CellStatLine:hover   .CellAvg { display: inline }

.CellFormula UL { margin: 0px }
/*
.CellTypeLine         .CellFormula { display: none }
.CellTypeLine:hover   .CellFormula { display: inline }
*/

.CellDate SPAN { display: none }
.CellDate:hover SPAN { display: inline }

.LastGrades .Display .the_grade { font-size: 160% }
.LastGrades .a_grade {
    font-size: 60% ;
    border: 1px solid black ;
    margin: 0.2em ;
}
.LastGrades { width: 100% }
.LastGrades .day { width: 6em }

.UEGrades .tree_node { }
.UEGrades .tree_leaves, .UEGrades .tree_leaves_final {
    display: inline-block ;
}
.UEGrades .tree_node > SPAN { font-weight: lighter }
.UEGrades .tree_leaves_final {
    padding-left: 0.5em ;
}
.UEGrades .tree_leaves {
    border-left: 1px solid black ;
    border-radius: 0.5em ;
    padding-left: 0.5em ;
}
.UEGrades .tree_node * { vertical-align: middle ; }

.highlight_grade_0 .CellBox.tree_done,
.highlight_grade_1 .CellBox.tree_done
  { opacity: 0.1 }
  .highlight_grade_0 .DisplayUE:hover .CellBox.tree_done,
  .highlight_grade_0 .tip_displayed .CellBox.tree_done,
  .highlight_grade_1 .DisplayUE:hover .CellBox.tree_done,
  .highlight_grade_1 .tip_displayed .CellBox.tree_done
  { opacity: 0.4 }

.highlight_ue_before {
    background: #0FF;
    border: 4px solid white;
}
.highlight_ue {
    background: #FFF;
    border-radius: 0.5em;
    padding: 4px;
    border: 4px solid black;
    transition: border 2s 2s, background 2s ;
}

.themeBW .CellBox.tree_done
{ opacity: 1 }

BODY.big_text_1 { font-size: 150% }

.preferences_popup LI { list-style: none; margin-left: -0.7em ; }
.preferences_popup LI:before {
    position: absolute ;
    left: 4px ;
    font-size: 120% ;
}
.selection_0:hover { background: #EEE }
.selection_1:hover { background: #FFD }
.selection_0:before { content: '☐'; }
.selection_1:before { content: '☑'; }
.selection_1 { background: #FF8 }

.show_empty_0 .is_empty { display: none }

.nonInscrit {
  background-color: #FFC0C0 ;
}

.hidden_to_student { background: #FFA500 ; color: black }
.modifiable_by_student { background: #FFCCCC ; color: black }
.public_display { background: #88FF88 ; color: black }


.GT1S0, .GT1S1, .GT1S2, .GT2S0, .GT2S1, .GT2S2, .GT3S0, .GT3S1, .GT3S2, .DisplayTypeUe_Grade {
    border-left-width: 0.7em;
    border-top-left-radius: 0.3em;
    border-bottom-left-radius: 0.3em;
}

.DisplayTypeUe_Grade {
    border-right-width: 0.7em;
    border-top-right-radius: 0.3em;
    border-bottom-right-radius: 0.3em;
}

.GT1S0:before, .GT1S1:before, .GT1S2:before, .GT2S0:before, .GT2S1:before,
.GT2S2:before, .GT3S0:before, .GT3S1:before, .GT3S2:before {
    position: absolute;
    transform-origin: bottom left;
    transform: translate(-0.1em,0.7em) scale(0.6) rotate(-90deg);
    color: #FF0;
    font-weight: bold;
}
.GT1S0:before { content: 'CP' }
.GT1S1:before { content: 'CP s2' }
.GT1S2:before { content: 'CP s3' }
.GT2S0:before { content: 'CC' }
.GT2S1:before { content: 'CC s2' }
.GT2S2:before { content: 'CC s3' }
.GT3S0:before { content: 'CT' }
.GT3S1:before { content: 'CT s2' }
.GT3S2:before { content: 'CT s3' }

.Ue_Grade_incomplete {
    border-color: #00F ;
}

.limited_time {
    font-size: 300%;
    display: inline-block;
    line-height: 0.1em;
}

/********** not grade Cells are transparent for teachers  *************/

.highlight_grade_1 .CellBox {
    opacity: 0.511 ;
    -webkit-transition: opacity 0.5s ;
    transition: opacity 0.5s;
}

.highlight_grade_1 .DisplayUE:hover .DisplayTypeNote,
.highlight_grade_1 .tip_displayed .DisplayTypeNote,
.highlight_grade_1 .DisplayTypeNote,
.highlight_grade_1 #cellbox_tip .CellBox {
    opacity:1 ;
    -webkit-transition: opacity 0.5s ;
    transition: opacity 0.5s;
}

.highlight_grade_1 .UEMasters {
    opacity: 0.511 ;
    -webkit-transition: opacity 0.5s ;
    transition: opacity 0.5s;
}

.highlight_grade_1 .DisplayUE:hover .CellBox,
.highlight_grade_1 .tip_displayed .CellBox {
    opacity:1 ;
    -webkit-transition: opacity 0.5s ;
    transition: opacity 0.5s;
}

.highlight_grade_1 .tip_displayed .UEMasters,
.highlight_grade_1 .UE:hover .UEMasters {
    opacity: 1 ;
}

@media print {
.highlight_grade_1 .CellBox { opacity: 1; }
.highlight_grade_1 .UEMasters {opacity: 1; }
}

/*********************** Small screen *******************/

BODY.hide_right_column_1.hide_picture_0.themeP { background-image: url(printemps.png) ; }
BODY.hide_right_column_1.hide_picture_0.themeA { background-image: url(automne.png) ; }

BODY.hide_right_column_1.big_box_0 .CellBox {
    min-width: 3.8em;
    width: 3.8em;
    }

BODY.big_box_1 .CellBox {
    max-width: 22em;
    }

BODY.uniform_width_1 .CellBox {
    width: 5em;
    }

BODY.hide_right_column_1 .hide_rightclip {
    opacity: 0.3 ;
    width: 5em ;
    -webkit-transition: opacity 0.5s, width 1s ;
    transition: opacity 0.5s, width 1s;
}
BODY.hide_right_column_1 .show_rightclip {
    z-index: 2 ; /* Hide cellbox tip */
    opacity: 1 ;
    width: 21.6em ;
    max-width: 100% ;
    -webkit-transition: opacity 0.5s, width 1s ;
    transition: opacity 0.5s, width 1s;
}
BODY.hide_right_column_1 .BodyRight {
    border: 2px solid black ;
    padding: 0.3em ;
}
BODY.hide_right_column_1 .TopLine {
    font-size: 150% ;
}

BODY.hide_grade_1 .DisplayTypeNote .DisplayCellValue,
BODY.hide_grade_1 .DisplayTypeMCQ .DisplayCellValue,
BODY.hide_grade_1 .DisplayTypeMoy .DisplayCellValue,
BODY.hide_grade_1 .DisplayTypeUe_Grade .DisplayCellValue,
BODY.hide_grade_1 .DisplayTypeAnalyser .DisplayCellValue,
BODY.hide_grade_1 .DisplayTypeNotation .DisplayCellValue
{
    color: #EEE;
    background: #EEE;
}
BODY.hide_grade_1 .DisplayTypeNote .DisplayCellValue:hover,
BODY.hide_grade_1 .DisplayTypeMCQ .DisplayCellValue:hover,
BODY.hide_grade_1 .DisplayTypeMoy .DisplayCellValue:hover,
BODY.hide_grade_1 .DisplayTypeUe_Grade .DisplayCellValue:hover,
BODY.hide_grade_1 .DisplayTypeAnalyser .DisplayCellValue:hover,
BODY.hide_grade_1 .DisplayTypeNotation .DisplayCellValue:hover
{
    color: initial;
    background: initial;
}

/*********************** Long text *******************/

.CellBox .long_text TEXTAREA { font-size: 204%; }
#cellbox_tip .CellBox .long_text TEXTAREA { font-size: 100%; }
.long_text { font-size: 49% ; white-space: normal ; min-height: 2.6em ;}
#cellbox_tip .long_text { font-size: 100% ; height: auto; min-height: initial; }
BODY.hide_right_column_1 .long_text { height: 2.6em ; }
.DisplayTypeUpload A { white-space: nowrap ; }

.DisplayTypeAnnotate .long_text { font-size: 100%; min-height: 0px }
BODY.hide_right_column_1 .DisplayTypeAnnotate .long_text { height: auto ; }


/*********************** Tip management *******************/

#cellbox_tip {
    position: absolute ;
    z-index: 1 ;
    background: #EEF ;
    opacity: 0.9 ;
    -webkit-transition: opacity 1s, visibility 1s ;
    transition: opacity 1s, visibility 1s ;
    visibility: visible;
}
#cellbox_tip.hidden {
    opacity: 0;
    visibility: hidden;
}

#cellbox_tip .CellBox {
    margin-top: 0px ;
    margin-bottom: 0px ;
    width: auto ;
    overflow: visible ;
    white-space: normal ;
    max-width: initial ;
    max-height: initial ;
}


DIV#tip.tip_fade_in {
    -webkit-animation-duration: 1s;
    -webkit-animation-name: full_fade_in;
    animation-duration: 1s;
    animation-name: full_fade_in;
}

@-webkit-keyframes full_fade_in {
  from { opacity: 0 ; }
  to { opacity: 1; }
}
@keyframes full_fade_in {
  from { opacity: 0 ; }
  to { opacity: 1; }
}

.yellow {
    background: #FF0 ;
    -webkit-transition: background 0.5s ;
    transition: background 0.5s ;
}

.not_yellow {
    -webkit-transition: background 3s ;
    transition: background 3s ;
}


#popup DIV.check_suivi_url {
    position: fixed ;
    left: 10% ;
    width: 80% ;
    top: 10% ;
    height: 80% ;
    border: 2px solid black ;
}
#popup DIV.check_suivi_url IFRAME { width: 100% ; height: 100% }

/************************ Old CSS *****************************/

.prst     { background-color: #8F8 ;               }
.abinj    { background-color: #F88 ;               }
.tnr      { background-color: #FAA ;               }
.abjus    { background-color: #CCF ;               }
.novalue  { background-color: #DDD ;               }
.verygood { background-color: #0F0 ;               }
.good     { background-color: #BFB ;               }
.mean     { background-color: #FFF ;               }
.bad      { background-color: #FAA ;               }
.verybad  { background-color: #F44 ; color: white; }

IFRAME {
width: 1em ;
height: 1em ;
border: 0px ;
 }

.blocnote {
  background-color: white ;
  border: 1px solid black ;
  clear: both; 
}

DIV.feedback { height: 1.1em ; }


TABLE.memberof { background-color: black; border-spacing: 1px }
TABLE.memberof TH, TABLE.memberof TD { padding: 0px }
TABLE.memberof TH { text-align: left; }
TABLE.memberof TD { background-color: #DDD; }

.DA TD, TABLE.display_abjs TD, .TT TD {
    font-size: 70% ; padding: 0px ;
}
.LinksTable TD { font-size: 80% ; padding: 0px ; }

.boxed_boxes {
    display: inline-block ;
    margin: 0.2em ;
    margin-top: 0.8em;
    padding-top: 0.3em ;
    padding-left: 0.4em ;
    border: 1px solid #000 ;
    vertical-align: top ;
    min-height: 1.5em;
}

.boxed_boxes_title {
    border-radius: 0.5em ;
    font-size: 80% ;
    background: #FFF ;
    display: block ;
    border: 1px solid #000;
    padding-left: 3px ;
    padding-right: 3px ;
    margin-right: 0.5em;
    width: min-content;
    margin-top: -1.2em;
}

.boxed_boxes > .Display {
    vertical-align: bottom ;
}

/*****************************************************************************/
/* PRINT */
/*****************************************************************************/

@media print {

BODY.hide_right_column_1.themeP { background-image: none ; }
BODY.hide_right_column_1.themeA { background-image: none ; }

.BodyRight, .RightClip, .GetStudent { display: none ; }

.CellBox {
    width: auto;
    }

.BodyLeft, .Body, .Top, .Grades { display: inline }
}