/* zzz CHARTE GRAPHIQUE */

:root{
/* Textes */
--couleur-titres : #F4F6F8;
--couleur-sous-titres : #5F6B76;
--police-texte : 'texte';

/* Div principale (A) */
--couleur-fond-divA : #FFFFFF;
--couleur-bordure-divA : #D5DEE7;

/* Div secondaire (B) */
--couleur-fond-divB : #E6EEF5;       /* #FAFBFC */
/*bordure accentuée : #244B73*/
/*bordure verte : #4F6F64*/

/* Div générales */
--bordure : 1px dotted cadetblue; /*1px solid #0000003d;*/
--margesInternes : 1vw 2vw 1vw 2vw; /* haut | droit | bas | gauche */
--fondDiv : white;
--arrondiDiv : 0.2vw;
--ombreDiv : 0vw 0vw 0.2vw #00000030;

}

/* polices */
@font-face {
    font-family: 'texte';
    src: url('../polices/texte.ttf') format('truetype');
}
@font-face {
    font-family: 'sousTitre';
    src: url('../polices/sousTitre.ttf') format('truetype');
}

body{
    background-color: #F4F6F8;
    margin: 0;
}


button{
   /* background-color: #cddde9;
    border: 1px solid #999;
    padding-right: 1.5vw;
    padding-left: 1.5vw;
    padding-top: 2vh;
    padding-bottom: 2vh;
    border-radius: 1vw;
    transition: 0.5s ease background-color;*/
    background-color: transparent;
    border: none;
    padding-right: 0vw;
    padding-left: 0vw;
    padding-top: 0.8vh;
    padding-bottom: 0.2vw;
    border-radius: 0;
    transition: 0.8s ease background-color;
    text-decoration: underline 3px orange;
    margin-top: 2vh;
}
button:hover{
    /*background-color: #eed0d0;*/
    background-color: orange;
    cursor: pointer;
}

/* bouton principal */
button .boutonA{
    background-color: #E28A4A;
    border: none;
    color: white;
}

/* bouton secondaire */
.boutonB{
    background-color: #4c7c7e14; /*transparent;*/
    text-decoration: none;
    border: 1px solid var(--couleur-bordure-divA);
    padding-right: 1.5vw;
    padding-left: 1.5vw;
    padding-top: 2vh;
    padding-bottom: 2vh;
    border-radius: 0;
    transition: 0.8s ease all;
    font-size: medium/*1vw*/;
    font-family: 'texte';
    color:white;
    font-weight: bold;
}
.boutonB:hover{
    /*background-color: #5f9ea0b2; /*#0000001c;*/
    background-color: white;
    color: #2b4748;
}

.boutonD{
    background-color: #4c7c7e14; /*transparent;*/
    text-decoration: none;
    border: 1px solid var(--couleur-bordure-divA);
    padding-right: 1.5vw;
    padding-left: 1.5vw;
    padding-top: 2vh;
    padding-bottom: 2vh;
    border-radius: 0;
    transition: 0.8s ease all;
    font-size: medium /*1vw*/;
    font-family: 'texte';
}
.boutonD:hover{
    background-color: #5f9ea0b2; /*#0000001c;*/
}


/* bouton C */
.boutonC{
    background-color: cadetblue;
    padding: 1vw 2vw 1vw 2vw;
    text-decoration: none;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    font-family: var(--police-texte);
    transition: 0.5s ease background-color;
    font-size: medium/*1vw*/;
}
.boutonC:hover{
    background-color: #98c4c6; /*#0000001c;*/
}

.boutonSansCss{
    text-decoration: none;
    margin-top: 0;
    font-size: small/*0.8vw*/;
    font-family: 'texte';
}
.boutonSansCss:hover{
    background-color: transparent;
    cursor: pointer;
}

a{
    color: black;
    text-decoration: none;
    margin-top: auto;
    margin-bottom: auto;
    font-family: var(--police-texte);
    transition: 0.5s ease all;
}
a:hover{
    color: cadetblue;
}
.boutonD a:hover{
    color:black;
}

p{
    font-family: var(--police-texte);
    font-size: /*1vw*/medium;
    text-align: justify;
}

select option{
    font-family: 'texte';
    font-size: medium;
}

/* zzz Modification bouton li => pour les messages de form_error */
li::marker {
    content: "⚠️ ";
    font-size: small/*0.8vw*/;
    font-style: initial;
}

li{
    color:red;
    font-family: 'texte';
    font-size: small/*0.7vw*/;
    font-style: italic;
    text-align: left;
}

#lienContactMQ{
    display: none;
}


/* zzz Formulaires */

select{
    padding-left: 1vw;
    padding-right: 1vw;
    padding-top: 0.5vw;
    padding-bottom: 0.5vw;
    font-family: texte;
    background-color: white;
    border-radius: 1.2vw;
    font-size: medium/*1.0vw*/; /* AGRANDI POUR ACCUEIL */
}

textarea{
    width: 96%;
    border-radius: 0.4vw;
    border: var(--bordure);
    height: 42vh;
    padding: 2%;
    margin-bottom: 2vh;
    font-size: medium/*0.8vw*/;
    font-family: var(--police-texte);
}

label{
    font-family: 'texte';
    font-size: medium;
}

h6{
    font-family: 'texte';
    font-size: medium;
}

input{
    border-radius: 0.4vw;
    border: var(--bordure);
    padding-left: 2%;
    padding-right: 2%;
    font-size: medium/*0.8vw*/;
    font-family: var(--police-texte);
    height: 4vh;
}

input[type="checkbox"] {
    height: auto;
}

input[type="radio"] {
    height: auto;
}

input::placeholder{
    color: #387f82;
    font-style: italic;
    font-size: medium/*0.9vw*/;
}
textarea::placeholder{
    color: #387f82;
    font-style: italic;   
    font-size: medium/*0.9vw*/; 
}

/* div "divGenerale" */
.divGenerale{
    border: var(--bordure);
    padding: var(--margesInternes);
    background-color: var(--fondDiv);
    border-radius: var(--arrondiDiv);
    box-shadow: var(--ombreDiv);
    margin-bottom: 4vh;
}

.divGeneralePleinePage{
    border: var(--bordure);
    padding: var(--margesInternes);
    background-color: var(--fondDiv);
    border-radius: var(--arrondiDiv);
    box-shadow: var(--ombreDiv);
    margin-bottom: 4vh;
    width: 80vw;
    margin-left: auto;
    margin-right: auto;
    margin-top: 7vh;
    margin-bottom: 2vh;
}

.divGeneralePleinePage h2{
    font-family: 'texte';
    text-align: center;
}

.divGeneralePleinePage li{
    color: black;
    font-size: medium/*1vw*/;
    font-style: normal;
}

.divGeneralePleinePage li::marker{
    content: "🐾 ";
    font-size: medium/*1.1vw*/;
    font-style: initial;
}

/* div pour centrer bouton */
.divBouton{
    width: 100%;
    text-align: center;
    margin-bottom: 7vh;
}

.divBoutonDroite{
    width: 100%;
    text-align: right;    
}



/* zzz BASE.HTML.TWIG ***********************/

header{
    width: 100%;
}

.bandeauTop{
 /*   background: linear-gradient(rgba(0, 0, 0, 0.16), rgba(0, 0, 0, 0.16)), url("../images/fondpage.jpg");*/
    background-color: #244B73B2;
    height: 3vh;
}

.liensMenuTop button{
    margin-bottom: 1vh;
}

.menuTop{
    justify-content: space-between;
    display: flex;
    background-color: white;
    border-bottom: 6px solid cadetblue;
}

.logoMenuTop{
    height: 11vh;
}

.logoMenuTop img{
    height: 100%;
}

.liensMenuTop{
    margin-top: auto;
    margin-bottom: auto;
    margin-right: 3%;
    gap: 2vw;
    display: flex;
}

.divTitrePage{
   /* background-image: url("../images/fondpage.jpg");*/
    /*background: linear-gradient(rgba(0, 0, 0, 0.16), rgba(0, 0, 0, 0.16)), url("../images/fondpage2.png");*/
    background: linear-gradient(to right, rgba(0, 0, 0, 0), rgb(94, 135, 136)), url("../images/fondpage5.png");
    background-size: cover;
    background-position: center;
    margin-top: 0;
   /* height: 23vh;*/
    text-align: center;
    padding-top: 9vh;
    border-radius: 0% 0% 2% 2%;
}

.divTitrePageV2{
    /*background: linear-gradient(150deg,rgb(19, 78, 80) 0%, rgba(157, 155, 155, 0.26) 70%, rgba(157, 155, 155, 0.26) 100%), url("../images/fondpage.png");*/
    /*background: linear-gradient(90deg,rgba(75, 107, 108, 0) 0%, rgba(157, 155, 155, 0) 70%, rgba(157, 155, 155, 0) 100%), url("../images/Design sans titre2.png");*/
    background: linear-gradient(150deg,rgba(95, 158, 160, 0) 0%, rgba(99, 126, 155, 0) 70%, rgba(99, 126, 155, 0) 100%), url("../images/fondProfilPro3.png");
    background-size: cover;
    background-position: right;
    margin-top: 0;
    text-align: center;
    padding-top: 6vh;
    border-radius: 0% 0% 2% 2%;
}

.divTitrePage h1, .divTitrePage h2, .divTitrePageV2 h2{
    margin-top: auto;
    margin-bottom: auto;
    font-size: xxx-large/*3.5vw*/;
    color: white;
    /*font-family: var(--police-texte);*/
    font-family: 'sousTitre';
    text-align: right;
    padding-right: 7vw;
    text-shadow: 1px 1px 2px #00000085;
}

.corps{
   /* width: 80%;
    margin-left: auto;
    margin-right: auto;*/
    margin-top: 7vh;
    margin-bottom: 7vh;
    display: flex;
    width: 93%;
    margin-left: auto;
    margin-right: auto;
    gap: 3%;
}

.corpsContenu{
    width: 75%;
}

.corpsPubs{
    width: 25%;
   /* background-color: #4c7c7e;*/
    /*border: 1px solid black;*/
}

.pubBas{
    display: none;
    margin-top: 10vh;
    width: 97%;
    margin-left: auto;
    margin-right: auto;
}

.corpsPubsMQ{
    display: none;
}

footer{
    /*width: 100%;
    background-color: #244B73B2;*/
    width: 100%;
    border-top: 7px dotted cadetblue;
    padding-top: 5vh;
    padding-bottom: 5vh;
    margin-top: 19vh;
    background-color: #e6ecee;
}

.footerContenu{
    display: flex;
    width: 90%;
    gap: 16%;
    margin-left: auto;
    margin-right: auto;
}

.footerDivLogo img{
    width: 54%;
}

.footerGauche{
    width: 60%;
}

.profilProBandeauTop{
    text-align: left;
    display: flex;
    width: 88%;
    justify-content: left;
    gap: 5vw;
    padding-bottom: 5vh;
    margin-left: auto;
    margin-right: auto;
}

.footerDivLiens{
    width: 30%;
}

#flashboite{
    position: fixed;
    top: 20px;
    right: 20px;
    z-index: 9999;    
}

.flash {
    padding: 15px 20px;
    margin-bottom: 10px;
    border-radius: 8px;
    color: white;
    font-weight: bold;
    opacity: 0.95;
    transition: opacity 0.5s ease, transform 0.5s ease;
    font-family: 'texte';
}

