@charset "utf-8";
/* CSS Document */

body.body_client {
    margin: 1%;
}
html,
body {
    height: 98%;
}
#client_container {
    background-color: #f7f7f7;
    border: 1px solid #f2f2f2;
    min-height: 100%;
    position: relative;
    /*min-width:900px;*/
}
.client_home #client_container {
    width: 900px;
    margin-right: auto;
    margin-left: auto;
    height: 500px;
    min-height: 500px;
    position: absolute;
    /* Centrer verticalement */
    
    top: 50%;
    margin-top: -250px;
    /* Centrer horizontalement */
    
    left: 50%;
    margin-left: -450px;
}
#client_header {
    background-image: url(../images/logo.png);
    background-repeat: no-repeat;
    background-position: 30px 30px;
    padding-top: 30px;
    padding-bottom: 0px;
    padding-left: 30px;
    height: 141px;
    position: relative;
}
.tab_info {
    background-color: #FF0000;
    margin-bottom: 30px;
}
#client_menu_header {
    float: right;
    background-color: #FFF;
    margin-right: -1px;
    padding: 10px;
    box-shadow: -4px 0 7px rgba(0, 0, 0, 0.2);
    ;
    -moz-box-shadow: -4px 0 7px rgba(0, 0, 0, 0.2);
    ;
    -webkit-box-shadow: -4px 0 7px rgba(0, 0, 0, 0.2);
    ;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 11px;
    white-space: nowrap;
    line-height: 22px;
}
#client_menu_header .client_name {
    float: left;
    background-color: #F4F4F4;
    padding-right: 7px;
    padding-left: 7px;
}
#client_menu_header span i {
    color: #054777;
}
.link_header {
    color: #FFF;
    text-decoration: none;
    display: block;
    float: right;
    line-height: 22px;
    padding-right: 7px;
    padding-left: 7px;
    background-repeat: no-repeat;
    background-position: 7px;
}
#link_profil {
    background-color: #054777;
    background-image: url(../images/icone_profil.gif);
    padding-left: 24px;
}
#link_retour_site {
    background-color: #054777;
    background-image: url(../images/icone_accueil.gif);
    padding-left: 24px;
}
#link_logout {
    background-color: #ffaf00;
    background-image: url(../images/icone_logout.gif);
    padding-left: 30px;
    margin-left: 10px;
}
#link_logout .cnx {
    background-color: #ffaf00;
}
#link_retour_site .cnx {
    background-color: #054777;
}
.remarque_client {
    padding-top: 10px;
}
#menu_client_n {
    position: absolute;
    display: block;
    line-height: 35px;
    color: #FFF;
    background-color: #054777;
    padding-right: 8px;
    margin-left: 10px;
    text-decoration: none;
    background-repeat: no-repeat;
    background-position: right center;
    font-size: 16px;
    text-transform: uppercase;
    width: 114px;
    text-align: center;
    top: 90px;
    right: 0px;
    background-image: url(../images/icone_menu_client.gif);
}
#client_menu_principal_n {
    background-color: #054777;
    z-index: 999;
    display: none;
    position: absolute;
    right: 0px;
    top: 125px;
}
#client_menu_principal_n li {} #client_menu_principal_n li a {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 14px;
    line-height: 30px;
    color: #FFF;
    text-decoration: none;
    padding-right: 15px;
    padding-left: 15px;
    display: block;
    text-align: right;
    padding-top: 5px;
    padding-bottom: 2px;
    border-bottom-width: 1px;
    border-bottom-style: dotted;
    border-bottom-color: #376c92;
}
#client_menu_principal_n li a:hover,
#client_menu_principal_n li a.active {
    background-color: #376c92;
}
#client_content {
    padding-top: 30px;
    padding-right: 30px;
    padding-bottom: 50px;
    padding-left: 30px;
    line-height: 16px;
    font-size: 12px;
}
#client_header_content {
    background-color: #eaeaea;
    padding: 10px;
    overflow: hidden;
    font-size: 12px;
    line-height: 25px;
}
#barre_alerte {
    background-color: #FFF;
    padding: 10px;
    overflow: hidden;
    font-size: 12px;
    line-height: 18px;
    font-weight: bold;
    color: #F00;
    border: 2px solid #F00;
}
#barre_success {
    background-color: #FFF;
    padding: 10px;
    overflow: hidden;
    font-size: 12px;
    line-height: 18px;
    font-weight: bold;
    color: #090;
    border: 2px solid #090;
}
#boutons_outils {
    float: right;
}
#boutons_outils a {
    display: inline-block;
    float: left;
    font-size: 12px;
    line-height: 25px;
    color: #FFF;
    background-color: #054777;
    padding-right: 8px;
    margin-left: 10px;
    text-decoration: none;
    background-repeat: no-repeat;
    background-position: 8px center;
}
#bouton_rechercher {
    background-image: url(../images/icone_rechercher.gif);
    padding-left: 24px;
}
#bouton_exporter {
    background-image: url(../images/icone_exporter.gif);
    padding-left: 27px;
}
#bouton_imprimer {
    background-image: url(../images/icone_imprimer.gif);
    padding-left: 27px;
}
#boutons_outils a:hover {
    background-color: #ffaf00;
}
#tab_content {
    font-size: 11px;
    border-collapse: collapse;
}
#tab_content td {
    border: 1px solid #dedede;
    padding-top: 8px;
    padding-right: 5px;
    padding-bottom: 8px;
    padding-left: 5px;
    vertical-align: middle;
    line-height: 16px;
}
#tab_content .head_table td {
    font-weight: bold;
    color: #FFF;
    background-color: #4a4a4a;
}
#tab_content .head_table td.td_mla {
    background-color: #054777;
}
#tab_content .head_table td a {
    color: #FFF;
    display: inline-block;
    background-repeat: no-repeat;
    background-position: right center;
    padding-right: 10px;
}
#tab_content .head_table td a.tri_up {
    background-image: url(../images/up.gif);
}
#tab_content .head_table td a.tri_down {
    background-image: url(../images/down.gif);
}
#tab_content tr.ligne_edit td {
    background-color: #999999;
}
#tab_content tr.ligne_filtre td {
    background-color: #d5d5d5;
}
#tab_content select,
#tab_content input,
#tab_content textarea {
    width: 98%;
    border: 1px solid #ccc;
    font-size: 11px;
    line-height: 18px;
    font-family: Arial, Helvetica, sans-serif;
}
#tab_content input.champ_alerte,
#tab_content select.champ_alerte {
    border: 1px solid #F00;
}
#tab_content tbody tr:nth-child(2n+2) {
    background-color: #fff;
}
#tab_content tbody .td_mla {
    background-color: #e6ecf1;
}
.bouton_ligne {
    display: block;
    width: 21px;
    height: 21px;
    background-repeat: no-repeat;
    background-position: center center;
}
.edit_ligne {
    background-color: #054777;
    background-image: url(../images/icone_edit.gif);
}
.del_ligne {
    background-color: #ffaf00;
    background-image: url(../images/icone_del.gif);
}
.search_ligne {
    background-color: #333;
    background-image: url(../images/icone_rechercher.gif);
    width: 25px;
    height: 25px;
}
.add_ligne {
    background-color: #054777;
    background-image: url(../images/icone_ajouter.gif);
}
.valide_ligne {
    background-color: #054777;
    background-image: url(../images/icone_validate.gif);
}
#client_container .barre_recherche {
    float: right;
    background-color: transparent;
    padding: 0px;
}
.tab_recherche {
    float: right;
}
.tab_recherche .field {
    border: 1px solid #CCC;
    height: 21px;
}
.tab_recherche td {
    vertical-align: top;
}
/****footer****/

