:root {
    --main-border: 0px solid #000;

    --main-rouge        : #C82D36;
    --main-orange       : #F0B227;
    --main-bleu         : #183F7B;
    --main-bleulight    : #6982AB;
    --main-bleulightx2  : #E1E8F3;
    --main-bleulightx3  : #5CB3F0;
    --main-bleulightx4  : #3170E6;
    --main-bleulightx5  : #576E95;


    --main-vert         : #22CBB4;
    --main-vertlight    : #DEFBF7;

    --main-grisC        : #F7F9FB;
    --main-grislightx2  : #F5F9FF;

    --main-b-1          : #F4FAFE;
    --main-b-2          : #F1FBFA;
    --main-b-3          : #F0F2F6;
    --main-b-4          : #F1F5FD;
    --main-b-5          : #F5F7F9;

    --main-trait        : #E8ECF1;


    --main-TBH50    : 50px;
    --main-TBH20    : 30px;
    --main-B        : 2px;



}

.modal-backdrop{
    backdrop-filter: blur(5px);
    background-color: #01223770;
}
.modal-backdrop.in{
    opacity: 1 !important;
}

.flex{
    flex-grow: 1;
}

body,input {
    background: #F8FBFF;
    font-family:Geo-regular;
}

#HeaderOrpea {
    display: flex;
    position : fixed;
    width:100%;
    height:85px;

    top:0;
    left: 0;
    background:#FFF;
    box-shadow: 0px 3px 15px #1B417919;
}

/* Forme Modal */
.modal-header,.modal-content {
    border-radius: 20px;
    background:#FFF;
}
.modal-footer {
    border:0px;
}

.bloc-auth {
    display: inline-block;
    padding:50px;
    width:50%;
    text-align: center
}
.bloc-alertes,.bloc-recherche,.bloc-evaluations,.bloc-analyses1,.bloc-analyses2 {
    padding:20px;
}
.bloc-taches {
    padding:20px;
    padding-top:35px;
}


.bloc-eval-blanc,.bloc-eval-bleu,.bloc-eval-bleulight , .bloc-eval-grisC {
    margin:4px;
    padding-top:8px;
    adding-bottom:8px;
    border-radius: 8px;
    height:70px;
    color:#fff;
    text-align:left;
    padding-left:20px;

}

.bloc-eval-blanc {
    background: #FFF;
}
.bloc-eval-grisC {
    background: var(--main-grisC  );
}
.bloc-eval-bleu {
    background: var(--main-bleu);
}
.bloc-eval-bleulight {
    background: var(--main-bleulight);
}


.bloc-equ-bleulightx2 , .bloc-equ-bleulightx4, .bloc-equ-bleulight  , .bloc-equ-bleu {
    margin:8px;
    padding-top:8px;
    adding-bottom:8px;
    border-radius: 8px;
    height:90px;
    color:#fff;
    text-align:center;
}

.txt-equ {
    font-size: 0.8em;
    text-align:center;
    width:110px;
    margin-left:auto;
    margin-right:auto;
    /*border:1px solid #000;*/
}

.bloc-equ-bleulightx4 {
   background: var(--main-bleulightx4);
}
.bloc-equ-bleulightx2 {
    background: var( --main-bleulightx2 );
    border : 1px solid var( --main-bleu  );;
    color : var( --main-bleulight );
}
.bloc-equ-bleulight {
   background: var( --main-bleulight );
}
.bloc-equ-bleu {
   background: var( --main-bleu  );
}

.bloc-beneficiaires, .bloc-beneficiaire, .bloc-taches {
    padding:40px;
}

.bloc-ombre {
    background: #FFF;
    display: inline-block;
    box-shadow: 0px 3px 15px #1B417919;
    border-radius: 10px;
    opacity: 1;
}

.bloc-filet {
    border:var(--main-B) solid var(--main-trait);
    background: #FFF;
    display: inline-block;
    border-radius: 10px;
    opacity: 1;
}

/* Tableau */


.TR2_H {
    height:var(--main-TBH20);
    padding:5px;
    line-height: 1.5;;
}