/* Types de messages */
.flash-success {
    background-color: #4CAF50;
}

.flash-error {
    background-color: #f44336;
}

.flash-warning {
    background-color: #ff9800;
}

.flash-info {
    background-color: #2196F3;
}

/* animation disparition */
.flash.hide {
    opacity: 0;
    transform: translateY(-20px);
}


/* zzz PAGES D'ERREUR *************** */

.erreur-page {
    width: 80%;
    margin-left: auto;
    margin-right: auto;
    font-size: large/*2vw*/;
    height: 45vh;
    margin-top: 14vh;
}

.erreur-page p {
    font-size: large/*1.5vw*/;
    text-align: center;
}






















/* zzz PAGES PUBLIQUES */






/* zzz ACCUEIL ************** */

#divAccueilTop{
    justify-content: right;
    color: white; 
    display:flex;
    padding-top: 6vh;
    padding-bottom: 10vh;
    text-align: right;
}

.accueilBandeau{
    width: 50%;
    /*margin-left: auto;
    margin-right: auto;*/
}

#accueilForm{
    /*display:flex;*/
    justify-content: right;
    gap: 2vw;
    margin-bottom: 0vh;
    margin-top: 6vh;
    display: grid;
    margin-right: 7vw;
}

#accueilForm p{
    color: white;
    font-size: larger/*1.4vw*/;
    text-shadow: 1px 1px 2px #00000085;
}

#divAccueilForm{
    display: flex; 
    gap: 2vw; 
    justify-content: right;
}

#div2AccueilForm{
    display: flex; 
    gap: 2vw; 
    justify-content: right;
}

#recherche_pro_accueil_typeService{
    height: fit-content;
    margin-top: auto;
    margin-bottom: auto;
}

#recherche_pro_accueil_communeNom{
    padding-left: 1vw;
    padding-right: 1vw;
    padding-top: 0.5vw;
    padding-bottom: 0.5vw;
    font-family: texte;
    background-color: white;
    border-radius: 1.2vw;  
    height: fit-content;  
    margin-top: auto;
    margin-bottom: auto;
    font-size: medium/*1.0vw*/;
}

.divAccueilArguments{
    display: flex;
    width: 69%;
    margin-right: auto;
    margin-left: auto;
    justify-content: space-around;
    margin-top: 11vh;
    gap: 4vw;
    text-align: center;
    border-bottom: 7px dashed cadetblue;
    padding-bottom: 14vh;
}

.divAccueilArgument{
    display: block;
    flex: 1;
}

.divAccueilArgument h4{
    font-size: large/*1.3vw*/;
    text-align: center;
    font-family: 'texte';
}

.divAccueilArgument p{
    font-size: medium/*1vw*/;
    text-align: center;    
}

.divAccueilArgument img{
    width: 14vw;
    height: 14vw;
    border-radius: 50%;
    object-fit: cover;
    overflow: hidden;
    object-position: top;
    border: 10px dotted cadetblue;
    padding: 5%;
    transition: 0.4s ease all;
}
.divAccueilArgument img:hover{
    border: 10px dotted #98c7c8;
}

.divAccueilAppelPros{
    text-align: center;
    width: 70%;
    margin-right: auto;
    margin-left: auto;
    margin-top: 18vh;
    margin-bottom: 18vh;
    border: 1px solid black;
    padding: 1vw 4vw 1vw 4vw;
    background-color: cadetblue;
    font-size: medium/*1.2vw*/;
}

.divAccueilAppelPros p{
    font-size: medium/*1.2vw*/;
}

.divAccueilAppelPros h2{
    font-size: large/*2vw*/;
    font-family: 'sousTitre';
}

.divAccueilCommentCaMarche{
    text-align: center;
    margin-bottom: 18vh;
    padding-top: 10vh;
    font-family: 'texte';
}

.divAccueilCommentCaMarche h4{
    font-size: large/*1.2vw*/;
}

.divAccueilCommentCaMarcheSsDiv{
    display: flex;
    width: 78%;
    margin-right: auto;
    margin-left: auto;
    justify-content: space-between;
    margin-top: 11vh;
    gap: 10%;
}

.divAccueilCaMarche{
    border: 1px solid #00000040;
    padding: 2vw 1vw 2vw 1vw;
    background-color: cadetblue;
}

#divAccueilCaMarche{
    transition: 0.5s ease all;
}
#divAccueilCaMarche:hover{
    background-color: #61a2a40f;
}

#divAccueilCaMarche img{
    width: 10vw;
    height: 10vw;
    object-fit: cover;
    overflow: hidden;
    object-position: top;  
}

.divAccueilCommentCaMarche h2{
    font-size: xx-large/*2.5vw*/;
    font-family: 'sousTitre';
}

.divAccueilChiffres{
    text-align: center;
    /*margin-bottom: 18vh;*/
    display: none;
}

.divAccueilChiffres h2{
    font-size: xx-large /*2.5vw*/;
    font-family: 'sousTitre';
    margin-bottom: 10vh;
}

.divAccueilChiffresSsDiv{
    display: flex;
    width: 67%;
    margin-right: auto;
    margin-left: auto;
    justify-content: space-between;
    gap: 13%;
}

.divAccueilChiffre{
    border: 7px dotted cadetblue;
    border-radius: 10%;
    padding-bottom: 2%;
    flex: 1;
    background-color: white;
}

.divAccueilChiffre h6{
    font-size: xxx-large/*8vw*/;
    margin-top: 5vh;
    margin-bottom: 0vh;
    font-family: 'texte';
    color: #3f6566;
    text-shadow: #000000a3 1px 1px 1px;
}

.divAccueilChiffre p{
    font-size: large/*1.3vw*/;
    width: 74%;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
}

.divAccueilDerniersProsContactes{
    text-align: center;
    margin-top: 18vh;
}

.divAccueilDerniersProsContactes h2{
    font-size: xx-large /*2.5vw*/;
    font-family: 'sousTitre';
}

.divAccueilDerniersProsContactesSsDiv{
    display: flex;
    width: 80%;
    margin-right: auto;
    margin-left: auto;
    justify-content: space-around;
    margin-top: 11vh;
    gap: 2vw;
}

#divAccueilDernierPro{
    display: flex;
   /* border: 1px solid black;
    padding: 1vw 2vw 1vw 2vw;*/
    gap: 2vw;
    flex: 1;
    padding-top: 3%;
    padding-bottom: 3%;
}

.autocomplete {
    position: relative;
    width: 300px;
}

.autocomplete input {
    width: 100%;
    padding: 8px;
}

.autocomplete-results {
    /*position: absolute;
    top: 100%;
    left: 0;
    right: 0;*/
    color: black;
    list-style: none;
    padding: 0;
    margin: 0;
    font-style: normal;

    border: 1px solid #ccc;
    background: white;

    max-height: 200px;
    overflow-y: auto;

    display: none;
}

.autocomplete-results li {
    padding: 8px;
    cursor: pointer;
    color: black;
    font-style: normal;
    font-size: medium/*1.0vw*/;
}
.autocomplete-results li::marker{
    content: none;
}

.autocomplete-results li:hover {
    background: #f2f2f2;
}

#commune-results {
    /*position: absolute;
    top: 0;
    left: 0;*/
    width: 100%;
    border-radius: 2%;
    color: #487375;
    font-family: 'texte';
}

#divAccueilDernierPro img{
    height: 100%;
    width: 9vw;
    object-fit: cover;
    object-position: top;
    overflow: hidden;
}

.divAccueilDernierProInfos{
    display: block;
    text-align: left;
    font-size: medium/*1vw*/;
    font-family: 'texte';
}

.divAccueilDernierProInfos h2{
    font-size: medium/*1.2vw*/;
}

.divAccueilDernierProInfos p{
    color: cadetblue;
    text-align: left;
}

.divAccueilJeSuisUnPro{
    width: 70%;
    margin-right: auto;
    margin-left: auto;
    justify-content: space-around;
    margin-top: 11vh;
    background-color: #5f9ea0b8;
    padding: 1vw 2vw 2vw 2vw;
    margin-bottom: 11vh;
    text-align: center;
    /*border: 1px solid black;*/
    box-shadow: 0vw 0vw 0.8vw #0000005c;
}

.divAccueilJeSuisUnPro h2{
    font-size: xx-large/*2vw*/;
    font-family: 'sousTitre';
}

.divAccueilJeSuisUnProSsDiv{
    display: flex;
    width: 90%;
    margin-right: auto;
    margin-left: auto;
    gap: 6%;
}

.divAccueilJeSuisUnProSsDiv p{
    text-align: left;
    margin-top: 1%;
    margin-bottom: 1%;
    font-size: medium/*1vw*/;
}

.divAccueilJeSuisUnProSsDivImg img{
    width: 13vw;
    object-fit: cover;
    object-position: top;
    overflow: hidden;
}

.divAccueilJeSuisUnProSsDivTexte li{
    color: black;
    font-family: 'texte';
    font-size: medium/*1vw*/;
    font-style: normal;
}

.divAccueilJeSuisUnProSsDivTexte ul{
    text-align: justify;
    font-family: 'texte';
    font-size: medium/*1vw*/;
    margin-top: 0;    
}

.divAccueilJeSuisUnProSsDivTexte li{
    padding-bottom: 2%;
}

.divAccueilJeSuisUnProSsDivTexte li::marker{
    content: normal;
    font-size: medium/*1vw*/;
    font-style: initial;
}

.divAccueilBouton{
    width: 100%;
    text-align: center;
    margin-bottom: 12vh;
border-bottom: 7px dashed cadetblue;
  padding-bottom: 13vh;
}

#boutonFAQAccueil{
    width: 37vw; 
    height: 13vh; 
    font-size: larger/*1.5vw*/;
}

#divBoutonAccueilCreerComptePro button{
    background-color: #4c7c7e54;
    border: 1px solid var(--couleur-bordure-divA);
}

.divAccueilBlog h2{
    text-align: center;
    font-size: xxx-large;
    font-family: 'sousTitre';
    margin-bottom: 9vh;
}

.sousDivAccueilBlog{
    display:flex; width: 70vw;
    margin-left: auto;
    margin-right: auto; gap: 2vw;
    justify-content: center;
}

.articleBlogAccueil{
    width:20vw; 
    border-radius: 7%;
    box-shadow: 0vw 0vw 0.2vw #125281a3;
    overflow: hidden; 
    background-color: #daeef1;
    transition: 0.3s ease all;
}
.articleBlogAccueil:hover {
    box-shadow: 0vw 0vw 0.4vw #125281;
}

.articleBlogAccueil img{
    width: 100%;
    object-fit: cover;
    object-position: top; 
    height: 20vh;
}

.articleBlogAccueil div{
    padding:1vw
}

.articleBlogAccueil div h4{
    font-family: 'texte';
    font-size: large; 
    margin-top: 0;
}

.articleBlogAccueil div p{
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
    transition: 0.5s ease all;
}
.articleBlogAccueil:hover{
    color:black;
}
.articleBlogAccueil{
    color:black;
}



/* zzz RECHERCHER PRO ***********************/

.rechercherProBody{
    display: flex;
    justify-content: space-between;
}

#rechercherProFiltre{
    width: 20%;
    height: fit-content;
}

.filtreRechProRows{
    margin-bottom: 2vh;
    row-gap: 1vw;
    display: grid;
    margin-top: 2vh;
}

#filtre_chercher_pension_canine_typeAccueil{
    display: grid;
    margin-bottom: 12%;
}

