/*
    VERT UNAMUR = #55ab26
    VERT FONCE  = #39721a
    GRIS CLAIR  = #e6e6e6
    GRIS UNAMUR = #494949
    GRIS FONCE  = #393939

*/

/* ==== Globaux/Standards ==== */

html         { background-color: #e6e6e6; font-family: sans-serif; }
body         { width: 80vw; min-width: 1280px; height: 96vh; min-height: 640px; text-align: center; margin: 1vh auto 1vh auto; }
button:hover { cursor: pointer; }



/* ==== Menu Top ==== */

#title
{
    height: 64px;
    background-color: #55ab26; border-top: solid 4px #5dbc29; border-bottom: solid 4px #458721;
    text-shadow: 1px 0 0 #458721, -2px 0 0 #458721, 0 2px 0 #458721, 0 -2px 0 #458721, 2px 2px #458721, -2px -2px 0 #458721;
    font-family: sans-serif; font-size: 1.25em; font-weight: bold; color: white; padding: 8px 8px 4px 8px; height: 1.6em;
}
    #title_pt0, #title_pt2 { display: inline-block; width: 408px; }
    #title_pt0             { text-align: left; }
    #title_pt1             { display: inline-block; width: calc(99% - 816px); }

#barre_login         { text-align: right; height: 1.25em; }
.deploie_login       { width: 1.2em; height: 1.25em; background-image: url(../img/clef.png); background-size: contain; background-repeat: no-repeat;
                       display: inline-block; cursor: pointer; vertical-align: middle; padding: 2px; margin-left: 10px; }
.deploie_login:hover { width: calc(1.2em - 10px); height: calc(1.25em - 10px); background-image: url(../img/clef.png); background-size: contain; background-repeat: no-repeat;
                       display: inline-block; cursor: pointer; vertical-align: middle; padding: 6px; margin-left: 10px; border-radius: 6px; border: solid 1px rgba(255, 255, 255, 0.33); }
    #login_extend   { display: inline-block; }
    #outil_co       { display: inline-block; width: 100%; margin-right: 8px; background-color: #3e7c1c; vertical-align: middle; line-height: 1.1em; box-shadow: -1px -1px rgba(0, 0, 0, 0.45); }
    #outil_co td    { margin: 0 16px 0 16px; font-family: sans-serif; font-size: 13px; font-weight: 100; }
    #loginDiv1, #login_extend   { display: inline-block; }
    #loginDiv2   { display: inline-block; width: 304px; }
    .lien_blanc        { font-family: sans-serif; font-size: 13px; font-weight: 100; color: white; cursor: pointer; }
    .lien_blanc:hover  { font-family: sans-serif; font-size: 13px; font-weight: 100; color: #e6edca; cursor: pointer; }

#barre_user         { text-align: right; height: 1.25em; font-family: sans-serif; font-weight: 200; font-size: 0.9rem; text-shadow: none; }
    #btn_exit       { width: 40px; height: 25px; background-image: url(../img/exit.jpg); background-size: contain; background-repeat: no-repeat;
                      display: inline-block; cursor: pointer; vertical-align: middle; margin-left: 10px; border: solid 2px white; }
    #btn_exit:hover { width: 40px; height: 25px; background-image: url(../img/exit.jpg); background-size: contain; background-repeat: no-repeat; opacity: 0.85;
                      display: inline-block; cursor: pointer; vertical-align: middle; margin-left: 10px; border: solid 2px rgba(255, 255, 255, 0.74); }
    .pseudo         { font-size: 1rem; font-weight: 500; color: #39721a; text-shadow: 1px 0 0 #fff, -2px 0 0 #fff, 0 2px 0 #fff, 0 -2px 0 #fff, 2px 2px #fff, -2px -2px 0 #fff; margin-right: 8px; }
    .pseudo:hover   { font-size: 1rem; font-weight: 500; color: #fff; text-shadow: 1px 0 0 #39721a, -2px 0 0 #39721a, 0 2px 0 #39721a, 0 -2px 0 #39721a, 2px 2px #39721a, -2px -2px 0 #39721a ; margin-right: 8px; }


/* ==== Contenu Central ==== */

#structure  { width: 100%; min-height: 576px; height: 95%; display: block; }


#contener1      { width: 304px; height: calc(100% - 116px); display: inline-block; margin: 8px auto 8px auto; vertical-align: top; float: left; }
        .cadre_info { width: calc(100% - 32px); height: 144px; margin-bottom: 1em; padding: 1em 16px 1em 16px; text-align: justify; font-family: sans-serif; font-size: 0.9em; text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.2); }
        #serveur    { width: 80px; height: 82px; background-image: url(../img/serveur1.png); background-size: contain; background-repeat: no-repeat; margin: 8px auto 8px auto; }
        #triangle   { width: 20px; height: 24px; background-image: url(../img/triangle.png); background-size: contain; background-repeat: no-repeat; margin: 2vh auto 0 auto; }
        #bulle      { width: 100%; height: calc(97.25% - (144px + 82px + 24px)); margin: 0 auto 0 auto; background-color: white; border-radius: 14px; box-shadow: 6px 6px rgba(0, 0, 0, 0.2); }
        #log_titre  { width: 88%; font-family: sans-serif; font-size: 1.05em; font-weight: bold; padding: 4px; border-bottom: solid 1px #55ab26; margin: 0 auto 8px auto; }
     .flash_contain { overflow-y: auto;  min-height: 88px; height: calc(92.5vh - (8.9em + 2vh + 90px + 15em)); }
        .flash_text { text-align: justify; font-family: sans-serif; font-size: 0.8em; padding: 16px; }
        .date_log   { display: inline-block; width: 128px; text-align: center; }


#contener2  { width: calc(100% - 370px); height: calc(100% - 116px); display: inline-block; background-color: #ffffff; margin: 8px 6px 8px auto; padding: 16px; vertical-align: top;
              float: right; border: double 4px #e6e6e6; min-height: 384px; box-shadow: 6px 6px rgba(0, 0, 0, 0.2); overflow: auto; }

#entete_view { width: 98%; height: 44px; padding: 4px; margin: -16px auto 16px auto; }
    #entete_view_case1 { width: 28%; }
    #entete_view_case2 { width: 43%; }
    #entete_view_case3 { width: 28%; }

    .enveloppe_grise { background-image:linear-gradient(135deg, #393939, #494949); border-radius: 12px; margin: 24px auto 24px auto; padding: 16px; }
        .enveloppe_grise form { width: 80%; margin: 0 auto 0 auto; }
        .enveloppe_grise input, .enveloppe_grise textarea { width: 96%; }
        .env_grise_1 { width: 50%; }
        .env_grise_2 { width: 96%; }
    .enveloppe_claire { display: block; border: double 4px #e6e6e6; border-radius: 12px; margin: 24px auto 24px auto; padding: 16px; box-shadow: 6px 6px rgba(0, 0, 0, 0.2); height: auto; }
        .env_claire_1 { width: 50%; }
        .env_claire_2 { width: 96%; }
    .enveloppe_docs   { display: block; border: double 4px #e6e6e6; border-radius: 12px; margin: -4px auto 24px auto; padding: 8px 16px 24px 16px; box-shadow: 6px 6px rgba(0, 0, 0, 0.2); height: auto; }

    #UserTab { width: 98%; font-family: sans-serif; font-size: 0.9em; text-align: left; line-height: 1.8em; border-collapse: collapse; }
    #UserTab th { border-bottom: double 4px #e6e6e6; margin: 0 auto 8px auto; }
    #UserTab tr { border-bottom: dotted 1px #e6e6e6; margin: 0 auto 8px auto; }
    .UserTab_action_td { border-left: dotted 1px #e6e6e6; }
    #UserHeader tr { font-family: sans-serif; font-size: 0.9em; }
    #UserHeader tr a { text-decoration: underline; color: #39721a; }
    #UserHeader tr a:hover { text-decoration: underline; color: #55ab26; }
    .dl_thd { width: 128px; text-align: center; }
    #action_tab { float: right; }

#catalogue { width: 100%; }
#entete_posts { height: calc(1.5em + 12px); border-bottom: solid 1px #55ab26; margin: 0 auto 12px auto; }
.acces_conten  { cursor: default; font-family: sans-serif; font-size: 11.5px; }
    .acces0 { display: inline-block; width: 15px; height: 15px; vertical-align: sub; background-image: url(../img/acces0.png); background-size: contain; background-repeat: no-repeat; }
    .acces1 { display: inline-block; width: 15px; height: 15px; vertical-align: sub; background-image: url(../img/acces1.png); background-size: contain; background-repeat: no-repeat; }
    .acces2 { display: inline-block; width: 15px; height: 15px; vertical-align: sub; background-image: url(../img/acces2.png); background-size: contain; background-repeat: no-repeat; }
.enveloppe_posts { display: block; width: 96%; border: double 4px #e6e6e6; border-radius: 12px; margin: -4px auto 14px auto; padding: 2px; box-shadow: 2px 2px rgba(0, 0, 0, 0.16); height: auto; }
    .posts_table   { width: 98%; text-align: left; margin: 0 auto 0 auto; border-collapse: collapse; display: table; }
        .posts_table td { padding: 4px; font-family: sans-serif; display: table-cell; }
        .posts_titre    { font-size: 14.5px; border-bottom: double 3px #e6e6e6; }
        .posts_titre:hover { font-size: 14.5px; border-bottom: double 3px #e6e6e6; cursor: pointer; background-color: #eef7d9; }
        .posts_titre2    { font-size: 14.5px; }
        .posts_titre2:hover { font-size: 14.5px; cursor: pointer; background-color: #eef7d9; }
        .posts_fichier  { min-width: 160px; vertical-align: top; text-align: center; }
            .cadre_fichier { width: 94%; height: 100%; padding: 4px; border: solid 1px #e6e6e6; border-radius: 14px; text-align: center;  margin: 0 auto 0 8px; }
            .pdf_icone  { width: 28px; height: 37px; background-image: url(../img/pdf.png); background-size: contain; background-repeat: no-repeat; margin: 8px auto 8px auto; }
            .zip_icone  { width: 28px; height: 37px; background-image: url(../img/zip.png); background-size: contain; background-repeat: no-repeat; margin: 8px auto 8px auto; }
            .cadre_fichier_tab { margin: 8px auto 4px auto; }
        .posts_meta     { min-width: 176px; }
        .posts_descri   { width: 66%; text-align: justify; font-size: 14px; }
            .posts_descri div { padding: 0 16px 0 16px; max-height: 3rem; overflow-y: auto; }
            .posts_meta_tab { font-size: 14px; }
            .posts_meta_tab_td1 {  }
            .posts_meta_tab_td2 {  }

#menu_sections { width: 100%; border-bottom: dotted 1px #dedede; margin-bottom: 24px; text-align: left; white-space: nowrap; }
.section  { width: 15%; display: inline-block; height: 24px; text-align: left; padding: 4px; cursor: pointer; color: #383838; margin: 1px; }
.section:hover
{
    width: 15%; display: inline-block; height: 24px; text-align: left; padding: 3px; cursor: pointer; color: #888888;
    /* color: white; text-shadow: 1px 0 0 #55ab26, -2px 0 0 #55ab26, 0 2px 0 #55ab26, 0 -2px 0 #55ab26, 2px 2px #55ab26, -2px -2px 0 #55ab26; */
    border: dotted 1px #e6e6e6; border-top-left-radius: 8px; border-top-right-radius: 8px; border-bottom: none;
}
.unsection  { width: 15%; display: inline-block; height: 24px; text-align: left; padding: 4px; cursor: pointer; color: black; margin: 1px; }
.section_titre { display: inline-block; font-family: sans-serif; padding: 6px 12px 6px 12px; }
    .selectitr { border: solid 1px #dedede; border-top-left-radius: 8px; border-top-right-radius: 8px; border-bottom: none; }
.section_trait { display: inline-block; width: calc(100% - 24ch); border-bottom: solid 1px #dedede; }

.fond_gris  { background-color: #f7f7f7; }
.fond_blanc { background-color: #ffffff; }
.curs_def   { cursor: default; }


/* ==== Footer ==== */

#footer         {
                  background-image:linear-gradient(135deg, #393939, #494949); border-top: solid 4px #595959; border-bottom: solid 4px #333333;
                  font-family: sans-serif; font-size: 13px; color: white; padding: 16px 16px 8px 16px;
                  heigth: 64px; display: block; margin-bottom: 8px; /* position: fixed ; top: 92vh; */
                }
#logo           { width: 38px; height: 25px; background-image: url(../img/logo2.png); vertical-align: middle; margin-top: -3px; display: inline-block; background-size: contain; background-repeat: no-repeat; }
#logo:hover     { width: 38px; height: 25px; background-image: url(../img/logo2.png); vertical-align: middle; margin-top: -3px; display: inline-block; background-size: contain; background-repeat: no-repeat;
                  opacity: 0.88; }
#footer a       { color: #eaeaea; text-decoration: none; }
#footer a:hover { text-decoration: underline; }
ul              { list-style: none; margin: 0; }
ul li           { display: inline-block; width: auto; }
nav             { vertical-align: middle; padding: 4px; display: inline-block; }
.adress         { display: inline-block; font-size: 13px; vertical-align: middle; padding: 4px; }
li              { width: 100%; }



/* ==== Textes/Titres ==== */

.font_strd       { font-family: sans-serif; font-size: 0.9em; }
h1               { width: 100%; font-family: sans-serif; font-size: 1.5em; font-weight: 500; }
h2               { width: 96%;  font-family: sans-serif; font-size: 1.1em; font-weight: 400; padding: 4px; margin: 16px auto 16px auto; }
h3               { width: 66%;  font-family: sans-serif; font-size: 0.9em; font-weight: 400; padding: 4px; margin: 16px auto 16px auto; font-style: oblique; }
.error-message   { font-family: sans-serif; font-size: 0.85em; line-height: 0.85em; color: #bf4a4a; margin-bottom: 12px; font-style: oblique; }
label            { font-family: sans-serif; font-size: 0.9em; color: white; }



/* ==== Divers/Récurrent ==== */

.left          { text-align: left; }
.center        { text-align: center; }
.centermargin  { margin: 0 auto 0 auto; }
.right         { text-align: right; }
.justifie      { text-align: justify; }
.fleft         { float: left; }
.fright        { float: right; }
.v_middle      { vertical-align: middle; }
.v_sub         { vertical-align: sub; }
.normal        { font-weight: normal; }
.lightbold     { text-shadow: 1px 0 0 rgba(0, 0, 0, 0.2); }
.bold          { font-weight: bold; letter-spacing: -0.055rem; }
.bold2         { font-weight: 500; }
.italique      { font-style: oblique; }

.letspac1      { letter-spacing: -0.5px; }
.inline        { display: inline-block; }

.espace        { display: inline-block; width: 1rem; }
.semi_alinea   { display: inline-block; width: 8px; }
.alinea        { display: inline-block; width: 16px; }
.alinea2       { display: inline-block; width: 24px; }
.double_alinea { display: inline-block; width: 32px; }
.triple_alinea { width: 48px; }
.grand_ecart   { display: inline-block; width: 12.5vw; }

.petit         { font-size: 0.8em; }
.moyen         { font-size: 0.9em; }
.moyen2        { font-size: 0.925em; }
.dodu          { font-size: 1em; }
.dodu2         { font-size: 1.1em; }
.ombre         { text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.2); }

.vert          { color: #55ab26; }
.rouge         { color: #bf4a4a; }
.orange        { color: #d47f49; }
.grise         { color: #888585; }
.blanc         { color: #ffffff; }



/* ==== Formulaires/Inputs/Boutons/Liens ==== */

#lien_accueil { display: inline-block; }
.lien_accueil_link { font-family: sans-serif; font-size: 14px; text-decoration: none; color: #ffffff; }
.lien_accueil_link:hover { font-family: sans-serif; font-size: 14px; text-decoration: none; color: rgba(255, 255, 255, 0.86); text-decoration: underline; }


.login_input { display: inline-block; width: 10vw; line-height: 1.1em; margin-right: 4px; }
#login_btn, #login_form { display: inline-block; vertical-align: middle; line-height: 1.1em; }

.adduser_input { width: 16vw; line-height: 1.1em; margin-bottom: 12px; }
.form_USER_grade { display: inline-block; width: 100%; text-align: left; margin: 8px auto 16px auto; }
    #tab_btn_useradd { width: 99%; }
        #fUg_td1 { width: auto; } /* calc(100% - 5em); }*/
        #fUg_td2 { width: 5em; text-align: right; }

.lien_enveloppe_cont { width: 99%; margin-bottom: 4px; }
    #retour_search { width: 204px; margin-top: 4px;; }
.lien_enveloppe_1 { font-family: sans-serif; font-size: 13px; text-decoration: none; color: #39721a; }
    .plus { font-weight: bolder; font-size: 20px; vertical-align:sub; color: #55ab26; }
.lien_enveloppe_1:hover { font-family: sans-serif; font-size: 13px; text-decoration: underline; color: #39721a; }
    #lien_new_post { display: inline-block; vertical-align: top; margin-top: 4px; }

.BoutonModifier { width: 15px; height: 11px; font-size: 0px; background-image:url(../img/bouton_MODIFIER_neutre.gif); }
.BoutonModifier:hover { width: 15px; height: 11px; font-size: 0px; background-image:url(../img/bouton_MODIFIER_hover.gif); }
.BoutonModifier:active { width: 15px; height: 11px; font-size: 0px; background-image:url(../img/bouton_MODIFIER_active.gif); }
.BoutonSupprimer { width: 15px; height: 11px; font-size: 0px; background-image:url(../img/bouton_SUPPRIMER_neutre.gif); }
.BoutonSupprimer:hover { width: 15px; height: 11px; font-size: 0px; background-image:url(../img/bouton_SUPPRIMER_hover.gif); }
.BoutonSupprimer:active { width: 15px; height: 11px; font-size: 0px; background-image:url(../img/bouton_SUPPRIMER_active.gif); }
.BoutonImprimer { width: 15px; height: 11px; font-size: 0px; background-image:url(../img/bouton_IMPRIMER_neutre.gif); border: solid 1px #55ab26; border-radius: 5px; }
.BoutonImprimer:hover { width: 15px; height: 11px; font-size: 0px; background-image:url(../img/bouton_IMPRIMER_hover.gif); border: solid 1px #55ab26; border-radius: 5px; }
.BoutonImprimer:active { width: 15px; height: 11px; font-size: 0px; background-image:url(../img/bouton_IMPRIMER_active.gif); border: solid 1px #55ab26; border-radius: 5px; }

.lien_posts {  }
.lien_posts:hover { opacity: 0.8; }

.addpost_input { display: block; width: 32vw; line-height: 1.1em; margin-bottom: 12px; margin: 8px auto 16px auto; }
    .add_post_tarea { display: block; width: 32vw; line-height: 1.1em; margin-bottom: 12px; font-family: sans-serif; font-size: 13px; margin: 8px auto 16px auto; }
.form_POST_meta { display: inline-block; width: 96%; text-align: left; margin: 8px auto 16px auto; text-align: center; }
    #tab_postadd_meta { width: 100%;  }
        #tpam_td1 { width: 40%; text-align: left; }
        #tpam_td2 { width: 40%; text-align: left; }
        #tpam_td3 { width: 20%; text-align: right; }
#ligne_input_file { vertical-align: middle; }
#file_form        { width: 384px; margin: 0 calc(50% - 192px) 0 calc(50% - 192px); padding: 4px 0 4px 0; background-color: #595959; }
#form_fichier     { margin: 8px; }
    #indic_file  { margin-bottom: 16px; vertical-align: top; line-height: 28px; }
    #flash_input_file {  }
    .pdf_icone2  { width: 21px; height: 28px; background-image: url(../img/pdf.png); background-size: contain; background-repeat: no-repeat; }
    .zip_icone2  { width: 21px; height: 28px; background-image: url(../img/zip.png); background-size: contain; background-repeat: no-repeat; }
.closed_meta     { width: calc(100% - 66ch); float: right; text-shadow: none; font-size: 14px; height: 2ch; }
#closed_meta_table { margin-top: -5px; float: right; }
#closed_meta_table td { width: 14ch; text-align: center; }
.posts_table_case_action { width: 56px; text-align: right; }
.action_tab_post { float: right; }

#td_btn_save     { width: 64px; }
#btn_save        { width: 14px; height: 14px; background-image: url(../img/disquette.png); background-size: contain; background-repeat: no-repeat;
                   display: inline-block; cursor: pointer; vertical-align: middle; margin-left: 10px; border: solid 2px white; }
#btn_save:hover  { width: 14px; height: 14px; background-image: url(../img/disquette.png); background-size: contain; background-repeat: no-repeat; opacity: 0.8;
                   display: inline-block; cursor: pointer; vertical-align: middle; margin-left: 10px; border: solid 2px rgba(255, 255, 255, 0.74); }
#btn_save:active { width: 12px; height: 12px; background-image: url(../img/disquette.png); background-size: contain; background-repeat: no-repeat; opacity: 0.4;
                   display: inline-block; cursor: pointer; vertical-align: middle; margin-left: 10px; border: solid 2px rgba(255, 255, 255, 0.74); padding: 1px; }

#barre_search_div   { display: inline-block; width: 12.5%; max-width: 256px; vertical-align: top; margin-top: -3px; margin-left: 32px; }
#barre_search_input { width: inherit; border: solid 1px #e6e6e6; border-radius: 4px; padding: 3px; }
#btn_search_td button { background: none; border: none; padding: 0; }
#btn_search_td button         { width: 14px; height: 14px; background-image: url(../img/loupe.png); background-size: contain; background-repeat: no-repeat;
                      display: inline-block; cursor: pointer; vertical-align: middle; margin: 2px 2px 3px 6px; }
#btn_search_td button:hover   { width: 14px; height: 14px; background-image: url(../img/loupe.png); background-size: contain; background-repeat: no-repeat; opacity: 0.8;
                      display: inline-block; cursor: pointer; vertical-align: middle; margin: 2px 2px 3px 6px; }
#btn_search_td button:active  { width: 14px; height: 14px; background-image: url(../img/loupe.png); background-size: contain; background-repeat: no-repeat; opacity: 0.4;
                      display: inline-block; cursor: pointer; vertical-align: middle; margin: 2px 2px 3px 6px; }

#recherche     { width: 97.5%; collapse: none; margin: 0 auto 24px auto; }
    .rechtd13  { width: 28%; }
    .rechtd2   { width: 44%; }
    .nvlrech   { padding-top: 3px; margin-right: -24px; }

#option_deploiement { display: inline-block; cursor: pointer; width: 192px; text-align: center; font-family: sans-serif; color: #888585; margin-bottom: 2px; }
#option_deploiement:hover { display: inline-block; cursor: pointer; width: 192px; text-align: center; font-family: sans-serif; color: #55ab26; margin-bottom: 2px; }



/* ==== Autres ==== */

/* Menu déroulant 1 (outils admin) */
#ordre_affichage_actuel { margin-left: 2px; vertical-align: middle; }
#outils_admin { display: inline-block; }
#menu-vertical, #menu-vertical ul { width: 1em; padding: 2px; margin: 0; list-style: none; border: solid 1px white; border-radius: 4px; color: #fff; text-shadow: none; }
#menu-vertical:hover { width: 1em; padding: 2px; margin: 0; list-style: none; border: solid 1px #39721a; border-radius: 4px; color: #39721a; background-color: white; text-shadow: none; cursor: pointer; }
#menu-vertical li { display: block; position: relative; }
#menu-vertical ul { position: absolute; left:-999em; }
#menu-vertical li:hover ul { width: 160px; height: auto; top: 20; left: -120px; text-align: left; z-index: 2; background-image:linear-gradient(135deg, #39721a, #55ab26); }
#menu-vertical li a, #menu-vertical ul li  { width: 144px; font-family: sans-serif; font-size: 13px; background-color: none; color: white; }
#menu-vertical li a:hover, #menu-vertical ul li:hover { width: 144px; font-family: sans-serif; font-size: 13px; background-color: white; color: #39721a; }
#menu-vertical ul li { width: 100%; padding: 8px; line-height: 24px; }

/* Menu déroulant 2 (affichage) */
#organise { display: inline-block; width: auto;/*width: 360px;*/ float: left; text-align: left; }
#menu-vertical2 { display: inline-block; }
    #ligne_principale { display: inline-block; width: 204px; color: black; }
#menu-vertical2, #menu-vertical2 ul { padding: 2px; margin: 0; list-style: none; border: solid 1px #e6e6e6; border-radius: 4px; color: #fff; }
#menu-vertical2:hover { padding: 2px; margin: 0; list-style: none; border: solid 1px #39721a; border-radius: 4px; color: #39721a; background-color: white; cursor: pointer; }
#menu-vertical2 li { display: block; position: relative; }
#menu-vertical2 ul { position: absolute; left:-999em; }
#menu-vertical2 li:hover ul { width: 204px; height: auto; top: 20; left: -2px; text-align: left; z-index: 2; background-image:linear-gradient(135deg, #39721a, #55ab26); }
#menu-vertical2 li a, #menu-vertical2 ul li  { width: 188px; font-family: sans-serif; font-size: 13px; background-color: none; color: white; }
#menu-vertical2 li a:hover, #menu-vertical2 ul li:hover { width: 188px; font-family: sans-serif; font-size: 13px; background-color: white; color: #39721a; }
#menu-vertical2 ul li { width: 100%; padding: 8px; line-height: 24px; }

#form_affichage { display: inline-block; cursor: pointer; width: 182px; color: #494949; padding: 1px; margin: 0px; }
    label[for=form_affichage]{ font-family: sans-serif; font-size: 0.8em; color: #494949; }
#menu-vertical22              { display: inline-block; text-align: left; }
#menu-vertical22 button       { background: none; border: none; padding: 0; }
#menu-vertical22 button       { width: 24px; height: 16px; background-image: url(../img/engrenage.png); background-size: contain; background-repeat: no-repeat;
                                display: inline-block; cursor: pointer; vertical-align: middle; margin: 2px 2px 3px 6px; }
#menu-vertical22 button:hover { width: 24px; height: 16px; background-image: url(../img/engrenage.png); background-size: contain; background-repeat: no-repeat; opacity: 0.8;
                                display: inline-block; cursor: pointer; vertical-align: middle; margin: 2px 2px 3px 6px; }
#menu-vertical22 button:active { width: 24px; height: 16px; background-image: url(../img/engrenage.png); background-size: contain; background-repeat: no-repeat; opacity: 0.4;
                                 display: inline-block; cursor: pointer; vertical-align: middle; margin: 2px 2px 3px 6px; }

/*
    GRIS CLAIR  = #e6e6e6
    GRIS UNAMUR = #494949
    GRIS FONCE  = #393939
*/




scroll { width: 5px; }