#client_footer {
    position: absolute;
    bottom: -1px;
    right: 30px;
    background-color: #FFF;
    margin-right: -1px;
    padding: 10px;
    box-shadow: 0 -4px 7px rgba(0, 0, 0, 0.2);
    ;
    -moz-box-shadow: 0 -4px 7px rgba(0, 0, 0, 0.2);
    ;
    -webkit-box-shadow: 0 -4px 7px rgba(0, 0, 0, 0.2);
    ;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 11px;
    white-space: nowrap;
}
.sameteam {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 11px;
    color: #000;
    padding-top: 15px;
}
.sameteam a.link_same {
    background-image: url(../images/bg_sameteam.gif);
    background-repeat: no-repeat;
    background-position: left;
    padding-left: 16px;
    padding-right: 4px;
    font-weight: bold;
    font-family: Arial, Helvetica, sans-serif;
    text-transform: uppercase;
    color: #000000;
    text-decoration: none;
}
.team {
    color: #C31111;
}
#client_bloc_identification {
    overflow: hidden;
    width: 840px;
    margin-left: 30px;
    margin-top: 30px;
}
#client_bloc_identification .bloc_avantage {
    width: 475px;
    font-size: 12px;
    line-height: 16px;
    min-height: 185px;
}
#client_bloc_identification .bloc_identification .push-espaceclient {
    min-height: 187px;
}
#client_bloc_identification .bloc_avantage ul li {
    width: 220px;
    font-size: 11px;
}
/****identification***/