.rechercherProResultats{
    width: 70%;
}

.formFiltre label{
    font-family: 'texte';
    font-size: medium/*1vw*/;
    font-weight: bold;
    margin-top: auto;
    margin-bottom: auto;
}

#filtre_chercher_pension_canine_typeAccueil label{
    font-weight: normal;
}

.filtreRechProLabelsWidgets label{
    font-weight: normal;
}

.filtreRechProRows div{
    display: flex;
    gap: 1vw;
}

#sousDivProRechercherUnPro{
    width: 80%;
}

#nomProRechercherPro{
    font-family: 'sousTitre'; 
    font-size: larger/*1.2vw*/;   
    text-align: justify;
}

#texteRechercheRechercherProFiltre{
    font-style: italic; 
    font-size: small/*0.8vw*/; 
    margin-bottom: 4vh;
}

#divBoutonRechercherProFiltre{
    text-align: left; 
    margin-bottom: 2vh;
}

#divPCphotoProRechercherPro{
    display: block;
}

#divMQphotoProRechercherPro{
    display: none;
}

#tarifsPensionNACProRechercherPro{
    display:flex; 
    justify-content: space-between; 
    gap: 1vw;
}


#filtre_chercher_pension_canine_rayon, #filtre_chercher_pension_feline_rayon, #filtre_chercher_pension_nac_rayon, #filtre_chercher_pension_equine_rayon,
#filtre_chercher_educateur_canin_rayon,
#filtre_promenades_chien_rayon, 
#filtre_chercher_toiletteur_chat_rayon,
#filtre_chercher_toiletteur_chien_rayon,
#filtre_chercher_toiletteur_nac_rayon,
#filtre_chercher_vad_rayon{
    width: 26%;
}

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

.rechProEducCanin p{
    margin-bottom: 0;
}

.rechProVADAnimaux{
    display: flex; 
    gap: 2vw; 
    font-size: large/*2vw*/;  
}

.rechProVADAnimaux p{
    font-size: large/*2vw*/;
    margin-bottom: 0;
    margin-top: 0;    
}




/* zzz PROFIL PRO *************/

#h3VisibleOrdiProfilPro{
    display: block;
}
#h3VisibleMQProfilPro{
    display: none;
}

.contenuServiceProfilPro{
    display: flex; 
    gap: 5vw;
}

.aproposServiceProfilPro{
    width: 56%;
}

.divServiceProfilPro{
    border: none;
    padding: 1vw;
    padding-left: 3vw;
    padding-right: 3vw; 
    margin-bottom: 2vh;
    flex: 1;
    display:none;
    border: none;
    box-shadow: none;
    border-top: 4px dotted #D5DEE7;
}

.profilProBandeauTopInfos{
    margin-top: 4vh; 
    width: 57%; 
    padding-left: 0;
}

.profilProBandeauTopInfos img{
    width: 3vw;
    height: 3vw;
    margin-top: 2vh;
    margin-bottom: 0vh;
}

#communeProfilPro{
    font-size: x-large; 
    margin-top: 0;
}

#phraseAccrocheProfilPro{
    font-size: large; 
    margin-top: 0;
    margin-bottom: 0;
    font-style: italic;
    color: #a2a9b2;
}

#coordonneesProfilPro{
    display: block; 
    color: white; 
    text-align: left; 
    margin-bottom: 7vh;  
    margin-top: 3vh; 
    font-size: large;
}

#boutonContactProfilPro{
    background-color: #c4c5c55e;
    text-decoration: none;
    border: 1px solid var(--couleur-bordure-divA);
    padding-right: 1.5vw;
    padding-left: 1.5vw;
    padding-top: 2vh;
    padding-bottom: 2vh;
    border-radius: 0;
    transition: 0.8s ease all;
    font-size: medium;
    font-family: 'texte';
    color: white;
    font-weight: bold;    
}
#boutonContactProfilPro:hover{
   background-color: #366a6c;
    color: #fff;
    border: 1px solid #209edc; 
}

.profilProBandeauTopInfos h2{
    text-align: left;
}

.profilProBandeauTopInfos p{
    text-align: left;
    font-size: large;
}

#divInfosImportantesProfilPro{
    display:flex; 
    justify-content: space-around;
}

#ssDivInfosImportantesProfilPro{
    width: 31%; 
    display: block;  
    text-align: right; 
    border: none; 
    margin-top: 5vh;
}

#divLiensReseauxProfilPro{
    height: 3vh;
}

#servicesTopProfilPro{
    text-align: right !important; 
    display: block; 
    margin-top: 7vh;
}

#servicesTopProfilPro p{
        display: inline-block;
        padding: 8px 14px;
        border-radius: 999px;
        background-color: rgba(255,255,255,0.15);
        border: 1px solid rgba(255,255,255,0.3);
        color: white;
        font-size: 0.95rem;
        backdrop-filter: blur(4px);
        width: fit-content;
        margin-top: 0;
        margin-bottom: 1vh;      
        text-align: right;  
        backdrop-filter: blur(8px);
        background: rgba(255,255,255,0.12);
        border: 1px solid rgba(255,255,255,0.2);
}

#boutonSignalerProfilPro{
    border: none;
    padding-top: 0;
    background-color: transparent;
    text-align: right;
    padding-right: 0;
    text-decoration: none;
    transition: 0.8s ease all;
    font-size: medium;
    font-family: 'texte';
    color: white;
    text-shadow: 1px 1px 2px #00000085;
}
#boutonSignalerProfilPro:hover{
    color: #209edc;
    font-weight: bold;
}

#ssDivInfosImportantesProfilPro a{
    color: #05a5ab;
    transition: 0.2s ease all;
}
#ssDivInfosImportantesProfilPro a:hover{
    font-weight: bold;
}

#ssDivInfosImportantesProfilPro a img{
    width: 2vw; 
    height: 2vw; 
    margin-right: 1%;
    transition: 0.3s ease all;
}

#ssDivInfosImportantesProfilPro div img:hover {
    width: 2.3vw;
    height: 2.3vw;
}

#texteAssuProProfilPro{
    font-style: italic; 
    font-size: small/*0.8vw*/; 
    margin-top: 0;
}

#montantEstimatifProfilPro{
    font-size: small/*0.8vw*/; 
}

#divCondPartProfilPro{
    width:56%
}

.containerServicesProfilPro{
    display:block;
    border: var(--bordure);
    background-color: var(--fondDiv);
    border-radius: var(--arrondiDiv);
    box-shadow: var(--ombreDiv);
    margin-bottom: 4vh;
    padding: 0;
}

.divInfosServiceProfilPro{
  display: block !important;
    width: 34%; 
    margin-right: auto; 
    margin-left:auto; 
    font-size: small/*0.8vw*/; 
    justify-content: space-between;
    gap: 3%;
}

.profilProDescription{
    /*DIV*/
    border: var(--bordure);
    padding: var(--margesInternes);
    background-color: var(--fondDiv);
    border-radius: var(--arrondiDiv);
    box-shadow: var(--ombreDiv);
    margin-bottom: 4vh;
    /*FINDIV*/
}

.profilProFlashInfos{
    /*DIV*/
    border: var(--bordure);
    padding: var(--margesInternes);
    background-color: var(--fondDiv);
    border-radius: var(--arrondiDiv);
    box-shadow: var(--ombreDiv);
    /*FINDIV*/   
    display: flex;
    justify-content: space-around; 
}

#tarifsPensionFelineProfilPro{
    flex: 1; 
    padding-left: 0;
}

#tarifsPensionFelineProfilPro h6{
    font-size:small; 
    margin-top:0;
}

#tarifPrincipalProfilPro{
    font-size: medium;
}

.titreServiceProfilPro{
   /* background-color: cadetblue;
    padding-top: 2vw;
    padding-bottom: 2vw;
    text-align: center;
    font-size: xx-large/*2vw*//*;
    border: 2px solid #00000036;
    color: #000000b5;  */ 
    background-position: center;
    background-size: cover;
    font-family: 'sousTitre';
    background-image: url("../images/biancavandijk-cat-8704084.png");
    color: #000000b5;
    padding-top: 2vw;
    padding-bottom: 2vw;
    text-align: center;
    font-size: xxx-large;
    box-shadow: 0vw 0vw 0.2vw #000000f2;
    margin-top: 0;
    margin-bottom: 0;
}

.divBoutonsServicesProfilPro{
    padding-right: 2vw;
    padding-left: 2vw; 
    display: grid;
    gap: 2%;
    grid-template-columns: repeat(6, 2fr);
    padding-bottom: 3vh;
    padding-top: 1vh;
}

.divServiceProfilPro h3{
    font-size: xx-large/*1.5vw*/;
    color: #497a7b;    
    text-align: center;
    font-family: 'sousTitre';
}

.divServiceProfilPro h5{
    color: #497a7b;
    font-size: large/*1vw*/;
    margin-bottom: 2vh;
    /*text-decoration: 3px underline dotted cadetblue; */
    font-family: 'texte';
}

.divServiceProfilPro h6{
    color: #497a7b;
    font-size: small/*0.8vw*/; 
    margin-bottom: 1vh;
}

.divInfosServiceProfilPro p{
    margin-top: 0.5vh;
    margin-bottom: 0.5vh;    
    font-size: small/*0.8vw*/; 
}

.divBoutonServicesProfilPro{
    width: 100%;
    text-align: center;
    margin-top: 2%;
}

.divAutresInfosServiceProfilPro{

}

.divAutresInfosServiceProfilPro p{
    font-size: small/*0.8vw*/; 
}

.profilProBandeauTopPhoto img{
    border-radius: 50%;
    object-fit: cover;
    overflow: hidden;
    height: 35vh;
    width: 35vh;
    margin-bottom: 5vh;
    object-position: top;
}

.profilProBandeauTopInfos p{
    color: white;
}

.profilProBandeauTopInfos button{
   /* background-color: cadetblue;
    padding: 1vw;
    text-decoration: none;*/
}

.profilProPhotoProfilDiv{
    text-align: left;
}

.profilProPhotoProfilDiv img{
    width: 23vw;
    height: 23vw;
    object-fit: cover;
    object-position: top;
    overflow: hidden;
    border: 5px solid cadetblue;
    border-radius: 50%;
}

#ajouterServiceTexte p{
    font-size: medium/*0.8vw*/; 
    margin-top: 0;
    margin-bottom: 0;    
}

#ajouterServiceNom{
    display: flex;
    justify-content: center;
}

#ajouterServiceNom p{
    margin-bottom: auto;
    margin-top: auto;
    margin-right: 2vw;
}

#pension_canine_nomPension{
    width: 50%;
}

#ajouterServiceAccueil{
    display: block;
    justify-content: space-around;
}

#ajouterServiceAccueil div{
    display: flex;
    justify-content: space-around;
}

#ajouterServiceConditionsAccueil h6{
    font-size: medium/*1vw*/;
    text-align: left;
    margin-bottom: 2vh;
    margin-top: 2vh;
}

#ajouterServiceConditionsAccueil input{
    margin-top: auto;
    margin-bottom: auto;
}

#pension_canine_typeAccueil{
    justify-content: center;
    display: flex;
}

#pension_canine_typeAccueil label{
    font-size: var(--police-texte);
    margin-right: 3%;
}

#ajouterServiceConditionsAccueil div{
    display: flex;
    gap: 2%;
}

