:root {
--foret: #1d4433;
--vert: #2e6a4c;
--vert-clair: #e3efe6;
--terre: #a4461f;
--terre-fonce: #86381a;
--sable: #f5efe3;
--papier: #fffdf8;
--encre: #1b211d;
--gris: #4b5550;
--filet: #e2dbcc;
--erreur: #9b1c1c;
--police: "DM Sans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
--rayon: 10px;
--ombre: 0 1px 2px rgb(27 33 29 / 6%), 0 8px 24px rgb(27 33 29 / 6%);
--largeur: 70rem;
--largeur-etroite: 44rem;
--gouttiere: clamp(1rem, 4vw, 2rem);
}  *,
*::before,
*::after {
box-sizing: border-box;
}
html {
-webkit-text-size-adjust: 100%;
font-size: 112.5%;
scroll-behavior: smooth;
}
body {
margin: 0;
background: var(--papier);
color: var(--encre);
font-family: var(--police);
font-size: 1rem;
line-height: 1.65;
-webkit-font-smoothing: antialiased;
}
img,
video,
iframe {
display: block;
max-width: 100%;
height: auto;
}
a {
color: var(--vert);
text-underline-offset: 0.18em;
}
a:hover {
color: var(--foret);
}
:focus-visible {
outline: 3px solid var(--terre);
outline-offset: 2px;
}
h1,
h2,
h3,
h4 {
margin: 0 0 0.6em;
font-weight: 500;
line-height: 1.15;
letter-spacing: -0.015em;
text-wrap: balance;
}
p {
margin: 0 0 1em;
}
.visuellement-cache {
position: absolute !important;
width: 1px;
height: 1px;
overflow: hidden;
clip: rect(0 0 0 0);
white-space: nowrap;
}
.lien-evitement {
position: absolute;
top: -100px;
left: 1rem;
z-index: 100;
padding: 0.6rem 1rem;
background: var(--foret);
color: #fff;
}
.lien-evitement:focus {
top: 1rem;
}
.enveloppe {
width: 100%;
max-width: var(--largeur);
margin: 0 auto;
padding: 0 var(--gouttiere);
}
.enveloppe--etroite {
max-width: var(--largeur-etroite);
}
.section {
padding-block: clamp(2.5rem, 7vw, 5rem);
}
.section--sable {
background: var(--sable);
}
.section-courte {
margin-top: 2rem;
}
.note {
color: var(--gris);
font-size: 0.875rem;
} .bouton {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 0.5em;
min-height: 2.75rem;
padding: 0.55rem 1.2rem;
border: 2px solid var(--foret);
border-radius: 999px;
background: var(--foret);
color: #fff;
font: inherit;
font-weight: 500;
line-height: 1.2;
text-align: center;
text-decoration: none;
cursor: pointer;
transition: background-color 0.15s, border-color 0.15s, color 0.15s;
}
.bouton:hover {
border-color: var(--vert);
background: var(--vert);
color: #fff;
}
.bouton--don {
border-color: var(--terre);
background: var(--terre);
}
.bouton--don:hover {
border-color: var(--terre-fonce);
background: var(--terre-fonce);
}
.bouton--clair {
border-color: #fff;
background: transparent;
color: #fff;
}
.bouton--clair:hover {
border-color: #fff;
background: #fff;
color: var(--foret);
}
.bouton--clair-sombre {
background: transparent;
color: var(--foret);
}
.bouton--large {
min-height: 3.25rem;
padding: 0.75rem 1.6rem;
font-size: 1.0625rem;
}
.bouton--plein {
width: 100%;
}
.lien-fleche {
font-weight: 500;
text-decoration: none;
white-space: nowrap;
}
.lien-fleche::after {
content: " →";
} .entete {
position: sticky;
top: 0;
z-index: 50;
border-bottom: 1px solid var(--filet);
background: rgb(255 253 248 / 94%);
backdrop-filter: blur(8px);
}
.admin-bar .entete {
top: var(--wp-admin--admin-bar--height, 0);
}
.entete__interieur {
display: flex;
align-items: center;
justify-content: space-between;
gap: 1rem;
min-height: 4.5rem;
}
.marque {
display: flex;
align-items: center;
gap: 0.6rem;
color: var(--foret);
font-size: 1.25rem;
font-weight: 500;
text-decoration: none;
}
.marque__logo {
width: auto;
height: 2.75rem;
}
.navigation {
display: flex;
align-items: center;
gap: 1.5rem;
}
.navigation .menu {
display: flex;
gap: 1.4rem;
margin: 0;
padding: 0;
list-style: none;
}
.navigation .menu a {
color: var(--encre);
font-weight: 500;
text-decoration: none;
}
.navigation .menu a:hover,
.navigation .menu .current-menu-item > a,
.navigation .menu .current_page_item > a,
.navigation .menu .current-menu-ancestor > a {
color: var(--vert);
text-decoration: underline;
text-decoration-thickness: 2px;
}
.menu-bouton {
display: none;
} .navigation .menu a,
.langues__bouton,
.entete__don {
white-space: nowrap;
} @media (max-width: 90rem) {
.navigation,
.navigation .menu {
gap: 1rem;
}
}
@media (max-width: 78rem) {
.js .menu-bouton {
display: inline-flex;
align-items: center;
gap: 0.5rem;
min-height: 2.75rem;
padding: 0 0.9rem;
border: 1px solid var(--filet);
border-radius: 999px;
background: #fff;
color: var(--encre);
font: inherit;
font-weight: 500;
cursor: pointer;
}
.menu-bouton__icone,
.menu-bouton__icone::before,
.menu-bouton__icone::after {
display: block;
width: 18px;
height: 2px;
background: currentColor;
content: "";
}
.menu-bouton__icone {
position: relative;
}
.menu-bouton__icone::before {
position: absolute;
top: -6px;
}
.menu-bouton__icone::after {
position: absolute;
top: 6px;
}
.js .navigation {
display: none;
position: absolute;
top: 100%;
right: 0;
left: 0;
flex-direction: column;
align-items: stretch;
gap: 1rem;
padding: 1rem var(--gouttiere) 1.5rem;
border-bottom: 1px solid var(--filet);
background: var(--papier);
box-shadow: var(--ombre);
}
.js .navigation.est-ouverte {
display: flex;
}
.navigation .menu {
flex-direction: column;
gap: 0;
}
.navigation .menu a {
display: block;
padding: 0.7rem 0;
border-bottom: 1px solid var(--filet);
}
.no-js .entete__interieur {
flex-wrap: wrap;
padding-block: 0.8rem;
}
.no-js .navigation {
flex-wrap: wrap;
}
.no-js .navigation .menu {
flex-direction: row;
flex-wrap: wrap;
gap: 0.2rem 1rem;
}
.no-js .navigation .menu a {
border: 0;
padding: 0.2rem 0;
}
} .accroche {
position: relative;
display: flex;
align-items: flex-end;
min-height: min(34rem, 75vh);
padding-block: clamp(3rem, 10vw, 6rem);
background: var(--foret);
color: #fff;
isolation: isolate;
}
.accroche__photo {
position: absolute;
inset: 0;
z-index: -2;
width: 100%;
height: 100%;
object-fit: cover;
}
.accroche--photo::before {
position: absolute;
inset: 0;
z-index: -1;
background: linear-gradient(180deg, rgb(15 35 26 / 15%) 0%, rgb(15 35 26 / 72%) 100%);
content: "";
}
.accroche__titre {
max-width: 16ch;
font-size: clamp(2.3rem, 6vw, 4.2rem);
}
.accroche__texte {
max-width: 38rem;
font-size: clamp(1.1rem, 2vw, 1.3rem);
opacity: 0.95;
}
.accroche__boutons {
display: flex;
flex-wrap: wrap;
gap: 0.75rem;
margin-top: 1.8rem;
} .page-entete {
padding-block: clamp(2.5rem, 7vw, 4.5rem) clamp(1.5rem, 4vw, 2.5rem);
border-bottom: 1px solid var(--filet);
background: var(--sable);
}
.page-entete__titre {
font-size: clamp(2rem, 5vw, 3.2rem);
}
.page-entete__texte {
max-width: 42rem;
color: var(--gris);
font-size: 1.2rem;
} .page-entete--photo .page-entete__interieur {
display: grid;
gap: 1.5rem 3rem;
align-items: center;
}
.page-entete__photo {
width: 100%;
aspect-ratio: 3 / 2;
object-fit: cover;
border-radius: var(--rayon);
}
@media (min-width: 48rem) {
.page-entete--photo .page-entete__interieur {
grid-template-columns: 1fr minmax(16rem, 26rem);
}
}
.page-entete__meta {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 0.5rem 1.2rem;
color: var(--gris);
}
.fil {
margin-bottom: 0.6rem;
font-size: 0.9375rem;
}
.fil a {
text-decoration: none;
}
.fil a::before {
content: "← ";
}
.filtres {
display: flex;
flex-wrap: wrap;
gap: 0.5rem;
margin-top: 1.5rem;
}
.filtres a {
padding: 0.35rem 0.95rem;
border: 1px solid var(--filet);
border-radius: 999px;
background: #fff;
color: var(--encre);
font-size: 0.9375rem;
text-decoration: none;
}
.filtres a[aria-current] {
border-color: var(--foret);
background: var(--foret);
color: #fff;
} .section__entete {
display: flex;
flex-wrap: wrap;
align-items: baseline;
justify-content: space-between;
gap: 0.5rem 1.5rem;
margin-bottom: 1.8rem;
}
.section__entete .titre-section {
margin: 0;
}
.titre-section {
font-size: clamp(1.6rem, 3.5vw, 2.3rem);
}
.sous-titre {
margin-top: 2rem;
font-size: 1.25rem;
} .grille {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(min(100%, 20rem), 1fr));
gap: clamp(1rem, 3vw, 1.75rem);
}
.carte {
overflow: hidden;
border: 1px solid var(--filet);
border-radius: var(--rayon);
background: #fff;
transition: box-shadow 0.2s, transform 0.2s;
}
.carte:hover {
box-shadow: var(--ombre);
transform: translateY(-2px);
}
.carte__lien {
display: flex;
flex-direction: column;
height: 100%;
color: inherit;
text-decoration: none;
}
.carte__lien:hover {
color: inherit;
}
.carte__image {
position: relative;
aspect-ratio: 3 / 2;
background: var(--vert-clair);
}
.carte__image img {
width: 100%;
height: 100%;
object-fit: cover;
}
.carte__image .etiquette {
position: absolute;
top: 0.75rem;
left: 0.75rem;
}
.carte__corps {
display: flex;
flex: 1;
flex-direction: column;
padding: 1.1rem 1.25rem 1.3rem;
}
.carte__surtitre {
margin-bottom: 0.3rem;
color: var(--gris);
font-size: 0.875rem;
}
.carte__titre {
margin-bottom: 0.5rem;
font-size: 1.25rem;
}
.carte__resume {
color: var(--gris);
font-size: 0.975rem;
}
.carte .progression {
margin-top: auto;
}
.etiquette {
display: inline-block;
padding: 0.15rem 0.65rem;
border-radius: 999px;
background: var(--vert-clair);
color: var(--foret);
font-size: 0.8125rem;
font-weight: 500;
text-decoration: none;
}
.etiquette--en_cours {
background: var(--terre);
color: #fff;
}
.etiquette--finance {
background: var(--foret);
color: #fff;
}
.etiquette--termine {
background: #e7e3da;
color: var(--encre);
} .progression {
padding-top: 0.9rem;
}
.progression p {
margin: 0;
}
.progression__chiffres {
display: flex;
flex-wrap: wrap;
align-items: baseline;
gap: 0 0.4rem;
color: var(--gris);
font-size: 0.9375rem;
}
.progression__montant {
color: var(--encre);
font-size: 1.2rem;
font-weight: 500;
}
.progression__barre {
height: 0.55rem;
margin: 0.5rem 0 0.25rem;
overflow: hidden;
border-radius: 999px;
background: var(--vert-clair);
}
.progression__barre span {
display: block;
height: 100%;
border-radius: inherit;
background: var(--vert);
}
.progression__pourcentage {
color: var(--foret);
font-size: 0.875rem;
font-weight: 500;
}
.progression__arbres,
.progression__dons {
margin-top: 0.4rem !important;
color: var(--gris);
font-size: 0.9375rem;
}
.progression--detail .progression__montant {
font-size: 2rem;
}
.progression--detail .progression__barre {
height: 0.8rem;
} .section--chiffres {
padding-block: clamp(2rem, 5vw, 3rem);
}
.chiffres {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(min(100%, 12rem), 1fr));
gap: 1.5rem;
margin: 0;
padding: 0;
list-style: none;
}
.chiffres__valeur {
display: block;
color: var(--foret);
font-size: clamp(2rem, 4.5vw, 2.8rem);
font-weight: 500;
line-height: 1.1;
letter-spacing: -0.02em;
}
.chiffres__libelle {
color: var(--gris);
} .projet {
display: grid;
grid-template-columns: minmax(0, 1fr) 22rem;
align-items: start;
gap: clamp(2rem, 5vw, 4rem);
}
.projet__photo,
.article__photo {
margin: 0 0 2rem;
}
.projet__photo img,
.article__photo img {
width: 100%;
border-radius: var(--rayon);
}
.projet__collecte {
position: sticky;
top: 6rem;
}
@media (max-width: 60rem) {
.projet {
grid-template-columns: 1fr;
}
.projet__collecte {
position: static;
order: -1;
}
}
.encart {
padding: 1.5rem;
border: 1px solid var(--filet);
border-radius: var(--rayon);
background: #fff;
}
.encart .progression {
padding-top: 0;
margin-bottom: 1.25rem;
}
.encart--vert {
border-color: transparent;
background: var(--vert-clair);
}
.encart__titre {
margin-bottom: 0.6rem;
font-size: 1.15rem;
font-weight: 500;
}
.encart__boutons {
display: flex;
flex-wrap: wrap;
gap: 0.6rem;
margin: 1rem 0 0;
} .contenu > * + * {
margin-top: 1.1em;
}
.contenu > :first-child {
margin-top: 0;
}
.contenu h2 {
margin-top: 2em;
font-size: 1.7rem;
}
.contenu h3 {
margin-top: 1.6em;
font-size: 1.3rem;
}
.contenu img {
border-radius: var(--rayon);
}
.contenu figure {
margin-inline: 0;
}
.contenu figcaption {
margin-top: 0.5rem;
color: var(--gris);
font-size: 0.875rem;
}
.contenu blockquote {
margin-inline: 0;
padding-left: 1.2rem;
border-left: 3px solid var(--vert);
}
.contenu ul,
.contenu ol {
padding-left: 1.3rem;
} .temoignage {
overflow: hidden;
border: 1px solid var(--filet);
border-radius: var(--rayon);
background: #fff;
}
.temoignage > img {
width: 100%;
aspect-ratio: 3 / 2;
object-fit: cover;
}
.temoignage__corps {
padding: 1.1rem 1.25rem 1.3rem;
}
.temoignage__titre {
margin-bottom: 0.2rem;
font-size: 1.15rem;
}
.temoignage__titre a {
color: inherit;
text-decoration: none;
}
.temoignage__lieu {
color: var(--gris);
font-size: 0.875rem;
}
.temoignage__traduction {
margin: 0;
padding-left: 1rem;
border-left: 3px solid var(--terre);
color: var(--encre);
font-style: italic;
}
.video {
width: 100%;
aspect-ratio: 16 / 9;
background: #000;
}
.video--integree iframe {
width: 100%;
height: 100%;
} .page-don {
display: grid;
grid-template-columns: minmax(0, 1fr) 20rem;
align-items: start;
gap: clamp(2rem, 5vw, 4rem);
}
.page-don__infos {
display: grid;
gap: 1.5rem;
}
@media (max-width: 60rem) {
.page-don {
grid-template-columns: 1fr;
}
}
.don {
display: grid;
gap: 1.25rem;
}
.don__bloc {
margin: 0;
padding: 1.4rem 1.5rem 1.2rem;
border: 1px solid var(--filet);
border-radius: var(--rayon);
background: #fff;
}
.don__legende {
padding: 0;
font-size: 1.15rem;
font-weight: 500;
}
.don__legende + * {
margin-top: 0.8rem;
}
.choix-segment {
display: inline-flex;
flex-wrap: wrap;
padding: 0.25rem;
border-radius: 999px;
background: var(--sable);
}
.choix-segment__option input,
.montant input {
position: absolute;
opacity: 0;
pointer-events: none;
}
.choix-segment__option span {
display: block;
padding: 0.5rem 1.1rem;
border-radius: 999px;
font-weight: 500;
cursor: pointer;
}
.choix-segment__option input:checked + span {
background: var(--foret);
color: #fff;
}
.choix-segment__option input:focus-visible + span,
.montant input:focus-visible + span {
outline: 3px solid var(--terre);
outline-offset: 2px;
}
.montants + .montants {
margin-top: 1rem;
}
.montants__titre {
margin-bottom: 0.4rem;
color: var(--gris);
font-size: 0.875rem;
}
.js .montants__titre {
display: none;
}
.montants__liste {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(6.5rem, 1fr));
gap: 0.6rem;
}
.montant span {
display: block;
padding: 0.8rem 0.5rem;
border: 2px solid var(--filet);
border-radius: var(--rayon);
font-size: 1.15rem;
font-weight: 500;
text-align: center;
cursor: pointer;
transition: border-color 0.15s;
}
.montant span:hover {
border-color: var(--vert);
}
.montant input:checked + span {
border-color: var(--foret);
background: var(--vert-clair);
color: var(--foret);
}
.don__cout {
margin: 0.8rem 0 0;
color: var(--foret);
font-weight: 500;
}
.don__cout:empty {
display: none;
}
.champ {
display: grid;
flex: 1;
gap: 0.3rem;
margin: 0.9rem 0 0;
}
.champ--court {
max-width: 12rem;
}
.champ label {
font-size: 0.9375rem;
font-weight: 500;
}
.champ input,
.champ select {
width: 100%;
min-height: 2.9rem;
padding: 0.55rem 0.8rem;
border: 1px solid #c9c1b0;
border-radius: 8px;
background: #fff;
color: var(--encre);
font: inherit;
}
.champ input:focus,
.champ select:focus {
border-color: var(--vert);
outline: 2px solid var(--vert-clair);
}
.champs-ligne {
display: flex;
flex-wrap: wrap;
gap: 0 1rem;
}
.champs-ligne .champ {
min-width: min(100%, 12rem);
}
.case {
margin: 1.1rem 0 0;
} .case label {
display: inline-flex;
gap: 0.55rem;
align-items: flex-start;
cursor: pointer;
}
.case input {
flex: none;
width: 1.15rem;
height: 1.15rem;
margin: 0.25em 0 0;
accent-color: var(--foret);
} .derniers-dons__liste {
margin: 0;
padding: 0;
list-style: none;
}
.derniers-dons__liste li {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
gap: 0 1rem;
padding: 0.55rem 0;
border-top: 1px solid var(--filet);
}
.derniers-dons__liste li:first-child {
padding-top: 0;
border-top: 0;
}
.derniers-dons__quand {
color: var(--gris);
font-size: 0.95rem;
}
.projet__collecte .derniers-dons {
margin-top: 1.5rem;
} .derniers-dons--bandeau {
margin-top: 2rem;
padding: 1.25rem 1.5rem;
border-radius: var(--rayon);
background: var(--sable);
}
.derniers-dons--seul {
margin-top: 0;
}
.derniers-dons--bandeau .derniers-dons__liste {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(min(100%, 11rem), 1fr));
gap: 0.9rem 1.5rem;
}
.derniers-dons--bandeau .derniers-dons__liste li {
display: block;
padding: 0;
border: 0;
}
.derniers-dons--bandeau .derniers-dons__quand {
display: block;
} .case__lien {
display: block;
margin: 0.3rem 0 0 1.7rem;
font-size: 0.95rem;
} .formulaire > p:last-child {
margin-top: 1.5rem;
}
.don__sous-bloc {
padding-left: 1.7rem;
}
.js .don__sous-bloc[hidden] {
display: none;
}
.piege {
position: absolute;
left: -9999px;
}
.don__envoi .bouton {
width: 100%;
}
.don__securite,
.don__mentions {
margin: 0.8rem 0 0;
color: var(--gris);
font-size: 0.875rem;
} .avis {
margin-bottom: 1.5rem;
padding: 1rem 1.25rem;
border-radius: var(--rayon);
background: var(--sable);
}
.avis p:last-child {
margin-bottom: 0;
}
.avis--merci {
background: var(--vert-clair);
color: var(--foret);
}
.avis__titre {
font-size: 1.25rem;
font-weight: 500;
}
.avis--erreur {
background: #fbe9e7;
color: var(--erreur);
} .repartition {
display: grid;
gap: 0.9rem;
margin: 1rem 0 2rem;
padding: 0;
list-style: none;
}
.repartition__ligne {
display: grid;
grid-template-columns: 12rem minmax(0, 1fr) 3.5rem;
align-items: center;
gap: 1rem;
}
.repartition__barre {
height: 0.8rem;
overflow: hidden;
border-radius: 999px;
background: var(--vert-clair);
}
.repartition__barre span {
display: block;
height: 100%;
background: var(--vert);
}
.repartition__valeur {
font-weight: 500;
text-align: right;
}
@media (max-width: 36rem) {
.repartition__ligne {
grid-template-columns: minmax(0, 1fr) 3.5rem;
}
.repartition__barre {
grid-column: 1 / -1;
grid-row: 2;
}
}
.liste-documents {
margin: 1rem 0;
padding: 0;
list-style: none;
}
.liste-documents li {
padding: 0.7rem 0;
border-bottom: 1px solid var(--filet);
}
.fiche {
display: grid;
grid-template-columns: max-content minmax(0, 1fr);
gap: 0.5rem 1.5rem;
margin: 0;
}
.fiche dt {
color: var(--gris);
}
.fiche dd {
margin: 0;
}
@media (max-width: 36rem) {
.fiche {
grid-template-columns: 1fr;
gap: 0;
}
.fiche dd {
margin-bottom: 0.8rem;
}
} .pagination {
margin-top: 2.5rem;
}
.pagination .nav-links {
display: flex;
flex-wrap: wrap;
gap: 0.4rem;
}
.pagination .page-numbers {
padding: 0.4rem 0.9rem;
border: 1px solid var(--filet);
border-radius: 999px;
text-decoration: none;
}
.pagination .current {
border-color: var(--foret);
background: var(--foret);
color: #fff;
} .bandeau-don {
padding-block: clamp(2.5rem, 6vw, 4rem);
background: var(--foret);
color: #fff;
}
.bandeau-don__interieur {
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: space-between;
gap: 1.5rem;
}
.bandeau-don__titre {
margin-bottom: 0.3rem;
font-size: clamp(1.6rem, 3.5vw, 2.3rem);
}
.bandeau-don__texte {
margin: 0;
opacity: 0.9;
}
.pied {
padding-top: 3rem;
background: #14261d;
color: #d7e2da;
font-size: 0.9375rem;
}
.pied a {
color: #fff;
}
.pied__grille {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr));
gap: 2rem;
}
.pied__nom,
.pied__titre {
margin-bottom: 0.6rem;
color: #fff;
font-weight: 500;
}
.pied__nom {
font-size: 1.2rem;
}
.pied__liste {
margin: 0;
padding: 0;
list-style: none;
}
.pied__liste li + li {
margin-top: 0.35rem;
}
.pied__credit {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
gap: 0.5rem 2rem;
margin-top: 2.5rem;
padding-block: 1.2rem;
border-top: 1px solid rgb(255 255 255 / 12%);
font-size: 0.8125rem;
}
.pied__credit p {
margin: 0;
} .lien-bouton {
padding: 0;
border: 0;
background: none;
color: inherit;
font: inherit;
text-decoration: underline;
cursor: pointer;
}
.pied .lien-bouton {
color: #fff;
}
.pied__liste + .pied__liste {
margin-top: 0.35rem;
} .no-js [data-cookies-ouvrir] {
display: none;
} .cookies {
position: fixed;
right: var(--gouttiere);
bottom: var(--gouttiere);
left: var(--gouttiere);
z-index: 70;
max-width: 30rem;
margin-left: auto;
padding: 1.25rem 1.4rem;
border: 1px solid var(--filet);
border-radius: var(--rayon);
background: var(--papier);
box-shadow: 0 12px 40px rgb(27 33 29 / 18%);
}
.cookies[hidden] {
display: none;
}
.cookies__titre {
margin: 0 0 0.4rem;
color: var(--foret);
font-size: 1.1rem;
font-weight: 500;
}
.cookies__texte {
margin: 0 0 1rem;
} .cookies__boutons {
display: flex;
flex-wrap: wrap;
gap: 0.6rem;
}
.cookies__boutons .bouton {
flex: 1 1 9rem;
}
.cookies__plus {
margin: 0.8rem 0 0;
font-size: 0.95rem;
} .alignwide {
margin-inline: calc(-1 * min(8vw, 8rem));
}
.alignfull {
width: 100vw;
margin-inline: calc(50% - 50vw);
}
@media (max-width: 60rem) {
.alignwide {
margin-inline: 0;
}
}
.wp-block-button__link {
border-radius: 999px;
background: var(--foret);
}
.wp-block-image img {
border-radius: var(--rayon);
} .drapeau {
flex: none;
width: 1.5em;
height: 1em;
border-radius: 2px;
box-shadow: 0 0 0 1px rgb(27 33 29 / 15%);
}
.langues {
position: relative;
}
.langues__bouton {
display: inline-flex;
align-items: center;
gap: 0.5rem;
min-height: 2.75rem;
padding: 0 0.8rem;
border: 1px solid var(--filet);
border-radius: 999px;
background: #fff;
color: var(--encre);
font-size: 0.95rem;
font-weight: 500;
list-style: none;
cursor: pointer;
}
.langues__bouton::-webkit-details-marker {
display: none;
}
.langues__bouton:hover {
border-color: var(--vert);
}
.langues__fleche {
width: 0.75rem;
height: 0.5rem;
transition: transform 0.15s;
}
.langues[open] .langues__fleche {
transform: rotate(180deg);
}
.langues__liste {
position: absolute;
top: calc(100% + 0.4rem);
right: 0;
z-index: 60;
min-width: 12rem;
margin: 0;
padding: 0.4rem;
border: 1px solid var(--filet);
border-radius: var(--rayon);
background: #fff;
box-shadow: var(--ombre);
list-style: none;
}
.langues__liste a {
display: flex;
align-items: center;
gap: 0.7rem;
padding: 0.65rem 0.8rem;
border-radius: 8px;
color: var(--encre);
text-decoration: none;
}
.langues__liste a:hover {
background: var(--sable);
}
.langues__liste a[aria-current] {
background: var(--vert-clair);
color: var(--foret);
font-weight: 500;
}
@media (max-width: 78rem) {
.js .navigation .langues__liste {
position: static;
margin-top: 0.4rem;
box-shadow: none;
}
}
.etiquette--langue {
margin-left: 0.3rem;
background: #ece7dc;
color: var(--gris);
font-weight: 400;
} .bandeau-annonce {
background: var(--terre);
color: #fff;
}
.bandeau-annonce__interieur {
display: flex;
align-items: center;
justify-content: space-between;
gap: 1rem;
padding-block: 0.6rem;
}
.bandeau-annonce__texte {
margin: 0;
font-size: 0.95rem;
}
.bandeau-annonce a {
color: #fff;
font-weight: 500;
}
.bandeau-annonce__fermer {
flex: none;
width: 2.4rem;
height: 2.4rem;
border: 1px solid rgb(255 255 255 / 50%);
border-radius: 50%;
background: transparent;
color: #fff;
font-size: 1.3rem;
line-height: 1;
cursor: pointer;
}
.bandeau-annonce__fermer:hover {
background: rgb(255 255 255 / 15%);
}
.bandeau-annonce.est-fermee {
display: none;
} .en-bref {
margin-bottom: 2rem;
padding: 1.2rem 1.5rem;
border-left: 4px solid var(--terre);
border-radius: 0 var(--rayon) var(--rayon) 0;
background: var(--sable);
}
.section--sable .en-bref {
background: #fff;
}
.en-bref__titre {
margin-bottom: 0.5rem;
font-size: 1.1rem;
}
.en-bref__liste {
margin: 0;
padding: 0;
list-style: none;
}
.en-bref__element {
padding: 0.45rem 0;
}
.en-bref__element + .en-bref__element {
border-top: 1px solid var(--filet);
}
.annonce__date {
color: var(--terre-fonce);
font-weight: 500;
}
.bandeau-annonce .annonce__date {
color: #fff;
} .vedette {
display: grid;
grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
overflow: hidden;
border: 1px solid var(--filet);
border-radius: var(--rayon);
background: #fff;
}
.vedette__image {
min-height: 18rem;
background: var(--vert-clair);
}
.vedette__image img {
width: 100%;
height: 100%;
object-fit: cover;
}
.vedette__corps {
padding: clamp(1.25rem, 3vw, 2.25rem);
}
.vedette__surtitre {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 0.4rem 0.8rem;
color: var(--gris);
font-size: 0.95rem;
}
.vedette__titre {
font-size: clamp(1.5rem, 3vw, 2rem);
}
.vedette__titre a {
color: inherit;
text-decoration: none;
}
.vedette__resume {
color: var(--gris);
}
.vedette__boutons {
display: flex;
flex-wrap: wrap;
gap: 0.75rem;
margin: 1.5rem 0 0;
}
@media (max-width: 52rem) {
.vedette {
grid-template-columns: 1fr;
}
.vedette__image {
min-height: 12rem;
aspect-ratio: 3 / 2;
}
} .facons {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr));
gap: 1.25rem;
}
.facon {
display: flex;
flex-direction: column;
align-items: flex-start;
padding: 1.5rem;
border: 1px solid var(--filet);
border-radius: var(--rayon);
background: #fff;
}
.facon__titre {
font-size: 1.3rem;
}
.facon__texte {
flex: 1;
color: var(--gris);
} .formulaire {
max-width: 40rem;
}
.formulaire textarea,
.champ textarea {
width: 100%;
padding: 0.6rem 0.8rem;
border: 1px solid #c9c1b0;
border-radius: 8px;
background: #fff;
color: var(--encre);
font: inherit;
}
.groupe-cases {
margin: 1.2rem 0 0;
padding: 0;
border: 0;
}
.groupe-cases legend {
padding: 0;
font-size: 0.95rem;
font-weight: 500;
}
.groupe-cases .case {
margin-top: 0.5rem;
}
.etapes {
margin: 0;
padding-left: 1.3rem;
}
.etapes li + li {
margin-top: 0.4rem;
}
.bandeau-don__boutons {
display: flex;
flex-wrap: wrap;
gap: 0.75rem;
margin: 0;
}
.bandeau-don__texte + .bandeau-don__texte {
margin-top: 0.3rem;
} .lien-externe::after {
display: inline-block;
width: 0.75em;
height: 0.75em;
margin-left: 0.25em;
background: currentColor;
content: "";
vertical-align: 0.05em;
-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M9 2h5v5h-2V5.4L7.7 9.7 6.3 8.3 10.6 4H9V2zM3 4h4v2H4v6h6V9h2v5H2V4h1z'/%3E%3C/svg%3E") no-repeat center / contain;
mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M9 2h5v5h-2V5.4L7.7 9.7 6.3 8.3 10.6 4H9V2zM3 4h4v2H4v6h6V9h2v5H2V4h1z'/%3E%3C/svg%3E") no-repeat center / contain;
}
@media (prefers-reduced-motion: reduce) {
*,
*::before,
*::after {
scroll-behavior: auto !important;
transition: none !important;
}
}