/*
.EnteteC {
    border-top:var(--main-B) solid var(--main-trait);
}
.EnteteC_L {
    border-top:var(--main-B) solid var(--main-trait);
    border-left:var(--main-B) solid var(--main-trait);
}
.EnteteC_R {
    border-top:var(--main-B) solid var(--main-trait);
    border-right:var(--main-B) solid var(--main-trait);
}
*/





.EnteteTR {
    height:var(--main-TBH50);
    border-bottom:var(--main-B) solid var(--main-trait);
}


.LigneCD {


    border-left:var(--main-B) solid var(--main-trait);
}
.LigneC_L {
    border-left:var(--main-B) solid var(--main-trait);
}

.LigneCF {



    border-right:var(--main-B) solid var(--main-trait);
}


.TB_1_M_L {
    height:var(--main-TBH50);
    border-left:var(--main-B) solid var(--main-trait);

}

.TB_1_M_M {
    ine-height: 3em;
    height:var(--main-TBH50);

    padding:10px;
}
.TB_1_M_R {
    padding:10px;
    height:var(--main-TBH50);
    border-right:var(--main-B) solid var(--main-trait);
}

.TB_2_M_L {
    height:85px;
    border-left:var(--main-B) solid var(--main-trait);
}
.TB_2_M_M {
    padding:20px;
    height:85px;
    line-height: 1em;
    /*border:1px solid #f2f2f2;*/
}
.TB_2_M_R {
    height:85px;
    adding:10px;

    border-right:var(--main-B) solid var(--main-trait);
}


.TB_1_T_L {
    height:var(--main-TBH50);
    border-left:var(--main-B) solid var(--main-trait);
    border-top:var(--main-B) solid var(--main-trait);
    border-top-left-radius: 10px;
}

.TB_1_T_M {
    height:var(--main-TBH50);
    border-top:var(--main-B) solid var(--main-trait);
    padding:10px;

}

.TB_1_T_R {
    height:var(--main-TBH50);
    border:var(--main-B) solid var(--main-trait);
    border-bottom:0px;
    border-left:0px;
    border-top-right-radius: 20px;
}

.TB_2_T_L {
    height:10px;
    border-left:var(--main-B) solid var(--main-trait);
    border-top:var(--main-B) solid var(--main-trait);
    border-top-left-radius: 10px;
}

.TB_2_T_M {
    height:10px;
    border-top:var(--main-B) solid var(--main-trait);
    padding:5px;
}

.TB_2_T_R {
    height:10px;
    border:var(--main-B) solid var(--main-trait);
    border-bottom:0px;
    border-left:0px;
    border-top-right-radius: 20px;
}


.TB_1_B_L {
    height:10px;
    border:var(--main-B) solid var(--main-trait);
    border-top:0px;
    border-right:0px;
    border-bottom-left-radius: 20px;
}
.TB_1_B_M {
    height:10px;
    border-bottom:var(--main-B) solid var(--main-trait);
}
.TB_1_B_R {
    height:10px;
    border:var(--main-B) solid var(--main-trait);
    border-top:0px;
    border-left:0px;
    border-bottom-right-radius: 20px;
}




.TB1_left {
    border-left:var(--main-B) solid var(--main-trait);
}

.TB1_right {
    border-right:var(--main-B) solid var(--main-trait);
}

/*
tr:nth-child(even) {background: #F5F9FF};
tr:nth-child(odd) {background: #FFF};
*/
.FooterTR {
    height:10px;
    border:var(--main-B) solid var(--main-trait);
    border-top:0px;
    border-bottom-right-radius: 20px;
    border-bottom-left-radius: 20px;

}
.bleu {
    background: var(--main-bleu);
}
.vert {
    background: var(--main-vert);
}
.Titre-vert {
color :   var(--main-vert);
}


.Titre-U {
    color :   var( --main-rouge );
}

.Titre-AS {
    color :   var(--main-orange);
}

.Titre-SF, .Titre-bleu {
    color :   var(--main-bleu);
}


.notif_type_rouge, .notif_type_orange, .notif_type_bleu , .notif_type_bleulight {
    padding: 4px;
    padding-left: 20px;
    border-radius: 8px;
    font-weight: bold;
    height:40px;
    line-height: 2.5em;
    font-size:0.8em;
}