#pension_canine_preRencontre{
    justify-content: center;
}

#ajouterServiceTarif{
  /*  display: flex;
    justify-content: center;
    gap: 2%;*/ /*modifié pour PF */
    display: block;
    text-align: center;
}

#pension_feline_tarifGlobalParNuit, #pension_canine_tarifGlobalParNuit{
    margin-right: 1vw;
}

#pension_canine_tarifGlobalParNuit{
    width: 2vw;
    margin-top: auto;
    margin-bottom: auto;
}

#ajouterServiceTarifsParticuliers input{
    margin-top: auto;
    margin-bottom: auto;
}

#pension_canine_tarifSupplementaire{
    width: 42%;
}

#ajouterServiceTarifsParticuliers h6{
    font-size: medium/*1vw*/;
    text-align: center;
}

#ajouterServiceTarifsParticuliers div{
    display: flex;
    gap: 2%;
}

#ajouterServiceAnimauxAcceptes{

}

#ajouterServiceAnimauxAcceptes h6{
    font-size: medium/*1vw*/;
    text-align: center;
}

#ajouterServiceAnimauxAcceptes div{
    display: flex;
    gap: 2%;
    justify-content: center;
}

#ajouterServiceAcompte{
    /*display: flex;
    justify-content: center;
    gap: 2%;*/ /* modifié pour pension féline */
    display: block;
    text-align: center;
}

#ajouterServiceAcompte input{
    margin-top: auto;
    margin-bottom: auto;
}

#ajouterServiceAccueil{
    text-align: center;
}

#pension_feline_acompte{
    margin-right: 1vw;
}

#ajouterServiceBouton{
    width: 100%;
    text-align: center;
}

#ajouterServiceNom input{
    width: 35vw;
}

#vad_AnimauxAcceptes label{
    width: max-content;
}

#vad_zoneIntervention{
    width: 5vw;
}

#vad_AnimauxAcceptes{
    display: flex;
  justify-content: center;
}

#pension_equine_typeAccueil, #pension_equine_accueilCollectifOuIndividuel, #pension_nac_typeAccueil{
    border-radius: 0.4vw;
  padding-top: 0;
  padding-bottom: 0;
  height: 4vh;
}

#pension_equine_placesDisponibles{
    width: 5vw;
}

#pension_nac_tarifLapin, #pension_nac_tarifRongeur, #pension_nac_tarifFuret, #pension_nac_tarifOiseau, #pension_nac_tarifReptile{
    width: 5vw;
}

#pension_nac_tarifSupplementaire{
    width: 18vw;
}

#pension_nac_acompte{
    width: 5vw;
}




/* zzz ENVOYER MESSAGE CLIENT VERS PRO ********* */

.profilProMessageCoordonnees{
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10%;
    width: 84%;
    margin-right: auto;
    margin-left: auto;
    margin-top: 2vh;
    margin-bottom: 4vh;
    row-gap: 3vh;
}

.profilProMessageMessage{
    width: 84%;
    margin-right: auto;
    margin-left: auto;
}


/* zzz ENVOYER DDE A PRO **************** */

#envoyer_demande_service_nombreChats, #envoyer_demande_service_nombreLapins, #envoyer_demande_service_nombreRongeurs, #envoyer_demande_service_nombreOiseaux, #envoyer_demande_service_nombreReptiles, #envoyer_demande_service_nombreFurets, #envoyer_demande_service_nombreChiens, #envoyer_demande_service_nombreChevaux, #envoyer_demande_service_nombreFerme, #envoyer_demande_service_nombreAutre{
    width: 4vw;
    margin-left: 1vw;    
    margin-right: 1vw;
}

#envoyer_demande_service_dateDebut, #envoyer_demande_service_dateFin{
    margin-left: 1vw;
    margin-right: 1vw;
}

#serviceTitreEnvoyerDde{
    text-align: center; 
    font-family: 'texte'; 
    font-size: large/*1.4vw*/;
}

#communeEnvoyerDdePro{
    display:flex; 
    gap: 5%;
}

#communeautocomplEnvoyerDdePro{
    margin-top: auto; 
    margin-bottom: auto;
}

#animauxAGarderEnvoyerDde{
    display: flex; 
    justify-content: space-around;
}

#nombreChiensPromenadesEnvoyerDde{
    display: flex; 
    gap: 5%;
}

#animauxVADEnvoyerDde{
    display: grid;   
    grid-template-columns: repeat(3, 1fr);
}



/* zzz RECHERCHER UN PRO */

#divProRechercherUnPro{
    transition: 1.2s ease background-color;
    display: flex;
    justify-content: space-between;
    box-shadow: 0 2px 8px rgba(76, 124, 126, 0.15);
    color: black;
    transition: all 0.25s ease;
}
#divProRechercherUnPro:hover{
    /*background-color: #5f9ea082;*/
    box-shadow: 0 8px 24px rgba(76, 124, 126, 0.3);
    transform: translateY(-3px);
    color: black;
}

#divProRechercherUnPro div img{
    width: 10vw;
    height: 10vw;
    object-fit: cover;
    object-position: top;
    overflow: hidden;
    border-radius: 100%;
    border: 2px solid #4c7c7e;
}



/*zzz ENVOYER MESSAGE CLIENT VERS PRO ***** */

#divMessageClientPro{
    text-align: center;
}

#envoyerDdeDivIdentite h3{
    font-family: 'texte';
}

.profilProMessageMessage h4{
    text-align: center; 
    font-size: medium/*1.2vw*/;
    font-family: 'texte';
}


/* zzz SIGNALER PRO ********* */

#divSignalerPro{
    text-align: center;
}

#sousTexteSignalerPro{
    font-style: italic; 
    font-size: small/*0.8vw*/; 
}



/* zzz ENVOYER DDE */

#divEnvoyerDde{
    text-align: center;
}

#envoyerDdeDivIdentite{
    display: flex;
    justify-content: space-around;
}

#envoyerDdeDivIdentite input{
    margin-bottom: 5%;
    width: 78%;
}

#envoyerDdeChiens{
    gap: 2%;
    justify-content: center;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
}

#envoyerDdeChiens input{
    width: 3vw;
}

.envoyerDdeSousDiv{
    display: flex;
    gap: 4%;
}



/* zzz FAQ ********* */

.divFAQ{
    display: flex;
    width: 90%;
    margin-left: auto;
    margin-right: auto;
    gap: 2%;
    margin-top: 9vh;    
}

#FAQPro{
    flex: 1;
}

#FAQPro h2{
    text-align: center;
    font-family: 'texte';
    margin-top: 3vh;
    margin-bottom: 1vh;
    font-size: large/*1.5vw*/;
}

#FAQClient{
    flex: 1;
}

#FAQClient h2{
    text-align: center;
    font-family: 'texte';
    margin-top: 3vh;
    margin-bottom: 1vh;
    font-size: large/*1.5vw*/;
}

.FAQQuestion{
    margin-bottom: 1vh;
}

.FAQQuestion h2{
    font-family: 'texte';
    margin-top: 6vh;
    margin-bottom: 2vh;
    color: cadetblue;
    text-align: left !important;
}

.FAQQuestion p{
    margin-top: 0;
}

.FAQQuestion a{
    color: #05a5ab;
    transition: 0.3s ease all;
}

.FAQQuestion a:hover{
    color: #cd7607;
}

#FAQContact{
    width: 86vw;
}

#FAQContact p{
    font-family: var(--police-texte);
    font-size: large/*1.5vw*/;
    text-align: center;
    color: cadetblue;
    font-weight: bold;
}

#divBoutonFAQ{
    margin-bottom: 1vw;
}

.reponse {
    display: none;
    margin-top: 10px;
}

.question {
    cursor: pointer;
    position: relative;
}

.question::after {
    content: "›";
    position: absolute;
    transition: transform 0.3s ease;
    font-size: large/*2vw*/;
    padding-left: 1vw;
}

.question.active::after {
    transform: rotate(90deg);
}


/* zzz CONTACT EXT ************** */

#divContact h2{
    text-align: center;
    font-family: 'texte';
}

#sousDivContact{
    display: flex;
    justify-content: space-around;
}

#sousDivContact div{
    width: 30%;
}

#contacter_admin_ext_prenomExp, #contacter_admin_ext_nomExp, #contacter_admin_ext_emailExp, #contacter_admin_ext_telephoneExp{
    width: 90%;
}




/* zzz MENTIONS LEGALES ********** */

#texteML{
    text-align: right;
    padding-right: 7vw;
    font-size: large/*1.5vw*/;
    color: white;
    font-family: 'texte';
    text-shadow: 1px 1px 2px #00000085;
    margin-top: 0;    
}

.divML{
    margin-top: 9vh;
}


/* zzz CGU CGV ********** */

#divCGU{
    
}

#divCGU h2{
    font-family: 'texte';
    margin-top: 6vh;
}

#divCGU li{
    color: black;
    font-family: 'texte';
    font-size: medium/*1vw*/;
    font-style: normal;
}

#divCGU li::marker{
    content: "🐾 ";
    font-size: medium/*1vw*/;
    font-style: initial;
}

#GCul li::marker{
    content: "🍪 ";
    font-size: small/*0.8vw*/; 
}

.ulNormal li::marker{
    content: normal !important;
}


/* zzz COOKIES */

.cookie-banner a {
    color: #000000;
    text-decoration: underline;
}

.cookie-actions button {
    border: none;
    padding: 6px 10px;
    border-radius: 6px;
    cursor: pointer;
    font-size: 13px;
}

#accept-cookies {
    background: #4CAF50;
    color: white;
}

#reject-cookies {
    background: #eee;
}

.cookie-banner {
    animation: fadeIn 0.4s ease;
    position: fixed;
    bottom: 15px;
    background-color: #a5bcbd;
    padding-left: 2vw;
    padding-right: 2vw;
    border-radius: 0.5vw;
    display: flex;
    width: 50vw;
    justify-content: space-around;
}

@keyframes fadeIn {
    from { opacity: 0; transform: translate(-50%, 20px); }
    to { opacity: 1; transform: translate(-50%, 0); }
}

/* zzz BLOG */

#titreAutresArticlesBlog{
    display: none;
    font-size: x-large;
    margin-bottom: 3vh;
}

.blogMQ{
    display: none;
}

.blogDivGlobale{
    display:flex; gap: 3vw; width: 93vw;
    margin-left: auto;
    margin-right: auto;
   /* margin-top: 18vh;*/
}

.blogDivGauche{
    width:72%
}

.blogDivDernierArt{
    background-color: white;
    box-shadow: var(--ombreDiv);
    padding: 1vw 3vw 1vw 3vw;
    /*margin-top: 5vh;*/
    margin-bottom: 2vh;
}

.blogDivDernierArt h2{
    font-family: 'sousTitre';
    font-size: xxx-large;
    margin-bottom: 8vh;
}

.infosArticleBlog{
    display:flex; justify-content: left;
}

.infosArticleBlog p{
    font-size:small;
}

.imgArticleBlog{
    float: right;
    margin-left: 2vw;
    width: 56%;
    margin-top: 3vh;
}

.blogDivDernierArt img{
    width: 100%; 
    height: 48vh;
    object-fit: cover;
    object-position: top;
}

.blogDivDernierArt small{
    font-family: 'texte'; font-style: italic;
}

.blogDivDernierArt p{
    font-size: large;
}

