﻿/*-----------------------------------------------------------------------------
 Cyberclient.css
 Cyberclient 2020
 rev. 3.6.20
-----------------------------------------------------------------------------*/


body {
    margin-top: 0px;
}


.divAppli {
    max-width: 110em;
    /*min-width: 1128px;*/
    /*min-width: 640px;*/
}



header {
    margin-right: 0px;
    padding: .5rem;
    padding-bottom: 0.25rem;
    padding-top: 0rem;
}

.hauteurMenu {
    height: 48rem;      /* menuHaut + HauteurContenu + menuBas  */ 
}

.hauteurContenu {
    height: 42rem;
}


.divChapeau {
    padding-top: 1rem;
    padding-bottom: 1rem;
    padding-left: 1rem;
}


/*Menu*/


#menuGauche {
    padding-top: 3rem;
}

    #menuGauche .article {
        font-weight: bold;
        color: #111;
        border-color: #a0a0a0;
        width: 90%;
        margin: 3%;
    }


    #menuGauche .accueil {        
        background-color: #F4F4F4 !important;
    }

    #menuGauche .societe,
    #menuGauche .liste-societe {
        background-color: #FFE1CC !important;
    }

    #menuGauche .calendrier {
        background-color: lightyellow;
    }



.menuHaut {
    position: relative;
    height: 3rem;
    padding-top: .25rem;
}

.menuBas {
    height: 3rem;
    padding-top: .5rem;
    padding-bottom: .5rem;
}


/* Header et menu smart ----------- */
.header-smart {
    position: relative;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 4rem;
    padding-top: 1em;
    /*margin-left: -15px;
    margin-right: -15px;*/
    display: none; /* caché au démarrage */
    background-color: white;
    z-index: 2000;
}


/* largeur au maximum de 768px - ente 1 et 768 iPad vertical */
@media (max-width: 768px) {
    .header-smart {
        display: block;
    }

    #menuGauche {
        display: none;
    }

    header {
        display: none;
    }

    h4 {
        font-size: 1em;
    }
}

.menu-smart {
    display: none;
    position: fixed;
    top: 4.25em;
    left: 15px;
    padding-top: 1rem;
    padding-bottom: 5rem;
    z-index: 2000;
    width: 30em;
    line-height: 2rem;
    overflow-y: hidden;
    background-color: white;
}


a.menu-smart-fermer {
    position: absolute;
    left: 0px;
    bottom: 0px;
    width: 100%;
    text-align: center;
    font-size: 2em;
    color: black;
}

a.menu-smart-fermer:hover {
    text-decoration: none;
}


.header-smart .icone {
    position: absolute;
    left: .25em;
    bottom: 1.5em;
}


.header-smart h2 {
    text-align: center;
}

.header-smart a {
    color: coral;
    text-decoration: none;
}


.header-smart #imgMenuSmart {
    cursor: pointer;
}









/* Société et Personne */

#divSociete,
#divPersonne {
    height: 28rem;
}


#divPersonne {
    padding-top: 1rem;
}


.divListeRelation {
    height: 14rem;
    overflow-y: scroll;
}

#divDatesFiche {
    margin-top: 2rem;
}


.divListeSociete {
    overflow-y: scroll;
}

    .divListeSociete p {
        margin-bottom: .25rem;
    }

    .divListeSociete a {
        color: #333;
        text-decoration: none;
    }

    .divListeSociete a:hover {
        display:block;
        background-color: yellow;
        /*color: red;*/
    }



/* Relation */
#divRelation {
    padding-left: 1em;
    padding-bottom: 1em;
    padding-top: 1em;
}

#divRelation .cadre {
    border-style: solid;
    border-width: 1px;
    border-color: gray;
    border-radius: .25em;
    padding: .5em;
    margin-bottom: 1em
}

#divRelation p {
    margin-top: .5em;
    margin-bottom: .5em;
}


/* Suivi */
#divLienClient {
    margin-left: -15px;
    height: 3.6em;
    overflow-y: scroll;
}




/* largeur au maximum de 768 - ente 1 et 768 iPad vertical */
@media (max-width: 768px) {
    #divDatesFiche {
        display: none;
    }
}


#divDomaine {
    height: 16rem;
    overflow-y: scroll;
}

#divDomaine ul {
    padding-left: 1rem;
}

#divDomaine li {
    width: 48%;
    display: inline-block;
    
}

#divAjoutGroupeTravail {
    display: none;
}


#divSuivi {
    padding-top: 1em;
    padding-bottom: 1em;
    margin-top: 1em;
}



.calende {
    flex-direction: row;
    flex-grow: 3;
    flex-wrap: wrap
}


/* Recherche Société / Personne */

#divResultatCherche {
    display: none;
    position: absolute;
    z-index: 100;
    top: 2.5rem;
    left: 0px;
    padding-bottom: .5rem;
    max-height: 24em;
    min-height: 12rem;
    overflow-y: scroll;
    background-color: white;
}

#divResultatCherche p {
    margin: 0px;
    padding: 0px;
}

#divResultatCherche p:hover {
    background-color: yellow;
    cursor: pointer;
}

#divResultatCherche .divG {
    display: inline-block;
    width: 45%;
    overflow-x: hidden;
}

#divResultatCherche .divG:hover {
    background-color: yellow;
}

#divResultatCherche a {
    text-decoration: none;
}


#divResultatCherche .divA {
    display: inline-block;
    width: 2%;
    color: red;
}


.divRechercheRelation {
    padding: 1em;
}



/*#divResultatRelation {*/
    #divRechercheRelation #divResultatCherche {
    display: block;
    position: relative;
    padding-bottom: .5rem;
    max-height: 24em;
    min-height: 12rem;
    overflow-y: scroll;
    background-color: white;
}


#divCalendrier .jour {
    margin: .25rem;
}


#divCalendrier .dateJour p {
    margin: 0px;
}

#divCalendrier .dateJour h2 {
    margin: 0px;
    margin-top: .25rem;
    margin-bottom: 1rem;
    text-align: center;
}

#divCalendrier .rendezvous {
    max-height: 3.75rem;
    overflow-y: hidden;
}

#divCalendrier .rendezvous p {
    margin: 0px;
    min-height: 3.75rem;
}


#divCalendrier .suiviJour {
    margin: .25rem;
    min-height: 12.25rem;
}



#divCalendrier .divListeSuivi {
    margin-top: 1.5rem;
    height: 38.5rem;
    overflow-y: scroll;
}



/* Options */
#divOption {
    height: 42rem;
}