#client_identification {
    width: 360px;
    font-size: 12px;
    background-color: #efefef;
    padding: 20px;
    border: 1px solid #f7f7f7;
    overflow: hidden;
    height: 160px;
}
#client_identification {
    position: absolute;
    /* Centrer verticalement */
    
    top: 50%;
    margin-top: -80px;
    /* Centrer horizontalement */
    
    left: 50%;
    margin-left: -180px;
}
.titre_identification {
    font-size: 14px;
    text-transform: uppercase;
    color: #424141;
    background-image: url(../images/icone_identification.png);
    background-repeat: no-repeat;
    background-position: left center;
    padding-top: 5px;
    padding-left: 50px;
    height: 40px;
    line-height: 18px;
    margin-bottom: 15px;
}
.titre_identification span {
    font-size: 12px;
    text-transform: none;
    color: #838383;
}
.message_identification {
    font-weight: bold;
    color: #F00;
    padding-bottom: 10px;
}
.message_identification_ok {
    font-weight: bold;
    color: #060;
    padding-bottom: 10px;
}
#client_identification label {
    width: 100px;
    float: left;
    line-height: 24px;
}
#client_identification input.input_ident {
    border: 1px solid #cccccc;
    width: 245px;
    color: #666;
    padding-top: 3px;
    padding-right: 5px;
    padding-bottom: 3px;
    padding-left: 5px;
}
.bouton_ident {
    float: right;
    margin-top: 10px;
    font-size: 12px;
    line-height: 28px;
    text-transform: uppercase;
    color: #FFF;
    background-color: #054777;
    border: 0;
    padding-right: 10px;
    padding-left: 10px;
}
#link_oubli {
    float: left;
    display: inline-block;
    margin-top: 20px;
}
#menu_client_n:before {
    content: "Menu";
}
/********************Responsive Tableau************************/