.blogDivDernierArt a{
    /*color: #19b323;*/
    /*color: #19b3a5;*/
    color: #3f86dc;
    font-weight: normal;
}
.blogDivDernierArt a:hover{
    font-weight: bolder;
}

.divAutreArticle{
    display:flex; 
    gap: 2vw; 
    margin-bottom: 6vh;
    margin-top: 3vh;
    border-bottom: 6px dashed #5f9ea04a;
    padding-bottom: 5vh;
}

.divAutreArticle a{
    color: #3f86dc;
    font-size: large;
}
.divAutreArticle a:hover{
    font-weight: bold;
}

.divAutreArticle img{
    width: 15vw; 
    height: 10vw;
    object-fit: cover;
    object-position: top;
    margin-top: 0;
    margin-bottom: auto;
}

.divAutreArticle div{
    display:block;
}

.divAutreArticle div h2{
    font-family: 'sousTitre';
    font-size: x-large; margin-bottom: 0;
    margin-top: 0;
}

.divAutresArticles{
    background-color: white;
    box-shadow: var(--ombreDiv);
    padding: 1vw 3vw 1vw 3vw;
    margin-top: 5vh;
    margin-bottom: 2vh;
}

.divAutreArticle:last-child{
    border-bottom: none !important;
    padding-bottom: 0 !important;
    margin-bottom: 4vh !important;
}

.troisDerniersArticlesArticle{
    display:flex; justify-content: space-between;padding-bottom: 4vh; gap: 1vw; 
    border-bottom: 3px dashed #5f9ea04a; padding-top: 2vh;
}

.troisDerniersArticlesArticle:nth-of-type(3){
    border-bottom: none !important;
}

.divDroiteBlog{
    width: 25%;
}

.articleUne{
    display:block;background-color: white;
    box-shadow: var(--ombreDiv);
    padding: 1vw;
    margin-bottom: 2vh;
}

.articleUne h2{
    font-family: 'sousTitre';
    font-size: xx-large;
    margin-top: 0;
}

.articleUne img{
    width: 100%; 
    margin-bottom: 2vh;
    height: 25vh;
    object-fit: cover;
    object-position: top;
}

.articleUne h6{
    margin-top: 0; 
    font-size: large; 
    margin-bottom: 0;
}

.articleUne div a{
    color: #3f86dc;
    font-size: medium;
}
.articleUne a:hover{
    font-weight: bold;
}

.troisDerniersArticlesDiv{
    background-color: white;
    box-shadow: var(--ombreDiv);
    padding: 1vw;
    margin-top: 5vh;
    margin-bottom: 2vh;
}

.troisDerniersArticlesDiv h4{
    font-size: xx-large;
    font-family: 'sousTitre'; margin-top: 2vh; 
    margin-bottom: 1vh;
}

.troisDerniersArticlesArticle img{
    width: 8vw;
    height: 5vw;
    object-fit: cover;
    object-position: top;
}

.troisDerniersArticlesArticle div{
    display:block;
}

.troisDerniersArticlesArticle div a{
    color: #3f86dc;
    font-size: medium;
}
.troisDerniersArticlesArticle div a:hover{
    font-weight: bold;
}

.troisDerniersArticlesArticle div h6{
    margin-bottom: 2vh;
    margin-top: 0;
}

.pubBlog{
    margin-top: 5vh;
}

.pubBlog img{
    width: 100%; 
    margin-bottom: 2vh;
}

/* zzz ARTICLE BLOG */

#lienArticleRetour:hover{
    font-weight: bold;
}

.blogDivArticle{
    background-color: white;
    box-shadow: var(--ombreDiv);
    padding: 1vw 3vw 1vw 3vw;
    /*margin-top: 5vh;*/
    margin-bottom: 5vh;
}

.blogDivArticle h2{
    font-family: 'sousTitre';
    font-size: xxx-large;
    margin-bottom: 2vh;
}

.blogDivArticle p {
  font-size: large;
}

.blogDivArticle img{
    width: 100%; 
    height: 48vh;
    object-fit: cover;
    object-position: top;
}

.blogDivArticle small{
    font-family: 'texte'; font-style: italic;
}

.blogDivArticle p{
    font-size: large;
}

.blogDivArticle a{
    /*color: #19b323;*/
    /*color: #19b3a5;*/
    color: #3f86dc;
    font-weight: normal;
}
.blogDivArticle a:hover{
    font-weight: bolder;
}

.signatureBlog{
    display:flex;
    align-items:center;
    gap:15px;

    margin-top:40px;
    padding-top:20px;

    border-top:1px solid #dcdcdc;
}

.signatureBlog img{
    width: 4vw;
    height: 4vw;
    border-radius:50%;
    object-fit:cover;
}

.nomAuteur{
    font-weight:600;
    margin-bottom:3px;
}

.descAuteur{
    color:#666;
    font-size:0.95em;
}





/* zzz PAGES PRO */


/* zzz LOGIN PRO ****** */

.erreurLoginPro{
    font-family: 'texte';
    color: red;
    margin-top: 2vh;
    margin-bottom: 4vh;
    font-weight: bold;
}

.loginProDiv{
    
}

#formLoginPro{
    margin-bottom: 10vh;
    text-align: center;
}

#formLoginPro h2{
    font-family: 'texte';
}

.loginProCreerCompte{
    border: 1px dotted cadetblue;
    padding: 4%;
    background-color: #628a8b;    
}

#loginProCreerCompte, .loginProCreerCompte h2{
    font-family: 'texte';
}

.loginFormInputs{
    display: flex;
    justify-content: space-evenly;
    gap: 10%;
}

#inputEmail, #inputPassword{
    width: 30%;
    margin-top: 2vh;
    margin-bottom: 2vh;
    height: 5vh;
    font-size: medium/*1vw*/;
}

#inputEmail::placeholder{
    font-size: medium/*1vw*/;
    font-style: normal;
}

#inputPassword::placeholder{
    font-size: medium/*1vw*/;
    font-style: normal;
}

#boutonCreerCompteLoginPro{
    background-color: #7fa7a8;
    transition: 0.5s ease all;
}
#boutonCreerCompteLoginPro:hover{
    background-color: #92c0c1;
    cursor: pointer;
}


/* zzz MOT DE PASSE OUBLIE ************** */

#reset_password_request_form_email{
    width: 18vw;
    margin-left: 2vw;
}

#divRequestMDPOublie{
    text-align: center;
}

#divRequestMDPOublie h2{
    font-family: 'texte'; 
    font-size: large/*1.5vw*/;
}

#aideRequestMDPOublie{
    font-size: small/*0.8vw*/; 
    font-style: italic; 
    margin-top: 4vh; 
    text-align: center;
}

#change_password_form_plainPassword_first, #change_password_form_plainPassword_second{
    width: 24vw;
    margin-bottom: 2vh;
}



/* zzz INTERFACE PRO ****************** */

        #liInterfaceProInfos li{
            color: #3f86dc;
            font-family: 'texte';
            font-size: large;
            font-style: normal;
            text-align: left;
            font-weight: bold;
        }
        #liInterfaceProInfos li::marker{
            content: "🔹 ";
            font-size: large;
            font-style: initial;
        }
        #li2InterfaceProInfos li{
            color: black;
            font-weight: normal;
            font-size: medium;
            font-style: normal;
        }
        #li2InterfaceProInfos li::marker{
            font-size: small;
            font-style: initial;
            content: "➔ ";
        }

#interfaceProProfilVisible{
    width: 89%;
    margin-left: auto;
    margin-right: auto;
}

#interfaceProProfilVisible ul{
    margin-top: 0;  
}
/*
#interfaceProProfilVisible li{
    color: black;
    font-size: medium;
    font-style: normal;    
}*/
/*
#interfaceProProfilVisible li::marker{
    font-size: small; 
    font-style: initial;
    content: "➔ ";    
}*/

.interfaceProTitre{
    text-align:center; font-family:'texte'; margin-bottom: 6vh;
    font-size: xx-large/*2vw*/;
    color: cadetblue; 
    text-shadow: #00000085 0px 1px 0px;    
}

#interfaceProNotifs{
    width: 88.8%; 
    margin-right: auto; margin-left: auto;        
}

#interfaceProNotifs p{
    font-size: medium/*1.2vw*/;
}

.interfaceProLiens{
    display: grid;
    justify-content: space-around;
    grid-template-columns: repeat(3, 1fr);
    gap: 3vw;
    width: 95%;
    margin-left: auto;
    margin-right: auto;    
}

.interfaceProLiens li::marker{
    content: '🐾 ';
    font-size: medium/*1vw*/;
    font-style: normal;
}

.interfaceProLiens li{
    color: black;
    font-size: medium/*1vw*/;
    font-style: normal;    
}

.interfaceProLiens div{
    padding-bottom: 3vh;
    transition: 0.5s ease all;
    margin-bottom: 1vh;
}
.interfaceProLiens div:hover{
    background-color: #5f9ea00d;
}

.interfaceProLiens div h2{
    font-family: 'texte';
    font-size: large/*1.5vw*/;
    text-align: left;   
}







/* zzz CREER COMPTE PRO *************** */

#pro_registration_form_email, #pro_registration_form_plainPassword_second, #pro_registration_form_prenom, #pro_registration_form_nom, #pro_registration_form_SIRET, #pro_registration_form_kBis, #pro_registration_form_plainPassword_first{
    width: 70%;
}

#pro_registration_form_plainPassword_second{
    margin-top: 2vh;
}

#pro_registration_form_kBis{
    padding-top: 1vh;
}

#registerProDiv li{
    font-size: medium/*1vw*/;
    font-style: italic;
    color: red;
}

#registerProDiv li::marker{
    content: "⚠️ ";
}

#idCoRegisterProDiv{
    display: flex;
  justify-content: space-around;
}

#idCoRegisterProDiv div{
    width: 40%;
  text-align: center;
}

#idProRegisterProDiv{
    display: flex;
  justify-content: space-around;
}

#idProRegisterProDiv div{
    width: 40%;
  text-align: center;
}

#entrRegisterProDiv{
    display: flex;
    justify-content: space-around;
}

#entrRegisterProDiv div{
width: 40%;
  text-align: center;
}

#pro_registration_form_communeNom{
    margin-left: 2vw;
    width: 23vw;
}

#champCommuneRegisterPro li{
    color: cadetblue;
    font-style: normal;
    width: 27vw;
    margin-left: auto;
    margin-right: auto;
}

#champCommuneRegisterPro li::marker{
    content: none;
}


/* zzz CREER PROFIL PRO ************** */

#creer_profil_pro_phraseAccroche{
    width: 96%;
}

#creer_profil_pro_siteWeb, #creer_profil_pro_telephone{
    width: 28%;
}

#divCoordonneesCreerProfilPro{
    text-align: center;
}

#divCoordonneesCreerProfilPro h2{
    font-family: 'texte';
    text-align: center;
}

#divCoordonneesCreerProfilPro li{
    text-align: left;
}

#creer_profil_pro_descriptionGenerale{
    height: 21vh;
}



/* zzz MODIFIER PROFIL PRO */

#modifier_profil_pro_phraseAccroche{
    width: 96%;
}

#modifierProfilAssuPro div{
    display: flex;
    gap: 2%;
}

#modifierProfilDivBoutons{
    display: grid;
    grid-template-columns: repeat(4,1fr);
    row-gap: 3vh;
}


#modifierProfilDivBoutons {
  display: grid;
  grid-template-columns: repeat(3,1fr);
}

