.glob-label h1 { text-align: center; padding: var(--ec-4) 0 var(--ec-1) 0; margin: 0;}
.info-label { overflow: hidden; background-color: color-mix(in oklab,var(--gr-0) 25%, var(--rev-white) 75%); border-radius: var(--radius-1); border: 2px dashed var(--gr-05); padding : var(--ec-1); color: var(--color-2); margin-bottom: var(--size-md); }
.info-label p { margin-bottom: 1rem }
.info-label .h-label { display: flex; align-items: center; gap: .5rem; margin-bottom: var(--ec-1)}
.info-label .h-label div:last-child { font-weight: 700; font-size: clamp(1.15rem, 3vw, 1.3rem); color: var(--color-1) }
.info-label ul { list-style: circle; margin-bottom: var(--size-md); color: var(--gr-3); }
.info-label ul li { margin-left : 2rem; padding: .4rem 0  }
.info-label table { border-collapse: collapse; border-spacing: 0; color: var(--color-1); width: 100% ; max-width: 800px; margin: var(--size-lg) auto ;}
.info-label table td, .info-label table th  { padding: 1rem; border: 1px solid var(--gr-05); width: 50%;}
.info-label table tr td:first-child { background-color: var(--gr-0)}
.info-label table thead th { background-color: var(--lsa-2); text-align: center; font-weight: bold; color : var(--rev-white)}
.info-label .info-supp p {  margin: 0; font-size: .9em; width: 90% ; max-width: 800px; margin: auto}
.info-label .annonce-validee, .info-label .parcours-digital { padding: .25rem; }
.info-label .annonce-validee svg, .info-label .parcours-digital svg { height: clamp(1.15rem, 3vw, 1.4rem);  width: clamp(1.15rem, 3vw, 1.4rem); }
.info-label-article { background-color: color-mix(in oklab,var(--gr-0) 98%, var(--rev-black) 2.5%); padding: var(--ec-3); font-size: .9rem; margin-bottom: var(--size-d); border : 1px solid var(--gr-0)}
.info-label-article a { text-decoration: underline !important}
.info-label-interesse { position: relative; font-weight: bold; text-align: center; margin: var(--ec-0) auto var(--ec-2) auto; width: fit-content; border-radius: .5rem;  background-color: var(--gr-0); display: flex;  align-items: center; font-size: 1.25rem; gap: .5rem; justify-content: center; padding: var(--ec-2);}
.info-label-interesse svg { display: inline; fill:var(--color-2);     }
.info-label .fida-logo {
    content: '';
    width: 150px;
    height: 60px;
    display: block;
    background: url(/media/assurance/logo.svg) no-repeat 50% 0%;
    background-size: contain;
    margin: auto
}

.dark .info-label .fida-logo { background: url(/media/assurance/logo-w.svg) no-repeat 50% 0%; }

 
/* GALERIE */ 
.gal {
    color: var(--color-1);
    aspect-ratio: 16/9;
    max-height: 850px; 
    overflow: hidden;
    border-radius: var(--radius);
    margin-bottom: 1rem;
    position: relative;
    align-items: center;
    justify-content: center
}
.gal-bg {
    z-index: 0;
    -moz-filter: blur(.8rem);
    -ms-filter: blur(.8rem);
    -o-filter: blur(.8rem);
    -webkit-filter: blur(.8rem);
    background-position: center;
    position: absolute;
    top: -50px;
    bottom: -50px;
    right: -50px;
    left: -50px;
    opacity: .5;
    background-size: cover;
    background-repeat: no-repeat
}
.gal-only {
    z-index: 1;
    object-fit: contain;
    height: 100%; 
}
.gal-bg, .gal img, .gal-item, .gal .gal-princ {
    border-radius: var(--radius);
    height: 100%; 
}
.gal-0, .gal-1, .gal-2, .gal-3, .gal-4, .gal-5, .gal-6 {
    display: grid;
    grid-gap: 1rem;
    grid-auto-rows: 1fr 1fr;
    grid-auto-columns: 1fr 1fr;
    justify-items: center;
}

