.body {
    width : 98% ;
    padding-left : 2% ;   
    background-color: #f2f4f7; 
}
.form-control {
    color: #0c2241 !important;
}

.text-align-center {
    text-align: -webkit-center ;
    text-align: center;
}
.text-align-last-center {
    text-align-last: center;
}
.text-align-left {
    text-align: left !important;
}
.text-align-right {
    text-align: right;
}
.paddingTop {
    padding-top: 1vw;
}
.upperCase {
    text-transform: uppercase;
}
.noPadding {
    padding: 0px !important;
}
.noPaddingLeft {
    padding-left: 0px !important;
}
.noPaddingRight {
    padding-right: 0px !important;
}
.noMargin {
    margin: 0px !important;
}
.marginRAuto {
    margin-right: auto;
}
.cursor-pointer {
    cursor: pointer;
}
.small {
    font-size: small;
}
.medium {
    font-size: medium;
}
.large {
    font-size: large;
}
.larger {
    font-size: larger;
}
.bold {
    font-weight: bold;
}
.marginB1 {
    margin-bottom: 1vw;
}
.alignContCenter {
    align-content: center;
}

.borderTopNone {
    border-top: none !important;
}

.widthStretch {
    width: stretch !important;
}

.widthInherit {
    width: inherit !important;
}

.display-none {
    display: none !important;
}
.display-flex {
    display: flex !important;
}

.modalFormHidden {
    visibility: hidden;
    height: 15px;
}

.heightFitContent {
    height: fit-content;
}
.widthFitContent {
    width: fit-content;
}

.hidden {
    visibility: hidden;
}
.visibility-hidden {
    visibility: hidden;
}

.noBoxShadow {
    box-shadow: none !important;
}

.breakWord {
    word-wrap: break-word;
}