#modifierProfilDivBoutons button{
    width: 87%;
}



#modifierProfilDivBoutons div{
    display: block;
    text-align: center;   
}

#modifierProfilDivBoutons div a{
    font-size: small/*0.8vw*/; 
}

#modifier_profil_pro_siteWeb, #modifier_profil_pro_telephone{
    width: 100%;
}

#modifier_profil_pro_photoProfil{
    margin-top: auto;
    margin-bottom: auto;
    padding-top: 2vh;
    padding-bottom: 1vh;
    width: 35%;
}

.modifierProfilReseaux{
    display: flex; 
    justify-content: space-around;    
}

.modifierProfilReseaux input{
    width: 90%;
}

#modifierProfilProAjouterPhoto div{
    text-align: center; 
    display: flex; 
    justify-content: space-around;
}

#modifierProfilProSiteWeb{
    display: flex; 
    justify-content: space-around;
}

#modifierProfilProSiteWeb div{
    width: 30%;
}

.modifierProfilReseaux div{
    width: 30%;
}

.modifierProfilReseaux div p{
    text-align: center;
}

#modifiermesservices h2{
    font-family: 'texte'; 
    font-size: large/*2vw*/;
    text-align:center;
}

#modifierProfilAjouterService{
    text-align:center
}

#modifierProfilAjouterService h2{
    font-family: 'texte'; 
    font-size: large/*2vw*/;
}

#sousTexteModifierCompte{
    padding-left: 10%; 
    margin-top: 0; 
    font-style: italic; 
    font-size: small/*0.8vw*/; 
    padding-right: 20%;
}


/* zzz MODIFIER COMPTE ********* */

#modifierComptePro{
    display: block;
    text-align: center;
}

.sousLienModifierComptePro::marker{
    font-size: xx-small !important;
    font-style: initial !important;
    content: none !important;
}

.sousLienModifierComptePro a{
    font-style: italic;
    font-size: small;
}

#modifierComptePro div{
    display: flex;
    justify-content: left;
    gap: 6%;
    padding-left: 10%;
}

#modifierComptePro h2{
    font-family: 'texte';
    margin-top: 6vh;
    margin-bottom: 6vh;
}

#modifierComptePro input{
    margin-top: auto;
    margin-bottom: auto;
}

#modifierComptePro, #modifierCompteProSupp ul{
    text-align: left;
    padding-left: 16%;    
}

#modifierComptePro ul{
    padding-left: 12.5%;
}

#divBoutonModifierCompte{
    width: 47%; 
    margin-left: auto; 
    margin-right: auto;
}

#modifierCompteProDesactiver{
    text-align: center;
}

#modifierCompteProDesactiver h2{
    font-family: 'texte';
    margin-top: 6vh;
    margin-bottom: 6vh;
}

#modifierCompteProSupp{
    text-align: center;
}

#modifierCompteProSupp h2{
    font-family: 'texte';
    margin-top: 6vh;
    margin-bottom: 6vh;
}





/* zzz MESSAGERIE PRO ********* */

.MessagerieDivMessage{
    border: 6px dotted #19696c;
    padding-bottom: 2vh;
    padding-top: 3vh;
    width: 71%;
    margin-left: auto;
    margin-right: auto;
    background-color: white;
    border-radius: 1vw;
    margin-bottom: 10vh;
}

.MessagerieMessage{
    padding: 2vw;
    margin-top: 3vh;
    margin-bottom: 1vh;
    text-align: justify;  
    border-radius: 1vw;
    font-size: medium/*1.2vw*/;
    background-color: #4c7c7e;
    width: 78%;
    margin-left: auto;
    margin-right: auto;
    color: white;
}

#divBoutonMessageriePro{
    margin-bottom: 0; 
    gap: 7%; 
    display: flex; 
    justify-content: center;
}

#MessagerieDivMessageLu{
    border: 6px dotted #5f9ea073;
}






/* zzz AFFICHAGE DDES (PRO) ******** */

#divBoutonDemandesPro{
    margin-bottom: 0; 
    gap: 7%; 
    display: flex; 
    justify-content: center;
}

#vad_zoneIntervention{
    padding-right: 0;
    margin-right: 1vw;
}

#promenades_chien_zoneIntervention{
    width: 5vw;
}

#pension_feline_tarifGlobalParNuit, #pension_feline_tarifJournee, #pension_feline_tarif2Chats, #pension_feline_tarif3Chats, #pension_feline_acompte, #pension_canine_acompte, #pension_canine_tarifJournee, #pension_canine_tarifPetitChien, #pension_canine_tarifMoyenChien, #pension_canine_tarifGrandChien, #pension_canine_tarifChienJunior, #pension_canine_tarifChienSenior, #pension_canine_tarif2Chiens, #pension_canine_tarif3Chiens{
    width: 5vw;
}

#pension_canine_acompte{
    margin-right: 1vw;
}

#pension_feline_tarifSupplementaire{
    width: 18vw;
}











/* zzz PAGES ADMIN */


/* zzz INTERFACE ADMIN ********* */

#notifsInterfaceAdmin{
    width: 71vw;
}

#notifsInterfaceAdmin p{
    margin-bottom: 0.5vw;
}

#notifsInterfaceAdmin a{
    font-size: medium/*1vw*/;
}

.divLiensInterfaceAdmin div{
    width: 66%;
}

.divLiensInterfaceAdmin{
    display: grid; 
    grid-template-columns: repeat(3, 1fr);
    width: 80%;
    margin-left: auto;
    margin-right: auto;
}



/* zzz ADMIN CONTACTER PRO ******** */

#admin_contacter_pro_objetMessage{
    width: 96%;
}

#messagerieAdminDivMessage{
    width: 43vw;
}

#messagerieAdminDivMessageh2{
    font-family: 'texte';
    text-align: center;
    font-size: large/*1.5vw*/;    
}

#messagerieAdminDivMessage i{
    font-size: medium/*1vw*/;
}

.formAdminContacterPro{
    margin-top: 7vh;
    width: 80%;
    margin-left: auto;
    margin-right: auto;
}

/* zzz MODIFIER COMPTE ADMIN ****** */

#divModifierCompteAdmin{
    display: flex;
    justify-content: space-around;
}

.ssDivModifierCompteAdmin{
    padding-left: 16%; 
    margin-top: 7vh;
}

.divPhotoProfilModifierCompteAdmin{
    margin-top: auto;
    margin-bottom: auto;
}

.divPhotoProfilModifierCompteAdmin img{
    width: 20vw;
    height: 20vw;
    object-fit: cover;
    object-position: top;
    border-radius: 20%;
    border: 5px solid cadetblue;
}

/* zzz PAGE INFO PROS */

#divPageInfosPro{

}

#divPageInfosPro h2{
    font-family: 'sousTitre';
    text-align: center;
    font-size: x-large;
}

#divPageInfosPro li{
    color: #3f86dc;
    font-family: 'texte';
    font-size: large;
    font-style: normal;
    text-align: left;
    font-weight: bold;
}

#divPageInfosPro li::marker{
    content: "🔹 ";
    font-size: large;
    font-style: initial;
}

.ulInfosPro li{
    font-size: medium !important;
    color: black !important;
    font-weight: normal !important;    
}

.ulInfosPro li::marker{
    content: "- " !important;
}

#divBoutonInfosPro{
    margin-bottom: 3vh;
    margin-top: 5vh;
}

/* zzz BLOG ADMIN */

#blogAdminArticles li{
    font-size: large;
    margin-bottom: 3vh;
}

.boutonSansBouton{
    text-decoration: none;
    font-family: 'texte';
    font-size: large;
    padding: 0;
    margin-top: 0;
}
.boutonSansBouton:hover{
    background-color: transparent;
    color: cadetblue;
    font-weight: bold;
}

/* zzz AJOUTER ARTICLE */

#ajouterArticleDivForm{
    display: block;
    text-align: center;
}

#ajouterArticleDivFormTitre{
    display: block;
    text-align: center;
}

#ajouterArticleDivFormTitre p{
    text-align: center;
}

#ajouterArticleDivForm p{
    text-align: center;
}

#ajouter_article_titreArticle{
    width: 50%;
}

#ajouter_article_contenuArticle{
    height: 95vh;
}

#ajouter_article_auteurImage{
    width: 50%;
}

#ajouterArticleDivForm h4{
    font-family: 'texte';
    font-size: large;
}

#ajouterArticleDivFormTitre h4{
    font-family: 'texte';
    font-size: large;
}

#ajouterArticleFormSousDiv{
    display: flex;
    justify-content: center;
    gap: 15vw;
}



/* zzzMQ MEDIA QUERIES */

@media (min-width: 800px) and (max-width: 1200px) {
.interfaceProLiens {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
    }

.divInfosServiceProfilPro {
  display: block !important;
}

.sousDivAccueilBlog{
    display: grid;
    width: 79%;
    grid-template-columns: repeat(2, 1fr);
}

.articleBlogAccueil {
    width: 91%;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 3vh;
}
.articleBlogAccueil:hover {
  width: 91%;
}

.articleBlogAccueil div {
  padding: 4vw;
}

.articleBlogAccueil:hover .resumeArticleBlogAccueil {
  -webkit-line-clamp: 4;
}

.divAccueilBlog h2 {
  text-align: left;
  font-size: xx-large;
  margin-bottom: 9vh;
  margin-top: 8vh;
  margin-left: 12vw;
}


}

@media (max-width: 800px) {

/* zzz Général */


p{
    font-size: medium /*3vw*/;
}

a{
    font-size: medium /*3vw*/;
}

.boutonB{
   font-size: medium /*2.5vw*/; 
}

.boutonC{
    font-size: medium /*3vw*/;
    padding-top: 1vh;
    padding-bottom: 1vh;
}

.boutonD{
    padding-top: 1vh;
    padding-bottom: 1vh;
    font-size: medium/*3vw*/;
}

select{
    font-size: medium/*2.5vw*/;
}

input{
    font-size: medium/*2.8vw*/;
}

input::placeholder {
  font-size: medium/*2.9vw*/;
}

textarea::placeholder {
  font-size: medium/*2.9vw*/;
}

.divGeneralePleinePage li {
  font-size: medium/*3vw*/;
}

.divGeneralePleinePage li::marker {
  font-size: medium/*4.1vw*/;
}

.ulNormal li::marker {
  font-size: medium/*4.1vw*/ !important;
}

#lienContactMQ{
    display: flex;
    text-align: center;
    margin-top: 4vh;
    justify-content: space-between;
}

#lienContactMQ a{
    width: 38%;
}

.corps{
    display: block;
    margin-top: 4vh;
}

.corpsContenu{
    width: 100%;
}

.corpsPubsMQ{
  /*  display: flex;*/
  display: none;
    width: 100%;
    margin-bottom: 2vh;
}

.corpsPubsMQ img{
    width: 33.3% !important;
}

.corpsPubs{
    display: none;
}

.pubBas {
  /*display: block;*/
  display: none;
}


/* zzz Accueil */

.logoMenuTop {
    height: 6vh;
    margin-top: 1vh;
}

.divTitrePage{
   padding-top: 5vh; 
   background: linear-gradient(to right, rgba(0, 0, 0, 0), rgb(94, 135, 136)), url("../images/fondpageMQ.png");
   background-position: center;
   background-size: cover;
}

.divTitrePage h2{
    font-size: xx-large;
    text-align: left;
    padding-left: 7vw;
   /* font-size: 5.5vw;*/
}