.gal-0 { display: flex !important; }
.gal-item {    width: 100%;   height: 100%;    overflow: hidden }
.gal-item img {    width: 100%;    height: 100%;    object-fit: cover }
.gal-1 div:nth-child(n+1) {    grid-column: 1;    grid-row: 1 }
.gal-1 div:nth-child(n+2) {    grid-column: 2;    grid-row: 1 }
.gal-2 div:nth-child(n+1) {    grid-column: 1 / 3;    grid-row: 1 / 3 }
.gal-2 div:nth-child(n+2) {    grid-column: 3 / 4;    grid-row: 1 }
.gal-2 div:nth-child(n+3) {    grid-column: 3 / 4;    grid-row: 2 }
.gal-3 div:nth-child(n+1) {    grid-column: 1 / 4;    grid-row: 1 / 3 }
.gal-3 div:nth-child(n+2) {    grid-column: 4 / 6;    grid-row: 1 }
.gal-3 div:nth-child(n+3) {    grid-column: 4 / 4;    grid-row: 2 }
.gal-3 div:nth-child(n+4) {    grid-column: 5 / 5;    grid-row: 2 }
.gal-4 div:nth-child(n+1) {    grid-column: 1 / 3;    grid-row: 1 / 3 }
.gal-4 div:nth-child(n+2) {    grid-column: 3 / 4;    grid-row: 1 / 2 }
.gal-4 div:nth-child(n+3) {    grid-column: 4 / 5;    grid-row: 1 / 2 }
.gal-4 div:nth-child(n+4) {    grid-column: 3 / 4;    grid-row: 2 / 2 }
.gal-4 div:nth-child(n+5) {    grid-column: 4 / 5;    grid-row: 2 / 2 }
.gal-5 div:nth-child(n+1) {    grid-column: 1 / 3;    grid-row: 1 / 4 }
.gal-5 div:nth-child(n+2) {    grid-column: 3 / 4;    grid-row: 1 / 2 }
.gal-5 div:nth-child(n+3) {    grid-column: 3 / 4;    grid-row: 2 / 3 }
.gal-5 div:nth-child(n+4) {    grid-column: 3 / 4;    grid-row: 3 / 4 }
.gal-5 div:nth-child(n+5) {    grid-column: 4 / 5;    grid-row: 1 / 3 }
.gal-5 div:nth-child(n+6) {    grid-column: 4 / 5;    grid-row: 3 / 3 }
.gal-6 div:nth-child(n+1) {    grid-column: 2 / 5;    grid-row: 1 / 4 }
.gal-6 div:nth-child(n+2) {    grid-column: 1 / 2;    grid-row: 1 / 2 }
.gal-6 div:nth-child(n+3) {    grid-column: 1 / 2;    grid-row: 2 / 3 }
.gal-6 div:nth-child(n+4) {    grid-column: 1 / 2;    grid-row: 3 / 4 }
.gal-6 div:nth-child(n+5) {    grid-column: 5 / 6;    grid-row: 1 / 2 }
.gal-6 div:nth-child(n+6) {    grid-column: 5 / 6;    grid-row: 2 / 3 }
.gal-6 div:nth-child(n+7) {    grid-column: 5 / 6;    grid-row: 3 / 4 }

.gal-princ span {
    position: absolute;
    inset: 0 0;
    filter: blur(5px);
    transform: scale(1.25);
    background-size: cover;
    background-repeat: no-repeat;
    opacity: 0.5; 
}

.gal .gal-princ { 
    transition: .15s ease-in-out;
    overflow: hidden;
    display: flex;
    justify-content: center;
    height: 100%;
    position: relative; 
    width: -webkit-fill-available;
    width: -moz-available;
}
.gal .gal-princ a .count {
    font-size: .8rem;
    z-index: 5;
    position: absolute;
    border-radius: var(--radius-1) 0 0 0;
    padding: .5rem 1rem;
    background-color: var(--rev-white);
    bottom: 0rem;
    right: 0rem
}
.gal .gal-princ a img {
    position: relative;
    object-fit: cover;
    height: 100%;
    width: fit-content
}
.gal .sans {
    transition: .15s ease-in-out;
    overflow: hidden;
    display: flex;
    max-height: 250px;
    width: 100%;
    position: relative;
    background: url(/media/sans.png) no-repeat 50% 50%;
    background-color: var(--gr-0);
    background-size: 120px
}
.gal:after {
    display: none;
    padding: .6rem;
    position: absolute;
    font-weight: 700;
    letter-spacing: -.01rem;
    font-size: .9rem;
    left: 1rem;
    bottom: 1rem;
    content: "Voir toutes les images";
    background-color: var(--rev-white);
    box-shadow: 0 0 6px rgb(0 0 0 / 25%);
    text-align: center;
    border-radius: var(--radius-1)
}
.gal:hover .gal-princ:after {
    box-shadow: 0 0 6px rgba(0, 0, 0, .95);
    transition: .15s ease-in-out
}
.fiche-signaler {
    color: var(--signaler) !important;
    border: 1px solid var(--signaler);
    font-size: .9rem;
    border-radius: var(--radius-1);
    padding: .5rem;
    display: block;
    text-align: center;
    max-width: 250px;
    margin: auto
}
.gridifich {
    display: flex;
    gap: var(--size-lg);
    justify-content: space-between; 
    padding: var(--size-md) 0;
}
.gridifich .it1 {
    flex: 1
}
.gridifich .it2 {
    width: max(400px, 35%)
}
.gal .gal-princ a, .gal .gal-item a {
    display: contents
}
.gal .gal-princ a img, .gal .gal-item a img {
    transition: .2s ease-in-out
}

