body {
    font-family: "Sofia Sans", serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;  
}
.border-orange { border-color: #f39500!important; }
.text-orange { color: #f39500!important; }
.bg-orange { background-color: #f39500; }
.bg-orange-light { background-color: #fae1ba; }
.btn-orange { background-color: #f39500; color: white; }
.btn-orange:hover{ background-color: #d18204; color: white; }
.btn-orange:active{ background-color: #ff9d00!important; color: white!important; }
.dropdown-toggle::after { display: none!important; border: none!important;}
.form-range::-moz-range-thumb { background-color: #f39500; }
.form-range-hover::-moz-range-thumb { background-color: #FF0000; width: 40px; height: 40px;}

.border-bleu { border-color: #005fa3!important; }
.text-bleu { color: #005fa3!important; }
.bg-bleu { background-color: #005fa3; }
.bg-bleu-light { background-color: #3489c5; }
.btn-bleu { background-color: #005fa3; color: white; }
.btn-bleu:hover{ background-color: #014779; color: white; }
.btn-bleu:active{ background-color: #014779!important; color: white!important; }

.btn-white { background-color: #FFFFFF; color: #333; }
.btn-white:hover{ background-color: #EEE; color: #000; }
.btn-white:active{ background-color: #EEE!important; color: orange!important; }

.hover:hover { background-color: #EEE;}
.volet-overlay {
    position: fixed;
    top:0; left:0; right:0; bottom:0;
    background-color: #333;
    opacity: .5;
}

.volet {
    position: fixed;
    top: 0;
    bottom: 0;
    right: 0;
    background-color: #FFFFFF;
    transition: .25s ease all;
}

.volet-client {
    width: 90%;
    right: -90%;
}

.volet-job {
    width: 80%;
    right: -80%;
}

.volet-tache {
    width: 70%;
    right: -70%;
}

.transition {
    transition: .35s ease all;
}

.avatar {
    color: #fff; 
    padding: 2px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius:100%;
    width:32px;
    height: 32px;
    font-weight: 600;
}

.pointer { cursor: pointer; }
.clickAdresse:hover { background-color: #333; color: white; }
#resultat ul { list-style: none; }

.w-33-desktop { width: 33%; }
.w-50-desktop { width: 50%; }
.w-66-desktop { width: 66%; }
.w-100-desktop { width: 100%; }

.desktop { display: inline; }
.desktop-block { display: block; }
.mobile, .mobile-block { display: none; }

.toast { z-index: 1600!important; }

.page { display: flex; }
#main { margin-left:180px; margin-top: 80px;  }
.top-bar { display: block; z-index:10;}
.menu { z-index: 1050; }

.menu-item { display: flex; flex-direction: column; align-items: center;}
.cadre-documentt { width:300px; height:220px }

.cadre-locataire { max-width: 550px; min-width:350px; }

/*.menu-content { text-align: center; }/*/
@media only screen and (max-width:1100px) {
    .w-33-desktop, .w-50-desktop, .w-66-desktop  { width: 100%; }
    .desktop, .desktop-block { display: none; }
    .mobile { display: inline; }
    .mobile-block { display: block; }

    .page { display: block; }
    #main { margin-left:0px; margin-top: 0px; padding-top: 80px; }
    /*.top-bar { display: none!important; }*/
    .menu { width:75%!important; padding-left: 50px; }

    .menu-item { flex-direction:row; justify-content: start;}
    .cadre-document { width:100%; }
    .cadre-locataire {width: 100%; }

}