:root {
    --grey_0:    #000000;
    --grey_10:   #333333;
    --grey_20:   #333333;
    --grey_30:   #333333;
    --grey_40:   #666666;
    --grey_60:   #999999;
    --grey_75:   #bfbfbf;
    --grey_80:   #cccccc;
    --grey_85:   #d9d9d9;
    --grey_90:   #e6e6e6;
    --grey_95:   #f2f2f2;
    --grey_100:  #ffffff;

    --yellow_93: #fff8dc;
    --yellow_95: #ffffcc;

    --cyan_85:   #b3ffff;

    --pink:      pink;

    /*––––– BODY / FORM / … ––––– */
    --col_body_bgd:           var(--yellow_93);

    --col_form_bgd:           var(--grey_90);
    --col_form_border:        var(--grey_60);
    --col_form_txt:           var(--grey_0);

    --col_header_txt:         var(--grey_40);
    --col_header_border:      var(--grey_75);

    /*––––– BUTTON ––––– */

    --col_button_txt:         var(--grey_30);
    --col_button_bgd:         var(--grey_80);

    --col_button_txt_default: var(--grey_100);
    --col_button_bgd_default: var(--grey_60);

    --col_button_txt_focus:   var(--grey_40);
    --col_button_bgd_focus:   var(--grey_100);

    --col_button_txt_hover:   var(--col_button_txt_focus);
    --col_button_bgd_hover:   var(--col_button_bgd_focus);

    --col_button_txt_disable: var(--grey_40);
    --col_button_bgd_disable: var(--grey_60);

    --col_button_border:      var(--grey_40);

    --col-button_admin:        pink;
    --col-button_super:        lightcyan;

    /*––––– INPUT ––––– */

    --col_input_txt:          var(--grey_0);
    --col_input_bgd:          var(--grey_100);

    --col_input_txt_focus:    var(--col_input_txt);
    --col_input_bgd_focus:    var(--yellow_93);

    --col_input_txt_hover:    var(--col_input_txt);
    --col_input_bgd_hover:    var(--col_input_bgd);

    --col_input_txt_disable:  var(--grey_60);
    --col_input_bgd_disable:  var(--grey_100);

    --col_input_txt_submit:   var(--grey_0);
    --col_input_bgd_submit:   var(--grey_75);

    --col_input_txt_submit_hover:    var(--col_input_txt);
    --col_input_bgd_submit_hover:    var(--col_input_bgd);

    --col_input_txt_submit_disable:  var(--col_input_txt_disable);
    --col_input_bgd_submit_disable:  var(--col_input_bgd_disable);

    --col_input_border:              var(--grey_40);

    /*––––– TABLE ––––– */
    --col_table_border:       var(--grey_60);

    --col_table_txt_th:       var(--yellow_95);
    --col_table_bgd_th:       var(--grey_40);

    --col_table_txt_td:       var(--grey_30);
    --col_table_bgd_td:       var(--grey_80);

    --col_table_txt_td_hover: var(--yellow_0);
    --col_table_bgd_td_hover: var(--grey_90);

    /*––––– Sujet & Tag ––––– */

    --col_button_bgd_SujetTag_0:   var(--yellow_95);
    --col_button_bgd_sujet_1:   lightgreen;
    --col_button_bgd_tag_1:     cyan;

    --vol_bgd_photo:               var(--grey_10)

}
 /* –– Global ––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– */