.gal-item a .count {
    display: none
}
 
.gal-0 .gal-princ img { object-fit: contain; height: 100%; width: 100%; }

.gal-0 .gal-princ {
    background-size: 100px;
}



.nbimg {
    font-weight: 700; 
    background-color: hsl(0deg 0% 100% / 75%);
    cursor: pointer;
    position: absolute;
    bottom: .75rem;
    color: var(--rev-black);
    width: 180px;
    text-align: center;
    padding: .5rem 0;
    z-index: 5;
    font-size: .9rem;
    border-radius: var(--radius-1); 
}
.dark .nbimg {
    background-color: hsl(207deg 13% 16% / 82%)
}

.labeliflex { display: flex; gap : var(--size-sm); align-items: center; margin-bottom: var(--ec-2);}
.labeliflex-savoir svg { fill: var(--gr-2); height: 18px;  transition : fill .2s ease-in-out}
.labeliflex-savoir:hover svg { fill: var(--gr-3) }
.lsa-box {
    position: relative;
    padding: var(--ec-1)  ;
    border-radius: 0.5rem;
    font-weight: bold;
    font-size: 1.1em;
    line-height: 1.2em;
    max-width: 1000px;
    background-color: #f4f7ff;
    margin: var(--ec-0) auto;
    color: rgb(12, 67, 96);
} 


.annonce-validee     {  background-color: var(--valid) }
.parcours-digital    {  background-color: var(--male) }
.annonce-validee, .parcours-digital { display: inline-flex; gap: 0.25rem; font-size: .9rem; color: var(--rev-white); border-radius: 2rem; width: fit-content; padding: 4px 8px 4px 4px; align-items: center; font-weight: 600; }
.annonce-validee svg, .parcours-digital svg { fill : var(--rev-white); height: 18px; }

.fida-chiffres { display: grid; grid-gap: 1rem; grid-template-columns: repeat(auto-fill, minmax(500px, 1fr)) }

/* H1 */
.fiche h1 {
    color: var(--color-1);
    font-weight: 600; 
    margin-bottom: 0;
    flex-grow: 1;
    align-items: center;
    display: flex; 
    padding: 0 0 var(--ec-2) 0;
} 

/* DATE */
.fiche-date { color : var(--gr-3); font-size: .8em }

/* FICHE TOP */ 
.fiche-top {
    display: flex;  
    justify-content: space-between;
    gap : var(--ec-1); 
}

h1.fiche-top-int {
    flex-direction: column;
    align-items: normal
}

h1.fiche-top-int.spb { padding-bottom: 0 }
 

.fiche-top > div:first-child {
    flex-grow: 1;
    display: flex; 
    flex-direction: column;
    justify-content: space-between;
}

.fiche-top-cont {
    flex-shrink: 0;    
    text-align: center;
    width: 30%;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    gap: var(--size-md);
}

.fiche-top-cont > div {   
    display: flex;
    justify-content: center;
    align-items: center;
}
 

.fiche-top-cont > div div:first-child {
    margin-bottom: var(--size-xs);
} 

/* PRIX */
.fiche-prix { display: flex;overflow: hidden; width: -webkit-fill-available; width: -moz-available;   }
.fiche-prix .prix, .btn-msg { height: 50px} 
.fiche-prix .prix { padding: 0 .75rem; } 
.fiche-prix .prix span { text-align: center;  color: var(--gr-2);  font-weight: bold;display: flex; flex-direction: column; }
.fiche-prix .prix span i { font-size: 9px;  color: var(--gr-3); }
.btn-msg { padding: 0 var(--size-sm); } 
.fiche-prix > div:first-child {display: flex; flex-direction: column; justify-content: center; align-items: center; font-size: clamp(1.3rem, 1vw, 1.5rem); font-weight: 600;  border: 1px solid var(--gr-1); border-radius: var(--radius);}
.fiche-prix.fiche-prix-fida > div:first-child { border-radius: var(--radius) 0 0 var(--radius);}
.fiche-prix .fida { font-size: 1.15em; font-weight: 600;line-height: 2rem;display: inline-flex;align-items: center;gap: 0.25rem; border: 1px dashed var(--lsa-3);border-left: 0;border-radius: 0 var(--radius) var(--radius) 0;padding: 0 0.75rem;border-left: 1px solid var(--rev-white);margin-left:-3px;}
.fiche-prix .fida a { color: var(--lsa-2); text-decoration: underline;  }
.fiche-prix .fida span:first-child { color: var(--lsa-2)}
.fiche-prix .fida span:last-child  { text-decoration: underline;} 
.fiche-prix .fiche-fida-info, .fiche-prix .btn-msg { display: none;}
.fiche-prix .btn-msg { display: none;}

