body {
    margin-bottom: 4em;
}


.divAppli {
    max-width: 100%;
}


@media (max-width: 767px) {
    .divEntete {
        display: none;
    }
}





/* Entete et menu pour smartphone - stype modifié sur la view Liste.cshtml */
#divEnteteSmart {
    display: none;
    position: fixed;
    z-index: 2000;
    width: 100%;
    height: 6em;
    top: 0px;
    left: 0px;
    background-color: white;
}

@media (max-width: 767px) {
    #divEnteteSmart {
        display: block;

    }
}


#divEnteteSmart .divLogo {
    padding-top: 1rem;
    text-align: right;
}


#divEnteteSmart img {
    width: 100%;
    max-width: 15em;
}


/* menu Smart */
.menu-smart {
    position: absolute;
    z-index: 1000;
    width: 100%;
    top: 3.75rem;
    right: 0rem;
    padding-top: 0rem;
    padding-bottom: 6rem;
    background-color: white;
}



.menu-smart {
    display: none;
}

    .menu-smart a {
        padding-top: .5rem;
        padding-bottom: .5rem;
        font-size: 1.2em;
        text-align: center;
    }

        .menu-smart a:hover {
            color: #002450;
            text-decoration: none;
        }

a.menu-smart-fermer {
    font-weight: 600;
    padding-bottom: 3rem;
    font-size: 1.25em;
}

    a.menu-smart-fermer:hover {
        text-decoration: none;
    }



.menu-smart .border-top {
    border-top-style: solid;
    border-width: 1px;
    border-color: #aaa !important;
}

.menu-smart .border-bottom {
    border-bottom-style: solid;
    border-width: 1px;
    border-color: #aaa !important;
}



#divEnteteSmart #imgMenuSmart {
    width: 5rem;
    cursor: pointer;
}




.divEntete {
    position: fixed;
    z-index: 1000;
    width: 100%;
    top: 0px;
    left: 0px;
}


    .divEntete .logo {
        padding-left: 4.8%;
        padding-right: 5%;
        padding-top: 4em;
        background-color: white;
    }

    .divEntete img {
        width: 100%;
    }


.mb-KSA {
    margin-bottom: 5rem;
}




.divEntete .menu {
    text-align: center;
    position: relative;
    z-index: 100;
}



.MenuLoca {
    display: none;
    position: absolute;
    top: 0em;
    left: -.5em;
    width: 6.5em;
    text-align: left;
    padding-top: 2.25em;
    padding-bottom: 2.25em;
    /*line-height: 1.1em;
    border-style: solid;
    border-color: wheat;*/
}

.menu a.linkType {
    font-size: .8em !important;
    color: #111 !important;
    text-decoration: none !important;
    width: 100%;
    padding-left: .5em;
    padding-right: .5em;
    padding-top: .2em;
    padding-bottom: .2em;
    display: block;
}



.menu a.linkType:hover {
    color: white !important;
    text-decoration: none;
    background-color: #16ABE3;
    width: 100%;
}


.menu a.type-select {
    color: white !important;
    text-decoration: none;
    background-color: #16ABE3;
    width: 100%;
}




/* https://developer.mozilla.org/fr/docs/Web/CSS/CSS_Flexible_Box_Layout */
/* space-between pour espacer les éléments de façon égale */
.divEntete .box {
    height: 3em;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-left: 1em;
    padding-right: 1em;
}



.divEntete .bandeau {
    position: relative;
    height: 12em;
}


.divPrincipal {
    position: relative;
    top: 0px;
    left: 0px;
    margin-top: 17em;
}

@media (max-width: 1440px) {
    .divPrincipal {
        margin-top: 16em;
    }
}

@media (max-width: 992px) {
    .divPrincipal {
        margin-top: 15em;
    }
}


@media (max-width: 767px) {
    .divPrincipal {
        margin-top: 5em;
    }

    #divListe {
        margin-top: 10em;
    }
}





    .divTitreListe {
        height: 3em;
        display: flex;
        align-items: center;
    }