@media only screen and (max-width: 999px),
(min-device-width: 999px) and (max-device-width: 1024px) {
    #tab_donnees_client table,
    #tab_donnees_client thead,
    #tab_donnees_client tbody,
    #tab_donnees_client th,
    #tab_donnees_client td,
    #tab_donnees_client tr {
        display: block;
    }
    #tab_donnees_client thead tr {
        position: absolute;
        top: -9999px;
        left: -9999px;
    }
    #tab_donnees_client tr {
        border: 1px solid #ccc;
    }
    #tab_donnees_client td {
        border: none;
        border-bottom: 1px solid #eee;
        position: relative;
        padding-left: 50% !important;
        text-align: left;
    }
    #tab_donnees_client td:before {
        position: absolute;
        top: 6px;
        left: 6px;
        width: 50%;
        padding-right: 10px;
        white-space: nowrap;
        text-transform: uppercase;
    }
    table.echanciers td:nth-of-type(1):before {
        content: "code contrat ";
    }
    table.echanciers td:nth-of-type(2):before {
        content: "numéro loyer";
    }
    table.echanciers td:nth-of-type(3):before {
        content: "éhcéance";
    }
    table.echanciers td:nth-of-type(4):before {
        content: "Loyer TTC";
    }
    table.echanciers td:nth-of-type(5):before {
        content: "Loyer HT";
    }
    table.echanciers td:nth-of-type(6):before {
        content: "Intérêts";
    }
    table.echanciers td:nth-of-type(7):before {
        content: "Amortissement";
    }
    table.echanciers td:nth-of-type(8):before {
        content: "Services";
    }
    table.echanciers td:nth-of-type(9):before {
        content: "Restant Dû";
    }
    table.contrat_vigueur td:nth-of-type(1):before {
        content: "code contrat ";
    }
    table.contrat_vigueur td:nth-of-type(2):before {
        content: "Objet ";
    }
    table.contrat_vigueur td:nth-of-type(3):before {
        content: "montant ";
    }
    table.contrat_vigueur td:nth-of-type(4):before {
        content: "date 1er loyer  ";
    }
    table.contrat_vigueur td:nth-of-type(5):before {
        content: "Date fin contrat ";
    }
    table.contrat_vigueur td:nth-of-type(6):before {
        content: "durée contrat* ";
    }
    table.contrat_vigueur td:nth-of-type(7):before {
        content: "valeur résiduelle ";
    }
    table.contrat_vigueur td:nth-of-type(8):before {
        content: "durée résiduelle*  ";
    }
    table.contrat_echus td:nth-of-type(1):before {
        content: "code contrat ";
    }
    table.contrat_echus td:nth-of-type(2):before {
        content: "Objet ";
    }
    table.contrat_echus td:nth-of-type(3):before {
        content: "montant ";
    }
    table.contrat_echus td:nth-of-type(4):before {
        content: "date 1er loyer  ";
    }
    table.contrat_echus td:nth-of-type(5):before {
        content: "Date fin contrat ";
    }
    table.contrat_echus td:nth-of-type(6):before {
        content: "durée contrat* ";
    }
    table.contrat_echus td:nth-of-type(7):before {
        content: "valeur résiduelle ";
    }
    table.mov_client td:nth-of-type(1):before {
        content: "référence";
    }
    table.mov_client td:nth-of-type(2):before {
        content: "code contrat ";
    }
    table.mov_client td:nth-of-type(3):before {
        content: "libellé ";
    }
    table.mov_client td:nth-of-type(4):before {
        content: "Date opération ";
    }
    table.mov_client td:nth-of-type(5):before {
        content: "date échéance ";
    }
    table.mov_client td:nth-of-type(6):before {
        content: "Montant débit (DT) ";
    }
    table.mov_client td:nth-of-type(7):before {
        content: "Montant crédit (DT) ";
    }
    table.factures_impayees td:nth-of-type(1):before {
        content: "référence";
    }
    table.factures_impayees td:nth-of-type(2):before {
        content: "code contrat ";
    }
    table.factures_impayees td:nth-of-type(3):before {
        content: "libellé ";
    }
    table.factures_impayees td:nth-of-type(4):before {
        content: "Echéance ";
    }
    table.factures_impayees td:nth-of-type(5):before {
        content: "Montant facture (DT) ";
    }
    table.factures_impayees td:nth-of-type(6):before {
        content: " Reste à régler (DT)   ";
    }
    td#text-montant_reglement:before,
    td#montant_reglement:before {
        content: none;
    }
    td#text-montant_reglement,
    montant_reglement {
        padding-left: 5px !important;
    }
    #client_content table:last-child {
        margin-bottom: 25px;
    }
    table.demande_contrat td:nth-of-type(1):before {
        content: "code contrat ";
    }
    table.demande_contrat td:nth-of-type(2):before {
        content: "Objet ";
    }
    table.demande_contrat td:nth-of-type(3):before {
        content: "Valeur résiduelle ";
    }
    table.demande_contrat td:nth-of-type(4):before {
        content: "sélectionner";
    }
    table.fact_dup td:nth-of-type(1):before {
        content: "code contrat ";
    }
    table.fact_dup td:nth-of-type(2):before {
        content: "Objet ";
    }
    table.fact_dup td:nth-of-type(3):before {
        content: "Echéance";
    }
    table.fact_dup td:nth-of-type(4):before {
        content: "sélectionner";
    }
    #client_content table.captcha tr td {
        float: left !important;
    }
}
@media (max-width: 999px) {
    #client_header {
        padding-left: 0;
        padding-top: 0;
    }
    #client_content .password_panel {
        width: 100%;
    }
    #link_logout {
        background-color: #ffaf00;
    }
    #link_retour_site {
        background-color: #054777;
    }
    #link_retour_site:before {
        content: "\f015";
        font-family: fontawesome;
    }
    #link_logout,
    #link_retour_site {
        background-image: none;
        width: 50px;
        height: 50px;
        margin: 0;
        padding: 15px;
        font-size: 25px;
        line-height: 20px;
        text-align: center;
    }
    a#bouton_imprimer {
        background: none;
        padding-left: 0;
    }
    #boutons_outils a:hover {
        background: none;
    }
    a#bouton_imprimer:before {
        content: "\f02f";
        font-family: fontawesome;
        color: #054777;
        font-size: 16px;
    }
    .print {
        display: none;
    }
    #link_logout:before {
        content: "\f08b";
        font-family: fontawesome;
    }
    #client_menu_header {
        background: none;
        box-shadow: none;
    }
    div#client_menu_header .client_name i {
        display: block;
    }
    #menu_client_n {
        width: 100%;
        top: 115px;
        text-align: left;
        padding-left: 15px;
        background: none;
    }
    #client_menu_principal_n {
        width: 100%;
        top: 150px;
    }
    #client_menu_principal_n ul {
        padding-left: 0;
    }
    #client_menu_principal_n li a {
        text-align: left;
    }
    #menu_client_n:before {
        content: "\f0c9";
        float: right;
        font-size: 21px;
        font-family: fontawesome;
        color: #054777;
    }
    #titre_rub_client {
        left: 15px;
        top: 130px;
        font-size: 16px;
        right: 0;
    }
    #client_container .divider-line {
        display: none;
    }
    .link_header .cnx {
        display: none;
    }
    #client_menu_header .client_name {
        background: none;
        padding-right: 0px;
        padding-left: 5px;
        padding-top: 55px;
        text-align: right;
        float: none;
    }
    #client_header {
        background-position: 10px 10px;
    }
    #client_footer {
        width: 100%;
        right: 0;
    }
    #client_footer .sameteam {
        display: block;
        text-align: center;
    }
}
@media (max-width: 768px) {
    #client_header {
        background-size: 165px;
    }
    #client_menu_principal_n li a {
        font-size: 13px;
    }
}
@media (max-width: 600px) {
    .tab_recherche {
        float: none;
        width: 100%;
    }
    #titre_rub_client {
        font-size: 12px;
    }
    .tab_recherche .field {
        display: block;
        width: 100%;
    }
}