.accueilBandeau {
  width: 80vw;
}

#recherche_pro_accueil_typeService{
    width: 100%;
}

#accueilForm{
    margin-top: 0;
}

#accueilForm p {
  /*font-size: 3.4vw;*/
}

#divAccueilForm{
    display:block;
    text-align: center;
}

#recherche_pro_accueil_communeNom{
   /* font-size: 2.5vw;*/
    width: 97%;
}

.autocomplete-results li {
  /*font-size: 3vw;*/
}

#div2AccueilForm {
  display: block;
  text-align: center;
}

#accueilForm{
    margin-right: 0;
}

#divAccueilTop {
  text-align: center;
  padding-top: 3vh;
  justify-content: center;
}

.divAccueilArguments{
    display: block;
    margin-top: 4vh;
    padding-bottom: 3vh;
}

.divTitrePageV2 {
    /*background: linear-gradient(150deg,rgb(19, 78, 80) 0%, rgba(48, 98, 100, 0.28) 50%, rgb(95, 158, 160) 100%), url("../images/fondpagePPMQ.png");*/
    background-position: center;
    background-size: cover;
    padding-top: 1vh;
}

.divTitrePage h1{
    text-align: left;
    padding-left: 10vw;
}

.titreServiceProfilPro{
    background-position: right;
    font-size: x-large;
}

.divAccueilArgument{
    margin-bottom: 5vh;
}

.divAccueilArgument img {
  width: 30vw;
  height: 30vw;
}

.divAccueilArgument h4 {
  /*font-size: 4.3vw;*/
  font-family: 'texte';
}

.divAccueilArgument p {
  /*font-size: 3vw;*/
}

.divAccueilCommentCaMarche {
  padding-top: 5vh;
  border-bottom: 7px dashed cadetblue;
  padding-bottom: 5vh;
margin-bottom: 9vh;
}

.divAccueilCommentCaMarche h2 {
  /*font-size: 5.5vw;*/
}

.divAccueilCommentCaMarcheSsDiv{
    margin-top: 5vh;
    display: block;
}

.divAccueilCommentCaMarche h4 {
  /*font-size: 3.2vw;*/
}

#divAccueilCaMarche img {
  width: 14vw;
  height: 14vw;
  margin-top: 2vh;
}

.divAccueilAppelPros{
    margin-top: 0;
}

.divAccueilAppelPros h2 {
  /*font-size: 4.5vw;*/
}

.divAccueilAppelPros p {
  /*font-size: 3.2vw;*/
}

.divAccueilChiffres{
    border-top: 7px dashed cadetblue;
    padding-top: 5vh;
}

.divAccueilChiffresSsDiv {
  display: block;
  width: 76%;
}

.divAccueilChiffres h2 {
  /*font-size: 4.5vw;*/
}

.divAccueilChiffre h6 {
  font-size: 23vw;
}

.divAccueilChiffre{
    margin-bottom: 4vh;
}

.divAccueilChiffre p {
  /*font-size: 3.3vw;*/
}

.divAccueilDerniersProsContactes {
  text-align: center;
  margin-top: 9vh;
  border-top: 7px dashed cadetblue;
  padding-top: 5vh;
}

.divAccueilDerniersProsContactes h2 {
  /*font-size: 4.5vw;*/
}

.divAccueilDerniersProsContactesSsDiv {
  display: block;
  margin-top: 7vh;
}

#divAccueilDernierPro img {
  width: 36vw;
}

.divAccueilDernierProInfos {
  /*font-size: 4vw;*/
  font-family: 'texte';
  padding-left: 4vw;
}

.divAccueilJeSuisUnProSsDiv p{
    /*font-size: 3vw;*/
}

.divAccueilJeSuisUnProSsDivTexte li {
  /*font-size: 3vw;*/
}

.divAccueilJeSuisUnProSsDivTexte li::marker {
  /*font-size: 3.1vw;*/
}

.divAccueilJeSuisUnPro h2 {
 /* font-size: 4vw;*/
  text-align: left;
  padding-left: 4vw;
}

.divAccueilJeSuisUnProSsDivImg{
    display:none;
}

.divAccueilBouton{
    margin-bottom: 0;
}

#divBoutonAccueilCreerComptePro{
    margin-bottom: 2vh !important;
    margin-top: 2vh !important;
}

.divAccueilBouton button{
width: 74vw;
  height: 13vh;
 /* font-size: 3.5vw;*/
}

footer{
    margin-top: 7vh;
}

.footerContenu {
  display: block;
}

.footerGauche {
  width: 97%;
  margin-bottom: 5vh;
}

.footerDivInfos img{
    width: 11vw !important;
  height: 11vw !important;
  margin-right: 4% !important;
}

.footerDivLiens {
  width: 50%;
}

#cookie-banner{
    width: 94vw;
    display: block;
}

#cookie-banner a{
    font-size: small;
}

.cookie-actions{
    text-align: center;
}

#accept-cookies{
    margin-right: 4vw;
    margin-bottom: 2vw;
}

#reject-cookies{
    margin-bottom: 2vw;
}

.divAccueilJeSuisUnPro {
  width: 75%;
}

.sousDivAccueilBlog{
    display: block;
    width: 100%;
}

.articleBlogAccueil {
    width: 80%;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 3vh;
}
.articleBlogAccueil:hover {
  width: 80%;
}

.articleBlogAccueil div {
  padding: 4vw;
}

.articleBlogAccueil:hover .resumeArticleBlogAccueil {
  -webkit-line-clamp: 4;
}

.divAccueilBlog h2 {
  text-align: left;
  font-size: xx-large;
  margin-bottom: 9vh;
  margin-top: 8vh;
  margin-left: 12vw;
}


/* zzz Rechercher pro */

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

.rechercherProBody {
  display: block;
}

#rechercherProFiltre {
  width: 95% /*80%*/;
  margin-left: auto;
  margin-right: auto;
}

.rechProEducCanin p {
  text-align: left;
  font-size: small;
}

.rechercherProResultats {
  width: 100% /*86%*/;
  margin-left: auto;
  margin-right: auto;
}

#rechercherProFiltre p{
   /* font-size: 2.8vw;*/
}

.formFiltre label {
  /*font-size: 3vw;*/
}

#rechercherProFiltre .divBouton{
    text-align: center;
}

#texteRechercheRechercherProFiltre{
   /* font-size: 2.8vw; */
}

.filtreRechProRows div {
  gap: 5vw;
}

#nomProRechercherPro{
   /* font-size: 4.2vw;*/
    text-align: left;
}

#divPCphotoProRechercherPro{
    display: none;
}

#divMQphotoProRechercherPro{
    display: block;
    text-align: center;
}

#divProRechercherUnPro{
    display:block;
}

#divProRechercherUnPro div img {
  width: 21vw;
  height: 21vw;
  margin-top: 2vh;
}

#sousDivProRechercherUnPro {
  width: 98%;
}

#tarifsPensionNACProRechercherPro{
    display: grid;
    grid-template-columns: repeat(2, 1fr);
}

.rechProVADAnimaux p {
 /* font-size: 6vw;*/
}

.rechProVADAnimaux {
  gap: 4vw;
  justify-content: space-around;
}

#boutonFAQAccueil{
    width: 74vw;
    height: 13vh;
   /* font-size: 3.5vw;*/
}

/* zzz Profil pro */

.profilProBandeauTop{
    display: block;
}

.profilProBandeauTopInfos {
  margin-top: 2vh;
}

.profilProPhotoProfilDiv {
  text-align: center;
}

#h3VisibleOrdiProfilPro{
    display: none;
}
#h3VisibleMQProfilPro{
    display: block;
}

#divInfosImportantesProfilPro {
  display: block;
  text-align: center;
}

.divBoutonsServicesProfilPro{
    grid-template-columns: repeat(3, 2fr);
}

.profilProBandeauTopInfos {
  width: 80%;
  margin-left: auto;
  margin-right: auto;
}

.profilProBandeauTopInfos img {
  width: 14vw;
  height: 14vw;
}

.profilProPhotoProfilDiv img {
    width: 50vw;
    height: 50vw;
}

#ssDivInfosImportantesProfilPro {
    width: 80%;
    margin-left: auto;
    margin-right: auto;
}

#coordonneesProfilPro {
  margin-bottom: 3vh;
}

#ssDivInfosImportantesProfilPro {
  text-align: left;
}

#servicesTopProfilPro{
    display: none;
}

#ssDivInfosImportantesProfilPro p{
    text-align: left;
}

#ssDivInfosImportantesProfilPro a img {
  width: 8vw;
  height: 8vw;
  margin-right: 4%;
}

#texteAssuProProfilPro {
 /* font-size: 1.8vw;*/
}

.titreServiceProfilPro{
   /* font-size: 3vw;*/
}

.divServiceProfilPro h3 {
  /*font-size: 3.5vw;*/
}

.divInfosServiceProfilPro {
  display: block !important;
  width: 100%;
}

.divServiceProfilPro h5 {
  /*font-size: 3vw;*/
}

.divInfosServiceProfilPro p {
  /*font-size: 2.6vw;*/
}

#montantEstimatifProfilPro{
   /* font-size: 2.6vw;*/
}

.contenuServiceProfilPro{
    display: block;
}

.aproposServiceProfilPro{
    width: 100%;
}

.divServiceProfilPro h6 {
  /*font-size: 1.9vw;*/
}

.divAutresInfosServiceProfilPro p {
  /*font-size: 2.8vw;*/
}

#tarifsPensionFelineProfilPro{
    padding-left: 0;
}

.divBoutonServicesProfilPro{
    margin-bottom: 2vh;
}

/* zzz Envoyer message client à pro */

#envoyerDdeDivIdentite {
  display: block;
}

.profilProMessageMessage h4 {
  /*font-size: 4.2vw;*/
}

/* zzz Signaler pro */

#sousTexteSignalerPro{
    /*font-size: 1.8vw;*/
}

/* zzz Envoyer dde client vers pro */

#serviceTitreEnvoyerDde {
 /* font-size: 3.4vw;*/
}

#divBoutonEnvoyerDde{
    margin-bottom: 3vh;
}

#envoyerDdeChiens {
  grid-template-columns: repeat(1, 1fr);
}

#envoyerDdeChiens input {
  width: 13vw;
}

#animauxAGarderEnvoyerDde{
    display: block;
}

#envoyer_demande_service_nombreChats, #envoyer_demande_service_nombreLapins, #envoyer_demande_service_nombreRongeurs, #envoyer_demande_service_nombreOiseaux, #envoyer_demande_service_nombreReptiles, #envoyer_demande_service_nombreFurets, #envoyer_demande_service_nombreChiens, #envoyer_demande_service_nombreChevaux, #envoyer_demande_service_nombreFerme, #envoyer_demande_service_nombreAutre {
    width: 14vw;
}

#communeEnvoyerDdePro {
  display: block;
}

#nombreChiensPromenadesEnvoyerDde{
    display: block;
}

#animauxVADEnvoyerDde{
    grid-template-columns: repeat(1, 1fr);
}

/* zzz Blog */

.blogDivGlobale{
    display: block;
}

.blogDivGauche{
    width: 100%;
}

.blogDivDernierArt h2 {
    font-size: xx-large;
    margin-bottom: 3vh;
}

.blogDivDernierArt p {
  font-size: medium;
}

.blogDivDernierArt img {
  height: 25vh;
}