@media (max-width: 992px) {
    .divTitreListe a {
        margin: auto !important;
    }
}


    @media (max-width: 992px) {
        #divListe .divTitreListe h1 {
            padding-left: 22.0%;
        }
    }


    @media (max-width: 992px) {
        #divListe .divTitreListe {
            display: none;
        }
    }


    /*@media (max-width:576px) {
    .divTitreListe a {
        padding-left: 7.0%;
    }
}*/



    .divTitreListeSmart {
        display: none;
    }

    @media (max-width: 767px) {
        .divTitreListeSmart {
            position: fixed;
            display: block;
            height: 2.25em;
            top: 6em;
            z-index: 2000
        }
    }


    .divTitreListeSmart .divChoixPiece {
        position: relative;
        z-index: 2500;
        overflow: hidden;
        width: 14em;
        height: 0px; /*replié au départ*/
        display: none;
        left: 14%;
        top: 0px;
        border-style: solid;
        border-width: 1px;
        border-color: dimgray;
        background-color: white;
        opacity: .7;
    }

        .divTitreListeSmart .divChoixPiece a {
            width: 100%;
            display: block;
            margin-top: 1em;
            margin-bottom: 1em;
            padding-left: 1em;
            font-size: 1.2em;
        }


    #divListe .divTitreListeSmart h1 {
        margin-left: 7.0%;
    }





    #divListe .divChoixCarte {
        display: none;
    }

    /*@media (max-width: 992px) {*/
    @media (max-width: 767px) {
        #divListe .divChoixCarte {
            display: block;
            position: absolute;
            z-index: 2500;
            top: 0em;
            left: 71%;
            width: 25%;
            text-align: right;
        }
    }



    /*#divListe .divChoixCarte a {
        background-color: white;
    }

        #divListe .divChoixCarte a:hover {
            color: #17ace4;
        }*/








    a#linkFiltrePiece {
        text-decoration: underline;
    }




    @media (min-width: 767px) {
        #divListe .signet {
            display: none;
        }
    }



    .divTitreLocSmart {
        display: none;
    }

    @media (max-width: 992px) {
        .divTitreLocSmart {
            display: flex;
        }

        .divTitreLocOrdi {
            display: none;
        }
    }


    .divAnnonce {
        position: relative;
        overflow: hidden;
        min-height: 15em;
    }


        .divAnnonce .photo {
            position: absolute;
            top: 0px;
            left: -2%;
            width: 104%;
        }


        .divAnnonce .ruban {
            position: absolute;
            z-index: 100;
            left: 0px;
            min-height: 6em; /* garder des em ! */
            width: 100%;
            bottom: 0px;
            background-color: white;
            opacity: .85;
        }

        .divAnnonce .ruban-haut {
            min-height: 10em; /* garder des em ! */
        }


    @media (max-width: 992px) {

        .divAnnonce .ruban {
            min-height: 5em; /* garder des em ! */
        }

        .divAnnonce .ruban-haut {
            min-height: 9em; /* garder des em ! */
        }
    }


    .divAnnonce .texte {
        position: absolute;
        z-index: 500;
        width: 100%;
        left: 0px;
        bottom: 0px;
        padding-left: 14.5%;
    }


/* news */
#NewsHome .texte:first-child,
#NewsHome .ruban:first-child,
#NewsHome .ruban-haut:first-child {
    /*display: none;*/
}


    @media (max-width: 576px) {
        .divAnnonce .texte {
            padding-left: 7%;
        }
    }

    .divAnnonce .texte p {
        margin: 0px;
        padding: 0px;
    }

        .divAnnonce .texte p:first-child {
            color: #16ABE3;
            font-family: librefranklin-medium;
        }


    /* caché au démarrage */
    .divAnnonce .texte .divLegende {
        display: none;
        height: 3.9em;
        overflow: hidden;
        margin-top: .5em;
        margin-bottom: 0.5em;
    }

.divAnnonce .texte .divLegende-news {
    height: 7em;
    display: block;
    overflow: hidden;
    margin-top: .5em;
    margin-bottom: 0.5em;
}


    .divAnnonce img {
        width: 100%;
    }



.divAnnonce .palette {
    position: absolute;
    z-index: 500;
    width: 100%;
    bottom: 0px;
    background-color: yellow;
    opacity: 0.01
}


/* Palette Krisalis */

.divKrialis-home {
    background-color: white;
    padding: 1em;
}

    .divKrialis-home .divAffichPlus {
        position: relative;
        z-index: 1000;
    }

    .divKrialis-home .paletteK {
        position: fixed;
        background-color: white;
        z-index: 500;
        top: 0px;
        left: 0px;
        left: 0px;
        width: 33%;
        height: 24em;
        top: 35em;
        padding: 1em;
    }


@media (max-width: 992px) {
    .divKrialis-home .paletteK {
        width: 100%;
        min-height: 10em;
    }
}

.divKrialis-home .afficheSuite {
    opacity: .9;
    transition: 2s;
    display: block;
}

.divKrialis-home .cacheSuite {
    opacity: 0.2;
    display: none;
}