* {
    font-family:     Helvetica, sans-serif;
    font-size:       12px;
}
h3 {
    margin-left:     50px;
    margin-top:      20px;
    font-size:       1.1em;
}
h4 {
    margin-left:     50px;
    padding:         0px 0px 0px 0px;
    font-size:       1.1em;
}
/* –– Texte ––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– */
#txt_page {
    padding-top:     9px;
    color:           grey;
}
#txt_pad_topleft15 {
    padding-top:     20px;
    padding-left:    15px;
    color:           var(--col_table_txt_td);
}
/* –– Buttons & Fields –––––––––––––––––––––––––––––––––––––––––––––––––––––– */
a {
    text-decoration: none;
    text-align:      center;

    color:           var(--col_button_txt);
    background:      var(--col_button_bgd);

    border:          1px solid var(--col_button_border);
    border-radius:   2px;

    margin-top:      5px;
    padding:         5px 10px 5px 10px;
    line-height:     10px;
}
/* #id_btn_SujetTags {
    text-decoration: none;
    text-align:      center;

    color:           var(--col_button_txt);
    background:      var(--col_button_bgd_SujetTag);

    border:          1px solid var(--col_button_border);
    border-radius:   2px;

    margin-top:      5px;
    padding:         5px 10px 5px 10px;
    line-height:     10px;
} */
a:hover {
    color:           var(--col_button_txt_hover);
    background:      var(--col_button_bgd_hover);

    outline:         none;
}
a:focus {
    color:           var(--col_button_txt_disable);
    background:      var(--col_button_bgd_disable);

    outline:         none;
}
a:disabled {
    color:           var(--col_button_txt_focus);
    background:      var(--col_button_bgd_focus);

    outline:         none;
}
#Admin{
    background:     var(--col-button_admin);
}
#Super{
    background:     var(--col-button_super);
}
/* –––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– */
input[type=text], input[type=password], input[type=number], select  {
    color:           var(--col_input_txt);
    background:      var(--col_input_bgd);

    border:          0px solid var(--col_input_border);
    outline:         none;
}
input[type=text]:focus, input[type=password]:focus, input[type=number]:focus, select:focus  {
    color:           var(--col_input_txt_focus);
    background:      var(--col_input_bgd_focus);

    line-height:     14px;
    outline:         none;
    border:          0p solid var(--col_input_border);
}
input[type=text]:disabled, input[type=password]:disabled, input[type=number]:disabled, select:disabled  {
    color:           var(--col_input_txt_disable);
    background:      var(--col_input_bgd_disable);

    outline:         none;
}
.a_button_enabled_sujet  {
    color:           var(--col_button_txt_disable);
    background:      var(--col_button_bgd_sujet_1);
    border:          1px solid var(--col_button_border);
    border-radius:   2px;

    text-decoration: none;
    outline:         none;
}
.a_button_enabled_tag  {
    color:           var(--col_button_txt_disable);
    background:      var(--col_button_bgd_tag_1);
    border:          1px solid var(--col_button_border);
    border-radius:   2px;

    text-decoration: none;
    outline:         none;
}
.a_button_disbaled_sujet  {
    color:           var(--col_button_txt_disable);
    background:      var(--col_button_bgd_SujetTag_0);
    border:          1px solid var(--col_button_border);
    border-radius:   2px;

    text-decoration: none;
    outline:         none;
}
.a_button_disabled_tag  {
    color:           var(--col_button_txt_disable);
    background:      var(--col_button_bgd_SujetTag_0);
    border:          1px solid var(--col_button_border);
    border-radius:   2px;

    text-decoration: none;
    outline:         none;
}
/* –––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– */
input[type=submit] {
    text-decoration: none;
    text-align:      center;
    outline:         none;

    color:           var(--col_input_txt_submit);
    background:      var(--col_input_bgd_submit);

    border:          1px solid var(--col_input_border);
    border-radius:   2px;

    margin-top:      4px;
    padding:         5px 10px 5px 10px;
    line-height:     10px;
    height:          23px;
}
input[type=submit]:hover, input[type=submit]:focus {
    color:           var(--col_input_txt_submit_hover);
    background:      var(--col_input_bgd_submit_hover);
}
input[type=submit].disabled {
    color:           var(--col_input_txt_submit_disable);
    background:      var(--col_input_bgd_submit_disable);
}
#id_input_disabled {
    color:           var(--col_input_txt_submit_disable);
    background:      var(--col_form_bgd);

}
#img_photo{
    object-fit:contain;
}
/* –– Form –––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– */
#id_form_row {
    display:         flex;
    flex-direction:  row;

    color:           var(--col_form_txt);
    background:      var(--col_form_bgd);
    border:          1px solid var(--col_form_border);
}
#id_form_row_start {
    display:         flex;
    flex-direction:  row;
    justify-content: flex-start;

    color:           var(--col_form_txt);
    background:      var(--col_form_bgd);
    margin-left:     50px;
    border:          1px solid var(--col_form_border);
}
#id_form_row_end {
    display:         flex;
    flex-direction:  row;
    justify-content: flex-end;

    color:           var(--col_form_txt);
    background:      var(--col_form_bgd);
    padding:         5px 25px 5px 10px;
}
#id_form_column_end {
    display:         flex;
    flex-direction:  column;
    justify-content: flex-end;

    color:           var(--col_form_txt);
    background:      var(--col_form_bgd);
    margin-left:     50px;
    border:          1px solid var(--col_form_border);
}
#id_form_column {
    color:           var(--col_form_txt);
    background:      var(--col_form_bgd);
    display:         flex;
    flex-direction:  column;
    padding:         10px 10px 10px 10px;
}
#id_form_row_between {
    color:           var(--col_form_txt);
    background:      var(--col_form_bgd);
    display:         flex;
    flex-direction:  row;
    justify-content: space-between;
    padding:         10px 10px 10px 10px;
}
#id_form_row_between_wrap {
    color:           var(--col_form_txt);
    background:      var(--col_form_bgd);
    display:         flex;
    flex-direction:  row;
    flex-wrap:       wrap;
    padding:         10px 10px 10px 10px;
}
#id_form_start {
    color:           var(--col_form_txt);
    background:      var(--col_form_bgd);
    /* border:          1px solid var(--col_form_border); */
    display:         flex;
    justify-content: flex-start;
    padding:         5px 10px 5px 10px;
}
#id_form_start_border {
    color:           var(--col_form_txt);
    background:      var(--vol_bgd_photo);
    border:          1px solid var(--col_form_border);
    display:         flex;
    justify-content: flex-start;
    padding:         30px 30px 30px 30px;
}
#id_form_center {
    color:           var(--col_form_txt);
    background:      var(--col_form_bgd);
    display:         flex;
    justify-content: center;
    padding:         5px 10px 5px 10px;
}
#id_form_end {
    color:           var(--col_form_txt);
    background:      var(--col_form_bgd);
    display:         flex;
    justify-content: flex-end;
    padding:         5px 10px 5px 10px;
}
/* –– Table ––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– */
th, td {
    padding-left:     3px;
}
#id_table {
    margin-top:       4px;
    margin-left:      5px;
    border-collapse:  collapse;
    border:           1px solid var(--col_table_border);
}
#id_table_simple {
    border-collapse:  collapse;
    border-top:       1px solid var(--col_table_border);
    border-bottom:    1px solid var(--col_table_border);
}
#id_table_th {
    color:            var(--col_table_txt_th);
    background:       var(--col_table_bgd_th);
    text-align:       left;
    line-height:      1.5em;
    font-size:        1.1em;
}
#id_table_td {
    color:            var(--col_table_txt_td);
    background:       var(--col_table_bgd_td);
    text-align:       left;
    line-height:      1.5em;
    font-size:        1.0em;
}
#id_table_td_simple {
    color:            var(--col_table_txt_td);
    background:       var(--col_table_bgd_td);
    text-align:       left;
    line-height:      1.5em;
    font-size:        1.0em;
    border-top:       1px solid var(--col_table_border);
    border-bottom:    1px solid var(--col_table_border);
}
#id_table_td:hover {
    color:            var(--col_table_txt_td_hover);
    background:       var(--col_table_bgd_td_hover);
}
#id_table_td: {
    background:       var(--col_table_bgd_td_hover);
}
#id_table_td a {
    padding:          0px 5px 0px 5px;
}