.divAutreArticle {
  display: block;
}

.divAutreArticle img {
  width: 100%;
  height: 50vw;
}

.divDroiteBlog{
    display: none;
}

.blogMQ{
    display: block;
}

.blogMQ h2{
    font-size: x-large;
}

.articleUne{
    margin-bottom: 2vh;
    box-shadow: none;
}

.articleUne h6 {
  margin-bottom: 2vh;
}

#titreAutresArticlesBlog{
    display: block;
}

.troisDerniersArticlesDiv{
    box-shadow: none;
}

.troisDerniersArticlesArticle {
  display: block;
}

.troisDerniersArticlesArticle img {
  width: 100%;
  height: 59vw;
}

#divBoutonBlogUne{
    text-align: left;
    margin-top: 2vh; 
}

.imgArticleBlog {
  float: none;
  width: 100%;
}

/* zzz Article Blog */

.signatureBlog img {
  width: 13vw;
  height: 13vw !important;
}

.blogDivArticle h2 {
  font-size: xx-large;
  margin-bottom: 3vh;
}

.blogDivArticle p {
  font-size: medium;
}

.blogDivArticle img {
  height: 25vh;
}

.imgArticleBlog {
  margin-left: 0;
}


/* zzz Contact client vers admin */

#sousDivContact {
  display: block;
}

#sousDivContact div {
  width: 80%;
    margin-left: auto;
  margin-right: auto;
}



/* zzz Pages annexes */

#divCGU li {
 /* font-size: 3vw;*/
}

.divFAQ {
  display: block;
}

#FAQPro h2, #FAQClient h2 {
  /*font-size: 4.5vw;*/
}

.question::after {
 /* font-size: 5vw;*/
  padding-left: 4vw;
}

.question {
  /*font-size: 4vw !important;*/
}

#FAQContact p {
  /*font-size: 4.5vw;*/
}

#texteML {
 /* font-size: 2.5vw;*/
    text-align: left;
    padding-left: 11vw;
}

#divCGU li::marker {
 /* font-size: 4.1vw;*/
}


/* zzz Pages pro */

/* zzz Créer compte */

#pro_registration_form_communeNom {
  margin-left: 0;
  width: 90%;
}

#divBoutonCreerCompte{
    margin-bottom: 4vh;
}

#idCoRegisterProDiv {
  display: block;
}

#idCoRegisterProDiv div {
  width: 90%;
  margin-left: auto;
  margin-right: auto;
}

#idProRegisterProDiv {
  display: block;
}

#idProRegisterProDiv div {
  width: 90%;
  margin-left: auto;
  margin-right: auto;
  padding-bottom: 2vh;
}

#entrRegisterProDiv {
  display: block;
}

#entrRegisterProDiv div {
  width: 90%;
  margin-left: auto;
  margin-right: auto;
  padding-bottom: 2vh;
}

/* zzz Login pro */

.loginFormInputs {
  display: grid;
}

#inputEmail, #inputPassword {
  width: 50vw;
  /*font-size: 3vw;*/
  margin-bottom: 0vh;
}

#inputPassword{
    margin-bottom: 5vh;
}

#inputPassword::placeholder {
  /*font-size: 3vw;*/
}

#inputEmail::placeholder {
 /* font-size: 3vw;*/
}

#formLoginPro {
  padding: 6vw;
}

/* zzz Créer profil pro */

#creer_profil_pro_siteWeb, #creer_profil_pro_telephone {
  width: 95%;
}

/* zzz Request mdp oublié */

#divRequestMDPOublie h2 {
  /*font-size: 4.5vw;*/
}

#reset_password_request_form_email {
  width: 50vw;
  margin-top: 2vh;
}

#aideRequestMDPOublie {
  /*font-size: 2.8vw;*/
}

#change_password_form_plainPassword_first, #change_password_form_plainPassword_second {
  width: 51vw;
}


/* zzz Modifier compte pro */

#modifierComptePro div {
    display: block;
    padding-left: 0;
    text-align: left;
    gap: 2%;
}

#modifierComptePro div p{
    padding-left: 0;
    text-align: left;
}

#sousTexteModifierCompte{
    padding-left: 0;
    margin-top: 1vh;
    font-style: italic;
   /* font-size: 2.8vw;*/
    padding-right: 0;    
}

#modifierComptePro, #modifierCompteProSupp ul{
  padding-left: 5vw;
  padding-right: 5vw;
}

#modifierComptePro ul li{
   /* font-size: 2.7vw;*/
}

#modifierComptePro ul {
  padding-left: 0;
}

#modifier_compte_pro_email, #modifier_compte_pro_password{
    width: 78vw;
    text-align: center;
}

#modifierComptePro h2 {
  margin-top: 2vh;
  margin-bottom: 4vh;
/*  font-size: 3vw;*/
}

#communeModifierCompte{
    display: block !important;
}

#idModifierCompte{
    display: flex !important;
}

#modifier_compte_pro_communeNom, #modifier_compte_pro_SIRET{
    margin-bottom: 2vh;
}

#divBoutonModifierCompte{
    margin-bottom: 2vh;
}

#modifierCompteProDesactiver, #modifierCompteProSupp {
  padding: 4vw;
}

#modifierCompteProDesactiver h2, #modifierCompteProSupp h2 {
  margin-top: 3vh;
  margin-bottom: 3vh;
}

#modifierComptePro li::marker{
    content: none;
}

/* zzz Ajouter service */

#vad_AnimauxAcceptes {
  display: grid !important;
  grid-template-columns: repeat(2, 1fr);
}

#texteMQVADService{
    display: flex;
}

#vad_zoneIntervention{
    padding-right: 0;
    margin-right: 1vw;
}

#vad_zoneIntervention {
  width: 21vw;
}

#promenades_chien_zoneIntervention{
    width: 21vw;
}

#ajouterServiceNom{
    display: block;
  text-align: center;
}

#ajouterServiceNom p{
  text-align: center;
margin-top: 2vh !important;
    margin-bottom: 2vh !important;
  font-weight: bold;
}

#ajouterServiceNom h6{
  text-align: center;
margin-top: 2vh !important;
    margin-bottom: 2vh !important;
  font-weight: bold;
}

#pension_equine_nomPension, #pension_nac_nomPension, #pension_canine_nomPension, #pension_feline_nomPension{
   width: 50vw;
  margin-bottom: 1vh; 
}

#ajouterServiceConditionsAccueil div{
    display: block;
}

.instPensionEqAjouterServ{
    display: flex !important;
}

#ajouterServiceTarifsParticuliers div {
  display: block;
}

#pension_equine_tarif1Cout, #pension_equine_tarif2Cout, #pension_equine_tarif3Cout{
    width: 10vw;
}

#pension_equine_tarif1Intitule, #pension_equine_tarif2Intitule, #pension_equine_tarif3Intitule{
    width: 95%;
}

.coutPensionEqAjouterSer{
    display: flex !important;
}

#ajouterServiceAcompte {
  display: block;
}

#pension_equine_placesDisponibles{
    width: 16vw;
}

#ajouterServiceNom input {
  width: 56vw;
}

.divPensionNacAjouterServ{
    display: flex !important;
}

#tarifsPensionNacAjouterServ{
    text-align: center;
}

#tarifsPensionNacAjouterServ p{
    text-align: center;
}

#pension_nac_tarifSupplementaire, #pension_nac_prixTarifSupplementaire{
    width: 80%;
}

#pension_feline_tarifGlobalParNuit, #pension_feline_tarifJournee, #pension_feline_tarif2Chats, #pension_feline_tarif3Chats, #pension_feline_acompte{
    width: 15vw;
}

#pension_feline_tarifSupplementaire{
    width: 93%;
}

#div1AjouterServiceAccueil{
    display: block !important;
}

#div2AjouterServiceAccueil{
    display: flex !important;
}

#div2AjouterServiceAccueil p{
    text-align: left;
}

/*#pension_feline_typeAccueil*/ #pension_feline_preRencontre{
    display: grid !important;
    grid-template-columns: repeat(2, 1fr);
}

#pension_feline_typeAccueil label{
    width: max-content;
}

#ajouterServiceTarif{
    display: block;
}

#pension_feline_preRencontre, #pension_feline_typeAccueil, #pension_canine_typeAccueil, #pension_canine_preRencontre{
    display: grid !important;
  grid-template-columns: repeat(2, 1fr);
}

#pension_canine_tarifGlobalParNuit{
    width: 13vw;
}

#pension_canine_tarifSupplementaire, #pension_canine_prixTarifSupplementaire{
    width: 95%;
}

#ajouterServiceTarif div{
    display: flex;
  justify-content: center;
}

#pension_feline_tarifGlobalParNuit, #pension_feline_acompte{
    margin-right: 2vw;
}

#ajouterServiceTarif p{
    text-align: center;
}

#ajouterServiceAccueil h6{
    text-align: center;
}

/* zzz Interface pro */

.interfaceProTitre{
    display: none;
}

.interfaceProTitre{
   font-size: larger; 
   margin-top: 7vh;
   margin-bottom: 6vh;
}

.interfaceProLiens {
  display: grid;
  grid-template-columns: repeat(1, 1fr);
}

/* zzz Messagerie */

.MessagerieDivMessage{
width: 83%;
    padding: 4vw;
}

.MessagerieMessage{
    text-align: left;
    width: 95%;
}

#divBoutonMessageriePro{
    display: grid;
}

.MessagerieDivMessage p{
    text-align: left !important;
}

#divBoutonDemandesPro{
    display: grid;
}

#divBoutonDemandesPro .boutonD{
width: 52vw;
    padding-right: 0;
    padding-left: 0;
    margin-left: auto;
    margin-right: auto;
}

.MessagerieDivMessage {
  border: 1px dotted #19696c !important;
}

/* zzz Modifier profil pro */


#modifierProfilProSiteWeb{
    display: block;
}
#modifierProfilProSiteWeb div {
  width: 86%;
  margin-left: auto;
  margin-right: auto;
}

.modifierProfilReseaux {
  display: block;
}
.modifierProfilReseaux div {
  width: 86%;
  margin-left: auto;
  margin-right: auto;
}

#modifierProfilDivBoutons {
  display: grid;
  grid-template-columns: repeat(2,1fr);
  padding-bottom: 2vh;
}


/* zzz Pages admin */

/* zzz Interface admin */

.divLiensInterfaceAdmin {
  display: grid;
  grid-template-columns: repeat(1, 1fr);
  width: 100%;
}

.divLiensInterfaceAdmin div{
margin-top: 2vh;
  margin-bottom: 2vh;
}

#notifsInterfaceAdmin {
  width: 66vw;
}

.interfaceProLiens div{
    padding-bottom: 0;
    padding-top: 2vh;
  padding-left: 6vw;
}



/* zzz Modération messages */

#messagerieAdminDivMessage {
  width: 81vw;
}

/* zzz Modifier compte admin */

#divModifierCompteAdmin {
  display: block;
}

.divPhotoProfilModifierCompteAdmin {
  text-align: center;
}

.divPhotoProfilModifierCompteAdmin img {
  width: 52vw;
  height: 52vw;
}


/* zzz Validation profils */

#validerValidationProfil{
    display: block !important;
}

#divProfilAdminTouslesprofils{
    display: block !important;
}

/* zzz Ajouter Article Blog Admin */

#ajouterArticleFormSousDiv{
    display: block;
}

/* parenthèse finale : */
}