ajouter un style pour une transition




/* Liste */
#divListe {
    margin-bottom: 5em;
}


        #divListe .divGoogleMap {
            width: 100%; /*modif*/
            height: 40rem; /*modif*/
            background-color: transparent;
        }

            #divListe .divGoogleMap #map {
                width: 100%;
                height: 40rem;
            }


    @media (max-width: 767px) {
        #divListe .divGoogleMap {
            display: none;
            display: flex;
            /*height: 0px;*/
        }
    }



.CarteCache {
    /*display: none;*/
    height: 0px;
}

.CarteVisible {
    display: flex;
    position: relative;
    z-index: 100;
    color: white;
}



    @media (max-width: 767px) {
        #divListeObjet .divChoixPiece {
            display: block;
        }
    }


    #divListeObjet .divChoixPiece a {
        width: 100%;
        display: block;
        margin-top: 1em;
        margin-bottom: 1em;
        padding-left: 1em;
        font-size: 1.2em;
    }

    #divListeObjet .divChoixPiece .btnChoix {
        position: absolute;
        top: 4em;
        right: 2.1em;
    }

        #divListeObjet .divChoixPiece .btnChoix img {
            width: 100%;
        }

    #divListeObjet .divChoixPiece .btnFermer {
        position: absolute;
        top: .25em;
        right: 2.25em;
    }

        #divListeObjet .divChoixPiece .btnFermer a {
            display: none;
            margin-top: 0px;
            color: red;
            font-size: 2em;
            font-weight: bold;
        }



    #divListeObjet .signet,
    #divSociete .signet,
    .signet {
        position: relative;
        top: -8em;
    }


@media (max-width: 992px) {
    #divListeObjet .signet,
    #divSociete .signet,
    .signet {
        top: -12em;
    }
}




    /* Description */
    .divCoteGauche,
    .divCoteDroite {
        padding-left: 14.5%;
        padding-right: 14%;
    }


    @media (max-width: 576px) {
        .divCoteGauche,
        .divCoteDroite {
            padding-left: 7%;
            padding-right: 7%;
        }
    }



    @media (max-width: 576px) {
        #divDescription .linkPdf {
            display: none;
        }
    }





    #divDescription .divTech {
        padding-left: 14.5%;
        padding-top: 2em;
        padding-bottom: 2em;
    }

    @media (max-width: 576px) {
        #divDescription .divTech {
            padding-left: 7%;
        }
    }





    #divDescription .divTech label {
        width: 40%;
    }

    #divDescription .divTech p {
        display: inline-block;
        width: 40%;
    }



    @media (max-width: 576px) {
        #divDescription .divTech label {
            width: 54%;
        }

        #divDescription .divTech p {
            display: inline-block;
            width: 45%;
        }
    }





    #divDescription .divTech p.ville {
        width: 80%;
    }



    #divDescription .divGoogle {
        padding-left: 14.5%;
        padding-right: 14.5%;
    }


    @media (max-width: 576px) {
        #divDescription .divGoogle {
            padding-left: 7%;
            padding-right: 7%;
        }
    }





    #divDescription .divGoogle #map,
    #map_canvas_agence {
        width: 100%;
        height: 25em;
        background-color: #F0F0F0;
    }

    @media (max-width: 576px) {
        #divDescription .divGoogle #map {
            width: 112%;
            margin-left: -6%;
        }
    }







    #divDescription .divSuivant {
        height: 5.25em;
    }

    @media (max-width: 1400px) {
        #divDescription .divSuivant {
            height: 4.5em;
        }
    }


/*    #divDescription a.linkPrecedent,
    #divDescription a.linkSuivant {
        padding-left: 29%;
    }*/


/* liens objet suivant précédent*/
.divObjSuivant {
    width: 100%;
}

@media (max-width: 992px) {
    .divObjSuivant {
        width: 71%;
    }
}

@media (max-width: 576px) {
    .divObjSuivant {
        width: 84%;
    }
}



#divDescription a.linkSuivant {
    padding-right: 1.5em;
    background-image: url('../Images/flecheSuivant.png');
    background-repeat: no-repeat;
    background-position-x: 100%;
    background-position-y: .15em;
}