.tache_type_rouge, .tache_type_orange, .tache_type_bleu , .tache_type_bleulight {
    mrgin:0px;
    padding: 4px;
    padding-left: 20px;
    border-radius: 8px;
    font-weight: bold;
    eight:40px;
    line-height: 2.5em;
    font-size:0.8em;
}

.tache_type_rouge ,.notif_type_rouge {
    background: var(--main-rouge);
    color:#FFF;
}
.tache_type_orange,.notif_type_orange {
    background: var(--main-orange);
    color:#FFF;
}
.tache_type_bleulight , .notif_type_bleulight {
    background: var(--main-bleulight);
    color:#FFF;
}
.tache_type_bleu, .notif_type_bleu {
    background: var(--main-bleu);
    color:#FFF;
}



.btn {
 padding:0px; margin:0px;
}
/* S identifier */
.BtnBleu           {color:#fff;background-color:var(--main-bleu); border-color:var(--main-bleu); border-radius:50px; border:2px solid var(--main-bleu); height:60px; width:100px; letter-spacing: 0.16px;}
.BtnBleu:hover     {color:var(--main-bleu);   background-color:#FFF;  border-color:var(--main-bleu)}
.BtnBleu:active    {color:var(--main-bleu);   background-color:#FFF;  border-color:var(--main-bleu)}
.BtnBleu:focus     {color:var(--main-bleu);   background-color:#FFF;  border-color:var(--main-bleu)}
.BtnBleu:visited   {color:var(--main-bleu);   background-color:#FFF;  border-color:var(--main-bleu)}



/* Dcx Pwdperdu */
.btn-bleu           { color:#fff;background-color:var(--main-bleu); border-color:var(--main-bleu); border-radius:10px; border:2px solid var(--main-bleu); height:50px; width:130px; font-size:1.1em; font-weight: bold;}
.btn-bleu:hover     {color:var(--main-bleu);   background-color:#FFF;  border-color:var(--main-bleu)}
.btn-bleu:active    {color:var(--main-bleu);   background-color:#FFF;  border-color:var(--main-bleu)}
.btn-bleu:focus     {color:var(--main-bleu);   background-color:#FFF;  border-color:var(--main-bleu)}
.btn-bleu:visited   {color:var(--main-bleu);   background-color:#FFF;  border-color:var(--main-bleu)}


.btn-bleu_           {color:var(--main-bleu);   background-color:#FFF; border-color:var(--main-bleu); border-radius:40px; border:2px solid var(--main-bleu); height:50px; width:250px; font-size:1.1em; font-weight: bold;}
.btn-bleu_:hover     {color:#FFF;   background-color:var(--main-bleu);  border-color:var(--main-bleu)}
.btn-bleu_:active    {color:#FFF;   background-color:var(--main-bleu);  border-color:var(--main-bleu)}
.btn-bleu_:focus     {color:#FFF;   background-color:var(--main-bleu);  border-color:var(--main-bleu)}
.btn-bleu_:visited   {color:#FFF;   background-color:var(--main-bleu);  border-color:var(--main-bleu)}




.btn-vert           {color:#fff;background-color:var(--main-vert); border-color:var(--main-vert); border-radius:10px; border:2px solid var(--main-vert); height:50px; width:130px; font-size:1.1em; font-weight: bold; }
.btn-vert:hover     {color:var(--main-vert);   background-color:#FFF;  border-color:var(--main-vert)}
.btn-vert:active    {color:var(--main-vert);   background-color:#FFF;  border-color:var(--main-vert)}
.btn-vert:focus     {color:var(--main-vert);   background-color:#FFF;  border-color:var(--main-vert)}
.btn-vert:visited   {color:var(--main-vert);   background-color:#FFF;  border-color:var(--main-vert)}




#LibMotPassePerdu {
    color:var(--main-bleu);
    font-weight: bold;
    font-size: 1em;

    text-decoration: underline;
}


#bonjour {
    color:var(--main-bleu);
    font-family:Geo-italic;
    font-weight: bold;
    font-size:2em;
    margin-bottom:50px;
}

#login,#password,#Identifiant,#search,#f_nom,#f_prenom,#f_identifiant {
    height:60px;
    border-radius : 50px;
    border:0px;
    margin-bottom: 30px;
    font-size: 1.2em;
}

#login {
    padding-left: 60px;
    background:transparent url(../images/commun/orpea/ico-login.svg) no-repeat 20px 20px ;
    background-size: 18px;
    background-color :#FFF;
    background-color: var(--main-vertlight);
}

#password {
    padding-left: 60px;
    background:transparent url(../images/commun/orpea/ico-pwd.svg) no-repeat 20px 20px ;
    background-size: 18px;
    background-color: var(--main-vertlight);
}

#Identifiant {
    padding-left: 60px;
    background:transparent url(../images/commun/orpea/ico-login.svg) no-repeat 20px 20px ;
    background-size: 18px;
    background-color: var(--main-vertlight);
}
#search {
    padding-left: 60px;
    background:transparent url(../images/commun/orpea/btn-search.svg) no-repeat 20px 18px ;
    background-size: 25px;
    background-color: var(--main-grislightx2);
}
#f_nom,#f_prenom {
    padding-left: 60px;
    background:transparent url(../images/commun/orpea/header-user.svg) no-repeat 20px 18px ;
    background-size: 20px;
    background-color: var(--main-grislightx2);
}
#f_identifiant {
    padding-left: 60px;
    background:transparent url(../images/commun/orpea/ico-identifiant-b.svg) no-repeat 20px 18px ;
    background-size: 20px;
    background-color: var(--main-grislightx2);
}

.DIV_eval {
    border-radius: 10px;
    background: var(--main-bleulight) ;
    color:#FFF;
    height:60px;
    margin:5px;
    padding:10px;
}


#scrolly{
    width: 100%;
    height: 200px;
    display: flex;
    overflow-x: auto;
}



/* INPUT placeholder Vert */
.ColorPlaceholderVert::-webkit-input-placeholder {
    color:var(--main-vert);
}
.ColorPlaceholderVert::-moz-placeholder {
    color:var(--main-vert);
    opacity:  1;
}
.ColorPlaceholderVert::-ms-input-placeholder {
    color:var(--main-vert);
}
.ColorPlaceholderVert::-webkit-input-placeholder {
    color:var(--main-vert);
}
/* INPUT placeholder gris */
.ColorPlaceholderBleu::-webkit-input-placeholder {
    color:var(--main-bleu);
    ont-size: 1.2em;
}
.ColorPlaceholderBleu::-moz-placeholder {
    color:var(--main-bleu);
    ont-size: 1.2em;
    opacity:  1;
}
.ColorPlaceholderBleu::-ms-input-placeholder {
    color:var(--main-bleu);
    ont-size: 1.2em;
}
.ColorPlaceholderBleu::-webkit-input-placeholder {
    color:var(--main-bleu);
    ont-size: 1.2em;
}


@media screen and (min-width: 1450px) {
    .Menu1 {
        height:70px;
        color:#FFF;
        font-size: 1.2em;
        padding:20px;
        cursor:pointer;
    }
    .Menu1:hover {
        background: var(--main-vert);;
    }
    .Menu1_selected {
        background: var(--main-vert);;
    }
    .PositionMenu1{
        position: fixed;
        top:85px;
        float:left;
        width:20%;
        background: var(--main-bleu);
        height:100%;
    }

    .PositionMenu2 {
        display:none;
    }

    .Mdroite {
        float:right;
        width:80%;
        ackground: #00FF00;

    }
    .chiffre {
        font-weight: bold;
        font-size: 1.2em;
    }

}

@media screen and (min-width: 600px) and (max-width: 1450px) {
    .Menu2 {
        height:70px;
        text-align: center;
        padding:25px;
        cursor:pointer;
    }
    .Menu2_selected {
        color: var(--main-vert);;
    }
    .PositionMenu1 {
        display:none;
    }

    .PositionMenu2 {
        display: flex;
        position: fixed;
        color :#000;

        bottom: 0;
        left: 0;
        width: 100%;
        background: #FFF;

        z-index:99;
        box-shadow: 0px 0px 15px #1B417926;
    }

    .chiffre {
        font-weight: bold;
        font-size: 1.2em;
    }
 }

h3 {
    padding:0px;
    margin:0px;
    font-size: 1.5em;
    letter-spacing: 1px;

}
h1,h2,h3,h4,.BtnBleu,.btn-bleu,.btn-bleu_,.btn-vert {
    font-family:Geo-regular;
}

.wrapper {
    padding:25px;
    border:0px solid #000;

    display: grid;
    grid-template-columns: repeat(8, 1fr);
    gap: 25px;
    grid-auto-rows: minmax(100px, auto);
}
.one {
    grid-column: 1/6;
    grid-row: 1/6;
}
.two {
    grid-column: 6/9;
    grid-row: 1 ;
}
.twoA {
    grid-column: 6/9;
    grid-row: 2 ;
}
.twoB {
    grid-column: 6/9;
    grid-row: 3/6 ;
}
.three {
    grid-column: 1/5;
    grid-row: 6;
}
.four {
    grid-column: 5/9;
    grid-row: 6;
}

.Beneficiaire_1 {
    grid-column: 1/9;
    grid-row: 1;
}
.Beneficiaire_2 {
    grid-column: 1/9;
    grid-row: 2;
}
.Beneficiaire_3 {
    grid-column: 1/9;
    grid-row: 3;
}
.Beneficiaire_4 {
    grid-column: 1/9;
    grid-row: 4;
}

.Tache_1 {
    grid-column: 1/9;
    grid-row: 1;
}

.bloc {
    border:1px dashed #CCC;

}


.bric {
    border-radius:15px;
    padding:10px;
    margin:10px; width:18%; height:110px;
    border:0px solid #000;
}

.bric_titre {
    font-size: 1.1em;
    font-weight: bold;
}

.bric-1 {
    border-radius:15px;
    padding:20px;
    margin:10px;
    background: var(--main-b-1 );

}
.bric-2 {
    border-radius:15px;
    padding:20px;
    margin:10px;
    background: var(--main-b-2 );
}
.bric-3 {
    border-radius:15px;
    padding:20px;
    margin:10px;
    background: var(--main-b-3  );
}

.bric-4 {
    border-radius:15px;
    padding:20px;
    margin:10px;
    background: var(--main-b-4  );
}

.bric-5 {
    border-radius:15px;
    padding:20px;
    margin:10px;
    background: var(--main-b-5  );
}


.b-aucune {

    text-align: center;
    font-size: 1.1em;
    border-radius: 15px;
    border: solid 20px var(--main-grisC);
    background : var(--main-bleulightx2);
color: var(--main-bleulight)
    /*


    border : 2px solid var(--main-grisC);
    background : var(--main-bleulightx2);


    color : var( --main-bleu);*/
}
.b-gris {
    background : var(--main-grisC);

}

.b-rouge {
     background : var(--main-rouge);
     color:#FFF;
 }

.b-orange {
     background : var(--main-orange);
     color:#FFF;
 }

.b-bleu {
    background : var(--main-bleu);
    color:#FFF;
}

.btn-circle {
    top:18px;
    position:relative;
    display: flex;
    justify-content: center;
    background-color: var(--main-grislightx2);
    height: 50px;
    width: 50px;
    border-radius: 100px;
}

.btn-circle-2 {
    display: flex;
    justify-content: center;
    /*
    top:-5px;
    position:relative;
    padding-top:10px;
    padding-left:10px;


    */
    height: 40px;
    width: 40px;
    border-radius: 100px;
    background-color: #FFF;
}

.logo-header {
    margin-left:10px; margin-top:20px; height:40px
}

#Icon_material-dashboard {
    fill: red;
}


.spinner {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    border: 9px solid;
    border-color: #DEFBF7;
    border-right-color: #22CBB4;
    animation: spinner-d3wgkg 1s infinite linear;
}

@keyframes spinner-d3wgkg {
    to {
        transform: rotate(1turn);
    }
}

#flecheD {
    stroke:#26a6c0;
}