/*******************************/
    .divIconUser {
        background: url(../ressources/icon/user.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    .divIconUserN {
        background: url(../ressources/icon/userN.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    .divIconUsers {
        background: url(../ressources/icon/users.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    .divIconUsersN {
        background: url(../ressources/icon/usersN.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    .divIconBuilding {
        background: url(../ressources/icon/building.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    .divIconBuildingN {
        background: url(../ressources/icon/buildingN.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    .divIconBuildingV {
        background: url(../ressources/icon/buildingV.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    .divIconKey {
        background: url(../ressources/icon/key.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    .divIconKeyN {
        background: url(../ressources/icon/keyN.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    .divIconDocument {
        background: url(../ressources/icon/document.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    .divIconDocumentN {
        background: url(../ressources/icon/documentN.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    .divIconLocalisation {
        background: url(../ressources/icon/marker.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    .divIconLocalisationN {
        background: url(../ressources/icon/markerN.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    .divIconSurface {
        background: url(../ressources/icon/expand.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    .divIconSurfaceN {
        background: url(../ressources/icon/expandN.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    .divIconEtage {
        background: url(../ressources/icon/building.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    .divIconHome {
        background: url(../ressources/icon/home.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    .divIconHomeN {
        background: url(../ressources/icon/homeN.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    .divIconInfo {
        background: url(../ressources/icon/info.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    .divIconInfoN {
        background: url(../ressources/icon/infoN.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    .divIconQuestion {
        background: url(../ressources/icon/interrogation.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    .divIconCheckV {
        background: url(../ressources/icon/check-circleV.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    .divIconCheckR {
        background: url(../ressources/icon/check-circleX.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    .divIconSearch {
        background: url(../ressources/icon/search.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    .divIconBank {
        background: url(../ressources/icon/bank.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    .divIconBankN {
        background: url(../ressources/icon/bankN.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    .divIconPhone {
        background: url(../ressources/icon/phone-call.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    .divIconPhoneN {
        background: url(../ressources/icon/phone-callN.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    .divIconBriefcase {
        background: url(../ressources/icon/briefcase.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    .divIconBriefcaseN {
        background: url(../ressources/icon/briefcaseN.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    .divIconMail {
        background: url(../ressources/icon/envelope.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    .divIconMailN {
        background: url(../ressources/icon/envelopeN.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    .divIconAlerte {
        background: url(../ressources/icon/bell.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    .divIconAlerteN {
        background: url(../ressources/icon/bellN.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    .divIconCalendar {
        background: url(../ressources/icon/calendar.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    .divIconClock {
        background: url(../ressources/icon/signal.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    .divIconSignal {
        background: url(../ressources/icon/clock.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    .divIconGraph {
        background: url(../ressources/icon/chart-histogram.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    .divIconGraphN {
        background: url(../ressources/icon/chart-histogramN.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    .divIconPicture {
        background: url(../ressources/icon/picture.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    .divIconPictureN {
        background: url(../ressources/icon/pictureN.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    .divIconGallery {
        background: url(../ressources/icon/gallery.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    .divIconGalleryN {
        background: url(../ressources/icon/galleryN.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }


    .indexLogo {
        background: url(../ressources/logoB.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
        height: 10vw;
    }

    .profilImg1 {
        background: url(../ressources/profil/profil1.png) no-repeat !important;    
    }
    .profilImg2 {
        background: url(../ressources/profil/profil2.png) no-repeat !important;    
    }
    .profilImg3 {
        background: url(../ressources/profil/profil3.png) no-repeat !important;    
    }
    .profilImg4 {
        background: url(../ressources/profil/profil4.png) no-repeat !important;    
    }
    .profilImg5 {
        background: url(../ressources/profil/profil5.png) no-repeat !important;    
    }
    .profilImg6 {
        background: url(../ressources/profil/profil6.png) no-repeat !important;    
    }

    .divIconDPEA {
        background: url(../ressources/icon/DPE/A.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    .divIconDPEB {
        background: url(../ressources/icon/DPE/B.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    .divIconDPEC {
        background: url(../ressources/icon/DPE/C.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    .divIconDPED {
        background: url(../ressources/icon/DPE/D.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    .divIconDPEE {
        background: url(../ressources/icon/DPE/E.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    .divIconDPEF {
        background: url(../ressources/icon/DPE/F.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    .divIconDPEG {
        background: url(../ressources/icon/DPE/G.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }

    .divIconGESA {
        background: url(../ressources/icon/GES/A.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    .divIconGESB {
        background: url(../ressources/icon/GES/B.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    .divIconGESC {
        background: url(../ressources/icon/GES/C.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    .divIconGESD {
        background: url(../ressources/icon/GES/D.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    .divIconGESE {
        background: url(../ressources/icon/GES/E.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    .divIconGESF {
        background: url(../ressources/icon/GES/F.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    .divIconGESG {
        background: url(../ressources/icon/GES/G.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }

    .divIconSta1 {
        background: url(../ressources/icon/circleSta1.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    .divTextSta1{
        color : #00aaeb;
    }
    .divBackColorSta1{
        background-color: #00aaeb;
    }
    .divIconSta2 {
        background: url(../ressources/icon/circleSta2.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    .divTextSta2{
        color : #00a917;
    }
    .divBackColorSta2{
        background-color: #00a917;
    }    
    .divIconSta3 {
        background: url(../ressources/icon/circleSta3.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    .divTextSta3{
        color : #ff7800;
    }
    .divBackColorSta3{
        background-color: #ff7800;
    }
    .divIconSta4 {
        background: url(../ressources/icon/circleSta4.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    .divTextSta4{
        color : #656565;
    }
    .divBackColorSta4{
        background-color: #656565;
    }
    .divIconSta5 {
        background: url(../ressources/icon/circleSta5.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    .divTextSta5{
        background-image: linear-gradient(#00a917, #54acff);
        color: transparent;
        background-clip: text;
    }
    .divBackColorSta5{
        background: linear-gradient(to right, #00a917, #54acff);
    }

    .divIconConExt {
        background: url(../ressources/icon/conExt.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    .divIconConBai {
        background: url(../ressources/icon/conBai.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }

    .indexDesc {
        text-align: left;
        font-family: math;
        margin-left: 75px;
        padding-top: 1vw;
        font-size: 1.5vw;
    }

    .logDiv {
        background-color: #ffffff;
        box-shadow: 0px 5px 5px lightgrey;
        /*box-shadow: 0px 5px 5px #0c2241;*/
        border-radius: 5px;
        padding-top: 15px;
        padding-bottom: 15px;
    }
    .logInDiv {
        margin-bottom: 10px;
    }

    .logA {
        color: #22b14c;
        font-weight: bold;
    }
    .logA:hover {
        color: #22b14c;
        font-weight: bold;
    }

    .connexionBtn {
        color: #ffffff;
        border: 1px solid #ffffff;
        border-radius: 10px;
        background-color: #22b14c;
        height: 50px;
        font-size: large;
    }
    .newLoginBtn {
        color: #ffffff;
        border: 1px solid #ffffff;
        border-radius: 10px;
        background-color: #0E88FB;
        height: 50px;
        font-size: large;
    }

/*******************************/

    .rowHead {
        display: table;
        table-layout: fixed;
        width: 100%;
        height: 75px;
        margin: 10px 0 10px 0;
    }
    .colHeadLogo {
        display: table-cell;  
        background-color: #FB2A0E;
        width: 235px;
        min-width: 235px;
        text-align: -webkit-center ;
        text-align: center;
        vertical-align: middle;

        background: url(../ressources/logoB.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    .colHeadSearch {         
        width: 100%;
        padding-top: 22px;
    }
    .colHeadProfil {
        display: table-cell;  
        width: 225px;
        min-width: 225px;
        text-align: -webkit-center ;
        text-align: center;
        vertical-align: middle;
        border-radius: 20px;
        padding: 0 5px;
    }

    .colSearchPosition {
        color: #0e88fb;
        font-size: 2vh;
        font-weight: bold;
        font-family: cursive;
        text-align: right;
        height: 30px;
        padding-top: 1vh;
    }
    .colSearchSearch {
        background-color: #ffffff;
        height: 30px;
        border-radius: 20px;
    }
    .colSearchBtn {
        display: flex;
        float: right;
    }

    .colSearchBtnMessBtn {        
        height: 20px;
        width: 20px;
        margin: 5px;
    }
    .colSearchBtnAlerteBtn {       
        height: 20px;
        width: 20px;
        margin: 5px;
    }

    .colSearchBtnMess {
        width: 30px;
        height: 30px;
        background-color: #ffffff;
        border-radius: 20px;
        cursor: pointer;
        user-select: none;
        position: relative;
    }
    .colSearchBtnMess:hover {
        background-color: #0e88fb;
    }    
    .colSearchBtnMess:hover .colSearchBtnMessBtn {
        background: url(../ressources/icon/envelopeN.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    .colSearchBtnMess.non-lu::after,
    .colSearchBtnAlerte.non-lu::after {
        content: "";
        position: absolute;
        width: 15px;
        height: 15px;
        background-color: #e00000;
        border-radius: 50%;
        right: 0px;
        bottom: 0px;
        border: 2px solid white;
    }

    .colSearchBtnAlerte {        
        width: 30px;
        height: 30px;
        background-color: #ffffff;
        border-radius: 20px;
        margin-left: 1vw;
        cursor: pointer;
        user-select: none;
        position: relative
    }
    .colSearchBtnAlerte:hover {
        background-color: #0e88fb;
    }
    .colSearchBtnAlerte:hover .colSearchBtnAlerteBtn {
        background: url(../ressources/icon/bellN.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }

    .colProfil {
        display: flex;
        align-items: center;
        margin: 0;
        background-color: white;
        border-radius: 20px;
    }
    .colProfil.selected {
        background-color: #0e88fb;
        color: white;
    }

    .colProfil.selected .colProfilIcon {        
        background-color: white;
        color: #0e88fb;
    }

    .colProfil.selected .colProfilType {
        color: white;
    }

    .colProfilIcon {        
        height: 38px;
        border-radius: 50%;
        background-color: #0e88fb;
        color: #ffffff;
        display: flex;
        align-items: center;
        justify-content: center;
        font-weight: bold;
        margin-right: 8px;
        cursor: pointer;
        user-select: none;
    }

    .colProfilFace {
        cursor: pointer;
        user-select: none;
        line-height: 1.2;
    }

    .colProfil:hover {
        background-color: #cfe4f8;        
    }

    .colProfilNom {
        font-weight: bold;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        font-size: 15px;
    }

    .colProfilType {
        color: #777;
        font-size: 13px;
        white-space: nowrap;
    }

    .colProfilDrop {
        height: 40px;
        border-radius: 25px;
        cursor: pointer;
        user-select: none;
        font-size: 25px;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-top: 0;
    }

    .colProfilDrop:hover {
        font-size: 30px;
        color: #0183fd;
    }

    .colProdilDropModal {
        width: 200px !important;
        position: absolute !important;
        right: 40px;
        top: 55px;
        height: 10vh !important;
    }

    .modalProfilContent {
        box-shadow: none !important;
        background-color: #ffffff;
        border-color: #cfe4f8 !important;
    }

    .divContentProfil {
        padding: 15px !important;
    }

    .divContentProfilQuitBtnX {
        cursor: pointer;
        user-select: none;
        text-align: center;
        font-size: 1.5vw;
        border-radius: 10px;
        color: #0e88fb;
        border: solid #0e88fb 2px;
        height: fit-content;
        font-weight: bold;
    }

    .profilSwalBtn {
        align-items: center;
        padding: 0 20px;
        background: #fff;
        color: #0e88fb;
        border: 2px solid #0e88fb;
        border-radius: 10px;
        font-weight: 600;        
        user-select: none;    
        margin-left: 10px;    
    }
    .profilSwalBtn:hover {
        background-color: #e8f6ff;
    }

    .profilSwalTitle {
        font-weight: bold;
        color: #0e88fb;
    }
    .profilSwalCont {
        font-weight: bold;
    }
    .profilSwalValidMess {
        color: #f27474;
        font-weight: bold;
    }

/*******************************/

    .divMenuLeft {
        width: 235px;
        min-width: 235px;
        background: linear-gradient(#f8f9f9, #ffffff);
        border-radius: 15px;
        height: 85vh;
        font-weight: bold;
        position: sticky;
        display: table-cell;
    }

    .divMenuLeftItem {
        cursor: pointer;
        user-select: none;
        border-radius: 10px;
        color: #7b7e8a;
        height: 35px;    
        text-align: -webkit-center ;
        text-align: left;
        vertical-align: middle;
        padding-top: 5px;
        margin-bottom: 5px;
        margin-top: 5px;
        display: flex;
    }
    .divMenuLeftItem:hover {
        background-color: #cfe4f8;
    }
    .divMenuLeftItem.selected {
        background-color: #0E88FB;
        color: #ffffff;
    }

    .divMenuLeftItemIconParent {
        margin-top: -5px;
    }
    .divMenuLeftItemIcon {
        width: 25px;
        height: 25px;
        margin: 5px 10px 0px 10px;                
    }

    #divMenuLeftItemTdB .divMenuLeftItemIcon {
        background: url(../ressources/icon/chart-histogram.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    #divMenuLeftItemTdB.selected .divMenuLeftItemIcon{
        background: url(../ressources/icon/chart-histogramN.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    #divMenuLeftItemBie .divMenuLeftItemIcon {
        background: url(../ressources/icon/home.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    #divMenuLeftItemBie.selected .divMenuLeftItemIcon {
        background: url(../ressources/icon/homeN.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    #divMenuLeftItemLoc .divMenuLeftItemIcon {
        background: url(../ressources/icon/users.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    #divMenuLeftItemLoc.selected .divMenuLeftItemIcon {
        background: url(../ressources/icon/usersN.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    #divMenuLeftItemCon .divMenuLeftItemIcon {
        background: url(../ressources/icon/share.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    #divMenuLeftItemCon.selected .divMenuLeftItemIcon {
        background: url(../ressources/icon/shareN.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    #divMenuLeftItemFin .divMenuLeftItemIcon {
        background: url(../ressources/icon/bank.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    #divMenuLeftItemFin.selected .divMenuLeftItemIcon {
        background: url(../ressources/icon/bankN.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    #divMenuLeftItemDoc .divMenuLeftItemIcon {
        background: url(../ressources/icon/document.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    #divMenuLeftItemDoc.selected .divMenuLeftItemIcon {
        background: url(../ressources/icon/documentN.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    #divMenuLeftItemPar .divMenuLeftItemIcon {
        background: url(../ressources/icon/settings.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }
    #divMenuLeftItemPar.selected .divMenuLeftItemIcon {
        background: url(../ressources/icon/settingsN.png) no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
    }

    .divMenuLeftItemText {
        padding-top: 2px;
    }

    .divMenuLeftItemContact {    
        border-radius: 10px;
        background-color: #f2f4f7;
        height: 85px;    
        text-align: -webkit-center ;
        text-align: center;
        vertical-align: middle;
        font-size: 1vw;
        padding-top: 5px;
        margin: 10px;

        position: absolute;
        bottom: 25px;
        width: 215px;
    }

    .modal-backdrop {
        height: 0% !important;
    }

/*******************************/

    .divContentParent {
        flex: 1;
        padding: 0px 15px;
    }
    .divContent {
        height: 85vh;
        margin: 0 !important;
    }
    .divContentItem {
        margin-bottom: 2vh; 
        background-color: #ffffff;   
        border-radius: 15px;    
    }

    .divContentTDB {
        border-radius: 15px;
    }

    .divContentBie, .divContentLoc, 
    .divContentCon, .divContentProfil {
        background-color: #ffffff;
        border-radius: 15px;
    }
/**---------------------**/
    .divContentTDBResume {        
        height: 15vh;        
    }
    .divContentTDBBiens {
        height: 42vh;        
    }
    .divContentTDBSuivi {
        height: 42vh;
    }
    .divContentTDBNextLoyers {
        height: 23vh;
    }
    .divContentTDBDocRapide {
        height: 23vh;
    }
/**---------------------**/

.divContentBieGestionBar,.divContentLocGestionBar,.divContentConGestionBar {
    display: flex;
    margin-top: 1vh;
    margin-bottom: 1vh;
}
.divContentBieGestionBarAdd,.divContentLocGestionBarAdd,.divContentConGestionBarAdd {
    width: 20%;
    margin-left: 80%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;  
    padding: 0 20px;
    background: #fff;
    color: #0e88fb;
    border: 2px solid #0e88fb;
    border-radius: 10px;
    font-weight: 600;
    cursor: pointer;
    user-select: none;
    margin-bottom: 10px;
}
.divContentBieGestionBarAdd:hover,.divContentLocGestionBarAdd:hover,
.divContentConGestionBarAdd:hover,.divContentSuiDetGestionBarAdd:hover {
    background-color: #e8f6ff;
}

.divContentSuiDetGestionBarAdd {    
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;  
    padding: 0 20px;
    background: #fff;
    color: #0e88fb;
    border: 2px solid #0e88fb;
    border-radius: 10px;
    font-weight: 600;
    cursor: pointer;
    user-select: none;
    height: stretch;
    margin-bottom: 1vw;
    margin-top: 10px !important;
}
/**---------------------**/
    .divContentBieResume , 
    .divContentMess, .divContentAlerte,
    .divContentProfil {
        height: 85vh;     
        overflow: auto;         
    }

    .contentBieCell {
        /*width: 30vw;
        min-width: 315px;    
        height: 16vw;
        min-height: 195px; 
        width: 315px;  */
        height: max-content;
        cursor: pointer;    
        user-select: none;    
        border-radius: 15px;
        border: solid #f2f4f7 2px;
        margin: 0px 10px;
        margin-top: 1vh;
        min-width: 270px;
        margin-right: 20px !important;
        margin-bottom: 10px;
        background-color: #f2f4f7;
    }
    .contentBieCell:hover {
        background-color: #cfe4f8;
        border: solid #0e88fb 2px;
    }

    .contentBieCellParent {
        background-color: #f2f4f7;
    }

    .contentBieCellZ1 {
        height: 30vh;
        min-height: 180px !important;
        background-image: var(--background-image);
        background-size: cover !important;
        background-position: center !important;                      
        border-radius: 10px;
    }

    .contentBieCellZ2 {
        height: 100%;        
        font-family: system-ui;
        font-size: initial;
    }
    .divContentBieCellIcon {        
        width: 24px;        
        margin: 0px 10px 0px 0px; 
    }

    .contentBieCellZ2R1 {        
        font-weight: bold;
        padding: 3px 0px !important;
        font-size: 1vw;
    }
    .contentBieCellZ2R2,.contentBieCellZ2R3 {
        display: flex;  
    }

    .contentBieCellZ2R4,.contentBieCellZ2R5 {
        display: flex;
        padding: 6px 0px !important;     
        min-height: 36px !important;   
    }
    .contentBieCellZ2R5 {
        padding: 5px 5px !important;
        background-color: #ffffff;
        margin-top: 5px;
        border-radius: 10px;
    }
    .contentBieCellZ2R5V {
        background-color: #e9f2e7;
        border-radius: 10px;
        margin-top: 4px;
        margin-bottom: 4px;
    }
    .contentBieCellZ2R5R {
        background-color: #f2e7e7;
        border-radius: 10px;
        margin-top: 8px;
    }
    .contentBieCellZ2R2Text,.contentBieCellZ2R3Text,
    .contentBieCellZ2R4Text,.contentBieCellZ2R5Text {
        margin-top: 3px;
        font-size: 1vw;
    }
    .contentBieCellZ2Div {
        border: solid #f2f4f7 1px
    }
    .contentBieCellZ2R3Text {
        min-height: 3vw;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

    .contentBieCellCode {
        text-align: right;
        font-size: 0.7vw;
        padding-top: 5px;
    }

    .divContentLocResume {
        height: 85vh;
        overflow: auto;
    }

    .divContentConResume {
        height: 85vh;
        overflow: auto;
    }
/*******************************/

.contentLocCell {
    /*width: 30vw;
    min-width: 315px;    
    height: 16vw;
    min-height: 195px; 
    width: 315px;  */
    height: max-content;
    cursor: pointer;        
    border-radius: 15px;
    border: solid #f2f4f7 2px;
    margin: 0px 10px;
    margin-top: 1vh;
    min-width: 270px;
    margin-right: 20px !important;
    margin-bottom: 10px;
    background-color: #f2f4f7;
}
.contentLocCell:hover {
    background-color: #cfe4f8;
    border: solid #0e88fb 2px;
}

.contentLocCellZ1 {
    height: 27vh;
    min-height: 180px !important;
    /*background: url(../ressources/profil/profil1.png) no-repeat !important;*/
    background-size: cover !important;
    background-position: center !important;                      
    border-radius: 10px;
}

.contentLocCellZ2 {
    height: 100%;        
    font-family: system-ui;
    font-size: initial;
}
.divcontentLocCellIcon {        
    width: 24px;        
    margin: 0px 10px 0px 0px; 
}

.contentLocCellZ2R1 {        
    font-weight: bold;
    padding: 3px 0px !important;
    font-size: 1vw;
}
.contentLocCellZ2R2,.contentLocCellZ2R3,
.contentLocCellZ2R4,.contentLocCellZ2R5 {
    display: flex;
    padding: 6px 0px !important;     
    min-height: 36px !important;   
}
.contentLocCellZ2R5 {
    padding: 5px 5px !important;
    background-color: #ffffff;
    margin-top: 5px;
    border-radius: 10px;
}
.contentLocCellZ2R5V {
    background-color: #e9f2e7;
    border-radius: 10px;
    margin-top: 4px;
    margin-bottom: 4px;
}
.contentLocCellZ2R5R {
    background-color: #f2e7e7;
    border-radius: 10px;
    margin-top: 8px;
}
.contentLocCellZ2R2Text,.contentLocCellZ2R3Text,
.contentLocCellZ2R4Text,.contentLocCellZ2R5Text {
    margin-top: 3px;
    font-size: 1vw;
}
.contentLocCellZ2Div {
    border: solid #f2f4f7 1px
}

.contentLocCellCode {
    text-align: right;
    font-size: 0.7vw;
    padding-top: 5px;
}

/*******************************/

/*******************************/
#contentConCell3 {
    margin-right: 20px !important;
    margin-bottom: 10px;
}
.contentConCell {
    height: max-content;
    cursor: pointer;        
    border-radius: 15px;
    border: solid #f2f4f7 2px;
    min-width: 270px;
    background-color: #f2f4f7;
    padding: 5px 0px;
    margin-right: 20px !important;
    margin-bottom: 10px;
}
.contentConCell:hover {
    background-color: #cfe4f8;
    border: solid #0e88fb 2px;
}
.divContentConResume .row > .col-sm-4 {
    padding: 0px 15px;
    margin-bottom: 10px;
}

.contentConCellLeftPart {
    background-color: #fdfdfd;
    border-radius: 15px; 
}

.contentConCellZ1 {
    height: 15vh !important;
}

.contentConCellZ2 {
    height: 100%;        
    font-family: system-ui;
    font-size: initial;
}
.divcontentConCellIcon {        
    width: 24px;        
    margin: 0px 10px 0px 0px; 
}

.contentConCellZ1R1 {
    padding: 1px 3px !important;
    background-color: #f2f4f7;
    margin-top: 5px;
    margin-bottom: 5px;
    border-radius: 10px;
    font-weight: bold;
    font-size: 1vw;
}
.contentConCellZ1R2Text {
    font-weight: bold;
    padding: 3px 0px !important;
    font-size: 0.9vw;
    background-color: #f2f4f7;
    border-radius: 10px;
}

.contentConCellZ2R1 {        
    font-weight: bold;
    padding: 3px 0px !important;
    font-size: 1vw;
}
.contentConCellZ2R2,.contentConCellZ2R3,
.contentConCellZ2R4,.contentConCellZ2R5 {
    display: flex;
    padding: 6px 0px !important;     
    min-height: 36px !important;   
}
.contentConCellZ2R5 {
    padding: 5px 5px !important;
    background-color: #ffffff;
    margin-top: 5px;
    border-radius: 10px;
}
.contentConCellZ2R5V {
    background-color: #e9f2e7;
    border-radius: 10px;
    margin-top: 4px;
    margin-bottom: 4px;
}
.contentConCellZ2R5R {
    background-color: #f2e7e7;
    border-radius: 10px;
    margin-top: 8px;
}
.contentConCellZ2R2Text,.contentConCellZ2R3Text,
.contentConCellZ2R4Text,.contentConCellZ2R5Text {
    margin-top: 3px;
    font-size: 0.9vw;
}
.contentConCellZ2Div {
    border: solid #f2f4f7 1px
}

.contentConCellCode {
    text-align: right;
    font-size: 0.7vw;
    padding-top: 5px;
}

.modalFormConGesLocLoyLabelTitre {
    background-color: #e0e1e3;
    color: #0e88fb;
    border-radius: 8px 8px 0 0;
    margin-bottom: 2vh;
    font-size: 3vh;
}

#modalFormConGesLocLoyDivTable tr.trVert {
    background-color: #b1ffaa !important;
}
#modalFormConGesLocLoyDivTable tr.trOrange {
    background-color: #f7ffaa;
}
/*******************************/

.divContentBieResResume {
    height: 85vh;
    background-color: white;
    border-radius: 15px;
}

.divContentBieResCellIcon {
    height: 24px;
}
.divContentBieResCellIconText {
    text-align: right;
    height: 2vw;
    align-content: center;
}

.contentBieResCellDiv {
    margin: 2px;
}

.divBieResBienContentItemTitle, .divBieResStaContentItemTilte,
.divBieResImmContentItemTitle, .divBieResDocContentItemTitle,
.divBieResPhoContentItemTitle {
    color: #0e88fb;
    font-size: 1.8vw;
    text-align: left;
    font-weight: bold;
}
.divBieResBienContentItem, .divBieResImmContentItem,
.divBieResConContentItem {
    padding-top: 3px;   
    background-color: rgba(255, 255, 255, 0.8); 
    font-size: 1vw;
}
.divBieResStaContentItemTilte {
    color: white;
    text-align: center;
}
.divBieResStaConContentItemTilte {
    color: white;
    font-size: 1.5vw;
    text-align: left;
    font-weight: bold;
}
.divBieResImmContentItemTitle2 {
    font-size: 1.5vw;
    text-align: center;
}
.divBieResStaContentBtn {
    height: 4vh;
    margin-top: 2px;
    border: 2px solid;
    border-radius: 5px;
    cursor: pointer;
    background: url(../ressources/icon/infoN.png) no-repeat !important;
    background-size: contain !important;
    background-position: center !important;
}
.divBieResStaContentBtn:hover {
    background-color: #0e88fb !important;
}

.divBieResBien {
    height: 52vh;
    padding-bottom: 2vh;
}
.divBieResBienContent {
    border-radius: 15px;
    cursor: pointer;
    user-select: none;
    padding: 12px;
    padding-top: 5px;
    margin-top: 1vh;
    border: solid #f2f4f7 5px;
    text-align: left;
    font-weight: bold;    
    background-size: cover !important;
    background-position: center !important;
    background-blend-mode: lighten;
}
.divBieResBienContent:hover {    
    filter: brightness(0.98);
    background-color: #cfe4f8;
    border: solid #0e88fb 5px;
}

.divBieResStaImm {
    height: 52vh;    
}

.divBieResSta {
    height: 9vh; 
    padding-bottom: 1vh;  
}

.divBieTitleContent {  
    border-radius: 15px;
    /*cursor: pointer;*/
    padding: 10px;
    margin-top: 1vh;
    border: solid #f2f4f7 5px;     
    background-color: #e2e2e2;    
    color: #0e88fb;
    font-size: 2vw;
    text-align: left;
    font-weight: bold;  
}
.divBieResStaContent {  
    border-radius: 15px;
    /*cursor: pointer;*/
    user-select: none;
    padding: 10px;
    margin-top: 1vh;
    border: solid #f2f4f7 5px;           
}
.divBieResImm {
    height: 30vh;
    padding-top: 1vh;
}
.divBieResImmContent {    
    height: 100%;
    border-radius: 15px;
    cursor: pointer;
    user-select: none;
    padding: 12px;
    padding-top: 5px;
    margin-top: 1vh;
    border: solid #f2f4f7 5px;
    background: url(../ressources/back/backDesk2.jpg) no-repeat !important;
    background-size: cover !important;
    background-position: center !important;
    background-blend-mode: lighten;
}
.divBieResImmContent:hover {   
    filter: brightness(0.98); 
    background-color: #cfe4f8;
    border: solid #0e88fb 5px;
}
.divBieResImmContentItem {
    font-weight: bold;
}
.divBieResDoc {
    height: 30vh;
    padding-top: 1vh;
}
.divBieResDocContent {
    background-color: #ffffff;
    height: 100%;
    border-radius: 15px;    
    padding-top: 5px;
    margin-top: 1vh;
    border: solid #f2f4f7 5px;  
    font-size: 1vw;
    padding-bottom: 1vh;
    padding: 0px 10px;
    background: url(../ressources/back/backDesk.jpg) no-repeat !important;
    background-size: cover !important;
    background-position: center !important;
    background-blend-mode: lighten;
    cursor: pointer;
    user-select: none;
}
.divBieResPho {
    height: 30vh;
    padding-top: 1vh;
}
.divBieResPhoContent {
    background-color: #e2e2e2;
    height: 100%;
    border-radius: 15px;
    padding: 12px;
    padding-top: 5px;
    margin-top: 1vh;
    border: solid #f2f4f7 5px;   
    cursor: pointer;
    user-select: none;
}

.divBieResImgAnnexes {
    display: grid;
    gap: 8px;
}

.divBieResImgAnnexe {
    width: 100%;
    height: 10vh;
    overflow: hidden;
    border-radius: 4px;
}

.divBieResPhotos1 .divBieResImgAnnexe {
    height: 20vh;
}

.divBieResImgAnnexeImg {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.divBieResPhotos1 {
    grid-template-columns: 1fr;
}

.divBieResPhotos2 {
    grid-template-columns: repeat(2, 1fr);
}

.divBieResPhotos3 {
    grid-template-columns: repeat(3, 1fr);
}

.divBieResPhotos4 {
    grid-template-columns: repeat(2, 1fr);
}

.divBieResPhotos5,
.divBieResPhotos6 {
    grid-template-columns: repeat(3, 1fr);
}

/******************************---------------------------------------*/


.divContentLocResCellIcon {
    height: 24px;
}
.divContentLocResCellIconText {
    text-align: right;
    height: 2vw;
    align-content: center;
}

.contentLocResCellDiv {
    margin: 2px;
}

.divLocResLocContentItemTitle, .divLocResStaContentItemTilte,
.divLocResStaConContentItemTilte,.divLocResCauSolContentItemTitle,
.divLocResDocContentItemTitle, .divLocResPhoContentItemTitle {
    color: #0e88fb;
    font-size: 1.8vw;
    text-align: left;
    font-weight: bold;
}
.divLocResPhoContentItemTitle {
    font-size: 1.5vw;
}
.divLocResLocContentItem {
    padding-top: 3px;   
    background-color: rgba(255, 255, 255, 0.8); 
    font-size: 1vw;
}
.divLocResStaContentItemTilte {
    color: white;
    text-align: center;
}
.divLocResStaConContentItemTilte  {
    color: white;
    font-size: 1.5vw;
    text-align: left;
    font-weight: bold;
}
.divLocResCauSolContentItemTitle2 {
    font-size: 1.5vw;
    text-align: center;
}
.divLocResStaContentBtn {
    height: 4vh;
    margin-top: 2px;
    border: 2px solid;
    border-radius: 5px;
    cursor: pointer;
    user-select: none;
}
.divLocResStaContentBtn:hover {
    background-color: #0e88fb !important;
}

.divLocResLoc {
    height: 52vh;
    padding-bottom: 2vh;
}
.divLocResLocContent {
    /*background-color: #ffffff;*/
    height: 40vh;
    border-radius: 15px;
    cursor: pointer;
    user-select: none;
    padding: 12px;
    padding-top: 5px;
    margin-top: 1vh;
    border: solid #f2f4f7 5px;
    text-align: left;
    font-weight: bold;
    background: url(../ressources/back/sheet.jpg) no-repeat !important;
    background-size: cover !important;
    background-position: center !important;
    background-blend-mode: lighten;
}
.divLocResLocContent:hover {    
    filter: brightness(0.98);
    background-color: #cfe4f8;
    border: solid #0e88fb 5px;
}

.divLocResStaCauSol {
    height: 52vh;    
}

.divLocResSta {
    height: 9vh; 
    padding-bottom: 1vh;  
}

.divLocResStaContent {        
    border-radius: 15px;
    /*cursor: pointer;*/
    user-select: none;
    padding: 10px;
    margin-top: 1vh;
    border: solid #f2f4f7 5px;           
}
.divLocResCauSol {
    height: 30vh;
    padding-top: 1vh;
}
.divLocResCauSolContent {    
    height: 100%;
    border-radius: 15px;
    cursor: pointer;
    user-select: none;
    padding: 12px;
    padding-top: 5px;
    margin-top: 1vh;
    border: solid #f2f4f7 5px;
    background: url(../ressources/back/backDesk3.jpg) no-repeat !important;
    background-size: cover !important;
    background-position: center !important;
    background-blend-mode: lighten;
}
.divLocResCauSolContent:hover {   
    filter: brightness(0.98); 
    background-color: #cfe4f8;
    border: solid #0e88fb 5px;
}
.divLocResCauSolContentItem {
    font-weight: bold;
}
.divLocResDoc {
    height: 30vh;
}
.divLocResDocContent {
    background-color: #ffffff;
    height: 100%;
    border-radius: 15px;    
    padding-top: 5px;
    margin-top: 1vh;
    border: solid #f2f4f7 5px;  
    font-size: 1vw;
    padding-bottom: 1vh;
    padding: 0px 10px;
    background: url(../ressources/back/backDesk.jpg) no-repeat !important;
    background-size: cover !important;
    background-position: center !important;
    background-blend-mode: lighten;
    cursor: pointer;
    user-select: none;
}
.divLocResPho {
    height: 31vh;
    padding-top: 1vh;
}
.divLocResPhoContent {
    background-color: #e2e2e2;
    height: 100%;
    border-radius: 15px;
    padding: 12px;
    padding-top: 5px;
    margin-top: 1vh;
    border: solid #f2f4f7 5px;   
    cursor: pointer;
    user-select: none;
}
.divLocResPhoContentImg,
.divBieResImgContentImg {
    height: 22vh; 
    border-radius: 10px; 
    display: block; 
    margin: auto;
    border:solid #f2f4f7 2px;    
}
.divLocResPhoContent:hover,
.divBieResPhoContent:hover,
.divBieResDocContent:hover,
.divLocResDocContent:hover,
.divConResDocContent:hover {
    border:solid #0e88fb 5px;
}

/*******************************/

.divContentConResCellIcon {
    height: 24px;
}
.divContentConResCellIconText {
    text-align: right;
    height: 2vw;
    align-content: center;
}

.contentConResCellDiv {
    margin: 2px;
}

.divConResConContentItemTitle, .divConResDocContentItemTitle,
.divConResLocContentItemTitle, .divConResBieContentItemTitle {
    color: #0e88fb;
    font-size: 1.8vw;
    text-align: left;
    font-weight: bold;
}
.divConResConContentItem {
    padding-top: 1px;   
    padding-bottom: 1px;   
    background-color: rgba(255, 255, 255, 0.8); 
    font-size: 1vw;
}
.divConResConContentItemR { 
    background-color: #ffaaaa;
}
.divConResConContentItemG { 
    background-color: #aaffba;
}
.divConResStaContentItemTilte {
    color: white;
}
.divConResStaConContentItemTilte  {
    color: white;
    font-size: 1.5vw;
    text-align: left;
    font-weight: bold;
}
.divConResCauSolContentItemTitle2 {
    font-size: 1.5vw;
    text-align: center;
}
.divConResStaContentBtn {
    height: 4vh;
    margin-top: 2px;
    border: 2px solid;
    border-radius: 5px;
    cursor: pointer;
    user-select: none;
}
.divConResStaContentBtn:hover {
    background-color: #0e88fb !important;
}

.divConResLoc {
    height: 52vh;
    padding-bottom: 2vh;
}
.divConResConContent {
    /*background-color: #ffffff;*/  
    cursor: pointer;
    user-select: none;  
    height: 50%;
    border-radius: 15px;
    padding: 12px;
    padding-top: 5px;
    margin-top: 1vh;
    border: solid #f2f4f7 5px;
    text-align: left;
    font-weight: bold;
    background: url(../ressources/back/sheet.jpg) no-repeat !important;
    background-size: cover !important;
    background-position: center !important;
    background-blend-mode: lighten;
}
.divConResConContent:hover {    
    filter: brightness(0.98);
    background-color: #cfe4f8;
    border: solid #0e88fb 5px;
}
.divConResLocContent {
    /*background-color: #ffffff;*/ 
    cursor: pointer;
    user-select: none;   
    height: 50%;
    border-radius: 15px;
    padding: 12px;
    padding-top: 5px;    
    margin: 0px !important;
    border: solid #f2f4f7 5px;    
    text-align: left;
    font-weight: bold;
    background-color: #e0e1e3;
}
.divConResLocContent:hover {    
    filter: brightness(0.98);
    background-color: #cfe4f8;
    border: solid #0e88fb 5px;
}
.divConResBieContent {
    /*background-color: #ffffff;*/
    cursor: pointer;
    user-select: none;
    height: 50%;
    border-radius: 15px;
    padding: 12px;
    padding-top: 5px;
    margin: 1vh 0px 0px 0px !important;
    border: solid #f2f4f7 5px;
    text-align: left;
    font-weight: bold;
    background-color: #e0e1e3;
}
.divConResBieContent:hover {    
    filter: brightness(0.98);
    background-color: #cfe4f8;
    border: solid #0e88fb 5px;
}
.divConResGesContent {
    /*background-color: #ffffff;*/
    height: 50%;
    border-radius: 15px;
    cursor: pointer;
    user-select: none;
    padding: 12px;
    padding-top: 5px;
    margin-top: 1vh;
    border: solid #f2f4f7 5px;
    text-align: left;
    font-weight: bold;
    background: url(../ressources/back/backDesk4.jpg) no-repeat !important;
    background-size: cover !important;
    background-position: center !important;
    background-blend-mode: lighten;
}
.divConResGesContent:hover {    
    filter: brightness(0.98);
    background-color: #cfe4f8;
    border: solid #0e88fb 5px;
}
.divConResFinContent {
    /*background-color: #ffffff;*/
    height: 95%;
    border-radius: 15px;
    cursor: pointer;
    user-select: none;
    padding: 12px;
    padding-top: 5px;
    margin-top: 1vh;
    border: solid #f2f4f7 5px;
    text-align: left;
    font-weight: bold;
    background: url(../ressources/back/backDesk3.jpg) no-repeat !important;
    background-size: cover !important;
    background-position: center !important;
    background-blend-mode: lighten;
}
.divConResFinContent:hover {    
    filter: brightness(0.98);
    background-color: #cfe4f8;
    border: solid #0e88fb 5px;
}
.divConResStaCauSol {
    height: 52vh;    
}

.divConResSta {
    height: 9vh; 
    padding-bottom: 1vh;  
}

.divConResStaContent {        
    border-radius: 15px;
    /*cursor: pointer;*/
    user-select: none;
    padding: 10px;
    margin-top: 1vh;
    border: solid #f2f4f7 5px;           
}
.divConResLocBie {
    height: 42vh;
    padding-top: 1vh;
}
.divConResCauSolContent {    
    height: 100%;
    border-radius: 15px;
    cursor: pointer;
    user-select: none;
    padding: 12px;
    padding-top: 5px;
    margin-top: 1vh;
    border: solid #f2f4f7 5px;
    background: url(../ressources/back/backDesk3.jpg) no-repeat !important;
    background-size: cover !important;
    background-position: center !important;
    background-blend-mode: lighten;
}
.divConResCauSolContent:hover {   
    filter: brightness(0.98); 
    background-color: #cfe4f8;
    border: solid #0e88fb 5px;
}
.divConResCauSolContentItem {
    font-weight: bold;
}
.divConResDoc {
    height: 30vh;
}
.divConResDocContent {
    background-color: #ffffff;
    height: 100%;
    border-radius: 15px;    
    padding-top: 5px;
    margin-top: 1vh;
    border: solid #f2f4f7 5px;  
    font-size: 1vw;
    padding-bottom: 1vh;
    padding: 0px 10px;
    background: url(../ressources/back/backDesk.jpg) no-repeat !important;
    background-size: cover !important;
    background-position: center !important;
    background-blend-mode: lighten;
    cursor: pointer;
    user-select: none;
}

.divConResLocContentImg {
    /*background: url(../ressources/profil/profil1.png) no-repeat !important;*/
    background-size: cover !important;
    background-position: center !important;
}
.divConResBieContentImg {
    background-image: var(--background-image);
    background-size: cover !important;
    background-position: center !important;
}

#modalFormConvContent {
    height: 80vh ;
}

#modalFormConvContentTitre {
    padding-left: 8px !important;
}

.divContentConvGestionBarAdd {    
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;  
    padding: 0 20px;
    background: #fff;
    color: #0e88fb;
    border: 2px solid #0e88fb;
    border-radius: 10px;
    font-weight: 600;
    cursor: pointer;
    user-select: none;
    margin-top: 5px;
}
.divContentConvGestionBarAdd:hover {
    background-color: #e8f6ff;;
}

#modalFormConvContentDivConv, #modalFormConvContentDivMsg {
    overflow: auto;
}
#modalFormConvContentDivMsg {
    background-color: #f2f4f7;
    border-radius: 5px;
    height: 75vh;
}

.modalFormConvContentDivConvDiv {    
    border-bottom: solid 1px #ddd8d8;
    height: 8vh;
    padding-top: 5px;
    padding-bottom: 5px;
    min-height: 50px;
    overflow: hidden;
}

.modalFormConvContentDivConvList {
    padding-right: 0 !important;
}

.modalFormConvContentDivMsgHeader {
    height: 8vh;
    background-color: white;
    border-bottom: solid 1px #ddd8d8;
    min-height: 50px;
    overflow: hidden;
}

.modalFormConvContentDivMsgList {
    height: calc(70vh - 5vh);
    overflow-y: auto;
    overflow-x: hidden;
    padding: 10px;
    padding-top: 15px;
    padding-bottom: 15px;    
}

.modalFormConvDivConvCase {
    border-bottom: solid 1px #ddd8d8;
    padding-bottom: 3px;
    padding-top: 3px;
    height: fit-content; 
    cursor: pointer;
    user-select: none;
}
.modalFormConvDivConvCase:hover {
    background-color: #cae2f8 !important;
}
.modalFormConvDivConvCase.selected {
    background-color: #f2f4f7;
}

.modalFormConvDivConvCaseHeader {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
}
.modalFormConvDivConvCaseObj {
    flex: 1;
    font-size: larger;
    font-weight: bold;
    color: #0e88fb;
    line-height: 1.4em;
    overflow: hidden;
}

.modalFormConvDivConvCaseDate {
    white-space: nowrap;
    margin-left: 10px;
    color: #797979;
    font-size: small;
}
.modalFormConvDivConvCaseNom {
    color: #797979;
}

.modalFormConvContentDivMsgHeader1 {
    color: #0e88fb;
    align-content: center;
    font-weight: bold;
    font-size: xx-large;
}
.modalFormConvContentDivMsgHeader2 {
    color: #797979;
    align-content: center;
    text-align: right;
}

.modalFormConvDivConvCaseMsg {
    background-color: white;
    border-radius: 8px;
    padding: 10px 15px;
    flex: 0 0 auto; /* MODIF */
    height: fit-content;
    width: 65% !important;    
    max-width: 65%;
    margin-bottom: 20px !important;
    display: flex;
    flex-direction: column;
}

.modalFormConvDivConvCaseMsgRight {
    margin-left: 35%;
}

.modalFormConvDivConvCaseMsgHeader {
    margin-bottom: 10px;
    margin-left: 0px;
}
.modalFormConvDivConvCaseMsgEmet {
    color: #0e88fb;
    font-weight: bold;
}
.modalFormConvDivConvCaseMsgDate {
    color: #797979;
    align-content: center;
    text-align: right;
    font-size: small;
}
.modalFormConvDivConvCaseMsgCont {
    white-space: pre-wrap;
    overflow-wrap: break-word;
}

#modalFormConvDivConvCaseMsgRep {
    resize: none;
    overflow-y: hidden;
}
.modalFormConvDivConvCaseMsgBtnSend {
    width: fit-content;
    align-self: flex-end;
    cursor: pointer; 
    background-color: #0e88fb;
    color: white;
    border-radius: 10px;
    padding: 0px 5px;
    border: solid 2px #0e88fb;
    margin-top: 5px;
}
.modalFormConvDivConvCaseMsgBtnSend:hover {
    background-color: white;
    color: #0e88fb ; 
}

#modalFormConvNewObjet {
    color: #0e88fb !important;
    font-weight: bold !important;
    margin: 0 !important;
}
#modalFormConvNewObjet::placeholder {
	color: #c90202 !important;
	opacity: 1;
}
#modalFormConvNewDest {
    width: stretch !important;
    margin: 0 !important;
    overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

/*******************************/


#modalFormConLocDivTable tr,
#modalFormConBieDivTable tr,
#modalFormConGesLocLoyDivTable tbody tr,
#ModalFormDocDocDivTable tbody tr,
#divContentDocDocDivTable tbody tr,
#dataTableContentFinDetail tbody tr {
    cursor: pointer;
}
#modalFormConLocDivTable .selected,
#modalFormConBieDivTable .selected,
#divContentDocDocDivTable .selected,
#dataTableContentFinDetail .selected{
    background-color: #7dc0ff;
    color: white;
}
#modalFormConGesLocLoyDivTable .selected {
    background-color: #e0e1e3;
    color: #0e88fb;
   /* font-weight: bold;*/
}

#ModalFormDocDocDivTable .selected,
#divContentDocDocDivTable .selected {
    background-color: #7dc0ff;
    color: white;
   /* font-weight: bold;*/
}

.modalFormConLocDivCase,
.modalFormConBieDivCase,
.modalFormConGesLocLoyDivCase {
    border:solid #8bc7ff 2px;
    border-radius: 10px; 
}
#modalFormConGesLocLoyDivTable tbody tr:hover,
#ModalFormDocDocDivTable tbody tr:hover {
    background-color: #bcdefd;
}

.modalFormConGesLocLoyDivCase {
    padding-bottom: 3vh;
}
.modalFormConLocDivCaseImg {
    /*background: url(../ressources/profil/profil1.png) no-repeat !important;    */
    background-position: center !important;    
    height: 25vh;
}
.modalFormConBieDivCaseImg {
    background-image: var(--background-image);
    background-position: center !important;    
    background-size: cover !important;
    height: 25vh;
}

.modalFormConGesLocLoyDivCasePDF {
    border: solid 3px #8bc7ff;
    border-radius: 8px;
    margin-top: 2vh !important;
    cursor: pointer;
    user-select: none;
}
.modalFormConGesLocLoyDivCasePDF:hover {
    filter: brightness(0.98);
    background-color: #eaf2f9;
}
.modalFormConGesLocLoyDivCasePDFImg {
    background: url(../ressources/icon/pdf.png) no-repeat !important;
    background-position: center !important;
    height: 10vh;
}

/*******************************/

.divContentBLCResume {
    height: 85vh;
    background-color: white;
    border-radius: 15px;
}

.divContentBLCCellIcon {
    height: 24px;;
}
.divContentBLCCellIconText {
    text-align: right;
    height: 2vw;
    align-content: center;
}

.contentBLCCellDiv {
    margin: 2px;
}

.divBLCBienContentItemTitle, .divBLCLocContentItemTilte,
.divBLCConContentItemTitle, .divBLCDepContentItemTitle,
.divBLCDocContentItemTitle {
    color: #0e88fb;
    font-size: 1.8vw;
    text-align: left;
    font-weight: bold;
}
.divBLCBienContentItem, .divBLCLocContentItem,
.divBLCConContentItem {
    padding-top: 3px;   
    background-color: rgba(255, 255, 255, 0.8); 
}

.divBLCBien {
    height: 52vh;
    padding-bottom: 2vh;
}
.divBLCBienContent {
    /*background-color: #ffffff;*/
    height: 100%;
    border-radius: 15px;
    cursor: pointer;
    user-select: none;
    padding: 12px;
    padding-top: 5px;
    margin-top: 1vh;
    border: solid #f2f4f7 5px;
    text-align: left;
    font-weight: bold;
    background-image: var(--background-image);
    background-size: cover !important;
    background-position: center !important;
    background-blend-mode: lighten;
}
.divBLCBienContent:hover {    
    filter: brightness(0.98);    
    border: solid #0e88fb 5px;
}

.divBLCLocCon {
    height: 52vh;    
}

.divBLCLoc {
    height: 25vh; 
    padding-bottom: 1vh;  
}

.divBLCLocContent {    
    height: 100%;
    border-radius: 15px;
    cursor: pointer;
    user-select: none;
    padding: 12px;
    padding-top: 5px;
    margin-top: 1vh !important;
    margin-left: 0 !important;
    border: solid #f2f4f7 5px;    
    background-color: #d9dee2;
    font-weight: bold;
}
.divBLCLocContent:hover {    
    filter: brightness(0.98);
    background-color: #cfe4f8;
    border: solid #0e88fb 5px;
}
.divBLCCon {
    height: 25vh;
    padding-top: 1vh;
}
.divBLCConContent {    
    height: 100%;
    border-radius: 15px;
    cursor: pointer;
    user-select: none;
    padding: 12px;
    padding-top: 5px;
    margin-top: 1vh;
    border: solid #f2f4f7 5px;
    background: url(../ressources/back/sheet.jpg) no-repeat !important;
    background-size: cover !important;
    background-position: center !important;
    background-blend-mode: lighten;
    font-weight: bold;
}
.divBLCConContent:hover {   
    filter: brightness(0.98); 
    background-color: #cfe4f8;
    border: solid #0e88fb 5px;
}
.divBLCConContentImg {
    /*background: url(../ressources/profil/profil1.png) no-repeat !important;*/
    background-size: cover !important;
    background-position: center !important;
}
.divBLCDep {
    height: 30vh;
    padding-top: 1vh;
}
.divBLCDepContent {    
    height: 100%;
    border-radius: 15px;    
    padding-top: 5px;
    margin-top: 1vh;
    border: solid #f2f4f7 5px;  
    font-size: 1vw;
    padding-bottom: 1vh;
    padding: 0px 10px;    
    background: url(../ressources/back/backDesk2.jpg) no-repeat !important;
    background-size: cover !important;
    background-position: center !important;
}
.divBLCDoc {
    height: 30vh;
    padding-top: 1vh;
}
.divBLCDocContent {
    background-color: #ffffff;
    height: 100%;
    border-radius: 15px;
    padding: 12px;
    padding-top: 5px;
    margin-top: 1vh;
    border: solid #f2f4f7 5px;   
    background: url(../ressources/back/backDesk.jpg) no-repeat !important;
    background-size: cover !important;
    background-position: center !important;
}
#dataTableBLCDepense {
    width: 100% !important;
}
#dataTableBLCDepense_length {
    display: none;
}

#modalFormBieDoc {
    font-size: 1vw;
}
.contentmodalBieDiv {
    margin: 5px;
    height: 2px;
    background: linear-gradient(to right, white, #54acff);
}

/*******************************/
/*  MODAL  FORM                */
/*******************************/

.modalForm {
    max-width: 90% !important;
    width: 90% !important;
}

.modalFormTitre {
    color: #0e88fb;
    font-size: 2vw;
    text-align: left;
    font-weight: bold;
    margin-bottom: 10px;
    padding-left: 2vw !important;
    user-select: none;
}
.modalFormTitre2 {
    background: linear-gradient(to right, #54acff, white);    
    color: white;
    font-size: 1.5vw;
    text-align: left;
    font-weight: bold;
    padding: 5px;
    border-radius: 10px 0 0 0;
    user-select: none;
}
.modalFormTitre3 {
    background: linear-gradient(to right,white, #54acff);    
    color: white;
    font-size: 1.5vw;
    text-align: right;
    font-weight: bold;
    padding: 5px;
    justify-content: right;
    border-radius: 0 10px 0 0;
    user-select: none;
}
.modalFormTitre2Icon {        
    width: 24px;
    height: 24px;
    margin: 0px 10px 0px 0px; 
}
.modalFormTitre3Icon {        
    width: 24px;
    height: 24px;
    margin: 0px 0px 0px 10px; 
}

#modalFormBody {
    /*font-size: 1.2vw;*/
}
.modalFormBody2 {
    padding: 5px;
}

#modalFormBody input {
    margin: 0px 15px;
    width: inherit;
    height: fit-content;
    font-weight: normal;
}
#modalFormBody select {
    margin-left: 2vw;
    height: auto;
    width: auto;
    font-weight: normal;
}

.modalFormBieRow, .modalFormLocRow, .modalFormConRow,
.modalFormLocCauSolRow, .modalFormDocRow, 
.formProfilRow, .modalFormOpeRow {    
    padding: 5px;
}

#modalFormDocDivAdd {
    border-left: solid 2px #d7ecff;
    margin-bottom: 3vh;
}
#modalFormDocInputTypDocSelect {
    max-width: 100%;
    box-sizing: border-box;
    margin-left: 1vw !important;
}

#ModalFormDocDocDivCase {
    margin-top: 1vh;
    border: solid #8bc7ff 2px;
    border-radius: 10px;
    margin-left: 0;
}

.modalFormDocDivCaseImg {
    border: solid 3px #8bc7ff;
    border-radius: 8px;
    margin-top: 2vh !important;
    cursor: pointer;
    user-select: none;
}
.modalFormDocDivCaseImg:hover {
    filter: brightness(0.98);
    background-color: #eaf2f9;
}
.modalFormDocDivCaseImgLink {
    background: url(../ressources/icon/openFile.png) no-repeat !important;
    background-position: center !important;
    height: 12vh;
    width: 10vw;
}

.expandable {  
    overflow: hidden;
    transition: all .5s ease-in-out;
    height: 0;
    line-height: 0;
    padding: 0 1em;
    color: transparent;
}
.expandable input {
    border: transparent ;
}
.expandable:target {
    line-height: normal ;
    color: black ;
    height: auto ;
}
.expandable:target input {
    border: solid #7b7e8a  1px ;
}

.modalFormQuitBtn {
        width: 15%;
        cursor: pointer;
        user-select: none;
        text-align: center;
        font-size: 1.5vw;
        border-radius: 10px;
        color: #cba100;
        border: solid #f5d105 2px;
        height: fit-content;
    }
.modalFormQuitBtn:hover {
    background-color: #d3b3001c;
}

.modalFormQuitBtnX {
    cursor: pointer;
    user-select: none;
    text-align: center;
    font-size: 1.5vw;
    border-radius: 10px;
    color: #0e88fb;
    border: solid #0e88fb 2px;
    height: fit-content;
    font-weight: bold;
    width: auto !important;
}
.modalFormQuitBtnX:hover {        
    background-color: #a1d1ff;    
}

.resumeContentQuitBtnX {
    cursor: pointer;
    user-select: none;
    text-align: center;
    font-size: 1.5vw;
    border-radius: 10px;
    color: #0e88fb;
    border: solid #0e88fb 2px;
    height: fit-content;
    font-weight: bold;
    margin-top: 1.5vw !important;   
}
.resumeContentQuitBtnX:hover {        
    background-color: #a1d1ff;    
}

.bailGoBtnBase {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    /*min-width: 178px; */   
    padding: 0 20px;
    background: #fff;
    color: #0e88fb;
    border: 2px solid #0e88fb;
    border-radius: 10px;
    font-weight: 600;
    cursor: pointer;
    user-select: none;
    margin-bottom: 10px;
}
.bailGoBtnBase:hover {
    background: #e8f6ff;
}

#divContentDocFilterBien,
#divContentDocFilterLocataire,
#divContentDocFilterContrat {
    margin-left: 10px;
    margin-top: 10px;
}

.contentDocDivDetailLabel {
    margin-bottom: 3px;
    font-size: 1.2vh;
}
.contentDocDivDetailValue {
    min-height: 34px;
    padding: 6px 10px;
    margin-bottom: 10px;
    border-radius: 6px;
    background-color: #f5f5f5;    
    word-break: break-word;
    text-align: center;
}
.docInfoValue2Line {
    min-height: 60px;
}

.contentDocDivDetailCaseImg {
    border: solid 3px #8bc7ff;
    border-radius: 8px;
    cursor: pointer;
    user-select: none;
}
.contentDocDivDetailCaseImg:hover {
    filter: brightness(0.98);
    background-color: #eaf2f9;
}
.contentDocDivDetailCaseImgLink {
    background: url(../ressources/icon/openFile.png) no-repeat !important;
    background-position: center !important;
    height: 10vh;
}

.divContentFin {
    height: 79vh;
    background-color: white;
    border-radius: 15px;
    font-size: 1vw;
}

.divContentFinTab {
    background-color: white;
    border-radius: 15px;
    font-weight: bold;
    text-align: center;
    height: 4vh;
    margin-bottom: 1vh;
    align-content: center;
    cursor: pointer;
    user-select: none;
}
.divContentFinTab:hover {
    background-color: #cfe4f8;        
}
.divContentFinTab.selected {
    background-color: #0e88fb;
    color: white;
}

.divContentFinSynthese {
    height: 100%;
    align-items: center;
}

.divContentGraphAnalyseFinanciere {
    height: 40vh;
}

#tableContentFinSynthese .thead-vertical {
    writing-mode: vertical-rl;
    transform: rotate(200deg);
    white-space: nowrap;
    font-size: smaller;
}

.col-fin-synthese
{
    position: relative;
}

.col-fin-synthese::after
{
    content: "";
    position: absolute;
    top: 10vh;
    bottom: 0vh;
    right: 0;
    border-right: 1px solid #ccc;
}

.divContentFinDetailTable {
   margin: 15px 1vw 0 !important; 
}
.divContentFinDetailTotalCompte {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 5px;
    margin-top: 10px !important;
    border: 1px solid #ddd;
    border-radius: 4px;
    background-color: #f8f9fa;
}
.divContentFinDetailTotalCompte span {
    font-size: 14px;
    color: var(--bs-body-color);
    font-weight: bold;
}
.divContentFinDetailTotalCompte strong {
    font-size: 21px;
    font-weight: 600;
}

.divContentFinDetailTotalCompteValuePos {
    color: #0e88fb;
}
.divContentFinDetailTotalCompteValueNeg {
    color: #fb0e0e;
}

.divContentFinDetailLibelleOperation {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 5px;
    margin-top: 10px !important;
    border: 1px solid #ddd;
    border-radius: 4px;
    background-color: #f8f9fa;
}

#dataTableContentFinDetail tbody tr {
    height: 3vw;
}

.dataTableContentFinDetailNatureOpe {
    vertical-align: middle;
}

.operationEntree {
    background-color: #0e88fb;
    padding: 0 10px;
    border-radius: 3px;
    color: white;
}
.operationSortie {

}

.modalFormOpeMontantImpact, .modalFormOpeMontantImpactSigne  {
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
}

/*  --------------------------   */

.modalFormAddBtn {
    width: 15%;
    cursor: pointer;
    user-select: none;
    text-align: center;
    font-size: 1.5vw;
    border-radius: 10px;
    color: #00d309;
    border: solid #a2ffa6 2px;
    height: fit-content;     
    margin-bottom: 10px;   
}
.modalFormAddBtn:hover {        
    background-color: #a6ffaa;
}

.modalFormUpdBtn {
    width: 15%;
    cursor: pointer;
    user-select: none;
    text-align: center;
    font-size: 1.5vw;
    border-radius: 10px;
    color: #d39b00;
    border: solid #ffdea2 2px;
    height: fit-content;
    margin-bottom: 10px;
}
.modalFormUpdBtn:hover {
    background-color: #ffdea2;
}
.modalFormSuppBtn {
    width: 15%;
    cursor: pointer;
    user-select: none;
    text-align: center;
    font-size: 1.5vw;
    border-radius: 10px;
    color: #d32a00;
    border: solid #ffa2a2 2px;
    height: fit-content;
    margin-bottom: 10px;
}
.modalFormSuppBtn:hover {
    background-color: #ffa2a2;
}

#modalFormBieLocalInputSurface {
    width: 20%;
}

.modalFormBieImgPri,
.modalFormBieImgAdd {
    padding: 15px 0;
}

.modalFormBieImgPriImg {
    cursor: pointer;
    user-select: none;
    border-radius: 10px;
    border: solid #f2f4f7 2px; 
}
.modalFormBieImgPriImg:hover {
    border: solid #0e88fb 2px;
}
.modalFormBieImgGalImg {
    cursor: pointer;
    user-select: none;
    border-radius: 10px;
    border: solid #f2f4f7 2px;
}
.modalFormBieImgGalImg:hover {
    border: solid #0e88fb 2px;
}

#modalFormLocProIdent {
    height: 70vh;;
}
.modalFormLocProIdentDivImg {
    margin-bottom: 10px;    
    background-color: #e2e2e2;
    height: 55vh;
    border-radius: 15px;
    border: solid #f2f4f7 5px;
}
.divLocResPhoContentDivImg {
    padding-top: 2vh;
    height: 26vh;    
}

.divLocResPhoContentImg {
    cursor: pointer;
    user-select: none;
}
.divLocResPhoContentImg:hover {
    border: solid #0e88fb 2px !important;
}
.divLocResPhoContentImg.selected {
    border: solid #0e88fb 2px !important;
}

/*******************************/    

.dtButton {
    text-align: center;
    margin: 5px;
}

.outline-admin {
    background: white;
    border:     1px solid #4b9bf5 !important;
    color:      #4b9bf5;
}
.outline-admin:hover {
    background: #4b9bf5;
    color: white !important;
}

.outline-btn-admin {
    background: #4b9bf5;
    border:     1px solid #4b9bf5 !important;
    color:      white;
}
.outline-btn-admin:hover {
    background: white;
    color: #4b9bf5 !important;
}

.btn-adm {
    text-align: left !important;
    padding-bottom: 0.5vw;
}

.connexionButton{
    background: white;
    border:     1px solid #02723b !important;
    color:      #02723b;
}
.connexionButton:hover {
    background: #02723b;
    color:      white !important;
}

.starRequired {
    color: red;
}


.modalFormChoice {
    display: flex;
    gap: 2px;
    margin-left: 2vw;
}
.modalFormChoice input {
    display: none;
}
.modalFormChoiceLabel {    
    border-radius: 8px;
    padding: 0 12px;
    margin-left: 0px;
    border: 2px solid #e5e7eb;
    background: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    font-weight: 600;
    cursor: pointer;
    user-select: none;
    transition: .25s ease;
}
.modalFormChoiceLabel:hover {
    transform: translateY(-3px);
}
.modalFormChoiceLabel span {
    font-size: 24px;
}

/* sélection Oui */
.modalFormChoiceInputYes:checked + .oui {
    /*background: #16a34a;
    border-color: #16a34a;*/
    background: #0e88fb;
    border-color: #0e88fb;
    color: white;
}

/* sélection Non */
.modalFormChoiceInputNo:checked + .non {
    /*background: #dc2626;
    border-color: #dc2626;*/
    background: #0e88fb;
    border-color: #0e88fb;
    color: white;
}

.bg-blue {
    background-color : #0e88fb !important ;
}