#divDescription a.linkPrecedent,
a.linkRetourListe {
    background-image: url('../Images/flechePreced.png');
    background-repeat: no-repeat;
    background-position-x: 0%;
    background-position-y: .15em;
    padding-left: 1em;
}





    #divDescription a.linkPdf,
    #divDescription p.visiter,
    #divDescription a.linkDemandeLoc {
        display: block;
        margin-bottom: 3em;
        margin-top: 1em;
    }

    #divDescription a.linkRetourListe,
    #divDescription p.juridique,
    #divDescription p.dateMaj {
        display: block;
        margin-bottom: 1em;
    }




    /* Société */
    #divSociete img {
        width: 100%;
    }


    #divSociete .divServices {
        position: relative;
        min-height: 53em;
    }


    #divHomePage .divPhilo {
        position: relative;
        margin-top: 3em;
        min-height: 55em;
    }


    #divContact {
        margin-bottom: 5em;
    }


    .divPiedPage {
        position: relative;
        width: 100%;
        height: 9em;
    }

        .divPiedPage .RetourHaut {
            position: relative;
            top: -2em;
            width: 10em;
            margin-left: auto;
            margin-right: auto;
        }


            .divPiedPage .RetourHaut img {
                width: 100%;
            }



    #divSociete .divPanneau,
    #divHomePage .divPanneau {
        position: relative;
        top: 10em;
        padding-left: 5%;
        padding-right: 2%;
        padding-top: 2em;
        padding-bottom: 1em;
    }


    @media (max-width: 992px) {
        #divSociete .divPanneau,
        #divHomePage .divPanneau {
            top: 0px
        }
    }


    #divSociete .divPhoto,
    #divHomePage .divPhoto {
        position: absolute;
        height: 45em;
        top: 5em;
        left: 0px;
    }


    @media (max-width: 992px) {
        #divSociete .divPhoto,
        #divHomePage .divPhoto {
            position: relative;
            height: 26em;
        }
    }



    #divSociete .fndCollaborateur {
        background-image: url('../Images/FK2__20.jpg');
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
    }

    #divSociete .fndFidu {
        background-image: url('../Images/FK__134.jpg');
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
    }


    #divSociete .fndGerance {
        background-image: url('../Images/FK2__28.jpg');
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
    }


    #divHomePage .fndPhilo {
        background-image: url('../Images/FK2__02.jpg');
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
    }




    #divSociete .divServices .divPortrait {
        position: relative;
        width: 34.15%;
        min-height: 14em;
    }


    @media (max-width: 1440px) {
        #divSociete .divServices .divPortrait {
            min-height: 18em;
        }
    }


    @media (max-width: 992px) {
        #divSociete .divServices .divPortrait {
            min-height: 12em;
        }
    }



    #divSociete .divServices .divDepartement {
        position: relative;
        width: 7.70%;
        position: relative;
        /*background-color: aqua*/
    }

        #divSociete .divServices .divDepartement p {
            position: relative;
            top: 95%;
            left: 2em;
            font-size: 1.75em;
            margin: 0px;
            padding: 0px;
        }


    #divSociete .divServices .rotation {
        transform: rotate(-90deg);
        transform-origin: bottom;
    }



    #divSociete .divServices .box {
        display: flex;
        justify-content: center;
        margin-bottom: 2em;
    }


    #divSociete .divServices p.NomPropre {
        color: #17ace4;
        font-size: 1.75em;
        margin-top: 1em;
    }



    @media (max-width: 767px) {
        #divSociete .divServices p.NomPropre {
            font-size: 1.5em;
        }
    }



    #divSociete .divServices p.Titre {
        color: white;
        font-size: 1.1em;
        width: 111%;
    }


    @media (max-width: 1440px) {
        #divSociete .divServices p.Titre {
            font-size: 1em;
        }
    }




    /*Services 2*/

    #divSociete .divServices2 {
        position: relative;
        min-height: 53em;
    }


    @media (max-width: 992px) {
        #divSociete .divServices2 {
            min-height: 70em;
        }
    }



    #divSociete .divServices2 img {
        width: 100%;
    }


    #divSociete .divServices2 .colGauche {
        width: 57.5%;
    }

    @media (max-width: 992px) {
        #divSociete .divServices2 .colGauche {
            width: 100%;
        }
    }


    #divSociete .divServices2 .colDroite {
        width: 42.5%;
    }

    @media (max-width: 992px) {
        #divSociete .divServices2 .colDroite {
            width: 100%;
        }
    }

    #divSociete .divServices2 .colGauche .Portrait {
        flex: 0 0 auto;
        width: 16.25vw;
        /*min-height: 16.5em;*/
        margin-left: 0px;
        margin-right: 1vw;
    }

    @media (max-width: 992px) {
        #divSociete .divServices2 .colGauche .Portrait {
            flex: 1 0 auto; /* flex grow autorisé seulement pour les portraits de la colonne gauche! */
            width: 29.25vw;
            margin-left: 1vw;
            margin-right: 0px;
        }
    }


    #divSociete .divServices2 .Portrait-texte {
        min-height: 16.5em;
    }



    #divSociete .divServices2 p.NomPropre {
        color: #17ace4;
        font-size: 1.75em;
        margin-top: .5em;
        margin-bottom: .5em;
        padding-right: .25em;
        min-height: 2.5em;
    }

    @media (max-width: 1440px) {
        #divSociete .divServices2 p.NomPropre {
            font-size: 1.5em;
        }
    }

    @media (max-width: 768px) {
        #divSociete .divServices2 p.NomPropre {
            font-size: 1.25em;
        }
    }


    #divSociete .divServices2 p.Titre {
        color: white;
        /*    font-size: 1.1em;*/
        padding-right: .25em;
    }


    @media (max-width: 1440px) {
        #divSociete .divServices2 p.Titre {
            font-size: 1em;
        }
    }


    @media (max-width: 768px) {
        #divSociete .divServices2 p.Titre {
            font-size: .85em;
        }
    }




    #divSociete .divServices2 .colGauche .divDepmnt {
        width: 4.8vw;
        padding-right: 1em;
    }

    @media (max-width: 992px) {
        #divSociete .divServices2 .colGauche .divDepmnt {
            width: 5.5vw;
        }
    }



    #divSociete .divServices2 .colDroite .Portrait {
        width: 16.25vw;
        /*min-height: 16.5em;*/
        margin-left: 0px;
        margin-right: 1vw;
    }

    @media (max-width: 992px) {
        #divSociete .divServices2 .colDroite .Portrait {
            width: 29.25vw;
            margin-right: 7vw;
            margin-left: 7vw;
        }
    }



    #divSociete .divServices2 .colDroite .divDepmnt {
        width: 4.8vw;
        padding-right: 1em;
    }

    @media (max-width: 992px) {
        #divSociete .divServices2 .colDroite .divDepmnt {
            width: 5.5vw;
        }
    }



    #divSociete .divServices2 .divDepmnt p {
        position: relative;
        transform: rotate(-90deg);
        transform-origin: top;
        margin-top: 15vw;
        font-size: 2em;
    }

    @media (max-width: 1440px) {
        #divSociete .divServices2 .divDepmnt p {
            font-size: 1.75em;
        }
    }


    @media (max-width: 992px) {
        #divSociete .divServices2 .divDepmnt p {
            margin-top: 29vw;
            left: -0.25em;
            font-size: 1.5em;
        }
    }


    #divSociete .divServices2 .fndGris {
        background-image: url('../Images/fndGris.png');
        background-repeat: repeat-x;
        /*    background-position-y: bottom;*/
        background-position: bottom -9px left 0px;
    }




    /* Liens */
    @media (max-width: 992px) {
        #divPageLiens .divTitreListe h1 {
            margin-left: 7%;
        }
    }


    #divPageLiens {
        margin-bottom: 5em;
    }

        #divPageLiens .divLien {
            position: relative;
            height: 16em;
        }

        #divPageLiens img {
            width: 100%;
        }



        #divPageLiens .divLien .photo {
            width: 50%;
            margin-left: auto;
            margin-right: auto;
        }

        #divPageLiens .divLien .texte {
            position: absolute;
            z-index: 500;
            width: 100%;
            height: 5em;
            left: 0px;
            bottom: 0px;
            padding-left: 14.5%;
            padding-right: 1em;
            padding-top: .5em;
            background-color: gainsboro;
            opacity: .85
        }





    /* Gestion mailing location */
    .divMailingLoc {
        margin-top: 17rem;
        margin-left: 3rem;
        margin-right: 3rem;
    }


        .divMailingLoc .divListeDoc {
            width: 100%;
        }


            .divMailingLoc .divListeDoc label,
            .divMailingLoc .divListeDoc a {
                color: dimgray;
                font-size: 1rem;
                width: auto;
            }

            .divMailingLoc .divListeDoc .pointeur {
                cursor: pointer;
            }


        .divMailingLoc .btnRSA {
            background-color: #c55265;
            border-color: red
        }



    /* Filtrage */
    #divFiltre {
        position: absolute;
        display: block;
        top: 1em;
        left: 33%;
        width: 62%;
        /*border-style: solid;
    border-width: 1px;
    border-color: #aaa !important;*/
    }


    /* Filtrage */
    #divFiltre {
        display: none;
    }

    .cache {
        display: none;
    }