.fiche-prix .annonce { color:var(--color-2); font-size: 1.15em; font-weight: 600;line-height: 2rem;display: inline-flex;align-items: center;gap: 0.25rem; border: 1px dashed var(--lsa-3);border-left: 0;border-radius: 0 var(--radius) var(--radius) 0;padding: 0 0.75rem;border-left: 1px solid var(--rev-white);margin-left:-3px;}
.fiche-prix .annonce-sp { color:var(--color-2); font-size: 1.15em; font-weight: 600;line-height: 2rem;display: inline-flex;align-items: center;gap: 0.25rem; border: 1px dashed var(--lsa-3); border-radius: var(--radius)  ;padding: 0 0.75rem; }


/* MESSAGE */
.fiche-mob-site-eleveur { display: none;}

.fiche-site-eleveur { display: block; text-align: center; font-weight: bold; }
.fiche-site-eleveur span { font-size: clamp(1.1rem, 1vw, 1.25rem)}
.fiche-site-eleveur div { font-size: .9rem; margin-bottom: var(--size-xs); display: flex; align-items: center; gap: .25rem; justify-content: center; font-weight: normal; color: var(--color-1); } 
.fiche-site-eleveur div svg { fill:var(--rev-black); height: 14px; width: 14px;      }
.btn-msg { transition: .2s ease-in-out ; display: flex; align-items: center; gap: .5rem; background-color: var(--cta); color: #FFF !important; justify-content: center; font-size: 1.2rem; text-align: center;  border-radius: .3rem; fill: var(--rev-white); font-weight: bold  }
.btn-msg:hover { background-color: var(--cta-h);  }
.btn-msg svg { fill : #FFF; height: 24px; }

.fiche-box, .fiche-info, .fiche-top, .lien-pedigree, .pedifich-flex { margin-bottom: var(--ec-1) }

/* LIST */ 
.fiche .fiche-info { 
    border-radius: var(--radius); 
    text-align: center;    
    display  : grid;  
    grid-template-columns : 1fr 1fr 1fr 1fr;  
    text-align: center;
    font-size: 1.2rem; 
    grid-gap: var(--ec-3) ; 
}

.fiche .fiche-info > div { 
    border-radius: var(--radius); 
    background-color: var(--gr-0);
    font-size: clamp(1rem, 1vw, 1.2rem);;
    padding: var(--ec-3);
}

.fiche .fiche-info > div .fiche-info-titre svg {
    height: 14px; 
    fill :  var(--gr-3)  
} 

.fiche .fiche-info > div .fiche-info-titre {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: var(--size-xs);
    margin-bottom: var(--size-sm);    
    text-transform: uppercase;
    font-size: .7em;    
    color : var(--gr-3);
}

.fiche .fiche-info > div .fiche-info-titre svg {
    height: 14px; 
    fill :  var(--gr-3)  
}

.fiche .fiche-info > div p {
    font-weight: bold;
    font-size: 1em;
}  

.liste-annee {
    display: flex;
    flex-wrap: wrap;
    column-gap: .5rem
}
.liste-annee a {
    display: block;
    margin-bottom: var(--size-md);
    cursor: pointer;
    color: var(--rev-black); 
    border: 2px solid var(--gr-2);
    border-radius: var(--radius);
    padding: var(--ec-4) var(--ec-3) ;
}
.liste-annee a:hover {
    height: 4rem;
    width: 4rem;
    border: 2px solid var(--male);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center
}
.liste-annee a.select {
    background-color: var(--rev-white)
}
.liste-annee a:hover.select {
    border: 2px solid var(--gr-2)
}

/* MOT */
.fiche .fiche-autre {
    background-color : var(--gr-0); 
    border-radius: var(--radius);
    padding: var(--ec-3); 
    text-align: left;
    line-height: 1.25rem; 
    overflow-wrap: break-word;
}

.fiche .fiche-autre ul { list-style: none; padding: 0}
.fiche .fiche-autre ul li { margin-top : .75rem }
.fiche .fiche-autre ul li:first-child { margin-top : 0 }

.fiche .fiche-result { background-color : var(--gr-0);     border-radius: var(--radius);    padding: var(--ec-3);       list-style: none;      display: grid;    grid-template-columns : 1fr 1fr ;    grid-gap: var(--ec-2); margin-bottom: var(--ec-2);}
.fiche .fiche-result li { display: flex; gap: var(--ec-3);}
.fiche .fiche-result li p { font-size: .9em; word-break: break-word; }

.fiche-result-annee { grid-column: span 2; font-weight: bold; font-size: clamp(1.4rem, 2vw, 1.8rem); padding: .5rem 0 ; text-align: center; color: var(--color-2);} 
.fiche .fiche-result li .result-int { color: var(--color-2); }
.fiche .fiche-result li .result-int { display: block;}
.fiche .fiche-result li .result-img {  overflow: hidden; background: var(--rev-white) url(/media/sans.png) no-repeat 50% 50%;   background-size: 25%; border-radius: var(--radius); height: 80px; aspect-ratio: 4/3; flex-shrink: 0; }
.fiche .fiche-result li .result-img img {object-fit: cover;width: 100%;height: 100%;}
.fiche .fiche-result .result-date-ville { color: var(--gr-3); font-size: .8rem; }



/* MOT */
.fiche .fiche-mot {
    border : 1px solid var(--gr-1); 
    border-radius: var(--radius);
    padding: var(--ec-1); 
    text-align: left;
    line-height: 1.25rem; 
    overflow-wrap: break-word;
    color: var(--gr-4);
}

.fiche .fiche-mot > div {
    font-weight: bold;
    font-size: 1.2rem;
    text-align: center;
    margin-bottom: var(--size-md); 
}

.tares {
    background-color: var(--gr-0);
    border-right: 0;
    padding: var(--ec-1); 
    text-align: left;
    border-radius: var(--radius); 
    line-height: 1.25rem; 
    overflow-wrap: break-word;
} 

/* SHARE */
.share-item {
    display: inline-block; 
    font-size: .9rem;
    border-radius: 0 0 var(--radius) var(--radius); 
    font-weight: bold;
    grid-column: 1 / span 4; 
    width: -moz-available;
    width: -webkit-fill-available;
    text-align: center;
}

.share-item .btn-share {
    padding: 0 1rem .5rem 1rem;
    border-radius: 0 0 var(--radius) var(--radius);
    font-size: .8rem;
    display: inline-flex;
    justify-content: center;
    background-color: color-mix(in oklab, var(--gr-0) 50%, var(--rev-white) 50%); 
    align-items: center;
    gap: 0.5rem;
    cursor: pointer;
    margin: auto;
    border-top: .0;
    color:var(--gr-2)
}

.share-item .btn-share:hover {
    border-color :var(--gr-2);
}

.share-item .btn-share  svg {height: 14px; fill : var(--gr-2)  }


.modal-content { 
    flex-direction: column !important;
}

.modal-body { display: flex; gap: var(--size-md); justify-content: center; padding-top: var(--size-md);}
.modal-header {display: none;}
.modal-body ul { 
    display: flex;
    gap: var(--size-md); 
    border: 1px dashed var(--gr-1); 
    border-radius: var(--radius-1);
    padding: var(--size-md);
}
.modal-body ul li { flex: 1;}
.modal-body ul li a { 
display: flex;
border-radius: var(--radius);
align-items: center;
justify-content: center;
font-size: .9rem; 
padding: var(--size-sm);
background-color: color-mix(in oklab, var(--gr-0) 75%, var(--rev-white) 25%); 
border : 1px solid var(--gr-0)
}

/* FIDANIMO */
.fiche-fida-info {
    position: relative;
    display: block;
    padding: var(--ec-3);
    margin: var(--ec-0) auto;
    color: var(--rev-black) !important;
    text-align: center; 
    border-radius: var(--radius); 
    background-image: url(/media/assurance/bg-basgauche.svg);
    background-repeat: no-repeat;
    background-size: 15%;
    background-position: 0 100%;
    text-align: center; 
    border : 1px solid var(--gr-1);
    background-color: var(--rev-white);
}

.fiche-fida-info > span { 
    display: flex;
    flex-direction: column;
    gap : .5rem
}

.fiche-fida-info::after {
    position: absolute; 
    display: block;
    content: '';
    background: url(/media/assurance/logo.svg) no-repeat 50% 0%;
    background-size: contain;
    width: 60px;
    height: 40px;
    top: 10px;
    right: 10px;
}

.liste-info-1 li.liste-info-fida { padding: 0; }
.liste-info-1 li.liste-info-fida .fiche-fida-info { margin: 0;}

/* LISTE INFO 1 */
.liste-info-1 {
    display: grid; 
    grid-template-columns : repeat(auto-fill,minmax(420px,1fr));
    grid-gap: var(--ec-3) ;
    text-align: center;  
}

.liste-info-1 li { 
    background-color: var(--gr-0);
    padding: var(--size-md) var(--size-xs) ;
    border-radius: var(--radius);
    display: flex;
    flex-direction: column;
}
 
.liste-info-1 li div {
    text-transform: uppercase;
    font-size: .8em;
    margin-bottom: var(--size-xs);
    display: flex;
    justify-content: center;
    align-items: center;
    gap: var(--size-xs);
    color : var(--gr-3);
}

.liste-info-1 li p { 
    font-weight: bold;
    flex: 1 0;
    display: flex;
    align-items: center; 
    flex-direction: column; 
    justify-content: center;
}

.liste-info-1 li p span { font-size: .8rem; display: block; font-weight: normal; text-transform: capitalize; }

/* LISTE INFO 2 */
.liste-info-2 {
    border-radius: var(--radius);
    display: flex;
    flex-direction: column;
    gap: 1px;
    overflow: hidden;
}

.liste-info-2 li { 
    display: flex;  
    background-color: var(--gr-0);
    border-radius: var(--radius);
}

.liste-info-2 li a { 
    display: flex;  
    align-items: center;
}

.liste-info-2 li div {
    background-color : var(--gr-05); 
    width: 30%;
    padding: var(--size-md) ;
    justify-content: flex-end; 
}

.liste-info-2 li p, .liste-info-2 li a { 
    padding:  var(--size-md);
    flex-grow: 1;
}
.liste-info-2 li a svg {  fill : var(--color-2); height: 14px; }
.liste-info-2 li > div  {
    display: flex; 
    align-items: center;
    text-align: right;
}

.liste-info-2 li span { 
    display: block;
}

/* PEDIGREE */
.lien-pedigree {
    margin: 0 auto var(--ec-1) auto;
    width: fit-content;
}

.lien-pedigree svg { fill: var(--rev-white);}
.lien-pedigree > span {
    display: flex;
    gap : .5rem;
    align-items: center;
    padding: var(--size-sm) var(--size-md) ;
    border-radius: var(--radius);
    background-color: var(--cta);
    color: #FFF !important;
    transition: .2s ease-in-out; 
    margin-bottom: .75rem;
    text-align: center;
} 

.lien-pedigree > div { display: flex;    gap: 0.5rem;    justify-content: center; } 
.lien-pedigree > div > span { display: flex; font-size: .9rem ; gap: .5rem;  align-items: center; flex-shrink: 0; padding: .5rem; border: 1px solid var(--gr-1); border-radius: var(--radius); } 
.lien-pedigree > div > span .material-icons { font-size: 15px  } 
.lien-pedigree > div > span:hover { border-color :var(--gr-2);}  

.pedifich-flex { 
    display: flex;   
    gap: var(--ec-0); 
}

.pedifich { 
    border-radius: var(--radius);
    flex : 1 0; 
    display: flex;
    flex-direction: column;
}
.pedifich .nom {
    display: block; 
    color: var(--color-1);
    display: flex; flex-direction: column; gap: var(--size-xs)
}

.pedifich .nom .list-etoile  { margin: .25rem auto 0 auto }


.pedifich .nom .puce { color : var(--gr-3); font-size: .8rem }

.pedigree-box .nom span {
    display: block;
    color: var(--rev-black)
}
.pedigree-box.male .p-lien {
    color: var(--male)
}
.pedigree-box.femelle .p-lien {
    color: var(--femelle)
}
 
.pedi-fond {
    border-radius: var(--radius);
    padding: var(--resp);
    background-color: var(--gr-0)
}

.pedi-flx { text-align: center; position: relative; min-height: 235px;}

.pedi-flx , .pedifich .gp { border: 1px solid var(--gr-1); padding: 1rem .75rem .75rem .75rem; border-radius: var(--radius); }

.pedi-flx > div { flex: 1; display: flex; flex-direction: column; justify-content: space-between; gap: var(--size-md); } 

.gpbox { display: flex; gap: 0 var(--size-md); flex-wrap: wrap; justify-content: center; flex : 1 }   

.gpbox-arbo { 
    margin: auto;
    position: relative;
    height: 18px;
    width: 50%;
    border-top: 1px dashed var(--gr-1);
    border-left: 1px dashed var(--gr-1);
    border-right: 1px dashed var(--gr-1);
    margin-top: 13px;
}  

.gpbox-arbo:before {
    position: absolute;
    content: "";
    top: -14px;
    left: 50%;
    height: 13px;
    width: 1px;
    border-right: 1px dashed var(--gr-1);
} 

.pedifich .img-p {
    display: block;
    overflow: hidden;
    border-radius: var(--radius);
    aspect-ratio: 4/3;
    height: 120px;
    margin: 0 auto 1rem auto;
    
}
.pedifich .img-p img {
    object-fit: cover;
    height: 100%;
    width: 100%;
}
.pedifich .arbo {
    min-width: 2rem;
    position: relative;
    flex-grow: 1
}
.pedifich .arbo span {
    display: block;
    position: relative;
    width: 100%;
    height: 100%
}
.pedifich .arbo span:after {
    position: absolute;
    display: block;
    width: 50%;
    content: " ";
    height: .25rem;
    background-color: var(--gr-1);
    top: 50%;
    left: 0
}
.pedifich .arbo span:before {
    position: absolute;
    display: block;
    height: 50%;
    content: " ";
    width: .25rem;
    background-color: var(--gr-1);
    top: 25%;
    left: 50%
}
.pedifich .arbo:after {
    position: absolute;
    display: block;
    width: 50%;
    content: " ";
    height: .25rem;
    background-color: var(--gr-1);
    top: 25%;
    right: 0
}
.pedifich .arbo:before {
    position: absolute;
    display: block;
    width: 50%;
    content: " ";
    height: .25rem;
    background-color: var(--gr-1);
    bottom: 25%;
    right: 0
}
  
.pedifich .gp { 
    display: flex;
    flex-direction: column;
    text-align: center;
    gap: .75rem;
    align-items: center;
    flex: 1;   
    min-width: 40%;
    border-radius: var(--radius);
    position: relative;
}
.pedifich .gp:last-child {
    color: var(--femelle)
}
.pedifich .gp .img-gp {
    flex-shrink: 0;
    background-color: var(--gr-0);
    aspect-ratio: 4/3;
    height: 70px;
    overflow: hidden;
    border-radius: var(--radius);
}

.pedifich .gp .img-int { font-size: .9rem; color: var(--color-1);}

.pedifich .gp .img-gp img {
    object-fit: cover;
    height: 100%;
    width: 100%;
    max-width: 100px
}

.pedifich .gp .gp-int {
    position: absolute;
    top: -10px;
    left: calc(50% - 50px);
    width: 100px;
    text-align: center;
    background-color: var(--rev-white);
    padding: 0.15rem 0;
    font-size: .8rem;
    font-weight: bold;
}

.pedifich.male .type { color: var(--male); }
.pedifich.femelle .type { color: var(--femelle); }

.pedifich.femelle .type, .pedifich.male .type {
    position: absolute;
    width: 60px;
    text-align: center;
    background-color: var(--rev-white);
    padding: 0.15rem 0;
    font-size: .8rem;
    top: -2px;
    left: 50%;
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    font-weight: 700
}


.liste-1 {
    display: grid;
    grid-gap: .5rem;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    color: var(--color-3);
    margin-bottom: var(--resp)
}
.liste-1 li { 
    padding: var(--size-md);
    border-radius: var(--radius);
    background-color: var(--gr-0);
    line-height: normal;
}
.liste-1 li div:first-child, .tares div:first-child { 
    margin-bottom: var(--size-xs);
    color: var(--color-1)
}

.list-other-max { text-align: center; margin-bottom: var(--ec-1); background-color: var(--gr-0); padding: var(--ec-0); }
.list-other { display: grid; grid-template-columns: 1fr 1fr;  grid-gap: var(--ec-3); background-color: var(--gr-0); padding: var(--ec-3); }
.list-other > div div  { font-size: clamp(1.1rem, 1vw, 1.4rem); font-weight: bold; padding-bottom: var(--ec-1) }
.list-other > div ul { list-style: none; } 
.list-other > div ul li a { font-size: clamp(.9rem, 1vw, 1rem); display: block; margin-bottom: var(--size-sm); font-weight: 600; padding: var(--ec-3); background-color: color-mix(in oklab, var(--gr-0) 25%, var(--rev-white) 75% ); border-radius: 0.5rem; transition: background-color .2s ease-in-out; }
.list-other > div ul li a:hover { background-color : var(--gr-05)} 



@media only screen and (max-width:1400px ) { 
    .gal { max-height: 550px; }
}

@media only screen and (max-width:1000px ) { 
    .fiche .fiche-info > div .fiche-info-titre { flex-direction: column;}
    .list-other { grid-template-columns: 1fr }
    .liste-info-1 { grid-template-columns : 1fr 1fr;}
    .liste-info-1 li.liste-info-fida { grid-column: span 2; order : -1 }
    .labeliflex { margin-bottom: var(--size-md); } 
    .fiche .fiche-info { grid-template-columns : 1fr 1fr; font-size: 1rem; padding: 0; } 
    .pedifich-flex { flex-direction: column; gap : 2rem }
    .pedi-flx { min-height:auto }
    .liste-info-1 li.max { grid-column: auto; }
    .liste-info-2 { gap: 0;}
    .liste-info-2 li { padding: 0 1.25rem 1.25rem 1.25rem; flex-direction: column; border-radius: 0;}
    .liste-info-2 li:first-child { border-radius: var(--radius) var(--radius) 0 0; padding-top: 1.25rem ;}
    .liste-info-2 li:last-child  { border-radius: 0 0 var(--radius) var(--radius);}
    .liste-info-2 li div {  width: -webkit-fill-available;  width: -moz-available; text-align: center; justify-content: flex-start; background-color: transparent; font-weight: bold; text-align: left; margin-bottom: .25rem; }
    .liste-info-2 li div, .liste-info-2 li p, .liste-info-2 li a { padding: 0; }
    .fiche-top-cont { display: none; } 
    .fiche-prix {position: fixed; box-shadow: 0 0 19px 0px hsl(0deg 0% 0% / 16%); flex-wrap: wrap; gap : 0 2.5%; z-index: 1000; bottom: 0px; left: 0; padding: .75rem 10% 0.25rem 10%; background-color: var(--rev-white); width: 100%; margin-bottom: 0; border-radius: 0;}
    .fiche-prix.sanfid { padding: .75rem 2.5%  ;}
    .fiche-prix .btn-msg { flex: 1; display: flex; font-size: 1.1em;  margin-bottom: 0; order : 2; width: 63%; padding: 0.75rem .5rem;}
    .fiche-prix .fida { font-size: .9rem; order: 3; justify-content: center; width: -webkit-fill-available; width: -moz-available; margin: auto; border: 0;}   
    .fiche-prix .annonce, .fiche-prix .annonce-sp { font-size: .9rem; order: 3; justify-content: center; width: -webkit-fill-available; width: -moz-available; margin: auto; border: 0;}   
    .fiche-fida-info { width: 100%; font-size: .9em;} 
    .fiche .fiche-mot > div { font-size: 1rem}
    .fiche-prix.fiche-prix-fida > div:first-child { border-radius : var(--radius); }
    footer { margin-bottom: 100px }
    .fiche .fiche-result { grid-template-columns : 1fr; grid-gap : 1.5rem }
    .fiche-result-annee { grid-column : span 1; }
    .fiche .fiche-result li .result-img { height: 60px; }
    .fiche h1 { padding: 0;}
    .fiche-mob-site-eleveur { display: inline-flex; width: fit-content; align-items: center; border: 1px solid var(--gr-1); padding : .25rem .75rem .25rem .25rem   ; border-radius: var(--radius); text-align: center; margin-top: 1rem; font-size: .8rem;}
    .fiche-mob-site-eleveur svg { height: 14px; fill: var(--color-2);}
}

@media only screen and (max-width:700px ) {  
    .gal { aspect-ratio: 4/3; max-height: 400px; }
    .gal .gal-princ a img { object-fit: contain; }
    .gal-6 div {    grid-column: 1 !important;    grid-row: 1 !important }
    .fiche-box, .fiche-info, .fiche-top, .lien-pedigree, .pedifich-flex { margin-bottom: 2rem } 
    .fiche .fiche-info { grid-template-columns : 1fr 1fr; grid-gap:  var(--size-sm); }
    .fiche-fida-info::after { position: relative; margin: var(--size-sm) auto 0 auto; top: auto; right: auto; height: 24px;}
    .liste-info-fida a { padding: var(--ec-1) var(--ec-1) 0 var(--ec-1) }
    .fiche .fiche-info .fiche-mot { grid-column: 1 ; } 
    .fiche .fiche-info, .liste-info-1 { gap: .75rem;}
    .liste-info-1 { grid-template-columns: 1fr 1fr; } 
    .annonce-validee svg, .parcours-digital svg { height: 18px;  } 
    .fida-chiffres { display: grid; grid-gap: 1rem; grid-template-columns:  1fr } 
    .fiche-prix { padding: .75rem 2.5% 0.25rem 2.5% }
    .lien-pedigree > div > span { font-size: .8rem ; gap: .25rem } 
}

@media only screen and (max-width:550px) {
    .content .glob.globetalon { width: -webkit-fill-available; width: -moz-available;  }
}
