/*=========================================== */
div,
span,
p,
button,
input,
label,
nav,
optgroup,
select,
textarea,
table { font-size:var(--fntsize1); font-family:Liberation Serif; }
:root {
    --pri_l: #FEFFE7 ;
    --pri_d: #7D7E00;
    --sec_l: #EAEAF2;
    --sec_d: #D4D4E2;
    --ter_l: #D8E6F6;
    --ter_d: #2761A3;
}

body { font-size: var(--fntsize1); }

body { background-size: cover; }


p     { display:inline; }
label { float: none; display: inline-block;  margin-left:0.68%; vertical-align: baseline; }
input { float: none; display: inline-block;  vertical-align: baseline;}
area:hover{  cursor: pointer;}

/*  .bulle {display:block; position:absolute; bottom:4%; left:68%; } */
.clickable:hover { cursor: pointer;}
.mustupdate { background-color: #15B533; }
/*============================================================================*/
.tbl {
    display: block;
    border-collapse: collapse;
    overflow-y: scroll;
}
.tbl tr {font-size: var(--fntsize2); font-family: Liberation Serif;}                /*font-size:0.8rem; */
.tbl tr .active { background-color:yellow;}
.tbl thead tr { background-color: var(--ter_d); color: #ffffff; }
.tbl th { padding: .4vh 0.4vw; top:0; position:sticky; z-index: 1;text-align: left;}
.tbl td { display: table-cell; height: 38vh; padding-left: .3vw; white-space: nowrap;text-align: left; text-overflow: ellipsis;}
.tbl td:hover { background-color:white;}

.tbl tbody td { font-size: var(--fntsize2);}
.tbl tbody tr { border-bottom: 1px solid #dddddd;}
.tbl body tr:nth-of-type(even) { background-color: #f3f3f3;}
/* .tbl tbody tr:last-of-type      { border-bottom: 2px solid #009879;}  */
/*.tbl tbody tr.active-row        {font-weight: bold; color: #009879;}*/


/*============================================================================*/
.formitem {
     /*width:220px;   font-size:0.9rem;  */
     height:2.95%;
     border:2px solid silver;
     border-radius:3px;
     padding:2px 8px;
     font-size: var(--fntsize1);

 }
.btt {
  display: inline-block;
  height:4%;
  color: navy;
  background-color:#E5FDEA;     /*var(--sec_l);*/
  border:1px solid navy;
  border-radius:5px;
  padding: 1px 4px;
  margin: 1px 6px;
  text-align: center;
  text-decoration: none;
  transition-duration: 0.4s;
  cursor: pointer;
  min-height: 24px;

}
    .btt:hover { cursor: pointer; background-color: #ABF7B9;  }
    .btt.mustupdate { background-color: #22CE83; }

.hlp {
     color:navy;
     background-color:#ABEBC6;
     border-radius:3px;
     box-shadow:0px 0px 10px 0px #424242;
     z-index: 99;
     padding:12px;
     box-sizing:border-box;
}
.hlpspa {
    /*display: inline-block;*/
    background-color:white;
    border:1px solid  navy;
    border-radius:4px;
    padding:8px;
    min-width: :260px;
    z-index: 99;
    color:navy;
    font-size: var(--fntsize1);
   /* font-size: 1em;*/
    font-family: Liberation Serif;
}


/*========================================================================*/
.navbar{
    position:fixed;
    background-color: #F5F5F5;
    top:0px; left:0px;
    height:5.6%; width:100%;
    border-bottom: 1px solid black;
    }
.nav:hover { color: white; cursor: pointer;}

nav {
    position: fixed;
    width: 100%;
    background-color: var(--sec_l);
    top: 0px;
    left: 0px;
    height:5.09%;
    }

/*nav img:hover { color: white; background: LightBlue;cursor: pointer;}*/

nav p {                                             /* tous les liens a à l'intérieur de la balise nav */
    float: left;                                    /* effet flottant */
    text-decoration: none;                          /* pas d'héritage avec effet souligné */
    color: navy;                                    /* couleur du texte */
    background-color: var(--sec_l);                       /* couleur de fond */
    height:5.09%;                                   /* hauteur      38px;       */
    line-height: 5.09%;                               /* interligne   38px;     */
    vertical-align: text_top;
    margin:0px;
    padding: 0% 0% 0% 0.68%;                                /* marges intérieur */
    transition: .5s;                                /* temps de transition lors du hover : une demi seconde */
}

nav a {                                             /* tous les liens a à l'intérieur de la balise nav */
    float: left;                                    /* effet flottant */
    text-decoration: none;                          /* pas d'héritage avec effet souligné */
    color: navy;                                    /* couleur du texte */
    background-color:LightBlue;                       /* couleur de fond    var(--sec_l);    */
    height: 5%;                                   /* hauteur   36px;  */
    line-height: 5%;                                /* interligne 36px*/
    margin:0px;
    padding: 0% 0% 0% 0.68%;                                  /* marges intérieur */
    transition: .5s;                                /* temps de transition lors du hover : une demi seconde */
}

#img_nav_bob {position: absolute;top:0%; right:0%; height:5.6%; background-color:LightBlue;z-index:9; }
/*==================================================================container niveau 1========*/
.cdr1 {
    background-color: var(--pri_l);
    border:2px solid  var(--pri_d);
    border-radius:.34%;
    padding:.8% .4%  ;
}
/*==================================================================container niveau 2========*/
.cdr2 {
    background-color: var(--sec_l);
    border:2px solid  var(--ter_d);
    padding:.8% .4%  ;
    border-radius:.34%;
}
/*==================================================================container niveau 2========*/
.cdr3 {
    background-color: linen;
    border:1px solid  black;
    padding:.8%  .4%  ;
    font-size:0.81em;
}
.titre1 {
    display:block;
    font-size: 2.2em;
    font-family: garamond, serif;
    font-weight: bolder;

    margin:2px 2px 14px 2px;
    }
.titre2 {
    display:block;
    font-size: 1.8em;
    font-family: garamond;
    font-weight: bolder;
    margin:2px 2px 14px 2px;
    }
.titre3 {
    display:block;
    font-size: 1.5em;
    font-family: garamond;
    text-decoration:underline;
    font-weight: bolder;
    margin:2px 2px 8px 2px;
    }
.titre4 {
    display:block;
    font-size: 1.2em;
    font-family:Liberation Serif;
    text-decoration:none;
    font-weight: bolder;
    margin:2px 2px 8px 2px;
    }
.titre5 {
    display:block;
    font-size: 0.9em;
    font-family: Liberation Serif;
    text-decoration:none;
    font-weight: bolder;
    margin:2px;
    }
 .titre6 {
    display:block;
    font-size: 0.9em;
    font-family: Liberation Serif;
    text-decoration:underline;
    }