/* CSS for Display framework */

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

BODY { margin: 0px ;
       background-position: top right ;
       background-image: none ;
       background-repeat: repeat-y;
       margin-left: 0.2em ;
     }

BODY.Printemps,
BODY.Printemps TABLE.colored TD,
BODY.Printemps .BodyRight
{ background-color: #f9fff6 }
BODY.Automne,
BODY.Automne TABLE.colored TD,
BODY.Automne .BodyRight
{ background-color: #fff5e0 }

.Display {
    display: inline-block ;
    vertical-align: top ;
}

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

.Top, .User, .Body, .Grades, .Private, .Preamble, .Message, .Messages, .UEHeader {
    width: 100% ; }
.TopLine { font-size: 200% ; }
.Picture IMG.small { height: 1.5em ;}
.User * { vertical-align: middle }
.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 ;
}
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: 0px }
.RSS IFRAME { position: absolute; left: -100px ; }
.displayRSS IMG { height: 1em }
.BodyLeft {
    width: 100% ;
}
.RightClip {
    width: 21em ;
    overflow: hidden ;
    right: 0px ;
    position: absolute ;
}
.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 {
    padding: 0.2em;
    background-color: #FF8080;
    text-align: center ;
}
.Message {
    padding: 0.2em;
    background-color: #80FF80;
    text-align: center ;
}
.Messages {
    padding: 0.2em;
    color: white ;
    background-color: #FF0000;
}
.Grades H3 { margin-bottom: 0px; }
.UE { display: block; margin-top: 1em ; }
.UETitle { font-weight: bold ; }
.MoreOnSuivi { background: white }
.Cell {
    overflow: auto ;
}
.CellTop, .CellBottom {
    font-size: 60% ;
}
SPAN.displaygrey { color: #888 }
.CellBox INPUT {
    width: 20em;
    opacity: 1 ; /* Do not work */
    font-size: 60% ;
    margin: 0px ;
}
.CellBox SELECT {
    font-size: 70% ;
}
.CellBox {
    max-width: 22em ;
    border: 1px solid black ;
    overflow: hidden ;
    margin-top: 0.2em ;
    margin-bottom: 0.2em ;
    margin-right: 0.4em ;
    margin-left: 0px ;
    white-space: nowrap ;
}

.CellTitle { font-size: 60% ; }

.Grades { margin-left: 0.4em ; }

.DisplayTypeMoy { font-style: italic }

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

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

/*
.CellTypeLine         .CellFormula { display: none }
.CellTypeLine:hover   .CellFormula { display: inline }
*/

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

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


BODY.big_text_1 { font-size: 200% }

.selection_0:hover { background: #EEE }
.selection_1:hover { background: #FFD }
.selection_0 { list-style-type: circle }
.selection_1 { list-style-type: disc ; background: #FF8 }

.show_empty_0 .is_empty { display: none }

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

.highlight_grade_1 .CellBox {
    opacity: 0.511 ;
    -webkit-animation-duration: 0.5s;
    -webkit-animation-name: fadeout2;
    animation-duration: 0.5s;
    animation-name: fadeout2;
}

.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-animation-name: none ;
    animation-name: none ;
}

.highlight_grade_1 .UEMasters {
    opacity: 0.511 ;
    -webkit-animation-duration: 0.5s;
    -webkit-animation-name: fadeout2;
    animation-duration: 0.5s;
    animation-name: fadeout2;
}

.highlight_grade_1 .displayUE:hover .CellBox,
.highlight_grade_1 .tip_displayed .CellBox {
    opacity:1 ;
    -webkit-animation-duration: 0.5s;
    -webkit-animation-name: fadein2;
    animation-duration: 0.5s;
    animation-name: fadein2;
}

.highlight_grade_1 .tip_displayed .UEMasters,
.highlight_grade_1 .UE:hover .UEMasters {
    opacity: 1 ;
    -webkit-animation-duration: 0.5s;
    -webkit-animation-name: fadein2;
    animation-duration: 0.5s;
    animation-name: fadein2;
}

@-webkit-keyframes fadeout2 {
  from { opacity: 1 ; }
  to { opacity: 0.511; }
}
@-webkit-keyframes fadein2 {
  from { opacity: 0.511 ; }
  to { opacity: 1; }
}
@keyframes fadeout2 {
  from { opacity: 1 ; }
  to { opacity: 0.511; }
}
@keyframes fadein2 {
  from { opacity: 0.511 ; }
  to { opacity: 1; }
}

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

/*********************** Not working inline_block (IE) *******************/

BODY.bad_inline_block .Display {
    display: inline ;
}
BODY.bad_inline_block .Logout { text-decoration: underline }

BODY.bad_inline_block #cellbox_tip.hidden { display: none }

BODY.bad_inline_block .BodyLeft { width: 75% }

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

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

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

BODY.hide_right_column_1 .hide_rightclip {
    opacity: 0.3 ;
    width: 5em ;
    -webkit-animation-duration: 0.5s;
    -webkit-animation-name: make_small_bodyright;
    animation-duration: 0.5s;
    animation-name: make_small_bodyright;
}
BODY.hide_right_column_1 .show_rightclip {
    z-index: 2 ; /* Hide cellbox tip */
    opacity: 1 ;
    width: 21em ;
    -webkit-animation-duration: 0.5s;
    -webkit-animation-name: make_large_bodyright;
    animation-duration: 0.5s;
    animation-name: make_large_bodyright;
}
@-webkit-keyframes make_large_bodyright {
  from { width: 5em ; opacity: 0.3 }
  to   { width: 21em; opacity: 1 }
}
@-webkit-keyframes make_small_bodyright {
  from { width: 21em; opacity: 1   }
  to   { width: 5em ; opacity: 0.3 }
}

@keyframes make_large_bodyright {
  from { width: 5em ; opacity: 0.3 }
  to   { width: 21em; opacity: 1 }
}
@keyframes make_small_bodyright {
  from { width: 21em; opacity: 1   }
  to   { width: 5em ; opacity: 0.3 }
}

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

.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 ; }


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

DIV#tip { margin-top: 1em }
DIV.tipped DIV.text:hover { background: url(tip.png) }

#cellbox_tip {
    position: absolute ;
    z-index: 1 ;
    background: #EEF ;
    opacity: 0.9 ;
    -webkit-animation-duration: 0.5s;
    -webkit-animation-name: fadein;
    animation-duration: 0.5s;
    animation-name: fadein;
}
#cellbox_tip.hidden {
    font-size: 0% ; /* left, z-index, display are not usable :-( */
    opacity: 0; /* Hide the remaining border pixels */
    /* fadeout raise bug in Chrome : the font size is not 100% */
    animation-duration: 0.2s;
    animation-name: fadeout;
}
@-webkit-keyframes fadein {
  from { opacity: 0 ; }
  to { opacity: 0.9; }
}
@keyframes fadeout {
  from { opacity: 0.9 ; font-size:100% }
  to { opacity: 0; font-size:100% ; }
}
@keyframes fadein {
  from { opacity: 0 ; }
  to { opacity: 0.9; }
}
#cellbox_tip .CellBox {
    margin-top: 0px ;
    margin-bottom: 0px ;
    width: auto ;
    overflow: visible ;
    white-space: normal ;
    max-width: 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; }
}

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

.prst     { background-color: #8F8 ;               }
.abinj    { background-color: #F88 ;               }
.tnr      { background-color: #FAA ;               }
.abinj2   { background-color: #F88 ;               }
.abjus    { background-color: #88F ;               }
.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 ;
 }

.noninscrit {
  background-color: #FFC0C0 ;
}

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

IFRAME.feedback { width: 0.5em ; height: 0.5em ; }


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 ; }

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

@media print {

.noprint { display: none ; }

BODY, BODY.Printemps, BODY.Automne {
    background-color: white ;
    background: white ;
    background-image: none ;
}
BODY.hide_right_column_1.Printemps { background-image: none ; }
BODY.hide_right_column_1.Automne { background-image: none ; }

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

.CellBox {
    width: auto;
    }

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

#cellbox_tip * { display: none }
}