/*======================================
Theme Name: DiviChildSevaTheme
Description: Theme Enfant Divi Sevanova
Author: Sevanova
Author URI: https://www.sevanova.com/
Template: Divi
Version: 1.2
======================================*/
/* ================================
Preloader
================================ */
#sev-preloader {
position: fixed !important;
inset: 0 !important;
z-index: 99999 !important;
background: #fff !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
transition: opacity 0.4s ease, visibility 0.4s ease !important;
}
#sev-preloader.hidden {
opacity: 0 !important;
visibility: hidden !important;
pointer-events: none !important;
}
#sev-preloader img {
width: 200px !important;
height: 200px !important;
}
/* Cache TOUT le contenu pendant le chargement — seul le preloader est visible */
body:not(.sev-loaded) > *:not(#sev-preloader) {
visibility: hidden !important;
opacity: 0 !important;
}
/* Transition douce à l'apparition */
body.sev-loaded > * {
visibility: visible !important;
opacity: 1 !important;
transition: opacity 0.4s ease !important;
}
/* ==========================
Child Theme Sevanova
========================== */
/* Événement : colonne inscription (classe Divi sev-col-inscription) masquée si pas de lien ACF */
body.sev-sans-lien-inscription .sev-col-inscription {
display: none !important;
}
/* Événement : question / email / lien infos — classes Divi sev-bloc-email-contact, sev-bloc-lien-infos, sev-col-question-precision */
body.sev-sans-email-contact .sev-bloc-email-contact {
display: none !important;
}
body.sev-sans-lien-infos .sev-bloc-lien-infos {
display: none !important;
}
body.sev-sans-email-contact.sev-sans-lien-infos .sev-col-question-precision {
display: none !important;
}
/* INVERSE COLUMN mobile */
@media screen and ( max-width: 980px ) {
.reverse {
display: flex !important;
flex-direction: column-reverse !important;
}
}
/* BLURB */
/* Remove space blurb */
.et_pb_main_blurb_image {
margin-bottom: 0px !important;
}
/* VERTICAL CENTER content */
.dc-centrer-verticalement {
display: flex !important;
flex-direction: column !important;
justify-content: center !important;
display: -webkit-box !important;
display: -webkit-flex !important;
display: -moz-box !important;
display: -ms-flexbox !important;
-webkit-box-orient: vertical !important;
-webkit-box-direction: normal !important;
-webkit-flex-direction: column !important;
-moz-box-orient: vertical !important;
-moz-box-direction: normal !important;
-ms-flex-direction: column !important;
-webkit-box-pack: center !important;
-webkit-justify-content: center !important;
-moz-box-pack: center !important;
-ms-flex-pack: center !important;
}
/* JEFF */
.no-video .et_pb_video_overlay {
opacity: 1 !important;
display: block !important;
}
/* AUGMENTER LA LARGEUR CHAMP RESULTAT CAPTCHA Parfois, suivant la taille du texte, certains chiffres du resultat sont masques */
.et_pb_contact_right p input {
max-width: 50px !important;
}
/* METTRE EXPOSANTS ET INDICES A LA BONNE TAILLE */
sup,
sub {
font-size: 70% !important;
}
/* ==========================
Icones sub-menus réseaux sociaux
========================== */
.lb-menu-yt > a:before {
font-family: 'ETMODULES' !important;
content: '\e0a3' !important;
color: #fff !important;
font-size: 1.2em !important;
display: inline-block !important;
transition: all .3s ease !important;
}
.lb-menu-insta > a:before {
font-family: 'ETMODULES' !important;
content: '\e09a' !important;
color: #fff !important;
font-size: 1em !important;
display: inline-block !important;
transition: all .3s ease !important;
}
.lb-menu-fb > a:before {
font-family: 'ETMODULES' !important;
content: '\e093' !important;
color: #fff !important;
font-size: 1em !important;
display: inline-block !important;
transition: all .3s ease !important;
}
.lb-menu-x > a:before {
content: "\e61b" !important;
font-family: "Font Awesome 6 Brands" !important;
color: #fff !important;
font-size: 1em !important;
display: inline-block !important;
transition: all .3s ease !important;
}
.lb-menu-tiktok > a:before {
content: "\e07b" !important;
font-family: "Font Awesome 6 Brands" !important;
color: #fff !important;
font-size: 1em !important;
display: inline-block !important;
transition: all .3s ease !important; }
/* --- Masquer uniquement le texte, sans impacter les icônes --- */
.lb-menu-yt > a span,
.lb-menu-insta > a span,
.lb-menu-fb > a span,
.lb-menu-x > a span,
.lb-menu-tiktok > a span {
display: none !important; /* masque le texte du menu */
}
/* Ajustement du centrage vertical --- */
#top-menu-nav .lb-menu-yt > a::before,
#top-menu-nav .lb-menu-insta > a::before,
#top-menu-nav .lb-menu-fb > a::before,
#top-menu-nav .lb-menu-x > a::before,
#top-menu-nav .lb-menu-tiktok > a::before {
vertical-align: middle !important;
line-height: 1 !important;
}
/* --- Effet de survol --- */
.lb-menu-yt > a:hover::before,
.lb-menu-insta > a:hover::before,
.lb-menu-fb > a:hover::before,
.lb-menu-x > a:hover::before,
.lb-menu-tiktok > a:hover::before {
color: #e2b164 !important;
transform: scale(1.2) !important;
}
/* Correction d’alignement spécifique TikTok */
.lb-menu-tiktok > a::before {
margin-right: 0px !important; /* réduit l’espace à droite */
margin-left: -2px !important; /* équilibre à gauche */
transform: translateY(1px) !important; /* optionnel : ajuste verticalement si besoin */
}
/* ==========================
Shortcode : [desktop_menu] Desktop Menu fullscreen
========================== */
.dm-nav {
position: relative !important;
width: 100% !important;
margin-top: 25px !important;
color: var(--White, #FFF) !important;
font-family: 'Fjalla One', Helvetica, Arial, Lucida, sans-serif !important;
font-size: 16px !important;
font-style: normal !important;
font-weight: 400 !important;
line-height: 120% !important;
letter-spacing: 0.4px !important;
}
.dm-nav ul{
list-style: none !important;
}
.dm-l1 {
display: flex !important;
gap: 4vw !important;
justify-content: flex-start !important;
list-style: none !important;
margin: 0 !important;
padding: 0 !important;
}
.dm-l1__link,
.dm-l1__button,
.dm-l2__link,
.dm-l2__toggle,
.dm-l3__link {
text-decoration: none !important;
background: none !important;
border: 0 !important;
cursor: pointer !important;
font: inherit !important;
color: inherit !important;
}
.dm-l1__button{
padding-bottom: 25px !important;
position: relative !important;
}
.dm-l1__button::after{
content:"" !important;
width: 100% !important;
height: 4px !important;
background: #eba961 !important;
position: absolute !important;
bottom: 0 !important;
left: -20px !important;
opacity: 0 !important;
transition: .3s !important;
}
.dm-l1__button:hover::after, .dm-l1__button[aria-expanded="true"]::after{
opacity: 1 !important;
left: 0 !important;
}
.dm-panel {
position: fixed !important;
left: 0 !important;
width: 100vw !important;
max-height: calc(100vh - var(--dm-top-offset, 0px) - 10vh) !important; /* ✅ laisse ~10vh visibles */
display: none !important;
background: #ffffff !important;
box-shadow: 0 20px 50px rgba(0,0,0,0.08) !important;
padding: 0 !important;
z-index: 60 !important;
}
/* Panel visible (ajoute par JS) */
.dm-panel.is-open {
display: grid !important;
}
/* Grille interne : 25% / 75% */
.dm-panel {
grid-template-columns: 25% 75% !important;
align-items: stretch !important;
min-height: calc(100vh - 159px - 10vh) !important; /* ✅ réduit la hauteur d’autant */
}
/* Colonne media (25%) */
.dm-panel__media {
position: relative !important;
overflow: hidden !important;
}
.dm-panel__bg {
position: absolute !important;
inset: 0 !important;
width: 100% !important;
height: 100% !important;
object-fit: cover !important;
}
/* Colonne contenu (75%) => 2 colonnes egales */
.dm-panel__content {
display: grid !important;
grid-template-columns: 1fr 1fr !important;
gap: 1rem !important;
padding: 2.5rem 3rem !important;
background: #004C77 !important;
padding-top:4% !important;
position: relative !important;
overflow: hidden !important;
}
/* Deuxieme niveau (colonne gauche) */
.dm-l2 {
list-style: none !important;
margin: 0 !important;
padding: 0 !important;
display: grid !important;
gap: 1rem !important;
color: rgba(255, 255, 255, 0.60) !important;
/* H4 */
font-family: 'Fjalla One', Helvetica, Arial, Lucida, sans-serif !important;
font-size: 32px !important;
font-style: normal !important;
text-align: left !important;
font-weight: 400 !important;
line-height: 130% !important;
}
.dm-l2 button {
text-align: left !important;
}
.dm-l2__item {
display: block !important;
}
.dm-l2__item.is-active .dm-l2__toggle {
color: white !important;
}
.dm-panel__col--seconds .dm-l2 {
display: flex !important;
flex-direction: column !important;
gap: 40px !important;
}
/* --- Trait décoratif pour le 2e niveau actif --- */
.dm-panel__col--seconds .dm-l2__item {
position: relative !important;
padding-left: 30px !important;
}
.dm-panel__col--seconds .dm-l2__item.is-active::before {
content: "" !important;
position: absolute !important;
left: 0px !important;
top: 50% !important;
transform: translateY(-50%) !important;
width: 90px !important;
height: 2px !important;
background: rgba(255,255,255,.6) !important;
}
/* === Colonne niveau 3 === */
.dm-panel__col--thirds .dm-l3 {
display: flex !important;
flex-direction: column !important;
gap: 32px !important; /* 32px entre les titres L3 */
}
.dm-l3 {
list-style: none !important;
margin: 0 !important;
padding: 0 !important;
display: grid !important;
gap: 0.375rem !important;
}
.dm-l3-group[hidden] {
display: none !important;
}
.dm-panel__col--thirds .dm-l3 {
display: flex !important;
flex-direction: column !important;
gap: 32px !important;
}
.dm-panel__col--thirds .dm-l3__link {
color: var(--Gray, #F0F2F6) !important;
font-family: 'Rubik',Helvetica,Arial,Lucida,sans-serif !important;
font-size: 18px !important;
font-style: normal !important;
font-weight: 400 !important;
line-height: 130% !important;
text-decoration: none !important;
transition: color 0.3s ease !important;
}
/* Effet de survol (plus de contraste sur hover) */
.dm-panel__col--thirds .dm-l3__link:hover {
color: #eba961 !important;
}
/* Simple responsive hardening (menu desktop only) */
@media (max-width: 1024px) {
.dm-nav { display: none !important; }
}
/* Animation subtile d apparition */
.dm-panel.is-open {
animation: dmFadeIn 140ms ease-out both !important;
}
.dm-panel__sticker.dm-sticker-text {
position: absolute !important;
right: 50px !important;
z-index: 70 !important;
pointer-events: none !important;
user-select: none !important;
font-family: 'Fjalla One', Helvetica, Arial, Lucida, sans-serif !important;
letter-spacing: -0.25px !important;
-webkit-text-stroke-width: 2px !important;
-webkit-text-stroke-color: rgba(255,255,255,0.5) !important;
font-size: 160px !important;
line-height: 0.85 !important;
white-space: nowrap !important;
color: transparent !important; /* la couleur interne, à ajuster si besoin */
opacity: 0.5 !important;
bottom: 10px !important;
transform: translateY(20%) !important;
}
/* --- Trait décoratif pour le 2e niveau actif --- */
.dm-panel__col--seconds .dm-l2__item {
position: relative !important;
padding-left: 120px !important;
}
.dm-panel__col--seconds .dm-l2__item.is-active::before {
content: "" !important;
position: absolute !important;
left: -30px !important;
top: 50% !important;
transform: translateY(-50%) !important;
width: 90px !important;
height: 2px !important;
background: rgba(255,255,255,.6) !important;
}
/* ======== Style spécial pour l’item À la une ======== */
.dm-l1__item.dm-alaune > .dm-l1__button .dm-l1__label {
font-family: 'Fjalla One', Helvetica, Arial, Lucida, sans-serif !important;
font-size: 20px !important;
letter-spacing: 0.5px !important;
color: #eba961 !important; /* OR couleur à adapter */
position: relative !important;
}
.dm-l1__item.dm-alaune > .dm-l1__button .dm-l1__label::after {
content: "" !important;
width: 40px !important;
height: 3px !important;
background-color: #eba961 !important;
position: absolute !important;
bottom: -6px !important;
left: 0 !important;
}
/* Quand on ouvre le panneau du À la une */
.dm-panel.dm-panel--alaune {
background-color: #034B70 !important; /* ta couleur bleu foncé */
display: grid !important;
grid-template-columns: 25% 75% !important;
padding: 40px !important;
}
/* Colonne des 4 boutons */
.dm-alaune-buttons {
display: grid !important;
grid-template-columns: repeat(2, 1fr) !important;
gap: 25px !important;
}
/* Style des 4 blocs */
.dm-alaune-btn {
display: flex !important;
justify-content: space-between !important;
align-items: center !important;
padding: 25px 30px !important;
background: #69A9D4 !important;
color: white !important;
text-decoration: none !important;
font-family: 'Fjalla One', Helvetica, Arial, Lucida, sans-serif !important;
font-size: 18px !important;
transition: 0.2s !important;
}
.dm-alaune-btn:hover {
background: #004C77 !important;
}
.et-l--header{
position: fixed !important;
top: 0 !important;
left: 0 !important;
z-index: 99999 !important;
}
#et-main-area{
margin-top: 148px !important;
}
body{
overflow-x: hidden !important;
}
/* Icône loupe au L1 (à droite) */
.dm-l1__item--search {
margin-left: 1rem !important;
}
.dm-l1__button--search {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
width: 38px !important;
top: 8px !important;
position: relative !important;
padding-bottom: 25px !important; /* même baseline */
height: auto !important; /* override du height:38px */
border-radius: 999px !important;
}
/* Replacer correctement l'icône de loupe */
.dm-l1__button--search .dm-icon--search {
position: absolute !important;
bottom: 30px !important;
left: 50% !important;
transform: translateX(-50%) !important;
}
/* Trait au survol pour la loupe */
.dm-l1__button--search::after {
content: "" !important;
width: 100% !important;
height: 4px !important;
background: #eba961 !important;
position: absolute !important;
bottom: 0 !important;
left: -20px !important; /* comme les autres */
opacity: 0 !important;
transition: .3s !important;
}
.dm-l1__button--search:hover::after {
opacity: 1 !important;
left: 0 !important;
}
.dm-l1__button--search:hover {
background: rgba(0,0,0,0.06) !important;
}
.dm-icon--search {
display: inline-flex !important;
line-height: 0 !important;
}
/* Panel recherche : contenu en une colonne */
.dm-panel__content--search {
display: grid !important;
grid-template-columns: 1fr !important; /* au lieu de 2 */
align-content: center !important;
justify-items: start !important;
}
.dm-search {
width: min(720px, 100%) !important;
}
.dm-search .dm-search__input {
width: 100% !important;
padding: 1rem 1.25rem !important;
font-size: 1.125rem !important;
border: 1px solid rgba(0,0,0,0.15) !important;
border-radius: 0 !important;
outline: none !important;
}
.dm-search .dm-search__input:focus {
border-color: rgba(0,0,0,0.35) !important;
box-shadow: 0 0 0 3px rgba(0,0,0,0.08) !important;
}
.dm-search .dm-search__submit {
padding: 0.75rem 1.1rem !important;
font-size: 1rem !important;
border: 0 !important;
border-radius: 0 !important;
background: #EBA961 !important;
color: white !important;
cursor: pointer !important;
}
.dm-search .dm-search__submit:hover {
filter: brightness(0.9) !important;
}
/* Rapprocher verticalement le formulaire du haut du panel */
.dm-panel__content--search {
padding-top: 3rem !important;
}
/* Le reste (panel 100vw, positions, etc.) est déjà géré par tes styles existants */
/* ----- Panel Recherche : overrides spécifiques ----- */
/* Fond bleu sur toute la largeur */
#dm-panel-search {
background: #004C77 !important; /* tu changeras la couleur si besoin */
}
/* Pas de colonne gauche => 100% largeur */
#dm-panel-search {
grid-template-columns: 1fr !important;
}
/* Hauteur mini spécifique */
#dm-panel-search {
min-height: 300px !important;
}
/* Centrer le contenu */
#dm-panel-search .dm-panel__content--search {
justify-content: center !important;
align-items: center !important;
text-align: center !important;
}
/* Le formulaire reste étroit mais centré */
.dm-search {
width: min(600px, 90%) !important;
margin: auto !important;
}
#searchform > div{
display: flex !important;
gap: 10px !important;
}
#dm-panel-search .dm-panel__media{
display: none !important;
}
.dm-panel__btns{
width: 100% !important;
display: flex !important;
gap: 25px !important;
flex-direction: column !important;
}
.dm-panel__btns-row{
display: flex !important;
gap: 25px !important;
}
.dm-panel__btns-row a{
width: 282px !important;
height: 125px !important;
display: flex !important;
align-items: center !important;
justify-content: space-between !important;
background: var(--Gray, #F0F2F6) !important;
color: var(--Blue-dark, #004C77) !important;
font-family: 'Fjalla One', Helvetica, Arial, Lucida, sans-serif !important;
font-size: 24px !important;
font-style: normal !important;
font-weight: 400 !important;
line-height: 130% !important;
padding-left: 25px !important;
padding-right: 25px !important;
}
.dm-panel__btns-row1 a{
color: var(--White, #FFF) !important;
}
.dm-panel__btns-row1 > a:nth-child(1){
background: #EBA961 !important;
}
.dm-panel__btns-row1 > a:nth-child(2){
background: var(--Bleu-light, #73B4DA) !important;
}
.dm-panel__btns-row2{
justify-content: center !important;
}
.dm-panel__btns-row2 svg , .dm-panel__btns-row2 path{
stroke: #004C77 !important;
}
.dm-panel__content--400867{
display: block !important;
padding: 25px !important;
position: relative !important;
}
#dm-panel-400867 .dm-panel__sticker{
position: absolute !important;
right: unset !important;
left: 27% !important;
z-index: 70 !important;
pointer-events: none !important;
user-select: none !important;
font-family: 'Fjalla One', Helvetica, Arial, Lucida, sans-serif !important;
letter-spacing: -0.25px !important;
-webkit-text-stroke-width: 2px !important;
-webkit-text-stroke-color: #EBA961 !important;
font-size: 160px !important;
line-height: 0.85 !important;
white-space: nowrap !important;
color: transparent !important; /* la couleur interne, à ajuster si besoin */
opacity: 0.5 !important;
bottom: 10px !important;
transform: translateY(20%) !important;
}
/* === Conteneur principal === */
.dossiers-thematique {
display: flex !important;
gap: 50px !important;
padding-left: 105px !important;
margin-top: 61px !important;
}
/* === Colonne 1 — Titre (H4) === */
.dossiers-thematique > div:nth-child(1) {
color: var(--white, #ffffff) !important;
font-family: 'Fjalla One', Helvetica, Arial, Lucida, sans-serif !important;
font-size: 32px !important;
font-style: normal !important;
font-weight: 400 !important;
line-height: 130% !important; /* ≈ 41.6px */
}
/* === Colonne 2 — Texte === */
.dossiers-thematique > div:nth-child(2) {
display: flex !important;
flex-direction: column !important;
gap: 16px !important; /* valeur ajoutée (à ajuster si besoin) */
}
/* Liens / texte dans la colonne 2 */
.dossiers-thematique > div:nth-child(2) a {
color: var(--Gray, #fff) !important;
font-family: 'Rubik',Helvetica,Arial,Lucida,sans-serif !important;
font-size: 18px !important;
font-style: normal !important;
font-weight: 400 !important;
line-height: 130% !important;
}
/* ==========================
Petit écrans
========================== */
@media (max-width: 1440px) and (min-width: 1025px) {
.dm-panel {
grid-template-columns: 30% 70% !important;
overflow-x: hidden !important;
}
.dm-panel__content {
padding: 2rem 2rem !important;
padding-top: 4% !important;
row-gap: 3rem !important;
}
.dm-l1 {
gap: 4vw !important;
}
.dm-l2 {
font-size: 26px !important;
gap: 28px !important;
}
.dm-l2__toggle {
color: rgba(255,255,255,0.55) !important;
transition: color .25s ease !important;
}
.dm-l2__item.is-active .dm-l2__toggle {
color: #ffffff !important;
}
.dm-panel__col--thirds {
padding-top: 0.5rem !important;
}
.dm-panel__col--thirds .dm-l3__link {
font-size: 16px !important;
line-height: 125% !important;
}
.dm-panel__col--thirds .dm-l3 {
gap: 24px !important;
}
.dm-panel__col--thirds .dm-l3__link {
padding-left: 14px !important;
position: relative !important;
}
.dm-panel__col--thirds .dm-l3__link::before {
content: "—" !important;
position: absolute !important;
left: 0 !important;
color: transparent !important;
}
/* coutour text */
.dm-panel__sticker.dm-sticker-text {
opacity: 0.35 !important;
-webkit-text-stroke-width: 2px !important;
-webkit-text-stroke-color: rgba(255, 255, 255, 0.5) !important;
font-size: 80px !important;
}
/* coutour text a la une */
#dm-panel-400867 .dm-panel__sticker{
font-size: 80px !important;
left: 30% !important;
-webkit-text-stroke-width: 2px !important;
-webkit-text-stroke-color: #EBA961 !important;
}
.dm-panel__btns-row a {
width: 240px !important;
height: 90px !important;
font-size: 20px !important;
padding-left: 20px !important;
padding-right: 20px !important;
}
.dm-l2__toggle:hover {
transform: translateX(6px) !important;
transition: transform .2s ease, color .2s ease !important;
}
.dm-alaune-btn,
.dm-panel__btns-row a {
padding-top: 10px !important;
padding-bottom: 10px !important;
line-height: 115% !important;
}
.dm-panel--alaune {
position: relative !important;
overflow: hidden !important; /* clé */
}
}
/* =========================================================
Shortcode [mobile_menu]
- Panel full screen, slide in from right
- Background #004C77
- Text/icons/borders white
- CTA buttons: no radius
- UL: no bullets
- Search: rectangle border white + loupe inside right, no submit button
- Social icons: no borders, icons via mask SVG (white)
========================================================= */
/* Desktop: optional hide */
@media (min-width: 992px){
.mm{ display:none !important; }
}
/* Ensure native hidden works even if theme overrides */
[hidden]{ display:none !important; }
/* Toggle button (hamburger) */
.mm__toggle{
appearance:none !important;
border:0 !important;
background:transparent !important;
padding:0 !important;
cursor:pointer !important;
line-height:0 !important;
position: absolute !important;
right: 25px !important;
top: -40px !important;
}
.mm__burger{
display:inline-flex !important;
flex-direction:column !important;
justify-content:center !important;
gap:6px !important;
}
.mm__bar{
width:26px !important;
height:2px !important;
background:#fff !important;
display:block !important;
}
/* Overlay */
.mm__overlay{
position:fixed !important;
inset:0 !important;
background:rgba(0,0,0,.45) !important;
z-index:9998 !important;
}
/* Panel */
.mm__panel{
position:fixed !important;
top:0 !important;
right:0 !important;
width:100% !important;
height:100dvh !important;
background:#004C77 !important;
color:#fff !important;
z-index:9999 !important;
transform:translateX(100%) !important;
transition:transform .28s ease !important;
will-change:transform !important;
overflow:hidden !important;
}
.mm__panel.is-open{
transform:translateX(0) !important;
}
.mm__panel-inner{
height:100% !important;
display:flex !important;
flex-direction:column !important;
}
/* TOP */
.mm__top{
padding:14px 16px 10px !important;
border-bottom:0px !important;
}
.mm__top-row{
display:flex !important;
align-items:center !important;
justify-content:space-between !important;
gap:12px !important;
}
.mm__top-row--search{
margin-bottom:10px !important;
}
/* Search (custom) */
.mm__search{
flex:1 !important;
}
.mm__search-form{
position:relative !important;
width:100% !important;
}
.mm__search-input{
width:100% !important;
border:1px solid rgba(255,255,255,.9) !important;
background:transparent !important;
color:#fff !important;
padding:12px 42px 12px 12px !important; /* room for icon */
outline:none !important;
}
.mm__search-input::placeholder{
color:rgba(255,255,255,.85) !important;
}
.mm__search-icon{
position:absolute !important;
top:50% !important;
right:12px !important;
transform:translateY(-50%) !important;
color:#fff !important;
pointer-events:none !important;
line-height:0 !important;
}
/* Close / Back buttons */
.mm__close,
.mm__back{
appearance:none !important;
border:0 !important;
background:transparent !important;
color:#fff !important;
cursor:pointer !important;
padding:8px !important;
line-height:0 !important;
}
.mm__close:focus-visible,
.mm__back:focus-visible{
outline:2px solid rgba(255,255,255,.7) !important;
outline-offset:2px !important;
}
/* Icon base (SVG uses currentColor) */
.mm__icon{
display:inline-block !important;
vertical-align:middle !important;
color:#fff !important;
}
/* Socials (no borders) */
.mm__socials{
display:flex !important;
align-items:center !important;
gap:14px !important;
}
.mm__social{
display:inline-flex !important;
align-items:center !important;
justify-content:center !important;
width:26px !important;
height:26px !important;
color:#fff !important;
text-decoration:none !important;
}
.mm__social-icon{
width:22px !important;
height:22px !important;
display:block !important;
background:currentColor !important;
-webkit-mask-repeat:no-repeat !important;
-webkit-mask-position:center !important;
-webkit-mask-size:contain !important;
mask-repeat:no-repeat !important;
mask-position:center !important;
mask-size:contain !important;
}
/* Masks via SVG data uri (white via currentColor background) */
.mm__social--youtube .mm__social-icon{
-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M23.5 6.2s-.2-1.7-.9-2.4c-.9-.9-1.9-.9-2.4-1C16.9 2.5 12 2.5 12 2.5s-4.9 0-8.2.3c-.5.1-1.5.1-2.4 1C.7 4.5.5 6.2.5 6.2S0 8.1 0 10v1.9c0 1.9.5 3.8.5 3.8s.2 1.7.9 2.4c.9.9 2.1.9 2.6 1 1.9.2 8 .3 8 .3s4.9 0 8.2-.3c.5-.1 1.5-.1 2.4-1 .7-.7.9-2.4.9-2.4s.5-1.9.5-3.8V10c0-1.9-.5-3.8-.5-3.8zM9.6 14.8V7.9l6.4 3.5-6.4 3.4z'/%3E%3C/svg%3E") !important;
mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M23.5 6.2s-.2-1.7-.9-2.4c-.9-.9-1.9-.9-2.4-1C16.9 2.5 12 2.5 12 2.5s-4.9 0-8.2.3c-.5.1-1.5.1-2.4 1C.7 4.5.5 6.2.5 6.2S0 8.1 0 10v1.9c0 1.9.5 3.8.5 3.8s.2 1.7.9 2.4c.9.9 2.1.9 2.6 1 1.9.2 8 .3 8 .3s4.9 0 8.2-.3c.5-.1 1.5-.1 2.4-1 .7-.7.9-2.4.9-2.4s.5-1.9.5-3.8V10c0-1.9-.5-3.8-.5-3.8zM9.6 14.8V7.9l6.4 3.5-6.4 3.4z'/%3E%3C/svg%3E") !important;
}
.mm__social--instagram .mm__social-icon{
-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M7 2h10a5 5 0 0 1 5 5v10a5 5 0 0 1-5 5H7a5 5 0 0 1-5-5V7a5 5 0 0 1 5-5zm10 2H7a3 3 0 0 0-3 3v10a3 3 0 0 0 3 3h10a3 3 0 0 0 3-3V7a3 3 0 0 0-3-3zm-5 4a5 5 0 1 1 0 10 5 5 0 0 1 0-10zm0 2a3 3 0 1 0 0 6 3 3 0 0 0 0-6zm5.5-.8a1.1 1.1 0 1 1 0 2.2 1.1 1.1 0 0 1 0-2.2z'/%3E%3C/svg%3E") !important;
mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M7 2h10a5 5 0 0 1 5 5v10a5 5 0 0 1-5 5H7a5 5 0 0 1-5-5V7a5 5 0 0 1 5-5zm10 2H7a3 3 0 0 0-3 3v10a3 3 0 0 0 3 3h10a3 3 0 0 0 3-3V7a3 3 0 0 0-3-3zm-5 4a5 5 0 1 1 0 10 5 5 0 0 1 0-10zm0 2a3 3 0 1 0 0 6 3 3 0 0 0 0-6zm5.5-.8a1.1 1.1 0 1 1 0 2.2 1.1 1.1 0 0 1 0-2.2z'/%3E%3C/svg%3E") !important;
}
.mm__social--facebook .mm__social-icon{
-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M13.5 22v-8h2.7l.4-3h-3.1V9.1c0-.9.2-1.5 1.5-1.5h1.7V5c-.3 0-1.4-.1-2.7-.1-2.7 0-4.5 1.6-4.5 4.6V11H7v3h2.5v8h4z'/%3E%3C/svg%3E") !important;
mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M13.5 22v-8h2.7l.4-3h-3.1V9.1c0-.9.2-1.5 1.5-1.5h1.7V5c-.3 0-1.4-.1-2.7-.1-2.7 0-4.5 1.6-4.5 4.6V11H7v3h2.5v8h4z'/%3E%3C/svg%3E") !important;
}
.mm__social--x .mm__social-icon{
-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M18.7 2H22l-7.2 8.2L23 22h-6.5l-5.1-6.7L5.7 22H2.4l7.8-9L1 2h6.6l4.6 6.1L18.7 2zm-1.1 18h1.8L6.6 3.9H4.7L17.6 20z'/%3E%3C/svg%3E") !important;
mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M18.7 2H22l-7.2 8.2L23 22h-6.5l-5.1-6.7L5.7 22H2.4l7.8-9L1 2h6.6l4.6 6.1L18.7 2zm-1.1 18h1.8L6.6 3.9H4.7L17.6 20z'/%3E%3C/svg%3E") !important;
}
.mm__social--tiktok .mm__social-icon{
-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M16.5 2c.4 2.3 1.7 3.8 3.9 4.5V10c-1.7 0-3.2-.6-4.4-1.6v7.1c0 3.3-2.7 6-6 6s-6-2.7-6-6 2.7-6 6-6c.3 0 .6 0 .9.1v3.4c-.3-.1-.6-.2-.9-.2-1.4 0-2.6 1.2-2.6 2.6s1.2 2.6 2.6 2.6 2.6-1.2 2.6-2.6V2h3.9z'/%3E%3C/svg%3E") !important;
mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M16.5 2c.4 2.3 1.7 3.8 3.9 4.5V10c-1.7 0-3.2-.6-4.4-1.6v7.1c0 3.3-2.7 6-6 6s-6-2.7-6-6 2.7-6 6-6c.3 0 .6 0 .9.1v3.4c-.3-.1-.6-.2-.9-.2-1.4 0-2.6 1.2-2.6 2.6s1.2 2.6 2.6 2.6 2.6-1.2 2.6-2.6V2h3.9z'/%3E%3C/svg%3E") !important;
}
/* BODY */
.mm__body{
flex:1 !important;
overflow:auto !important;
padding:8px 0 !important;
-webkit-overflow-scrolling:touch !important;
}
.mm__nav{
padding:0 16px !important;
}
.mm__stage{
width:100% !important;
}
/* UL/LI: no bullets */
.mm__menu{
list-style:none !important;
margin:0 !important;
padding:0 !important;
}
.mm__menu li{
list-style:none !important;
margin:0 !important;
padding:0 !important;
}
/* Each level UL is a separate view */
.mm__menu--level-1,
.mm__menu--level-2,
.mm__menu--level-3{
width:100% !important;
}
/* Items */
.mm__item{
position:relative !important;
}
/* Link */
.mm__link{
display:block !important;
color:#fff !important;
text-decoration:none !important;
padding:14px 42px 14px 0 !important; /* room for chevron */
font-size:16px !important;
font-weight:600 !important;
}
/* Separator */
.mm__separator{
height:1px !important;
background:rgba(255,255,255,.55) !important;
}
/* Next (chevron) */
.mm__next{
position:absolute !important;
top:50% !important;
right:0 !important;
transform:translateY(-50%) !important;
appearance:none !important;
border:0 !important;
background:transparent !important;
color:#fff !important;
cursor:pointer !important;
width:40px !important;
height:44px !important;
display:inline-flex !important;
align-items:center !important;
justify-content:center !important;
}
.mm__next:focus-visible{
outline:2px solid rgba(255,255,255,.7) !important;
outline-offset:2px !important;
}
/* CTA */
.mm__cta{
padding:14px 16px 18px !important;
border-top:0px !important;
}
.mm__cta-row{
display:flex !important;
gap:12px !important;
}
.mm__cta-row--don{
margin-bottom:10px !important;
}
.mm__btn{
display:inline-flex !important;
align-items:center !important;
justify-content:center !important;
text-decoration:none !important;
font-weight:700 !important;
padding:12px 14px !important;
width:100% !important;
text-align:center !important;
line-height:1.1 !important;
border-radius:0 !important;
}
/* Donate */
.mm__btn--don{
background:#EBA961 !important;
border:1px solid #EBA961 !important;
padding: 20px !important;
color: var(--Black, #061D29) !important;
}
/* Outline */
.mm__btn--outline{
background:transparent !important;
color:#fff !important;
border:1px solid rgba(255,255,255,.75) !important;
}
/* 2 buttons side by side */
.mm__cta-row--actions .mm__btn{
width:50% !important;
}
/* Reduce motion */
@media (prefers-reduced-motion: reduce){
.mm__panel{ transition:none !important; }
}
/* Lock scroll when open */
body.mm-no-scroll{
overflow:hidden !important;
}
.et_pb_code_1_tb_header {
line-height: 0 !important;
}
.et_pb_code_1_tb_header .et_pb_code_inner {
height: auto !important;
min-height: 0 !important;
padding: 0 !important;
margin: 0 !important;
}
.et_pb_column_3_4.et_pb_column_1_tb_header {
margin-bottom: 0 !important;
}
@media (max-width:980px){
#et-main-area{
margin-top:0!important;
}
}
#page-container{
overflow-x:hidden;
}
.et-l--header{
width:100%;
left:0;
right:0;
}
.et_pb_section{
width:100%;
max-width:100%;
}
/* ==========================
Module Blog Divi afichage personnalisé
========================== */
/* === Réordonne le contenu du module Blog (SevaTheme) === */
.sevatheme-blog .et_pb_post {
display: flex !important;
flex-direction: column !important;
position: relative !important;
overflow: hidden !important;
}
/* 1) Image — 2) Date — 3) Titre — 4) Contenu */
.sevatheme-blog .et_pb_post .et_pb_image_container { order: 1 !important; }
.sevatheme-blog .et_pb_post .post-meta { order: 2 !important; }
.sevatheme-blog .et_pb_post .entry-title { order: 3 !important; }
.sevatheme-blog .et_pb_post .post-content { order: 4 !important; }
/* === Espacements entre image, date et titre === */
/* === Espacements uniformes blog SevaTheme === */
.sevatheme-blog .et_pb_post .entry-featured-image-url {
margin-bottom: 18px !important;
}
.sevatheme-blog .et_pb_post .post-meta {
margin-top: 0 !important;
margin-bottom: 18px !important;
}
.sevatheme-blog .et_pb_post .entry-title {
margin-top: 0 !important;
}
/* Bouton sur image et zoom */
/* Le conteneur d'image doit être positionné */
.sevatheme-blog .et_pb_post .entry-featured-image-url,
.sevatheme-blog .et_pb_post .et_pb_image_container {
position: relative !important;
display: block !important;
overflow: hidden !important;
}
/* Effet zoom image au survol (optionnel) */
.sevatheme-blog .et_pb_post .entry-featured-image-url img,
.sevatheme-blog .et_pb_post .et_pb_image_container img {
transition: transform 0.6s ease !important;
}
.sevatheme-blog .et_pb_post:hover .entry-featured-image-url img,
.sevatheme-blog .et_pb_post:hover .et_pb_image_container img {
transform: scale(1.08) !important;
}
/* Bouton "Lire l’article" désormais à l’intérieur du conteneur image */
.sevatheme-blog .et_pb_post .more-link {
position: absolute !important;
bottom: 24px !important;
left: 24px !important;
color: var(--White, #FFF) !important;
font-weight: 400 !important;
line-height: 130% !important;
letter-spacing: 0.16px !important;
text-decoration-line: underline !important;
text-decoration-style: solid !important;
text-decoration-skip-ink: none !important;
text-underline-offset: auto !important;
text-underline-position: from-font !important;
background: none !important;
border: 0 !important;
opacity: 0 !important;
transition: opacity .35s ease !important;
z-index: 3 !important;
pointer-events: auto !important;
}
/* Apparition au survol de la carte */
.sevatheme-blog .et_pb_post:hover .more-link {
opacity: 1 !important;
}
/* === Icône flèche en bas à droite de l’image === */
.sevatheme-blog .et_pb_post .blog-arrow-icon {
position: absolute !important;
bottom: 24px !important;
right: 24px !important;
width: 24px !important;
height: 18px !important;
flex-shrink: 0 !important;
opacity: 0 !important;
transform: translateY(5px) !important;
transition: opacity 0.3s ease, transform 0.3s ease !important;
z-index: 3 !important;
}
/* Apparition au survol */
.sevatheme-blog .et_pb_post:hover .blog-arrow-icon {
opacity: 1 !important;
transform: translateY(0) !important;
}
.sevatheme-blog .et_pb_post .entry-featured-image-url,
.sevatheme-blog .et_pb_post .et_pb_image_container{
position: relative !important;
}
.sevatheme-blog .et_pb_post .blog-arrow-icon{
position: absolute !important;
z-index: 999 !important;
pointer-events: none !important;
}
/* =========================
BLOG DIVI - Images uniformes paysage
========================= */
.et_pb_post .entry-featured-image-url {
aspect-ratio: 16 / 9;
overflow: hidden;
}
.et_pb_post .entry-featured-image-url img {
width: 100%;
height: 100%;
object-fit: cover;
}
/* =========================================
Shortcode : [communiques_grid] Feed communiqués de presse
========================================= */
/* GRID */
.seva-comm-grid{
display:grid;
grid-template-columns:repeat(4,minmax(0,1fr));
gap:32px;
}
/* CARD */
.seva-comm-card{
display:flex;
flex-direction:column;
width:100%;
}
/* IMAGE 19/9 */
.seva-comm-thumb{
position:relative;
aspect-ratio:19/9;
overflow:hidden;
display:block;
width:100%;
}
.seva-comm-thumb img{
width:100%;
height:100%;
object-fit:cover;
transition:transform .6s ease;
}
.seva-comm-card:hover .seva-comm-thumb img{
transform:scale(1.08);
}
/* Overlay */
.seva-comm-thumb:before{
content:"";
position:absolute;
inset:0;
background:rgba(0,76,119,0.35);
opacity:0;
transition:.3s ease;
}
.seva-comm-card:hover .seva-comm-thumb:before{
opacity:1;
}
/* Bouton */
.seva-comm-btn{
position:absolute;
left:24px;
bottom:24px;
color:#fff;
font-family:Rubik;
font-size:14px;
text-decoration:underline;
opacity:0;
transition:.3s ease;
}
/* Flèche */
.seva-comm-arrow{
position:absolute;
right:24px;
bottom:24px;
opacity:0;
transition:.3s ease;
}
.seva-comm-card:hover .seva-comm-btn,
.seva-comm-card:hover .seva-comm-arrow{
opacity:1;
}
/* META */
.seva-comm-meta{
margin-top:18px;
display:flex;
flex-direction:column;
gap:24px;
width:100%;
}
/* Date */
.seva-comm-date{
display:block;
width:100%;
margin:0;
font-family:'Rubik',Helvetica,Arial,Lucida,sans-serif;
font-size:14px;
line-height:130%;
color:#004C77; /* ajuste si besoin */
}
/* Titre */
.seva-comm-title{
font-family:'Rubik',Helvetica,Arial,Lucida,sans-serif;
font-size:18px;
font-weight:400;
line-height:130%;
color:#061D29;
margin:0;
}
/* Large desktop */
@media(max-width:1400px){
.seva-comm-grid{
grid-template-columns:repeat(4,minmax(0,1fr));
gap:24px;
}
}
/* Laptop */
@media(max-width:1200px){
.seva-comm-grid{
grid-template-columns:repeat(3,minmax(0,1fr));
gap:20px;
}
}
/* Tablet */
@media(max-width:992px){
.seva-comm-grid{
grid-template-columns:repeat(2,minmax(0,1fr));
gap:20px;
}
}
/* Mobile */
@media(max-width:640px){
.seva-comm-grid{
grid-template-columns:1fr;
gap:16px;
}
/* META */
.seva-comm-meta{
margin-top:16px;
gap:16px;
}
/* Date */
.seva-comm-date{
font-size:12px;
}
/* Titre */
.seva-comm-title{
font-size:15px;
}
}
@media(hover:none){
.seva-comm-btn,
.seva-comm-arrow{
opacity:1 !important;
}
}
/* ==========================
Shortcode : [flickr_album_slider] Albums Slider
========================== */
.desktop-post-slider-wrapper {
position: relative !important;
width: 100% !important;
max-width: 100vw !important;
overflow: visible !important;
}
.desktop-post-slider {
position: relative !important;
width: 100% !important;
overflow: visible !important;
}
.desktop-post-slider .slider-track {
display: flex !important;
gap: var(--slider-gap, 20px) !important;
transition: transform 0.5s ease !important;
overflow: visible !important;
}
.desktop-post-slider .slider-item {
flex: 0 0 419px !important;
height: 314px !important;
background-size: cover !important;
background-position: center !important;
position: relative !important;
display: block !important;
text-decoration: none;
color: inherit;
cursor: pointer;
}
.desktop-post-slider .slider-controls {
position: absolute !important;
top: -100px !important;
right: 5% !important;
display: flex !important;
gap: 20px !important;
z-index: 9999 !important;
pointer-events: all !important;
}
/* === BOUTONS === */
.desktop-post-slider .slider-controls button {
display: flex;
width: 61px;
height: 61px;
justify-content: center;
align-items: center;
border: none;
cursor: pointer;
transition: all 0.3s ease;
}
/* SVG inside */
.slider-controls svg {
width: 27px;
height: 20px;
}
.desktop-post-slider .slider-controls button svg {
stroke: currentColor !important;
}
/* Bouton gauche */
.desktop-post-slider .slider-controls button.slider-prev {
background-color: #F0F2F6 !important;
color: #004C77 !important;
}
.desktop-post-slider .slider-controls button.slider-prev:hover {
background-color: #004c77 !important;
color: #ffffff !important;
}
/* Bouton droit */
.desktop-post-slider .slider-controls button.slider-next.slick-arrow {
background-color: #69a9d4 !important;
color: white !important;
}
.desktop-post-slider .slider-controls button.slider-next.slick-arrow:hover {
background-color: #004c77 !important;
color: white !important;
}
/* === ICONES DES FLECHES === */
.desktop-post-slider .slider-controls img {
width: 18px !important;
height: auto !important;
display: block !important;
filter: none !important; /* retire tout filtre noir/gris du lazyload */
opacity: 1 !important;
visibility: visible !important;
}
.desktop-post-slider .slider-controls .lazy-hidden {
opacity: 1 !important;
visibility: visible !important;
}
/* Flèche gauche blanche au hover */
.desktop-post-slider .slider-controls button.slider-prev.slick-arrow:hover img {
filter: brightness(0) invert(1) !important;
}
.desktop-post-slider .slider-controls button.slider-prev.slick-arrow img {
filter: none !important;
}
/* DECALAGE VERTICAL : 2e, 4e, 6e plus bas de 40px */
.desktop-post-slider .slider-item:nth-child(2n) {
margin-top: 48px !important;
}
/* IMAGE */
.desktop-post-slider .slider-image {
width: 100% !important;
height: 100% !important;
background-size: cover !important;
background-position: center !important;
}
/* OVERLAY TEXTE */
.desktop-post-slider .slider-overlay {
position: absolute !important;
inset: 0 !important;
display: flex !important;
flex-direction: column !important;
justify-content: flex-end !important;
padding: 40px !important;
z-index: 2 !important;
}
.desktop-post-slider .slider-title {
color: var(--White, #FFF) !important;
font-family: 'Fjalla One', Helvetica, Arial, Lucida, sans-serif !important;
font-size: 24px !important;
font-style: normal !important;
font-weight: 400 !important;
line-height: 130% !important;
padding-bottom: 24px !important;
}
.desktop-post-slider .slider-link {
color: var(--White, #FFF) !important;
font-family: 'Fjalla One', Helvetica, Arial, Lucida, sans-serif !important;
font-size: 16px !important;
font-style: normal !important;
font-weight: 400 !important;
line-height: 130% !important;
letter-spacing: 0.16px !important;
text-decoration-line: underline !important;
text-decoration-style: solid !important;
text-decoration-skip-ink: none !important;
text-decoration-thickness: auto !important;
text-underline-offset: auto !important;
text-underline-position: from-font !important;
}
/* ===== ICONE PHOTO / VIDEO ===== */
.desktop-post-slider .slider-type-icon {
position: absolute !important;
right: 40px !important;
bottom: 40px !important;
width: 28px !important;
height: 28px !important;
object-fit: contain !important;
z-index: 3 !important;
}
.desktop-post-slider .slider-type-icon-wrapper {
position: absolute !important;
right: 40px !important;
bottom: 40px !important;
width: 28px !important;
height: 28px !important;
z-index: 5 !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
}
.desktop-post-slider .slider-type-icon-wrapper svg {
width: 100% !important;
height: 100% !important;
display: block !important;
}
/* AUCUN POST */
.desktop-post-slider.no-posts {
text-align: center !important;
padding: 24px 0 !important;
font-style: italic !important;
}
/* === EFFET DE ZOOM SUR L'IMAGE AU SURVOL === */
.desktop-post-slider .slider-item {
overflow: hidden !important; /* pour éviter que l'image dépasse du cadre */
}
.desktop-post-slider .slider-image {
width: 100% !important;
height: 100% !important;
background-size: cover !important;
background-position: center !important;
transition: transform 0.6s ease !important; /* durée et fluidité du zoom */
}
/* Effet zoom au survol */
.desktop-post-slider .slider-item:hover .slider-image {
transform: scale(1.08) !important;
}
/* === Compatibilité Slick === */
.desktop-post-slider .slider-track.slick-initialized {
display: block !important; /* Slick gère sa propre piste */
gap: 0 !important; /* L’espacement passe sur .slick-slide */
transform: none !important; /* Animation gérée par Slick */
}
/* Espacement horizontal entre slides (reprend ta variable) */
.desktop-post-slider .slick-slide {
margin: 0 calc(var(--slider-gap, 20px) / 2) !important;
}
/* Contraindre les largeurs fixes comme avant (variableWidth:true s’appuie dessus) */
.desktop-post-slider .slick-slide.slider-item {
width: 419px !important;
height: 314px !important;
}
/* CentreMode: calcule un padding externe pour conserver le "peek" cohérent */
.desktop-post-slider .slick-list {
padding-left: 0 !important;
padding-right: 0 !important;
}
/* Remplacer le décalage vertical basé sur :nth-child par les classes serveur
(évite les effets sur les clones Slick) */
.desktop-post-slider .slider-item.offset-bottom { margin-top: 48px !important; }
.desktop-post-slider .slider-item.offset-top { margin-top: 0 !important; }
/* ===== RESPONSIVE ===== */
@media (max-width: 1400px) {.desktop-post-slider .slider-item { flex: 0 0 360px !important; height: 270px !important; }}
@media (max-width: 1200px) {.desktop-post-slider .slider-item { flex: 0 0 320px !important; height: 240px !important; }}
@media (max-width: 1024px) {.desktop-post-slider .slider-item { flex: 0 0 280px !important; height: 210px !important; }}
@media (max-width: 768px) {.desktop-post-slider .slider-item { flex: 0 0 240px !important; height: 180px !important; }}
/* Breakpoints */
@media (max-width: 1400px) {.desktop-post-slider .slick-slide.slider-item { width: 360px !important; height: 270px !important; }}
@media (max-width: 1200px) {.desktop-post-slider .slick-slide.slider-item { width: 320px !important; height: 240px !important; }}
@media (max-width: 1024px) {.desktop-post-slider .slick-slide.slider-item { width: 280px !important; height: 210px !important; }}
@media (max-width: 768px) {.desktop-post-slider .slick-slide.slider-item { width: 240px !important; height: 180px !important; }}
/* ======= VERSION MOBILE - ALIGNEMENT UNIFORME ======= */
@media (max-width: 768px) {
/* Supprime tout décalage vertical */
.desktop-post-slider .slider-item.offset-top,
.desktop-post-slider .slider-item.offset-bottom,
.desktop-post-slider .slider-item:nth-child(2n),
.desktop-post-slider .slider-item {
margin-top: 0 !important;
transform: none !important;
top: 0 !important;
}
/* Réinitialise les hauteurs et espacements */
.desktop-post-slider .slider-item {
min-height: 180px !important;
height: 202px !important; /* hauteur fixe */
margin: 0 !important; /* supprime tout décalage vertical */
scroll-snap-align: start !important;
flex: 0 0 270px !important; /* largeur fixe */
}
/* Réinitialise le container */
.desktop-post-slider .slider-track {
display: flex !important;
flex-wrap: nowrap !important;
align-items: stretch !important;
overflow-x: auto !important;
overflow-y: hidden !important;
scroll-snap-type: x mandatory !important;
-webkit-overflow-scrolling: touch !important;
transform: translateX(0) !important;
justify-content: flex-start !important;
gap: 24px !important;
scrollbar-width: none !important;
padding-left: 24px !important;
padding-right: 24px !important;
margin-left: 24px !important;
}
.desktop-post-slider {
overflow: hidden !important;
padding: 0 !important;
}
.desktop-post-slider .slider-track::-webkit-scrollbar {
display: none !important;
}
.desktop-post-slider .slider-image {
width: 100% !important;
height: 100% !important;
background-size: cover !important;
background-position: center !important;
}
.desktop-post-slider .slider-controls {
display: none !important; /* on masque les flèches sur mobile */
}
/* === TITRE === */
.desktop-post-slider .slider-title {
font-size: 18px !important;
font-weight: 400 !important;
line-height: 130% !important;
padding-bottom: 12px !important;
}
/* === LIEN "VOIR L’ALBUM" OU "VOIR LA VIDÉO" === */
.desktop-post-slider .slider-link {
font-size: 14px !important;
font-style: normal !important;
font-weight: 400 !important;
line-height: 130% !important;
text-decoration-line: underline !important;
text-underline-offset: 2px !important;
}
/* Masquer les flèches sur mobile comme avant */
.desktop-post-slider .slider-controls { display: none !important; }
/* On garde le mode scroll natif mobile existant, pas de changement ici */
}
/* ======================================
OVERLAY VIDEOS YOUTUBE (couleur site)
====================================== */
/* ===== Overlay spécifique vidéos ===== */
.desktop-post-slider .slider-item.video .slider-overlay{
background:linear-gradient(180deg,rgba(0,76,119,0.2) 0%,rgba(0,76,119,0.3) 100%);
}
.desktop-post-slider .slider-item.video:hover .slider-overlay{
background: linear-gradient(180deg,rgba(0,76,119,0.35) 0%, rgba(0,76,119,0.80) 100%) !important;
transition:background .3s ease !important;
}
.desktop-post-slider .slider-image{
background-size: cover !important;
background-position: center !important;
}
/* ==========================
Shortcode : [flickr_album_grid] Feed album flickr
========================== */
.flickr-grid{
display:grid !important;
gap:30px !important;
margin-bottom:60px !important;
}
.flickr-grid-item{
position:relative !important;
display:block !important;
aspect-ratio:4/3 !important;
overflow:hidden !important;
text-decoration:none !important;
color:inherit !important;
}
.flickr-grid-image{
width:100% !important;
height:100% !important;
background-size:cover !important;
background-position:center !important;
transition:transform .6s ease !important;
}
.flickr-grid-item:hover .flickr-grid-image{
transform:scale(1.08) !important;
}
.flickr-grid-overlay{
position:absolute !important;
inset:0 !important;
padding:30px !important;
display:flex !important;
flex-direction:column !important;
justify-content:flex-end !important;
}
.flickr-grid-overlay h3{
color:#fff !important;
margin-bottom:15px !important;
font-size:20px !important;
}
.flickr-grid-link{
color:#fff !important;
text-decoration:underline !important;
font-size:14px !important;
}
.flickr-grid-item.video .flickr-grid-overlay{
background:linear-gradient(180deg,rgba(0,76,119,0.4) 0%,rgba(0,76,119,0.5) 100%) !important;
}
.flickr-grid-item.video:hover .flickr-grid-overlay{
background: linear-gradient(180deg,rgba(0,76,119,0.35) 0%, rgba(0,76,119,0.80) 100%) !important;
transition:background .3s ease !important;
}
/* ===========================
PAGINATION
=========================== */
.flickr-pagination{
display:flex !important;
align-items:center !important;
justify-content:center !important;
gap:14px !important;
margin-top:50px !important;
}
/* NUMEROS */
.flickr-pagination a.flickr-page{
background:transparent !important;
background-color:transparent !important;
border:none !important;
color:#004C77 !important;
text-decoration:none !important;
cursor:pointer !important;
box-shadow:none !important;
font-family:'Fjalla One',Helvetica,Arial,sans-serif;
}
/* PAGE ACTIVE */
.flickr-page.active{
background:#004C77 !important;
color:#ffffff !important;
}
/* BOUTONS FLECHES */
.flickr-prev,
.flickr-next{
display:flex !important;
width:42px !important;
height:42px !important;
justify-content:center !important;
align-items:center !important;
border:none !important;
cursor:pointer !important;
transition:all .3s ease !important;
}
/* SVG FLECHES */
.flickr-pagination a.flickr-page.flickr-prev svg,
.flickr-pagination a.flickr-page.flickr-next svg{
width:24px !important;
height:34px !important;
stroke:currentColor !important;
display:block !important;
}
/* FLECHE GAUCHE : NORMAL */
.flickr-pagination a.flickr-page.flickr-prev{
background:#F0F2F6 !important;
background-color:#F0F2F6 !important;
color:#73B4DA !important;
}
/* FLECHE GAUCHE : HOVER */
.flickr-pagination a.flickr-page.flickr-prev:hover{
background:#004C77 !important;
background-color:#004C77 !important;
color:#ffffff !important;
opacity:1 !important;
}
/* FLECHE DROITE : NORMAL */
.flickr-pagination a.flickr-page.flickr-next{
background:#73B4DA !important;
background-color:#73B4DA !important;
color:#ffffff !important;
}
/* FLECHE DROITE : HOVER */
.flickr-pagination a.flickr-page.flickr-next:hover{
background:#004C77 !important;
background-color:#004C77 !important;
color:#ffffff !important;
opacity:1 !important;
}
/* TIRET SEPARATEUR NUMEROTATION */
.flickr-dash{
display:flex !important;
align-items:center !important;
justify-content:center !important;
width:24px !important;
height:20px !important;
}
@media (min-width:981px){
.flickr-grid{
grid-template-columns:repeat(4,1fr) !important;
}
}
@media (max-width:767px){
.flickr-grid{
grid-template-columns:1fr !important;
}
.flickr-pagination{
gap:6px !important;
}
/* flèches plus petites */
.flickr-pagination a.flickr-page.flickr-prev,
.flickr-pagination a.flickr-page.flickr-next{
width:30px !important;
height:30px !important;
}
/* SVG FLECHES */
.flickr-pagination a.flickr-page.flickr-prev svg,
.flickr-pagination a.flickr-page.flickr-next svg{
width:20px !important;
height:30px !important;
stroke:currentColor !important;
display:block !important;
}
/* numéros plus compacts */
.flickr-pagination a.flickr-page{
font-size:14px !important;
width:30px !important;
height:30px !important;
}
/* tiret plus court */
.flickr-dash{
width:14px !important;
}
}
/* ===============================
Album Flickr Youtube - Affichage automatique via champs ACF
=============================== */
.sev-album-grid {
display: flex !important;
flex-wrap: wrap !important;
margin-left: -15px !important;
margin-right: -15px !important;
}
.sev-single-album {
width: 25% !important;
padding: 0 15px !important;
margin-bottom: 30px !important;
box-sizing: border-box !important;
}
/* CARD */
.flickr-grid-item {
display: block !important;
position: relative !important;
text-decoration: none !important;
}
.flickr-grid-image {
width: 100% !important;
padding-top: 56.25% !important;
background-size: cover !important;
background-position: center !important;
}
.flickr-grid-overlay {
position: absolute !important;
inset: 0 !important;
display: flex !important;
flex-direction: column !important;
justify-content: flex-end !important;
padding: 25px !important;
background: linear-gradient(
180deg,
rgba(0,34,53,0.1) 0%,
rgba(0,34,53,0.7) 100%
) !important;
}
.flickr-grid-overlay h3 {
color: #fff !important;
margin: 0 0 10px !important;
}
.flickr-grid-link {
color: #fff !important;
text-decoration: underline !important;
}
.flickr-grid-overlay{
position:absolute !important;
inset:0 !important;
display:flex !important;
flex-direction:column !important;
justify-content:flex-end !important;
padding:25px !important;
}
.flickr-grid-bottom{
display:flex !important;
align-items:center !important;
justify-content:space-between !important;
}
.flickr-grid-link{
color:#fff !important;
}
.flickr-grid-icon{
display:flex !important;
align-items:center !important;
}
.flickr-grid-icon svg{
width:30px !important;
height:22px !important;
}
/* ===========================
PAGINATION
=========================== */
/* === PAGINATION CONTAINER === */
.flickr-pagination,
.sev-pagination{
margin-top:40px !important;
display:flex !important;
justify-content:center !important;
align-items:center !important;
gap:10px !important;
}
/* === BOUTON PAGINATION === */
.sev-pagination,
.flickr-pagination{
display:flex !important;
justify-content:center !important;
align-items:center !important;
flex-wrap:wrap !important;
gap:14px !important;
margin:30px 0 !important;
font-family:'Fjalla One',Helvetica,Arial,sans-serif !important;
}
.sev-pagination a,
.flickr-pagination a{
display:flex!important;
align-items:center!important;
justify-content:center!important;
width:42px !important;
height:42px !important;
background:#F0F2F6!important;
color:#004C77!important;
text-decoration:none!important;
border-radius:0px !important;
font-size:16px !important;
font-weight:400 !important;
transition:all .2s ease !important;
box-sizing:border-box !important;
margin:0!important;
padding:0!important;
line-height:1!important;
}
.sev-pagination a:hover,
.flickr-pagination a:hover{
background:#004C77!important;
color:#fff!important;
}
.sev-pagination a.active,
.flickr-pagination a.active{
background:#004C77!important;
color:#fff!important;
box-shadow:0 4px 12px rgba(0,0,0,.15) !important;
}
@media (max-width: 1024px) {
.sev-single-album {
width: 50% !important;
}
}
@media (max-width: 767px) {
.sev-single-album {
width: 100% !important;
}
.sev-pagination a,
.flickr-pagination a{
width:36px !important;
height:36px !important;
font-size:14px !important;
}
}
/* ===============================
Shortcode : [sev_media_from_acf]
Grid PERSONNALISE Flickr + YouTube via ACF repeater
=============================== */
/* ----- Titre ----- */
.sev-media-title {
color: var(--Blue-dark, #004C77) !important;
font-family: 'Fjalla One', Helvetica, Arial, Lucida, sans-serif !important;
font-size: 40px !important;
font-weight: 400 !important;
line-height: 130% !important;
margin-bottom: 20px !important;
}
/* ----- Grille principale ----- */
.sev-acf-grid {
display: grid !important;
gap: 20px !important;
margin-bottom: 40px !important;
/* ≥ 1200px : 4 colonnes */
grid-template-columns: repeat(4, 1fr) !important;
}
/* 900px – 1199px : 3 colonnes */
@media (max-width: 1200px) {
.sev-acf-grid {
grid-template-columns: repeat(3, 1fr) !important;
}
}
/* 600px – 899px : 2 colonnes */
@media (max-width: 899px) {
.sev-acf-grid {
grid-template-columns: repeat(2, 1fr) !important;
}
}
/* < 600px : 1 colonne */
@media (max-width: 599px) {
.sev-acf-grid {
grid-template-columns: 1fr !important;
}
}
/* ----- Vignette — ratio fixe 4/3 ----- */
.sev-acf-grid .flickr-grid-item {
aspect-ratio: 4 / 3 !important;
display: block !important;
position: relative !important;
overflow: hidden !important;
text-decoration: none !important;
border-radius: 4px !important;
}
/* ----- Image de fond ----- */
.sev-acf-grid .flickr-grid-image {
width: 100% !important;
height: 100% !important;
background-size: cover !important;
background-position: center !important;
transition: transform 0.6s ease !important;
}
.sev-acf-grid .flickr-grid-item:hover .flickr-grid-image {
transform: scale(1.08) !important;
}
/* ----- Overlay (commun) ----- */
.sev-acf-grid .flickr-grid-overlay {
position: absolute !important;
inset: 0 !important;
display: flex !important;
flex-direction: column !important;
justify-content: flex-end !important;
padding: 16px !important;
background: linear-gradient(
180deg,
rgba(0, 76, 119, 0.05) 0%,
rgba(0, 76, 119, 0.55) 100%
) !important;
transition: background 0.4s ease !important;
}
.sev-acf-grid .flickr-grid-item:hover .flickr-grid-overlay {
background: linear-gradient(
180deg,
rgba(0, 76, 119, 0.30) 0%,
rgba(0, 76, 119, 0.85) 100%
) !important;
}
/* Overlay vidéo légèrement différent */
.sev-acf-grid .flickr-grid-item.video .flickr-grid-overlay {
background: linear-gradient(
180deg,
rgba(0, 76, 119, 0.10) 0%,
rgba(0, 76, 119, 0.45) 100%
) !important;
}
.sev-acf-grid .flickr-grid-item.video:hover .flickr-grid-overlay {
background: linear-gradient(
180deg,
rgba(0, 76, 119, 0.40) 0%,
rgba(0, 76, 119, 0.90) 100%
) !important;
}
/* ----- Texte dans l'overlay ----- */
.sev-acf-grid .flickr-grid-text {
display: flex !important;
flex-direction: column !important;
gap: 4px !important;
}
.sev-acf-grid .flickr-grid-text h3 {
margin: 0 !important;
color: #fff !important;
font-size: 22px !important;
font-weight: 600 !important;
line-height: 1.3 !important;
overflow: visible !important;
}
/* Adaptation taille du titre selon résolution */
@media (max-width: 1200px) {
.sev-acf-grid .flickr-grid-text h3 {
font-size: 20px !important;
}
}
@media (max-width: 899px) {
.sev-acf-grid .flickr-grid-text h3 {
font-size: 18px !important; /* plus de place avec 2 colonnes */
}
}
.sev-acf-grid .flickr-grid-link {
display: flex !important;
align-items: center !important;
gap: 6px !important;
color: rgba(255, 255, 255, 0.80) !important;
font-size: 12px !important;
text-decoration: none !important;
}
/* ----- Icône (coin bas-droit) ----- */
.sev-media-section .flickr-grid-icon {
position: absolute !important;
right: 14px !important;
bottom: 14px !important;
width: 26px !important;
height: 26px !important;
opacity: 0.85 !important;
}
/* ----- Pagination ----- */
.sev-media-pagination {
margin-top: 40px !important;
text-align: center !important;
}
/* Héritage du style news-full-pagination — surcharges si besoin */
.sev-media-pagination .news-full-page {
transition: background 0.2s ease, color 0.2s ease !important;
}
/* ----- Transition globale lors du chargement AJAX ----- */
#sev-media-container {
transition: opacity 0.3s ease !important;
}
/* ==========================
Shortcode : [news_full] affichage du flux des ACTUS page actualités
========================== */
.news-full-wrapper {
position: relative !important;
max-width: 100% !important;
margin: 0 auto !important;
padding: 2rem 1rem !important;
transition: opacity 0.2s ease !important;
}
.news-full-grid {
display: flex !important;
flex-direction: column !important;
gap: 2rem !important;
}
/* État de chargement (AJAX) */
.news-full-loading {
opacity: 0.4 !important;
pointer-events: none !important;
}
/* === ROWS / LIGNES === */
.news-full-row {
display: grid !important;
gap: 1.5rem !important;
}
/* 1) Ligne des 2 actus "featured" */
.news-full-row-featured {
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}
/* 2) Lignes des petites cartes (4 colonnes) */
.news-full-row-small {
grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}
/* === Cartes FEATURED (1ère ligne) === */
.news-full-item-featured {
position: relative !important;
overflow: hidden !important;
border-radius: 0rem !important;
}
.news-full-item-featured-link {
display: flex !important;
align-items: flex-end !important;
justify-content: flex-start !important;
position: relative !important;
width: 100% !important;
min-height: 285px !important;
background-size: cover !important;
background-position: center center !important;
text-decoration: none !important;
}
/* Overlay sombre + dégradé en bas */
.news-full-item-featured-link::before {
content: "" !important;
position: absolute !important;
inset: 0 !important;
background: linear-gradient(
to top,
rgba(0, 0, 0, 0.75),
rgba(0, 0, 0, 0.15)
) !important;
}
/* Contenu texte dans l’overlay */
.news-full-item-featured-overlay {
position: relative !important;
padding: 1.25rem 1.5rem !important;
color: #fff !important;
z-index: 1 !important;
width: 100% !important;
}
/* Date sur les featured */
.news-full-item-featured .news-full-date {
display: inline-block !important;
letter-spacing: 0.08em !important;
opacity: 1 !important;
font-family: Rubik !important;
font-size: 12px !important;
font-style: normal !important;
line-height: 120% !important;
letter-spacing: 0.2px !important;
}
/* Titre sur les featured */
.news-full-item-featured .news-full-title {
margin: 0.4rem 0 0 !important;
font-weight: 700 !important;
font-family: 'Fjalla One', Helvetica, Arial, Lucida, sans-serif !important;
font-size: 1.6rem !important;
line-height: 130% !important;
color: #fff !important;
}
/* === Cartes SMALL (3 lignes x 4) === */
.news-full-item-small {
display: flex !important;
flex-direction: column !important;
gap: 0.6rem !important;
margin-bottom: 20px !important;
}
.news-full-thumb-wrapper {
position: relative !important;
display: block !important;
height: 180px !important;
overflow: hidden !important;
background-size: cover !important;
background-position: center !important;
background-repeat: no-repeat !important;
transition: transform 0.3s ease !important;
}
/* petit effet hover */
.news-full-thumb-wrapper:hover {
transform: scale(1.04) !important;
}
/* Overlay léger au survol */
.news-full-thumb-wrapper::before {
content: "" !important;
position: absolute !important;
inset: 0 !important;
background: rgba(0, 0, 0, 0.35) !important;
opacity: 0 !important;
transition: opacity 0.3s ease !important;
z-index: 1 !important;
}
.news-full-thumb-wrapper:hover::before {
opacity: 1 !important;
}
/* Bouton "Lire l’article" */
.news-full-thumb-wrapper::after {
content: "Lire l’article" !important;
position: absolute !important;
bottom: 12px !important;
left: 16px !important;
color: #fff !important;
font-family: Rubik, sans-serif !important;
text-decoration: underline !important;
font-size: 14px !important;
font-weight: 400 !important;
line-height: 130% !important;
padding: 6px 12px !important;
border-radius: 0px !important;
opacity: 0 !important;
transform: translateY(10px) !important;
transition: all 0.35s ease !important;
z-index: 2 !important;
}
.news-full-thumb-wrapper:hover::after {
opacity: 1 !important;
transform: translateY(0) !important;
}
/* Flèche (en bas à droite) */
.news-full-thumb-wrapper .news-full-arrow-icon {
position: absolute !important;
bottom: 16px !important;
right: 16px !important;
width: 22px !important;
height: 22px !important;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='27' height='20' viewBox='0 0 27 20' fill='none'%3E%3Cpath d='M16 1L25 10L16 19' stroke='white' stroke-width='2' stroke-linecap='round'/%3E%3Cpath d='M1 10C2.28 10 12.2 10 17 10' stroke='white' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") !important;
background-repeat: no-repeat !important;
background-size: contain !important;
opacity: 0 !important;
transform: translateY(5px) !important;
transition: all 0.3s ease, transform 0.3s ease !important;
z-index: 2 !important;
}
.news-full-thumb-wrapper:hover .news-full-arrow-icon {
opacity: 1 !important;
transform: translateY(0) !important;
}
/* Meta (date + titre) */
.news-full-meta {
display: flex !important;
flex-direction: column !important;
gap: 0.25rem !important;
}
/* Date */
.news-full-item-small .news-full-date {
letter-spacing: 0.08em !important;
color: #004C77 !important;
font-family: Rubik !important;
font-size: 12px !important;
font-weight: 500 !important;
line-height: 120% !important;
letter-spacing: 0.2px !important;
text-transform: none !important;
}
/* Titre + lien */
.news-full-item-small .news-full-title {
margin: 0 !important;
font-family: Rubik !important;
font-size: 18px !important;
font-style: normal !important;
font-weight: 400 !important;
line-height: 130% !important;
color: #061D29 !important;
}
/* Titre */
.news-full-item-small .news-full-title a {
text-decoration: none !important;
color: inherit !important;
}
.news-full-item-small .news-full-title a:hover {
text-decoration: underline !important;
}
/* Message "aucune actu" */
.news-full-empty {
text-align: center !important;
color: #061D29 !important;
font-size: 0.95rem !important;
}
/* ===========================
PAGINATION ACTUS
=========================== */
/* NETTOYAGE WORDPRESS */
/* Cacher les anciennes flèches WordPress (guillemets doubles) */
/* Supprime texte "Précédent / Suivant" */
.news-full-pagination-list .prev span,
.news-full-pagination-list .next span {
display: none !important;
}
/* Cache caractères « ‹ › » WP */
.news-full-pagination-list .prev,
.news-full-pagination-list .next {
font-size: 0 !important;
line-height: 0 !important;
}
/* Supprime puces */
.news-full-pagination-list,
.news-full-pagination-list li {
list-style: none !important;
}
/* Supprime marqueurs */
.news-full-pagination-list li::marker {
content: none !important;
}
/* Reset marges */
.news-full-pagination-list {
padding-left: 0 !important;
margin-left: 0 !important;
}
.news-full-pagination {
display:flex !important;
align-items:center !important;
justify-content:center !important;
gap:14px !important;
margin-top:50px !important;
}
/* LISTE */
.news-full-pagination-list {
display:flex !important;
align-items:center !important;
justify-content:center !important;
gap:14px !important;
flex-wrap:wrap !important;
}
/* NUMEROS */
.news-full-pagination a.news-full-page{
display:flex !important;
align-items:center !important;
justify-content:center !important;
border:none !important;
padding: 0 !important;
margin: 0 !important;
color:#004C77 !important;
text-decoration:none !important;
cursor:pointer !important;
box-shadow:none !important;
width:42px !important;
height:42px !important;
}
/* PAGE ACTIVE */
.news-full-pagination a.news-full-page.active{
background:#004C77 !important;
color:#ffffff !important;
}
/* HOVER NUMEROS */
.news-full-pagination a.news-full-page:hover{
background:#004C77 !important;
background-color:#004C77 !important;
color:#ffffff !important;
opacity:1 !important;
}
/* === FLÈCHES === */
.news-full-pagination a.news-full-page.news-full-prev,
.news-full-pagination a.news-full-page.news-full-next{
display:flex !important;
width:42px !important;
height:42px !important;
justify-content:center !important;
align-items:center !important;
border:none !important;
cursor:pointer !important;
transition:all .3s ease !important;
}
/* SVG FLECHES */
.news-full-pagination a.news-full-page.news-full-prev svg,
.news-full-pagination a.news-full-page.news-full-next svg{
width:24px !important;
height:34px !important;
stroke:currentColor !important;
display:block !important;
}
.news-full-pagination svg{
display:block !important;
}
/* FLECHE GAUCHE : NORMAL */
.news-full-pagination a.news-full-page.news-full-prev{
background:#F0F2F6 !important;
background-color:#F0F2F6 !important;
color:#73B4DA !important;
}
/* FLECHE GAUCHE : HOVER */
.news-full-pagination a.news-full-page.news-full-prev:hover{
background:#004C77 !important;
background-color:#004C77 !important;
color:#ffffff !important;
opacity:1 !important;
}
/* FLECHE DROITE : NORMAL */
.news-full-pagination a.news-full-page.news-full-next{
background:#73B4DA !important;
background-color:#73B4DA !important;
color:#ffffff !important;
}
/* FLECHE DROITE : HOVER */
.news-full-pagination a.news-full-page.news-full-next:hover{
background:#004C77 !important;
background-color:#004C77 !important;
color:#ffffff !important;
opacity:1 !important;
}
/* TIRET */
.news-full-dash{
display:flex !important;
align-items:center !important;
justify-content:center !important;
width:24px !important;
height:20px !important;
}
/* Responsive */
/* <= 1024px : les petites cartes passent à 3 colonnes */
@media (max-width: 1024px) {
.news-full-row-small{
grid-template-columns:repeat(4,1fr) !important;
}
.news-full-row-small article:last-child{
grid-column:span 4 !important;
}
}
/* Tablette (max 980px) */
@media (max-width: 980px) {
.news-full-item-small .news-full-title {
font-size: 17px !important;
}
.news-full-item-featured .news-full-title {
font-size: 24px !important;
}
}
/* Mobile (max 768px) */
@media (max-width: 768px) {
.news-full-item-small .news-full-title {
font-size: 15px !important;
}
.news-full-item-featured .news-full-title {
font-size: 20px !important;
}
.news-full-row-featured {
grid-template-columns: 1fr !important;
}
.news-full-row-small {
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}
.news-full-item-featured-link {
min-height: 220px !important;
background-size: cover !important;
background-position: center !important;
background-repeat: no-repeat !important;
}
.news-full-pagination{
gap:6px !important;
}
.news-full-pagination-list{
gap:6px !important;
}
.news-full-pagination a.news-full-page.news-full-prev,
.news-full-pagination a.news-full-page.news-full-next{
width:30px !important;
height:30px !important;
}
.news-full-pagination a.news-full-page{
font-size:14px !important;
width:30px !important;
height:30px !important;
}
.news-full-dash{
width:14px !important;
}
}
/* ==========================
FILTRES FILTRES CATÉGORIES ACTUS et SERVICES WPGB
========================== */
.wpgb-facet ul .wpgb-button {
color: var(--White, #FFF) !important;
background-color: transparent !important;
border: 1px solid #FFF !important;
border-radius: 0 !important;
font-family: 'Fjalla One', Helvetica, Arial, Lucida, sans-serif !important;
font-size: 16px !important;
font-weight: 500 !important;
line-height: 130% !important;
letter-spacing: 0.16px !important;
padding: 16px 16px !important;
display: flex !important;
justify-content: center !important;
align-items: center !important;
gap: 8px !important;
white-space: nowrap !important; /* empêche les retours */
transition: all 0.3s ease !important;
cursor: pointer !important;
}
.wpgb-facet ul .wpgb-button{
color: white !important;
}
/* Hover */
.wpgb-facet ul .wpgb-button:hover {
background-color: #eba961 !important;
border-color: #eba961 !important;
}
/* Active */
.wpgb-facet ul .wpgb-button.wpgb-active {
background-color: #73b4da !important;
border-color: #73b4da !important;
}
/* ======================================================
DESKTOP — Boutons alignés à gauche
====================================================== */
.wpgb-facet ul {
display: flex !important;
flex-wrap: wrap !important;
justify-content: flex-start !important; /* ⬅️ ALIGNEMENT À GAUCHE */
gap: 8px !important;
padding: 0 !important;
margin: 0 !important;
margin-top: 10px !important;
list-style: none !important;
}
/* === TABLETTE + MOBILE — SCROLL HORIZONTAL === */
@media (max-width: 1024px) {
/* Container scrollable */
.wpgb-facet {
overflow-x: auto !important;
overflow-y: hidden !important;
white-space: nowrap !important;
-webkit-overflow-scrolling: touch !important;
scrollbar-width: none !important;
}
.wpgb-facet::-webkit-scrollbar {
display: none !important;
}
/* Ligne → one-line horizontal */
.wpgb-facet ul,
.wpgb-facet .wpgb-facet-list {
display: inline-flex !important;
flex-wrap: nowrap !important;
justify-content: flex-start !important;
gap: 12px !important;
padding: 0 8px !important;
margin: 0 !important;
margin-top: -30px !important;
}
/* Chaque bouton reste indépendant */
.wpgb-facet li {
flex: 0 0 auto !important;
}
/* Conteneur UL du filtre → scroll horizontal + padding */
.wpgb-facet ul {
display: flex !important;
flex-wrap: nowrap !important; /* un SEUL axe */
overflow-x: auto !important; /* scroll horizontal */
gap: 12px !important;
padding: 0 16px !important; /* espace bordure gauche/droite */
margin: 0 !important;
scrollbar-width: none !important; /* Firefox : cache scrollbar */
width: 100% !important;
margin-top: 10px !important;
}
/* Cache scrollbar Webkit (Chrome/Safari) */
.wpgb-facet ul::-webkit-scrollbar {
display: none !important;
}
/* Boutons : taille adaptée mobile/tablette */
.wpgb-facet .wpgb-button {
white-space: nowrap !important; /* évite retour ligne */
padding: 12px 16px !important;
}
}
/* === RESPONSIVE — Ajustements taille boutons === */
@media (max-width: 980px) {
.wpgb-facet ul .wpgb-button {
font-size: 15px !important;
padding: 10px 10px !important;
}
}
@media (max-width: 767px) {
.wpgb-facet ul .wpgb-button {
font-size: 13px !important;
padding: 6px 10px !important;
}
}
/* === FILTRES — VOIR PLUS / VOIR MOINS (Desktop uniquement) === */
@media (min-width: 1025px) {
.wpgb-button-facet {
display: flex !important;
flex-wrap: wrap !important;
gap: 8px !important;
align-items: flex-start !important;
}
.wpgb-inline-list {
width: 100% !important;
}
.wpgb-facet .wpgb-inline-list li:nth-child(n+9) {
display: none !important;
}
.wpgb-facet.facet-expanded .wpgb-inline-list li:nth-child(n+9) {
display: flex !important;
}
.facet-toggle-btn {
background: transparent !important;
border: 1px solid #FFF !important;
color: #FFF !important;
font-family: 'Fjalla One', Helvetica, Arial, Lucida, sans-serif !important;
font-size: 16px !important;
padding: 16px !important;
cursor: pointer !important;
transition: all 0.3s ease !important;
white-space: nowrap !important;
margin-top: 8px !important;
display: block !important;
width: 100% !important;
}
.facet-toggle-btn:hover {
background-color: #eba961 !important;
border-color: #eba961 !important;
}
}
/* =========================================
BLOG DIVI 4 COLONNES + HOVER CARD Classe : seva-blog-4col
========================================= */
/* Grille */
.seva-blog-4col .et_pb_blog_grid .et_pb_ajax_pagination_container{
display:grid !important;
grid-template-columns:repeat(4,minmax(0,1fr)) !important;
gap:16px !important;
width:100% !important;
align-items:start !important;
}
@media(max-width:1024px){
.seva-blog-4col .et_pb_blog_grid .et_pb_ajax_pagination_container{
grid-template-columns:repeat(3,minmax(0,1fr)) !important;
gap:14px !important;
}
}
@media(max-width:768px){
.seva-blog-4col .et_pb_blog_grid .et_pb_ajax_pagination_container{
grid-template-columns:repeat(2,minmax(0,1fr)) !important;
gap:12px !important;
}
}
@media(max-width:480px){
.seva-blog-4col .et_pb_blog_grid .et_pb_ajax_pagination_container{
grid-template-columns:1fr !important;
gap:14px !important;
}
}
/* Neutralise Divi salvattore */
.seva-blog-4col .et_pb_salvattore_content{
display:contents !important;
}
.seva-blog-4col .et_pb_salvattore_content .column{
width:100% !important;
max-width:100% !important;
float:none !important;
margin:0 !important;
padding:0 !important;
display:contents !important;
}
/* Ordre chronologique en grille : géré dynamiquement par sevaInitBlog4col() dans global.js
(lit l'index N dans et_pb_blog_item_X_N et applique style.order en inline). */
/* Pagination : order implicite 0 = même groupe que et_pb_blog_item_0_0 → 2e cellule de la grille.
Frère direct de .et_pb_salvattore_content dans .et_pb_ajax_pagination_container. */
.seva-blog-4col .et_pb_ajax_pagination_container > div:not(.et_pb_salvattore_content){
order: 999 !important;
grid-column: 1 / -1 !important;
width: 100% !important;
}
/* Card */
.seva-blog-4col .et_pb_post{
background:none !important;
border:none !important;
padding:0 !important;
margin:0 !important;
width:100% !important;
max-width:100% !important;
}
/* Wrapper image (cadre) */
.seva-blog-4col .et_pb_post .et_pb_image_container{
position:relative !important;
display:block !important;
width:100% !important;
height:180px !important;
overflow:hidden !important;
margin:0 !important;
}
/* Mobile : format paysage */
@media(max-width:480px){
.seva-blog-4col .et_pb_post .et_pb_image_container{
height:220px !important;
}
}
/* Image */
.seva-blog-4col .et_pb_post .et_pb_image_container img{
width:100% !important;
height:100% !important;
object-fit:cover !important;
display:block !important;
transition:transform .5s ease !important;
}
/* Zoom hover */
.seva-blog-4col .et_pb_post:hover .et_pb_image_container img{
transform:scale(1.08) !important;
}
/* Overlay bleu */
.seva-blog-4col .et_pb_post .et_pb_image_container:before{
content:"" !important;
position:absolute !important;
inset:0 !important;
background:rgba(0,76,119,0.20) !important;
opacity:0 !important;
transition:opacity .25s ease !important;
z-index:1 !important;
}
.seva-blog-4col .et_pb_post:hover .et_pb_image_container:before{
opacity:1 !important;
background:rgba(0,76,119,0.50) !important;
}
/* Bouton bas gauche */
.seva-blog-4col .et_pb_post .more-link{
position:absolute !important;
left:16px !important;
bottom:16px !important;
z-index:3 !important;
background:none !important;
border:none !important;
padding:0 !important;
margin:0 !important;
font-family:Rubik !important;
font-size:14px !important;
font-weight:400 !important;
line-height:130% !important;
text-decoration:underline !important;
color:#fff !important;
opacity:0 !important;
transform:translateY(8px) !important;
transition:opacity .25s ease, transform .25s ease !important;
pointer-events:none !important;
}
/* Flèche bas droite */
.seva-blog-4col .et_pb_post .blog-arrow-icon{
position:absolute !important;
right:16px !important;
bottom:16px !important;
width:27px !important;
height:20px !important;
z-index:3 !important;
opacity:0 !important;
transform:translateY(8px) !important;
transition:opacity .25s ease, transform .25s ease !important;
pointer-events:none !important;
}
/* Affichage UNIQUEMENT hover */
.seva-blog-4col .et_pb_post:hover .more-link,
.seva-blog-4col .et_pb_post:hover .blog-arrow-icon{
opacity:1 !important;
transform:translateY(0) !important;
pointer-events:auto !important;
}
/* Sur mobile : on cache */
@media(hover:none){
.seva-blog-4col .et_pb_post .more-link,
.seva-blog-4col .et_pb_post .blog-arrow-icon{
opacity:0 !important;
transform:translateY(8px) !important;
pointer-events:none !important;
}
}
/* Titre + spacing */
.seva-blog-4col .et_pb_post .entry-title{
margin-top:10px !important;
}
.seva-blog-4col .et_pb_post .post-content{
display:none !important;
}
/* Date au dessus du titre (module blog seva-blog-4col) */
.seva-blog-4col .et_pb_post{
display:flex !important;
flex-direction:column !important;
}
.seva-blog-4col .et_pb_post .et_pb_image_container,
.seva-blog-4col .et_pb_post .entry-featured-image-url{
order:1 !important;
}
.seva-blog-4col .et_pb_post .post-meta{
order:2 !important;
margin:10px 0 6px 0 !important;
}
.seva-blog-4col .et_pb_post .entry-title{
order:3 !important;
margin-top:0 !important;
}
.seva-blog-4col .et_pb_post .post-content{
order:4 !important;
}
/* ==========================
Shortcode : [anchor_menu] EDITO Menu titres H2 avec liens d'ancrages barre latérale page édito
========================== */
.anchor-menu {
display: flex !important;
flex-direction: column !important;
gap: 8px !important;
padding: 0 !important;
margin: 0 !important;
}
.anchor-menu ul {
list-style: none !important;
margin: 0 !important;
padding: 0 !important;
}
.anchor-menu li {
margin: 0 !important;
padding: 0 !important;
}
.anchor-menu a {
display: block !important;
padding: 10px !important;
color: #004C77 !important;
text-decoration: none !important;
font-family: inherit !important;
transition: background-color 0.3s ease, color 0.3s ease !important;
}
/* Survol : fond bleu */
.anchor-menu a:hover {
background: #73B4DA !important;
color: #fff !important;
}
/* États du lien actif */
.anchor-menu a.is-active {
background-color: #004C77 !important;
color: #ffffff !important;
}
/* ✅ Ligne séparatrice sur la colonne contenu (à gauche) */
.col-contenu-edito {
border-left: 1px solid rgba(0, 76, 119, 0.30) !important;
padding-left: 25px !important;
}
/* Limiter le z-index du module sticky Divi */
.et_pb_sticky,
.et_pb_sticky--top,
.et_pb_sticky_module {
z-index: 50 !important;
}
/* ✅ Cache le menu quand le footer arrive */
.anchor-menu--hide {
opacity: 0 !important;
pointer-events: none !important;
transform: translateY(10px) !important;
transition: opacity 0.25s ease, transform 0.25s ease !important;
}
/* ==========================
Formulaire Formidable
========================== */
/* Tablette (max 980px) */
@media (max-width: 980px) {
/* Titres de section H3 (mobile) */
.frm_forms .frm_section_heading h3.frm_pos_top.frm_section_spacing {
font-size: 24px !important;
line-height: 130% !important;
}
/* Labels des champs (mobile) */
.frm_primary_label,
.frm_form_field label.frm_primary_label {
font-size: 15px !important;
line-height: 120% !important;
}
}
/* Mobile (max 767px) */
@media (max-width: 767px) {
/* Titres de section H3 (mobile) */
.frm_forms .frm_section_heading h3.frm_pos_top.frm_section_spacing {
font-size: 20px !important;
line-height: 130% !important;
}
/* Labels des champs (mobile) */
.frm_primary_label,
.frm_form_field label.frm_primary_label {
font-size: 14px !important;
line-height: 120% !important;
}
}
/* ==========================
Shortcode : [agenda_edito] pour CPT tribe_events
========================== */
.agenda-edito {
font-family: inherit !important;
font-size: 16px !important;
}
/* ---- Barre des mois ---- */
.agenda-edito-months {
display: flex !important;
flex-wrap: wrap !important;
gap: 0.5rem !important;
margin-bottom: 1rem !important;
}
.agenda-edito-month {
border: 0px !important;
padding: 1rem 1rem !important;
cursor: pointer !important;
border-radius: 0px !important;
white-space: nowrap !important;
transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease !important;
color: var(--Blue-dark, #004C77) !important;
text-align: center !important;
font-family: 'Fjalla One', Helvetica, Arial, Lucida, sans-serif !important;
font-size: 22px !important;
font-style: normal !important;
font-weight: 400 !important;
line-height: 130% !important;
background: #fff !important;
}
.agenda-edito-month--active {
background: #b2c9d6 !important;
color: #fff !important;
border-color: #b2c9d6 !important;
}
.agenda-edito-month:hover {
background: #004C77 !important;
color: white !important;
}
/* ---- Liste des événements avec scroll + dégradé ---- */
.agenda-edito-events-wrapper {
position: relative !important;
max-height: 19rem !important; /* ~9 lignes visibles selon la hauteur des lignes */
overflow-y: auto !important;
}
/* Dégradé blanc sur le bas (pour “masquer” les ~3 dernières lignes visibles */
.agenda-edito-events-wrapper::after {
content: "" !important;
position: sticky !important;
bottom: 0 !important;
left: 0 !important;
right: 0 !important;
height: 4rem !important;
pointer-events: none !important;
background: linear-gradient(to bottom, rgba(255,255,255,0), rgba(255,255,255,0.96)) !important;
}
.agenda-edito-events-inner {
position: relative !important;
}
/* ---- Tables par mois ---- */
.agenda-edito-table {
width: 100% !important;
table-layout: fixed !important;
border-collapse: collapse !important;
display: none !important; /* tout masqué par défaut : le JS active la bonne table */
}
/* Si tu choisis de gérer l’état actif via une classe côté JS */
.agenda-edito-table.is-active {
display: table !important;
}
/* Lignes / cellules */
.agenda-edito-row td {
border-bottom: 1px solid var(--bleu-dark-30, #B3CAD7) !important;
height: 50px !important;
vertical-align: middle !important;
}
/* optionnel : pas de ligne après le dernier */
.agenda-edito-row:last-child td {
border-bottom: none !important;
}
/* Colonne date */
.agenda-edito-date {
white-space: nowrap !important;
font-family: 'Fjalla One', Helvetica, Arial, Lucida, sans-serif !important;
padding-right: 0.8rem !important;
font-size: 16px !important;
font-style: normal !important;
font-weight: 400 !important;
line-height: 130% !important;
max-width: 200px !important;
width: 200px !important;
white-space: normal !important; /* permet de passer à la ligne si nécessaire */
word-break: break-word !important; /* coupe si nécessaire */
vertical-align: middle !important;
}
/* Colonne titre */
.agenda-edito-title {
width: auto !important;
word-break: break-word !important;
vertical-align: middle !important;
}
.agenda-edito-title a {
display: inline-block !important;
text-decoration: none !important;
border-bottom: 1px solid transparent !important;
color: var(--Blue-dark, #004C77) !important;
font-family: Rubik !important;
font-size: 15px !important;
font-style: normal !important;
font-weight: 400 !important;
line-height: 120% !important; /* 19.2px */
letter-spacing: 0.08px !important;
}
/* Désactiver l’effet de soulignement au survol des liens du tableau */
.agenda-edito-title a,
.agenda-edito-title a:hover,
.agenda-edito-title a:focus,
.agenda-edito-title a:active {
text-decoration: none !important;
border-bottom: none !important;
}
/* Ligne “vide” quand aucun événement */
.agenda-edito-row--empty td {
padding: 0.8rem 0 !important;
color: #B3CAD7 !important;
font-style: italic !important;
}
/* Optionnel : léger séparateur entre lignes */
.agenda-edito-row + .agenda-edito-row td {
border-top: 1px solid #B3CAD7 30% !important;
}
/* Dégradé sur les 3 derniers éléments visibles */
.agenda-edito-events-wrapper {
position: relative !important;
overflow-y: auto !important;
scrollbar-width: thin !important; /* Firefox */
scrollbar-color: #cccccc transparent !important; /* couleur poignée + fond */
}
/* Chrome, Edge, Safari */
.agenda-edito-events-wrapper::-webkit-scrollbar {
width: 40px !important;
}
.agenda-edito-events-wrapper::-webkit-scrollbar-track {
background: transparent !important;
}
.agenda-edito-events-wrapper::-webkit-scrollbar-thumb {
background-color: #cccccc !important;
border-radius: 4px !important;
}
.agenda-edito-events-wrapper::-webkit-scrollbar-thumb:hover {
background-color: #b3b3b3 !important;
}
/* Dégradé blanc progressif */
.agenda-edito-events-wrapper::after {
content: "" !important;
position: sticky !important;
bottom: 0 !important;
left: 0 !important;
right: 0 !important;
display: block !important;
/* Hauteur approximative couvrant ~3 lignes */
height: 5.5rem !important;
pointer-events: none !important;
background: linear-gradient(
to bottom,
rgba(255, 255, 255, 0) 0%,
rgba(255, 255, 255, 0.6) 45%,
rgba(255, 255, 255, 0.85) 75%,
rgba(255, 255, 255, 1) 100%
) !important;
}
.agenda-edito-months {
display: grid !important;
grid-template-columns: repeat(4, 1fr) !important;
column-gap: 19px !important;
border-bottom: 1px solid var(--bleu-dark-30, #B3CAD7) !important;
padding-bottom: 0 !important;
margin-bottom: 1.5rem !important;
}
.agenda-edito-month {
display: flex !important;
align-items: center !important;
justify-content: center !important;
width: 100% !important;
height: 48px !important;
background: transparent !important;
border: none !important;
padding: 0 !important;
text-align: center !important;
cursor: pointer !important;
transition: background-color 0.2s ease, color 0.2s ease !important;
}
.agenda-edito-month--active {
background: #B3CAD7 !important;
color: #ffffff !important;
}
.agenda-edito-month:hover {
background: #004C77 !important;
color: #ffffff !important;
}
/* ===== RESET TOTAL DES BORDURES DU TABLEAU (Divi-proof) ===== */
.agenda-edito-table,
.agenda-edito-table thead,
.agenda-edito-table tbody,
.agenda-edito-table tr,
.agenda-edito-table td {
border: none !important;
}
/* ===== UNE SEULE LIGNE EN BAS DE CHAQUE EVENT ===== */
.agenda-edito-row td {
border-bottom: 1px solid var(--bleu-dark-30, #B3CAD7) !important;
}
/* Pas de ligne après le dernier */
.agenda-edito-row:last-child td {
border-bottom: none !important;
}
/* Tablette (max 980px) */
@media (max-width: 980px) {
.agenda-edito-month {
font-size: 18px !important;
padding: 0.7rem 0.7rem !important;
}
.agenda-edito-date {
padding-right: 0.8rem !important;
font-size: 15px !important;
}
}
@media (max-width: 767px) {
.agenda-edito-months {
display: flex !important;
width: 100% !important;
}
.agenda-edito-month {
flex: 0 0 20% !important;
position: relative !important;
/* Cache le texte desktop, mais SANS casser l'affichage ::after */
color: transparent !important;
font-size: 0 !important; /* Très important */
line-height: 1 !important;
padding: 0.8rem 0 !important;
text-align: center !important;
overflow: visible !important; /* IMPORTANT : empêche la disparition du ::after */
height: 40px !important;
}
/* On remet du texte via ::after */
.agenda-edito-month::after {
content: attr(data-label-mobile) !important;
font-size: 15px !important;
line-height: 1.2 !important;
color: var(--Blue-dark, #004C77) !important;
position: absolute !important;
inset: 0 !important; /* occupe parfaitement le bouton */
display: flex !important;
align-items: center !important;
justify-content: center !important;
}
/* Bouton actif */
.agenda-edito-month--active::after {
color: #fff !important;
}
/* ======= FORÇAGE TOTAL DU TEXTE BLANC AU SURVOL ======= */
.agenda-edito .agenda-edito-month:hover,
.agenda-edito .agenda-edito-month:hover *,
.agenda-edito .agenda-edito-month:hover::before,
.agenda-edito .agenda-edito-month:hover::after {
color: #fff !important;
fill: #fff !important;
stroke: #fff !important;
-webkit-text-fill-color: #fff !important;
}
/* ======= ETAT ACTIF : TOUJOURS BLANC ======= */
.agenda-edito .agenda-edito-month--active,
.agenda-edito .agenda-edito-month--active *,
.agenda-edito .agenda-edito-month--active::before,
.agenda-edito .agenda-edito-month--active::after {
color: #fff !important;
fill: #fff !important;
stroke: #fff !important;
-webkit-text-fill-color: #fff !important;
}
}
/* ================================
AGENDA EVEQUES - MANUEL
================================ */
/* RESET COMPLET */
.tab-agenda table,
.tab-agenda th,
.tab-agenda td,
.tab-agenda tr{
border:none !important;
height: auto !important;
}
.tab-agenda table *{
border:none !important;
height: auto !important;
}
.tab-agenda table tr{
border-bottom:1px solid var(--bleu-dark-30,#B3CAD7) !important;
}
/* FORCE 1/3 - 2/3 SUR LE TABLEAU AGENDA */
.tab-agenda table{
width:100% !important;
table-layout:fixed !important;
border-collapse:collapse !important;
}
.tab-agenda table tr > th:first-child,
.tab-agenda table tr > td:first-child{
width:30% !important;
height: auto !important;
}
.tab-agenda table tr > th:last-child,
.tab-agenda table tr > td:last-child{
width:70% !important;
height: auto !important;
}
/* ================================
Shortcode : [agenda_feed] grille d'événements tribe_events (The Events Calendar) et [agenda_feed_filt]
================================ */
.agenda-feed-item {
background: #fff !important;
position: relative !important;
padding: 24px !important;
padding-bottom: 28px !important; /* place fixe en bas */
overflow: hidden !important;
display: flex !important;
flex-direction: column !important;
gap: 12px !important;
border-radius: 0px !important;
transition: background-color 0.3s ease !important;
height: 100% !important;
min-height: 270px !important;
}
/* === A) CATÉGORIE Apparence + barre droite décorative === */
/* Nouveau bloc catégorie + ligne */
.agenda-feed-item__catline {
display: flex !important;
align-items: center !important;
gap: 8px !important;
width: 100% !important;
}
/* Catégorie : RESTAURE la typo */
.agenda-feed-item__catline .agenda-feed-cat {
font-family: 'Fjalla One', Helvetica, Arial, Lucida, sans-serif !important;
font-size: 16px !important;
font-weight: 400 !important;
line-height: 130% !important;
letter-spacing: 0.16px !important;
display: inline-block !important;
white-space: nowrap !important;
}
/* Ligne décorative */
.agenda-feed-catline-line {
flex: 1 !important;
height: 1px !important;
opacity: 1 !important;
display: block !important;
margin-top: 3px !important;
transition: background-color .2s ease, opacity .2s ease !important;
}
/* Couleurs de la ligne par catégorie */
/* === COULEUR DE LA LIGNE SELON LA CAT LABEL === */
.agenda-feed-item .agenda-feed-cat--celebration + .agenda-feed-catline-line {background-color: #73B4DA !important;}
.agenda-feed-item .agenda-feed-cat--mission + .agenda-feed-catline-line {background-color: #C2544F !important;}
.agenda-feed-item .agenda-feed-cat--art-et-culture + .agenda-feed-catline-line {background-color: #EBA961 !important;}
.agenda-feed-item .agenda-feed-cat--autres + .agenda-feed-catline-line {background-color: #B74888 !important;}
.agenda-feed-item .agenda-feed-cat--spiritualite + .agenda-feed-catline-line {background-color: #046755 !important;}
.agenda-feed-item .agenda-feed-cat--rassemblement + .agenda-feed-catline-line {background-color: #004C77 !important;}
.agenda-feed-item .agenda-feed-cat--formation + .agenda-feed-catline-line {background-color: #6CAE75 !important;}
.agenda-feed-item .agenda-feed-cat--conference + .agenda-feed-catline-line {background-color: #60609B !important;}
.agenda-feed-item .agenda-feed-cat--default + .agenda-feed-catline-line {background-color: #004C77 !important;}
/* Motif diocèse */
.agenda-feed-item__diocese-icon {
position: absolute !important;
right: 24px !important;
bottom: 24px !important;
width: 86px !important;
height: 80px !important;
pointer-events: none !important;
z-index: 0 !important;
}
.agenda-feed-item__diocese-icon svg {
width: 100% !important;
height: 100% !important;
display: block !important;
}
.agenda-feed-item{
position: relative !important;
text-decoration: none !important;
color: inherit !important;
display: flex !important;
flex-direction: column !important;
}
.agenda-feed-item:hover{
text-decoration: none !important;
}
.agenda-feed-item__overlay-link{
position: absolute !important;
inset: 0 !important;
z-index: 5 !important;
text-indent: -9999px;
}
.agenda-feed-item__hover-links{
margin-top: auto !important; /* 🔥 pousse en bas */
display: flex !important;
justify-content: space-between !important;
align-items: center !important;
opacity: 0 !important;
transition: opacity .25s ease !important;
}
.agenda-feed-item:hover .agenda-feed-item__hover-links{
opacity: 1 !important;
}
/* Le wrapper de l’icône : ancré à la carte */
.agenda-feed-item .agenda-feed-item__diocese-icon{
position: absolute !important;
width: 86px !important;
height: 80px !important;
pointer-events: none !important;
z-index: 0 !important; /* derrière le contenu */
line-height: 0 !important;
}
/* Le SVG remplit le wrapper = taille stable */
.agenda-feed-item .agenda-feed-item__diocese-icon .cat-svg{
width: 100% !important;
height: 100% !important;
display: block !important;
}
.agenda-feed-item{
position: relative !important;
}
.agenda-feed-item__diocese-icon{
position: absolute !important;
right: 24px !important;
bottom: 24px !important;
width: 86px !important;
height: 80px !important;
pointer-events: none !important;
z-index: 1 !important; /* ⬅️ était 0 */
}
/* Tout sauf l’overlay et l’icône passe au-dessus */
.agenda-feed-item > *:not(.agenda-feed-item__overlay-link):not(.agenda-feed-item__diocese-icon){
position: relative !important;
z-index: 2 !important;
}
/* Icon Etat normal */
.agenda-feed-item__diocese-icon .cat-svg{
width: 100% !important;
height: 100% !important;
display: block !important;
opacity: 0.18 !important;
transition: opacity .3s ease !important;
}
/* Icon Hover */
.agenda-feed-item:hover .agenda-feed-item__diocese-icon svg{
color: #ffffff !important;
opacity: 0.25 !important; /* plus visible au hover */
}
/* Couleurs par catégorie */
.agenda-feed-item.cat-celebration .agenda-feed-item__diocese-icon { color: #73B4DA !important; }
.agenda-feed-item.cat-mission .agenda-feed-item__diocese-icon { color: #C54943 !important; }
.agenda-feed-item.cat-art-et-culture .agenda-feed-item__diocese-icon { color: #EBA961 !important; }
.agenda-feed-item.cat-autres .agenda-feed-item__diocese-icon { color: #B74888 !important; }
.agenda-feed-item.cat-spiritualite .agenda-feed-item__diocese-icon { color: #046755 !important; }
.agenda-feed-item.cat-rassemblement .agenda-feed-item__diocese-icon { color: #004874 !important; }
.agenda-feed-item.cat-formation .agenda-feed-item__diocese-icon { color: #6CAE75 !important; }
.agenda-feed-item.cat-conference .agenda-feed-item__diocese-icon { color: #60609B !important; }
/* Hover → blanc */
.agenda-feed-item:hover .agenda-feed-item__diocese-icon {
color: #ffffff !important;
}
.agenda-feed-item::before{
content:"" !important;
position:absolute !important;
inset:0 !important;
transform:translateX(-100%) !important;
transition:transform .4s ease !important;
z-index:0 !important; /* ⬅️ passe derrière l’icône */
}
.agenda-feed-item.cat-celebration::before { background:#73B4DA !important; }
.agenda-feed-item.cat-mission::before { background:#C2544F !important; }
.agenda-feed-item.cat-art-et-culture::before { background:#EBA961 !important; }
.agenda-feed-item.cat-autres::before { background:#B74888 !important; }
.agenda-feed-item.cat-spiritualite::before { background:#046755 !important; }
.agenda-feed-item.cat-rassemblement::before { background:#004C77 !important; }
.agenda-feed-item.cat-formation::before { background:#6CAE75 !important; }
.agenda-feed-item.cat-conference::before { background:#60609B !important; }
.agenda-feed-item.cat-default::before { background:#004C77 !important; }
.agenda-feed-item:hover::before{
transform:translateX(0) !important;
}
/* ====================================
SYSTEME CENTRALISE COULEURS
==================================== */
.agenda-feed-item.cat-celebration .agenda-feed-cat{color:#73B4DA!important;}
.agenda-feed-item.cat-mission .agenda-feed-cat{color:#C2544F!important;}
.agenda-feed-item.cat-art-et-culture .agenda-feed-cat{color:#EBA961!important;}
.agenda-feed-item.cat-autres .agenda-feed-cat{color:#B74888!important;}
.agenda-feed-item.cat-spiritualite .agenda-feed-cat{color:#046755!important;}
.agenda-feed-item.cat-rassemblement .agenda-feed-cat{color:#004C77!important;}
.agenda-feed-item.cat-formation .agenda-feed-cat{color:#6CAE75!important;}
.agenda-feed-item.cat-conference .agenda-feed-cat{color:#60609B!important;}
.agenda-feed-item.cat-default .agenda-feed-cat{color:#004C77!important;}
.agenda-feed-item.cat-celebration .agenda-feed-catline-line{background:#73B4DA!important;}
.agenda-feed-item.cat-mission .agenda-feed-catline-line{background:#C2544F!important;}
.agenda-feed-item.cat-art-et-culture .agenda-feed-catline-line{background:#EBA961!important;}
.agenda-feed-item.cat-autres .agenda-feed-catline-line{background:#B74888!important;}
.agenda-feed-item.cat-spiritualite .agenda-feed-catline-line{background:#046755!important;}
.agenda-feed-item.cat-rassemblement .agenda-feed-catline-line{background:#004C77!important;}
.agenda-feed-item.cat-formation .agenda-feed-catline-line{background:#6CAE75!important;}
.agenda-feed-item.cat-conference .agenda-feed-catline-line{background:#60609B!important;}
.agenda-feed-item.cat-default .agenda-feed-catline-line{background:#004C77!important;}
/* B) === TITRE. === */
.agenda-feed-item__title {
margin: 0 !important;
padding: 0 !important;
color: var(--Black, #061D29) !important;
font-family: 'Fjalla One', Helvetica, Arial, Lucida, sans-serif !important;
font-size: 24px !important;
font-weight: 400 !important;
line-height: 130% !important;
}
.agenda-feed-item__title a {
color: inherit !important;
text-decoration: none !important;
}
/* C) === DATE === */
.agenda-feed-item__date {
color: var(--Black, #061D29) !important;
font-family: Rubik !important;
font-size: 18px !important;
font-weight: 400 !important;
line-height: 130% !important;
}
/* D) === LIEU + ICÔNE === */
.agenda-feed-item__venue {
display: flex !important;
align-items: flex-start !important; /* important */
gap: 8px !important;
}
.agenda-feed-item__venue-icon {
width: 18px !important;
height: 22px !important;
display: inline-block !important;
flex-shrink: 0 !important;
background-repeat: no-repeat !important;
background-size: contain !important;
background-position: center !important;
background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2218%22%20height%3D%2222%22%20viewBox%3D%220%200%2018%2022%22%20fill%3D%22none%22%3E%3Cpath%20d%3D%22M2.63596%202.63596C6.15063%20-0.878704%2011.8497%20-0.878605%2015.3645%202.63596C18.8792%206.15068%2018.8792%2011.8498%2015.3645%2015.3645L9.00022%2021.7287L2.63596%2015.3645C-0.878605%2011.8497%20-0.878704%206.15063%202.63596%202.63596ZM14.6574%203.34397C11.5333%200.219778%206.46817%200.219778%203.34397%203.34397C0.219778%206.46817%200.219778%2011.5333%203.34397%2014.6574L9.00022%2020.3137L14.6574%2014.6574C17.7815%2011.5334%2017.7813%206.46819%2014.6574%203.34397ZM9.00022%205.03636C10.933%205.0366%2012.5002%206.60351%2012.5002%208.53636C12.5%2010.469%2010.9329%2012.0361%209.00022%2012.0364C7.06738%2012.0364%205.50047%2010.4691%205.50022%208.53636C5.50022%206.60336%207.06723%205.03636%209.00022%205.03636ZM9.00022%206.03636C7.61951%206.03636%206.50022%207.15564%206.50022%208.53636C6.50047%209.91685%207.61966%2011.0364%209.00022%2011.0364C10.3806%2011.0361%2011.5%209.91671%2011.5002%208.53636C11.5002%207.15579%2010.3807%206.0366%209.00022%206.03636Z%22%20fill%3D%22%23061D29%22%2F%3E%3C%2Fsvg%3E") !important;
/* clé du centrage "1 ligne" et "sur les 2 premières lignes" */
margin-top: 11px !important;
transform: translateY(-50%) !important;
}
.tribe-block__venue__name {
color: var(--Black, #061D29) !important;
font-family: Rubik !important;
font-size: 14px !important;
font-weight: 400 !important;
letter-spacing: 0.2px !important;
display: -webkit-box !important;
-webkit-line-clamp: 2 !important;
-webkit-box-orient: vertical !important;
overflow: hidden !important;
line-height: 22px !important; /* égal à la hauteur de l’icône */
}
/* === GRILLE DES ÉVÉNEMENTS === */
.agenda-feed-grid {
display: grid !important;
grid-template-columns: repeat(4, 1fr) !important;
gap: 30px !important;
align-items: stretch !important;
}
/* Texte blanc au hover */
.agenda-feed-item:hover .agenda-feed-cat,
.agenda-feed-item:hover .agenda-feed-item__title,
.agenda-feed-item:hover .agenda-feed-item__title a,
.agenda-feed-item:hover .agenda-feed-item__date,
.agenda-feed-item:hover .tribe-block__venue__name {
color: #fff !important;
}
/* Ligne devient blanche au hover */
.agenda-feed-item:hover .agenda-feed-catline-line {
background-color: #fff !important;
opacity: 1 !important;
}
/* Label catégorie */
.agenda-feed-cat--default {
color: #004C77 !important;
}
/* Hover fond bleu */
.agenda-feed-item.cat-default:hover {
background: #004C77 !important;
}
.agenda-feed-item.cat-default:hover .agenda-feed-cat {
color: #fff !important;
}
/* Ligne devient blanche */
.agenda-feed-item:hover .agenda-feed-catline-line {
background-color: #fff !important;
opacity: 1 !important;
}
.agenda-feed-item:hover .agenda-feed-item__venue {
opacity: 0 !important;
transition: opacity .25s ease !important;
}
/* Bouton Voir plus */
.agenda-feed-item__more {
color: #fff !important;
font-family: 'Fjalla One', Helvetica, Arial, Lucida, sans-serif !important;
font-size: 16px !important;
font-style: normal !important;
font-weight: 400 !important;
line-height: 130% !important;
letter-spacing: 0.16px !important;
text-decoration-line: underline !important;
text-decoration-style: solid !important;
text-decoration-skip-ink: none !important;
text-decoration-thickness: auto !important;
text-underline-offset: auto !important;
text-underline-position: from-font !important;
}
/* Flèche */
.agenda-feed-item__arrow {
width: 22px !important;
height: 22px !important;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='27' height='20' viewBox='0 0 27 20' fill='none'%3E%3Cpath d='M16 1L25 10L16 19' stroke='white' stroke-width='2' stroke-linecap='round'/%3E%3Cpath d='M1 10C2.28 10 12.2 10 17 10' stroke='white' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") !important;
background-size: contain !important;
background-repeat: no-repeat !important;
}
/* ============================
PAGINATION
============================ */
.agenda-feed-wrapper {
transition: opacity 0.2s ease !important;
}
.agenda-feed-loading {
opacity: 0.4 !important;
pointer-events: none !important;
}
/* === TIRET === */
.pag-dash {
display: flex !important;
align-items: center !important;
justify-content: center !important;
width:24px !important;
height:20px !important;
}
.pag-dash svg{
display:block !important;
width:24px !important;
height:2px !important;
}
/* === PAGINATION === */
.agenda-pagination {
display: flex !important;
justify-content: center !important;
align-items: center !important;
margin-top: 1.5rem !important;
gap: 16px !important;
font-family: 'Fjalla One', Helvetica, Arial, Lucida, sans-serif !important;
font-size: 16px !important;
font-style: light !important;
font-weight: 400 !important;
line-height: 130% !important;
letter-spacing: 0.16px !important;
color: rgba(6, 29, 41, 0.8) !important;
}
/* === ARROWS === */
.pag-arrow {
display: flex !important;
justify-content: center !important;
align-items: center !important;
width: 42px !important;
height: 42px !important;
border-radius: 0px !important;
background: #fff !important;
transition: background-color 0.3s ease !important;width: 40px !important;
text-decoration: none !important;
}
.pag-arrow span {
display: block !important;
width: 24px !important;
height: 24px !important;
mask-repeat: no-repeat !important;
mask-size: contain !important;
mask-position: center !important;
background-color: #73B4DA !important;
}
.pag-next--filled span {
background-color: #fff !important;
}
/* Hover */
.pag-arrow:hover {
background-color: #004C77 !important; /* Rouge au survol */
}
.pag-arrow:hover span {
background-color: #fff !important; /* Pour que l’icône reste bien visible sur rouge */
}
/* Flèche droite remplie */
.pag-next--filled {
background: #73B4DA !important; /* le bleu du modèle */
}
/* Flèche gauche */
.pag-prev span {
mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNyIgaGVpZ2h0PSIyMCIgdmlld0JveD0iMCAwIDI3IDIwIiBmaWxsPSJub25lIj4KPHBhdGggZD0iTTEwLjQxNDEgMUwxLjQxNDA2IDEwTDEwLjQxNDEgMTkiIHN0cm9rZT0iIzczQjREQSIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiLz4KPHBhdGggZD0iTTI1LjQxNDEgMTBDMjQuMTM0MSAxMCAxNC4yMTQxIDEwIDkuNDE0MDYgMTAiIHN0cm9rZT0iIzczQjREQSIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiLz4KPC9zdmc+") !important;
}
/* Flèche droite (vide par défaut) */
.pag-next span {
mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='27' height='20' viewBox='0 0 27 20' fill='none'%3E%3Cpath d='M16 1L25 10L16 19' stroke='white' stroke-width='2' stroke-linecap='round'/%3E%3Cpath d='M1 10C2.28 10 12.2 10 17 10' stroke='white' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") !important;
}
/* === NUMÉROS === */
.pag-numbers {
display: flex !important;
align-items: center !important;
gap: 16px !important;
font-size: 16px !important;
}
/* Numéro normal */
.pag-number {
display: flex !important; /* Ajout essentiel */
justify-content: center !important; /* Centre horizontalement */
align-items: center !important; /* Centre verticalement */
width: 42px !important;
height: 42px !important;
color: #061D29 !important;
text-decoration: none !important;
border-radius: 0 !important; /* carré parfait */
}
/* Hover */
.pag-number:hover {
display: flex !important;
justify-content: center !important;
align-items: center !important;
background-color: #004C77 !important;
color: #fff !important;
transition: background-color .2s ease, color .2s ease !important;
}
/* Active */
.pag-number.active {
display: flex !important; /* garantit le centrage */
justify-content: center !important;
align-items: center !important;
background-color: #004C77 !important;
color: #fff !important;
font-style: bold !important;
}
/* tiret séparateur */
.pag-separator {
display: none !important;
}
/* ================================
BARRE FILTRES AGENDA
================================ */
.agenda-filt {
display: flex !important;
justify-content: flex-start !important;
align-items: center !important;
gap: 24px !important;
margin: 20px 0 !important;
width: 100% !important;
}
.agenda-filt__row {
display: flex !important;
gap: 24px !important;
width: 100% !important;
align-items: center !important;
}
/* ===== WRAPPER ===== */
.agenda-filt__field {
position: relative !important;
width: 260px !important;
}
/* ===== CHAMPS ===== */
.agenda-filt__field input[type="date"],
.agenda-filt__field select {
background: #fff !important;
height: 48px !important;
width: 100% !important;
padding: 0 48px 0 16px !important;
border: none !important;
font-family: 'Fjalla One', Helvetica, Arial, Lucida, sans-serif !important;
font-size: 16px !important;
color: #061D29 !important;
cursor: pointer !important;
box-sizing: border-box !important;
}
/* ===== PASTILLE BLEUE ===== */
.agenda-filt__field::after {
content: "" !important;
position: absolute !important;
top: 0 !important;
right: 0 !important;
width: 48px !important;
height: 100% !important;
background: #004c78 !important;
pointer-events: none !important;
}
/* ===== ICONES (base) ===== */
.agenda-filt__icon {
position: absolute !important;
top: 50% !important;
right: 14px !important;
transform: translateY(-50%) !important;
width: 22px !important;
height: 22px !important;
z-index: 3 !important;
background-repeat: no-repeat !important;
background-size: contain !important;
}
/* ====================================
ICON CALENDRIER
==================================== */
/* Le bouton calendrier doit occuper tout le carré bleu */
.agenda-filt--agenda .agenda-filt__field--date .agenda-filt__icon--calendar{
position: absolute !important;
top: 0 !important;
right: 0 !important;
width: 48px !important;
height: 48px !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
padding: 0 !important;
margin: 0 !important;
background: transparent !important;
border: none !important;
cursor: pointer !important;
z-index: 10 !important;
transform: none !important; /* ✅ enlève le translateY */
}
/* SVG parfaitement centré */
.agenda-filt--agenda .agenda-filt__field--date .agenda-filt__icon--calendar svg{
width: 22px !important;
height: 22px !important;
display: block !important;
margin: 0 !important;
padding: 0 !important;
position: static !important;
transform: none !important;
}
/* ✅ Empêcher Divi de casser la taille */
.et_pb_module button.agenda-filt__icon,
button.agenda-filt__icon {
width: auto !important;
height: auto !important;
min-width: 0 !important;
min-height: 0 !important;
}
/* ========= Masquer l’icône native Chrome/Safari/Edge ========= */
.agenda-filt__field input[type="date"]::-webkit-calendar-picker-indicator {
opacity: 0 !important;
width: 0 !important;
height: 0 !important;
margin: 0 !important;
padding: 0 !important;
cursor: pointer !important;
display: none !important;
}
/* ========= Internet Explorer (legacy, au cas où) ========= */
.agenda-filt__field input[type="date"]::-ms-clear,
.agenda-filt__field input[type="date"]::-ms-expand {
display: none !important;
}
/* Icône chevron (DECO — NON FONCTIONNEL) */
.agenda-filt__icon--chevron {
width: 16px !important;
height: 16px !important;
right: 16px !important;
top: 50% !important;
background-repeat: no-repeat !important;
background-size: contain !important;
pointer-events: none !important;
background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2220%22%20height%3D%2212%22%20viewBox%3D%220%200%2020%2012%22%20fill%3D%22none%22%3E%3Cpath%20d%3D%22M19%201L10%2010L1%200.999999%22%20stroke%3D%22white%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%2F%3E%3C%2Fsvg%3E") !important;
}
/* ===== SELECT ===== */
.agenda-filt__field select {
appearance: none !important;
-webkit-appearance: none !important;
-moz-appearance: none !important;
}
/* ===== BOUTONS FILTRER et EFFACER ===== */
/* ✅ PAGE AGENDA : ACTIONS (alignement des boutons) */
.agenda-filt--agenda .agenda-filt__actions{
display: flex !important;
align-items: center !important;
gap: 16px !important;
}
/* ✅ PAGE AGENDA : boutons Filtrer + Effacer identiques */
.agenda-filt--agenda .agenda-filt__submit,
.agenda-filt--agenda .agenda-filt__reset{
height: 48px !important;
padding: 0 28px !important;
font-family: 'Fjalla One', Helvetica, Arial, Lucida, sans-serif !important;
font-size: 16px !important;
font-weight: 400 !important;
background-color: #004c78 !important;
color: #fff !important;
border: none !important;
border-radius: 0 !important;
box-shadow: none !important;
cursor: pointer !important;
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
line-height: 48px !important; /* ✅ empêche l’écrasement */
white-space: nowrap !important;
appearance: none !important;
-webkit-appearance: none !important;
}
/* ✅ Hover bleu clair */
.agenda-filt--agenda .agenda-filt__submit:hover,
.agenda-filt--agenda .agenda-filt__reset:hover{
background-color: #73B4DA !important;
color: #fff !important;
}
/* Boutons */
.agenda-filt--agenda .agenda-filt__actions{
display:flex !important;
justify-content:flex-start !important;
align-items:center !important;
gap:12px !important;
}
.agenda-filt--agenda .agenda-filt__submit,
.agenda-filt--agenda .agenda-filt__reset{
width:auto !important;
}
/* ====== DESKTOP INTERMEDIAIRE (1440 -> 1200) ====== */
@media (max-width: 1440px) and (min-width: 1200px) {
.agenda-feed-grid {
max-width: 1252px !important;
margin-left: auto !important;
margin-right: auto !important;
grid-template-columns: repeat(4, 1fr) !important;
gap: 20px !important;
}
}
/* ====== DESKTOP INTERMEDIAIRE (1200 -> tablette) ====== */
@media (max-width: 1200px) and (min-width: 992px) {
.agenda-feed-grid {
max-width: 98% !important;
margin-left: auto !important;
margin-right: auto !important;
grid-template-columns: repeat(4, 1fr) !important;
gap: 16px !important;
}
}
/* TABLETTE (2 colonnes) */
@media (max-width: 991px) {
.agenda-feed-grid {
grid-template-columns: repeat(2, 1fr) !important;
gap: 20px !important;
}
}
/* ============================
MOBILE (max-width 768px)
============================ */
@media (max-width: 768px) {
/* 1 colonne */
.agenda-feed-grid {
grid-template-columns: 1fr !important;
}
/* Pagination */
.agenda-pagination{
gap: 6px !important;
margin-top: 20px !important;
}
.pag-numbers{
gap: 6px !important;
}
.pag-number{
width: 34px !important;
height: 34px !important;
font-size: 14px !important;
}
.pag-arrow{
width: 34px !important;
height: 34px !important;
}
.pag-arrow span{
width: 18px !important;
height: 18px !important;
}
.pag-dash{
width: 14px !important;
}
/* La barre de filtres passe en colonne */
.agenda-filt {
flex-direction: column !important;
align-items: stretch !important;
gap: 8px !important; /* espace entre tous les éléments */
}
/* Le conteneur qui regroupe les champs */
.agenda-filt__row {
flex-direction: column !important;
width: 100% !important;
gap: 8px !important;
}
/* Chaque champ prend toute la largeur */
.agenda-filt__field {
width: 100% !important;
}
/* Le bouton filtrer prend toute la largeur */
.agenda-filt__submit {
width: 100% !important;
}
}
/* ====================================
Shortcode : [agenda_feed_home] Feed event home
==================================== */
.agenda-feed-grid-home {
display: grid !important;
grid-template-columns: repeat(2, 1fr) !important;
gap: 16px !important;
align-items: stretch !important;
}
/* ✅ Dès 1680px : 24px */
@media (min-width: 1680px) {
.agenda-feed-grid-home {
gap: 24px !important;
}
}
@media (min-width: 1920px) {
.agenda-feed-grid-home {
gap: 40px !important;
}
}
.agenda-feed-grid-home .agenda-feed-item {
height: 100% !important;
min-height: 270px !important;
max-width: 100% !important;
margin: 0 !important;
}
.agenda-feed-grid-home .agenda-feed-item__diocese-icon{
z-index: 3 !important;
}
/* ==========================
PC : décalage visuel sans margin %
========================== */
@media (min-width: 992px) {
/* On garde les cartes plus étroites */
.agenda-feed-grid-home .agenda-feed-item {
width: 100% !important;
max-width: 90% !important;
}
/* Ligne 1 : pousse légèrement vers la gauche */
.agenda-feed-grid-home .agenda-feed-item:nth-child(1),
.agenda-feed-grid-home .agenda-feed-item:nth-child(2) {
justify-self: start !important;
transform: translateX(-8%) !important; /* ✅ décalage propre */
}
/* Ligne 2 : pousse légèrement vers la droite */
.agenda-feed-grid-home .agenda-feed-item:nth-child(3),
.agenda-feed-grid-home .agenda-feed-item:nth-child(4) {
justify-self: end !important;
transform: translateX(8%) !important; /* ✅ décalage propre */
}
}
/* Tablette : on annule tout */
@media (max-width: 991px) and (min-width: 768px) {
.agenda-feed-grid-home .agenda-feed-item {
justify-self: stretch !important;
max-width: 100% !important;
transform: none !important;
}
}
/* Mobile : slider */
@media (max-width: 767px) {
.agenda-feed-grid-home {
display: flex !important;
overflow-x: auto !important;
gap: 16px !important;
scroll-snap-type: x mandatory !important;
}
.agenda-feed-grid-home .agenda-feed-item {
min-width: 80% !important;
scroll-snap-align: start !important;
transform: none !important;
max-width: 100% !important;
margin: 0 !important;
}
.agenda-feed-grid-home .agenda-feed-item:last-child {
margin-right: 32px !important;
}
}
/* ====================================
Shortcode : [agenda_feed_home_filt] Feed event home
==================================== */
/* FILTRE HOME — toujours en colonne (PC, TAB, MOB) */
.agenda-filt--home {
display: flex !important;
flex-direction: column !important;
align-items: stretch !important;
gap: 12px !important;
width: 100% !important;
}
.agenda-filt--home .agenda-filt__row {
display: flex !important;
flex-direction: column !important;
gap: 12px !important;
width: 100% !important;
}
.agenda-filt--home .agenda-filt__field {
position: relative !important;
width: 100% !important;
}
/* Le carré bleu à droite */
.agenda-filt--home .agenda-filt__field::after {
content: "" !important;
position: absolute !important;
top: 0 !important;
right: 0 !important;
width: 48px !important;
height: 100% !important;
background: #004c78 !important;
pointer-events: none !important;
}
/* Icône générique (centrée verticalement) */
.agenda-filt--home .agenda-filt__icon {
position: absolute !important;
top: 50% !important;
transform: translateY(-50%) !important;
z-index: 5 !important;
background-repeat: no-repeat !important;
background-size: contain !important;
background-position: center !important;
}
/* Chevron (déco) */
.agenda-filt--home .agenda-filt__icon--chevron {
right: 16px !important;
width: 16px !important;
height: 16px !important;
pointer-events: none !important;
background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2220%22%20height%3D%2212%22%20viewBox%3D%220%200%2020%2012%22%20fill%3D%22none%22%3E%3Cpath%20d%3D%22M19%201L10%2010L1%200.999999%22%20stroke%3D%22white%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%2F%3E%3C%2Fsvg%3E") !important;
}
/* ====================================
BOUTON CALENDRIER (HOME)
=================================== */
.agenda-filt--home .agenda-filt__field--date .agenda-filt__icon--calendar{
position: absolute !important;
top: 0 !important;
right: 0 !important;
width: 48px !important;
height: 48px !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
padding: 0 !important;
margin: 0 !important;
background: transparent !important;
border: none !important;
cursor: pointer !important;
z-index: 10 !important;
transform: none !important;
}
/* SVG bien centré */
.agenda-filt--home .agenda-filt__field--date .agenda-filt__icon--calendar svg{
width: 22px !important;
height: 22px !important;
display: block !important;
margin: 0 !important;
padding: 0 !important;
transform: none !important;
position: static !important;
}
/* ====================================
BOUTON HOME
=================================== */
/* Bouton effacer (sans fond) */
.agenda-filt__reset{
background: transparent !important;
border: none !important;
padding: 0 !important;
cursor: pointer !important;
font-family: 'Fjalla One', Helvetica, Arial, Lucida, sans-serif !important;
font-size: 16px !important;
font-weight: 400 !important;
line-height: 130% !important;
letter-spacing: 0.16px !important;
color: #004C77 !important; /* bleu foncé */
}
/* Hover */
.agenda-filt__reset:hover{
color: #fff !important;
}
.agenda-filt__actions{
display: flex !important;
align-items: center !important;
gap: 16px !important;
}
.agenda-filt--home .agenda-filt__submit{
height: 48px !important;
padding: 0 28px !important;
font-family: 'Fjalla One', Helvetica, Arial, Lucida, sans-serif !important;
font-size: 16px !important;
background-color: #004c78 !important; /* bleu foncé */
color: #fff !important; /* texte blanc */
border: none !important;
cursor: pointer !important;
transition: all 0.2s ease !important;
}
/* ✅ HOME hover : fond blanc + texte bleu foncé */
.agenda-filt--home .agenda-filt__submit:hover{
background-color: #fff !important;
color: #004c78 !important;
}
/* ==========================
Shortcode : [find_church] recherche de paroisses par code postal avec carte
========================== */
/* LAYOUT 2 COLONNES */
.find-church-wrapper {
display: flex !important;
width: 100% !important;
}
.find-church-left {
width: 35% !important;
display: flex !important;
flex-direction: column !important;
gap: 0px !important;
height: 75vh !important; /* même hauteur que la carte */
overflow-y: auto !important; /* scroll vertical */
overflow-x: hidden !important; /* pas de scroll horizontal */
scrollbar-width: none !important; /* Firefox : masque la scrollbar */
min-height: 0 !important; /* indispensable pour permettre au scroll de fonctionner dans un flex */
}
/* colonne gauche scrollable */
.find-church-left::-webkit-scrollbar {
display: none !important; /* Chrome/Safari : masque la scrollbar */
}
.find-church-right {
width: 65% !important;
}
#find-church-map {
width: 100% !important;
height: 75vh !important;
overflow: hidden !important;
}
/* HEADER GAUCHE */
.find-church-header {
background: #004C77 !important;
padding: 48px 40px !important;
color: white !important;
}
.find-church-header h1 {
margin-top: 0 !important;
font-family: 'Fjalla One', Helvetica, Arial, Lucida, sans-serif !important;
font-size: 40px !important;
font-style: normal !important;
font-weight: 400 !important;
line-height: 130% !important;
color: var(--White, #FFF) !important;
}
.find-church-header p {
margin: 10px 0 20px !important;
color: var(--Gray, #F0F2F6) !important;
font-family: Rubik !important;
font-size: 18px !important;
font-style: normal !important;
font-weight: 400 !important;
line-height: 130% !important;
}
/* BARRE DE RECHERCHE */
.find-church-search {
display: flex !important;
width: 100% !important;
}
.find-church-search input {
flex: 1 !important;
padding: 12px 15px !important;
border: none !important;
background: #fff !important; /* fond sombre */
color: rgba(6, 29, 41, 0.80) !important;
font-family: 'Fjalla One', Helvetica, Arial, Lucida, sans-serif !important;
font-size: 16px !important;
font-style: normal !important;
font-weight: 400 !important;
line-height: 130% !important; /* 20.8px */
letter-spacing: 0.16px !important;
}
.find-church-search input::placeholder {
color: rgba(6, 29, 41, 0.80) !important;
}
.find-church-search button {
background: #73B4DA !important;
border: none !important;
padding: 12px 15px !important;
cursor: pointer !important;
color: white !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
}
.find-church-search button:hover {
background: #004C77 !important;
color: #004C77 !important;
}
.find-church-search button:hover i {
color: #fff !important;
}
.find-church-search button i {
font-size: 18px !important;
}
/* ==========================
LISTE DES RÉSULTATS
========================== */
.find-church-results {
list-style: none !important;
padding: 0 !important;
margin: 0 !important;
}
.church-item {
list-style: none !important;
border-bottom: 1px solid rgba(179, 202, 215, 0.3) !important; /* #B3CAD7 avec 30% d’opacité */
padding-bottom: 20px !important;
padding-right: 110px !important;
}
.find-church-results li {
list-style: none !important;
padding: 32px !important;
}
.find-church-results a {
color: #004C77 !important;
font-weight: 600 !important;
text-decoration: none !important;
transition: 0.2s !important;
}
.find-church-results a:hover {
color: #73B4DA !important;
}
/* Titre */
.church-title,
.church-title a {
color: var(--Blue-dark, #004C77) !important;
font-family: 'Fjalla One', Helvetica, Arial, Lucida, sans-serif !important;
font-size: 18px !important;
font-style: normal !important;
font-weight: 400 !important;
line-height: 130% !important;
text-decoration: none !important;
}
/* Bloc adresse */
.church-address {
display: flex !important;
align-items: center !important;
gap: 5px !important;
position: relative !important;
}
.church-address .address-icon {
display: flex !important;
align-items: center !important;
justify-content: center !important;
flex-shrink: 0 !important; /* empêche l'icône de se réduire */
margin-top: -3px !important; /* léger ajustement visuel */
}
.church-address .address-lines {
display: flex !important;
flex-direction: column !important;
line-height: 1.3 !important;
}
.address-line-1 {
font-weight: 400 !important;
color: var(--Blue-dark, #004C77) !important;
font-family: Rubik !important;
font-size: 16px !important;
font-style: normal !important;
font-weight: 400 !important;
line-height: 120% !important;
letter-spacing: 0.08px !important;
}
.address-line-2 {
font-weight: 400 !important;
opacity: 0.8 !important;
color: var(--Blue-dark, #004C77) !important;
/* body medium */
font-family: Rubik !important;
font-size: 16px !important;
font-style: normal !important;
font-weight: 400 !important;
line-height: 120% !important;
letter-spacing: 0.08px !important;
}
/* Phone */
.church-phone {
display: flex !important;
align-items: center !important;
gap: 10px !important;
margin-top: -6px !important;
}
.church-phone a {
color: inherit !important;
text-decoration: none !important;
color: var(--Blue-dark, #004C77) !important;
/* body medium */
font-family: Rubik !important;
font-size: 16px !important;
font-style: normal !important;
font-weight: 400 !important;
line-height: 120% !important;
letter-spacing: 0.08px !important;
}
.church-phone a:hover {
text-decoration: none !important;
}
/* Style des boutons d’action (Itinéraire, Site internet, Horaires) */
.btn-action {
color: var(--Blue-dark, #004C77) !important;
font-family: 'Fjalla One', Helvetica, Arial, Lucida, sans-serif !important;
font-size: 16px !important;
font-style: normal !important;
font-weight: 400 !important; /* enlève le gras */
line-height: 130% !important;
letter-spacing: 0.16px !important;
text-decoration: none !important;
display: inline-flex !important;
align-items: center !important;
gap: 6px !important; /* espace entre texte et flèche */
}
/* Effet hover */
.btn-action:hover {
text-decoration: underline !important;
}
/* Icône flèche */
.btn-action .arrow svg {
display: block !important;
}
.btn-action {
margin-right: 16px !important;
margin-top: 16px !important;
}
.btn-action:last-child {
margin-right: 0 !important;
}
/* Le bloc résultat doit permettre le positionnement absolu */
.church-item {
position: relative !important;
}
/* Bloc latéral */
.view-card {
position: absolute !important;
right: 0 !important;
top: 0 !important;
width: 100px !important;
height: 100% !important;
background: #EBA961 !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
opacity: 0 !important; /* caché par défaut */
pointer-events: none !important; /* non cliquable tant qu’il est invisible */
transition: opacity 0.25s ease !important;
}
/* Texte dans le bloc */
.view-card a {
color: #FFFFFF !important;
text-decoration: none !important;
text-align: center !important;
/* Btn */
font-family: 'Fjalla One', Helvetica, Arial, Lucida, sans-serif !important;
font-size: 16px !important;
font-style: normal !important;
font-weight: 400 !important;
line-height: 130% !important; /* 20.8px */
letter-spacing: 0.16px !important;
}
.view-card a:hover {
color: #FFFFFF !important;
text-decoration: underline !important;
}
/* Apparition au hover */
.church-item:hover .view-card {
opacity: 1 !important;
pointer-events: auto !important; /* devient cliquable */
}
/* ==========================
MAP
========================== */
/* CLUSTERS */
.church-cluster {
background: transparent !important;
border: none !important;
}
/* Curseur différent selon le type de lieu */
.find-church-pin {
cursor: pointer;
}
.find-church-pin--disabled {
cursor: default;
}
/* Wrapper global centré */
.cluster-wrapper {
position: relative !important;
width: 72px !important;
height: 72px !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
}
/* Grand cercle bleu clair (outer) */
.cluster-bg-outer {
position: absolute !important;
width: 72px !important;
height: 72px !important;
background: rgba(115, 180, 218, 0.5) !important;
border-radius: 50% !important;
top: 0 !important;
left: 0 !important;
}
/* Petit cercle bleu foncé (inner) */
.cluster-bg-inner {
position: absolute !important;
width: 56px !important;
height: 56px !important;
background: #73B4DA !important;
border-radius: 50% !important;
top: 50% !important;
left: 50% !important;
transform: translate(-50%, -50%) !important;
}
/* Texte du nombre */
.cluster-count {
position: absolute !important;
top: 50% !important;
left: 50% !important;
transform: translate(-50%, -50%) !important;
color: #FFF !important;
font-family: 'Fjalla One', Helvetica, Arial, Lucida, sans-serif !important;
font-size: 18px !important;
font-weight: 400 !important;
line-height: 130% !important;
z-index: 2 !important;
}
#find-church-map {
filter: sepia(0.2) contrast(1.1) brightness(1.05) !important;
}
/* ================================ TABLETTE : 40% / 60% (de 768px à 1023px) ================================ */
@media (max-width: 1023px) and (min-width: 768px) {
.find-church-wrapper {
display: flex !important;
flex-direction: row !important;
}
.find-church-left {
width: 40% !important;
}
.find-church-right {
width: 60% !important;
}
}
/* ================================ MOBILE : tout en colonne ordre = recherche -> carte -> résultats ================================ */
@media (max-width: 767px) {
.find-church-wrapper {
display: flex !important;
flex-direction: column !important;
gap: 0px !important;
}
.find-church-left,
.find-church-right {
width: 100% !important;
}
/* Supprimer toute hauteur fixe éventuelle */
#find-church-map {
height: 350px !important; /* hauteur mobile confortable */
}
.find-church-left { order: 1 !important; }
.find-church-right { order: 2 !important; }
/* HEADER GAUCHE */
.find-church-header {
padding: 24px 20px !important;
}
.find-church-header h1 {
font-size: 24px !important;
}
.find-church-header p {
font-size: 15px !important;
}
/* LISTE DES RÉSULTATS */
.find-church-results li {
list-style: none !important;
padding: 20px !important;
}
/* Titre */
.church-title a {
font-size: 16px !important;
}
/* Bloc adresse */
.address-line-1 {
font-size: 14px !important;
}
.address-line-2 {
font-size: 14px !important;
}
/* Phone */
.church-phone a {
font-size: 14px !important;
}
/* Style des boutons d’action (Itinéraire, Site internet, Horaires) */
.btn-action {
font-size: 14px !important;
}
/* Bloc latéral */
.view-card {
width: 60px !important;
}
/* Texte dans le bloc */
.view-card a {
font-size: 14px !important;
}
/* MAP */
/* Clusters */
/* Wrapper global centré */
.cluster-wrapper {
width: 56px !important;
height: 56px !important;
}
/* Grand cercle bleu clair (outer) */
.cluster-bg-outer {
width: 56px !important;
height: 56px !important;
}
/* Petit cercle bleu foncé (inner) */
.cluster-bg-inner {
width: 45px !important;
height: 45px !important;
}
/* Texte du nombre */
.cluster-count {
font-size: 16px !important;
}
}
/* === Tooltip Leaflet natif — pin église/paroisse === */
.church-leaflet-tooltip {
background: #C2544F !important;
border: none !important;
border-radius: 0 !important;
box-shadow: none !important;
color: #fff !important;
font-family: 'Fjalla One', Helvetica, Arial, Lucida, sans-serif !important;
font-size: 15px !important;
line-height: 130% !important;
padding: 8px 12px !important;
white-space: nowrap !important;
}
/* Supprime la petite flèche Leaflet par défaut */
.church-leaflet-tooltip::before {
display: none !important;
}
/* ===============================
Shortcode : [sev_event_header]
================================= */
.sev-event-date-wrapper{
width:100%!important;
}
.sev-event-date{
color:var(--Bleu-light,#73B4DA)!important;
font-family:'Fjalla One',Helvetica,Arial,Lucida,sans-serif!important;
font-size:32px!important;
font-weight:400!important;
line-height:130%!important;
}
/* ===============================
MOBILE
=============================== */
@media (max-width:768px){
.sev-event-date{
font-size:20px!important;
line-height:130%!important;
}
}
/* ==========================
Shortcode : [sev_event_meta]
========================== */
.sev-event-row{
display:flex!important;
gap:40px!important;
align-items:flex-start!important;
flex-wrap:wrap!important;
}
.sev-event-item{
display:flex!important;
align-items:flex-start!important;
gap:16px!important;
flex:1 1 0!important;
min-width:0!important;
}
.sev-event-icon{
flex:0 0 auto!important;
}
.sev-event-text{
color:#FFF!important;
font-family:Rubik,Helvetica,Arial,Lucida,sans-serif!important;
font-size:16px!important;
font-weight:400!important;
line-height:120%!important;
letter-spacing:0.08px!important;
white-space:normal!important;
word-break:normal!important;
overflow-wrap:normal!important;
}
/* TABLETTE */
@media (max-width:980px){
.sev-event-item{
flex:1 1 45%!important;
}
.sev-event-item:last-child{
flex:1 1 100%!important;
}
}
/* MOBILE */
@media (max-width:600px){
.sev-event-row{
flex-direction:column!important;
gap:20px!important;
}
.sev-event-item{
flex:1 1 100%!important;
}
}
/* =================================================
PAROISSE [sev_paroisse_infos]
================================================= */
.sev-paroisse-row{
display:flex!important;
flex-wrap:nowrap!important;
gap:40px!important;
align-items:center!important;
justify-content:flex-start!important;
}
.sev-paroisse-item{
display:flex!important;
align-items:center!important;
gap:12px!important;
flex:0 1 auto!important;
}
.sev-paroisse-btn-wrap{
margin-left:auto!important;
display:flex!important;
align-items:center!important;
}
.sev-paroisse-icon{
flex:0 0 auto!important;
display:flex!important;
align-items:flex-start!important;
}
.sev-paroisse-text{
color:#FFF!important;
font-family:'Rubik',Helvetica,Arial,Lucida,sans-serif!important;
font-size:14px!important;
font-weight:400!important;
line-height:120%!important;
letter-spacing:0.08px!important;
white-space:normal!important;
word-break:normal!important;
overflow-wrap:normal!important;
}
/* === BOUTON SITE INTERNET === */
.sev-paroisse-btn{
display:flex!important;
height:50px!important;
padding:0 20px!important;
align-items:center!important;
justify-content:center!important;
background:#FFF!important;
color:#061D29!important;
text-decoration:none!important;
font-family:'Rubik',Helvetica,Arial,Lucida,sans-serif!important;
font-size:14px!important;
font-weight:500!important;
transition:all 0.25s ease!important;
}
.sev-paroisse-btn:hover{
background:#73B4DA!important;
color:#FFF!important;
}
/* ============== RESPONSIVE ============= */
@media (max-width:980px){
.sev-event-row{
gap:30px!important;
}
.sev-paroisse-row{
gap:30px!important;
}
.sev-paroisse-item{
flex:1 1 45%!important;
align-items:flex-start !important;
}
.sev-paroisse-btn-wrap{
flex:1 1 100%!important;
}
.sev-paroisse-text{
display:block !important;
width:100% !important;
flex:1 1 auto !important;
text-align:left !important;
}
}
@media (max-width:600px){
.sev-event-row{
flex-direction:column!important;
gap:20px!important;
}
.sev-paroisse-row{
flex-direction:column!important;
gap:20px!important;
}
.sev-paroisse-item{
flex:1 1 100%!important;
}
}
/* ==========================
Shortcode : [sev_lieux_de_culte]
========================== */
.sev-lieux-wrapper{
display:flex!important;
flex-direction:column!important;
gap:32px!important;
}
.sev-lieu-item{
display:flex!important;
flex-direction:column!important;
gap:8px!important;
}
.sev-lieu-titre{
color:var(--Blue-dark,#004C77)!important;
font-family:'Fjalla One',Helvetica,Arial,Lucida,sans-serif!important;
font-size:24px!important;
font-weight:400!important;
line-height:130%!important;
}
.sev-lieu-adresse,
.sev-lieu-horaires{
color:var(--Blue-dark,#004C77)!important;
font-family:Rubik,Helvetica,Arial,Lucida,sans-serif!important;
font-size:16px!important;
font-weight:400!important;
line-height:120%!important;
letter-spacing:0.08px!important;
}
/* ==========================
Shortcode : [churches_search_cp] champ de recherche par code postal (Church)
========================== */
.church-search-form {
display: flex !important;
align-items: center !important;
justify-content: center !important;
margin: 40px auto !important;
max-width: 550px !important;
width: 100% !important;
gap: 0 !important;
position: relative !important;
}
/* Champ de recherche */
.church-search-input {
flex: 1 !important;
height: 61px !important;
background: #FFF !important;
border: none !important;
padding-left: 20px !important;
font-family: 'Fjalla One', Helvetica, Arial, Lucida, sans-serif !important;
font-size: 16px !important;
font-weight: 400 !important;
line-height: 130% !important;
letter-spacing: 0.16px !important;
color: rgba(6, 29, 41, 0.80) !important;
}
.church-search-input::placeholder {
color: rgba(6, 29, 41, 0.50) !important;
}
/* Bouton loupe */
.church-search-button {
width: 61px !important;
height: 61px !important;
background: #73B4DA !important;
color: white !important;
border: none !important;
padding: 12px 15px !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
cursor: pointer !important;
transition: background-color 0.2s ease !important;
}
/* Icône loupe */
.church-search-button svg {
width: 24px !important;
height: 24px !important;
stroke: #FFF !important;
}
.church-search-button:hover {
background: #004C77 !important;
color: #004C77 !important;
}
.church-search-button:hover i {
color: #fff !important;
}
/* Message de retour */
.church-search-message {
width: 100% !important;
margin-top: 10px !important;
text-align: center !important;
color: #fff !important;
font-family: 'Fjalla One', Helvetica, Arial, Lucida, sans-serif !important;
font-size: 15px !important;
text-align: center !important;
display: none !important; /* affiché en JS */
}
/* ================================ MOBILE : largeur 90% ================================ */
@media (max-width: 768px) {
.church-search-form {
max-width: 90% !important;
margin: 25px auto !important;
}
/* Champ de recherche */
.church-search-input {
font-size: 14px !important;
}
/* Message de retour */
.church-search-message {
font-size: 12px !important;
}
}
/* ==========================
Shortcode : [list-ouvrage] et [list-ressource] edito
========================== */
/* --- Grille 4 colonnes --- */
.list-ouvrages {
display: grid !important;
grid-template-columns: repeat(4, 1fr) !important;
gap: 19px !important;
}
/* --- Bloc ouvrage --- */
.ouvrage-item {
display: flex !important;
flex-direction: column !important;
height: 100% !important;
}
/* --- Image wrapper avec cadre, padding, centrage --- */
.ouvrage-image {
display: flex !important;
justify-content: center !important;
align-items: center !important;
padding: 20px !important;
border: 1px solid #73B4DA !important;
background: #FFF !important;
height: 200px !important; /* hauteur fixe pour harmoniser */
box-sizing: border-box !important;
}
/* L’image ne doit JAMAIS être coupée ou déformée */
.ouvrage-image img {
max-width: 100% !important;
max-height: 100% !important;
height: auto !important;
width: auto !important;
object-fit: contain !important; /* ne déforme pas / ne coupe pas */
}
/* Effet hover sur le bloc image */
.ouvrage-image img {
transition: transform 0.3s ease !important;
}
.ouvrage-item:hover .ouvrage-image img {
transform: scale(1.05) !important;
}
/* --- Titre --- */
.ouvrage-title {
margin-top: 12px !important;
margin-bottom: 12px !important;
}
.ouvrage-title a {
color: #004C77 !important;
font-family: Rubik, sans-serif !important;
font-size: 18px !important;
font-style: normal !important;
font-weight: 400 !important;
line-height: 130% !important;
text-decoration: none !important;
}
/* --- Meta : auteur / source / année --- */
.ouvrage-meta p {
color: #004C77 !important;
font-family: Rubik, sans-serif !important;
font-size: 14px !important;
font-style: normal !important;
font-weight: 400 !important;
line-height: 120% !important;
letter-spacing: 0.2px !important;
margin-top: -8px !important;
margin-bottom: Opx !important;
padding-top: 0px !important;
padding-bottom: Opx !important;
}
/* --- Bouton Voir l’ouvrage --- */
.btn-ouvrage {
display: inline-flex !important;
align-items: center !important;
gap: 8px !important;
margin-top: auto !important;
text-decoration: none !important;
color: #004C77 !important;
font-family: 'Fjalla One', Helvetica, Arial, Lucida, sans-serif !important;
font-size: 16px !important;
font-weight: 400 !important;
line-height: 130% !important;
letter-spacing: 0.16px !important;
}
/* icône après le texte */
.btn-ouvrage::after {
content: "" !important;
width: 8px !important;
height: 13px !important;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='13' viewBox='0 0 8 13' fill='none'%3E%3Cpath d='M1 1L6 6.5L1 12' stroke='%23EBA961' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") !important;
background-size: contain !important;
background-repeat: no-repeat !important;
display: inline-block !important;
margin-top: 16px !important;
margin-bottom: 16px !important;
}
.btn-ouvrage {
transition: text-decoration 0.2s ease !important;
}
.btn-ouvrage:hover {
text-decoration: underline !important;
}
.btn-ouvrage:hover::after {
transform: translateX(2px) !important;
transition: transform 0.2s ease !important;
}
/* ==========================
Responsive : mobile & tablette
========================== */
/* En dessous de 1024px : passage en slider horizontal */
@media (max-width: 1024px) {
.list-ouvrages {
display: flex !important;
overflow-x: auto !important;
scroll-snap-type: x mandatory !important;
gap: 16px !important;
padding-bottom: 10px !important;
-webkit-overflow-scrolling: touch !important;
}
/* Masque la scrollbar (selon navigateurs) */
.list-ouvrages::-webkit-scrollbar {
display: none !important;
}
/* 1 carte visible + un morceau de la suivante */
.ouvrage-item {
flex: 0 0 80% !important; /* ← Ajuste la largeur selon la maquette */
scroll-snap-align: start !important;
}
/* Une marge à droite après le dernier élément */
.list-ouvrages::after {
content: "" !important;
flex: 0 0 20px !important; /* marge finale après le dernier ouvrage */
}
/* Hauteur image → un peu plus haute sur mobile */
.ouvrage-image {
height: 220px !important;
}
}
/* Version smartphone ( < 768px ) */
@media (max-width: 768px) {
.ouvrage-item {
flex: 0 0 85% !important; /* encore plus centré */
}
.list-ouvrages::after {
flex: 0 0 20px !important;
}
.ouvrage-image {
height: 200px !important;
}
}
/* ==========================
Services diocésains
========================== */
/* Bloc image homogène */
.wpgb-card .wpgb-card-media {
position: relative !important;
overflow: hidden !important;
background: #fff;
padding-top: 56.25% !important;
}
/* Image toujours visible sans rognage */
.wpgb-card .wpgb-card-media img {
width: auto !important;
height: auto !important;
max-width: 100% !important;
max-height: 100% !important;
object-fit: contain !important;
object-position: center center !important;
transition: transform 0.15s ease-out !important;
}
/* Zoom doux */
.wpgb-card .wpgb-card-media:hover img {
transform: scale(1) !important;
}
/* On force la zone contenu en flex */
.wpgb-card .wpgb-card-content {
display: flex !important;
flex-direction: column !important;
flex: 1 1 auto !important;
}
/* Contenu = prend la place disponible */
.wpgb-card .wpgb-card-content {
flex: 1 1 auto !important;
display: flex !important;
flex-direction: column !important;
}
/* Titre flexible */
.wpgb-card .wpgb-card-title {
flex: 0 0 auto !important;
display: flex !important;
align-items: flex-start !important;
}
.wp-grid-builder .wpgb-card-42 .wpgb-block-3:hover,
.wp-grid-builder .wpgb-card-44 .wpgb-block-3:hover {
color: #004C77 !important;
}
.wp-grid-builder .wpgb-card-44 .wpgb-card-body,
.wp-grid-builder .wpgb-card-44 .wpgb-card-footer {
background-color: transparent !important;
padding-top: 0 !important;
}
/* Footer collé en bas */
.wpgb-card .wpgb-card-footer,
.wpgb-card a.wpgb-card-read-more {
margin-top: auto !important;
}
/* Conteneur du footer */
.wpgb-card .service-footer-align {
margin-top: auto !important;
}
/* --- Forcer la mise en page du footer --- */
.wpgb-card-footer {
display: flex !important;
justify-content: space-between !important; /* texte à gauche / icône à droite */
align-items: center !important;
margin-top: auto !important; /* pousse le footer en bas de la carte */
width: 100% !important;
padding-top: 8px !important;
}
/* Styliser le texte "Voir plus" */
.wpgb-card-footer .wpgb-block p,
.wpgb-card-footer .wpgb-block a {
font-family: 'Fjalla One', Helvetica, Arial, Lucida, sans-serif !important;
font-size: 16px !important;
color: #004C77 !important;
margin: 0 !important;
text-decoration: none !important;
}
.wpgb-card-footer .wpgb-block a:hover {
text-decoration: underline !important;
}
/* --- Icône toujours collée à droite --- */
.wpgb-card-footer svg {
width: 18px !important;
height: auto !important;
flex-shrink: 0 !important; /* empêche l’icone de bouger */
margin-left: 6px !important;
margin-right: 4px !important;
}
/* Responsive */
/* <= 1024px : 3 colonnes */
@media (max-width: 1024px) {
.wpgb-card .wpgb-card-media {
height: 308px !important;
}
}
/* <= 768px : 2 colonnes */
@media (max-width: 768px) {
.wpgb-card .wpgb-card-media {
height: 150px !important;
}
}
/* ---------------------------------------
CONTENEUR PRINCIPAL DE LA PAGINATION
---------------------------------------- */
.wpgb-facet-10,
.wpgb-facet-19 {
display: flex !important;
justify-content: center !important;
width: 100% !important;
margin: 70px 0 40px 0 !important;
text-align: center !important;
}
/* UL pagination */
.wpgb-facet-10 ul.wpgb-pagination,
.wpgb-facet-19 ul.wpgb-pagination,
.seva-comm-pagination {
display: flex !important;
justify-content: center !important;
align-items: center !important;
flex-wrap:wrap !important;
padding: 0 !important;
margin: 0 auto !important;
list-style: none !important;
width: auto !important;
}
.seva-comm-pagination {
gap: 16px;
padding-top: 70px !important;
}
/* =====================
NUMÉROS DE PAGE
===================== */
.wpgb-facet-10 ul.wpgb-pagination li.wpgb-page a,
.wpgb-facet-19 ul.wpgb-pagination li.wpgb-page a,
.seva-comm-pagination .page-numbers {
display:flex !important;
align-items:center !important;
justify-content:center !important;
border:none !important;
padding: 0 !important;
margin: 0 !important;
color:#004C77 !important;
text-decoration:none !important;
cursor:pointer !important;
box-shadow:none !important;
width:42px !important;
height:42px !important;
}
/* ===== PAGE ACTIVE — CORRECTION FINALE ===== */
.wpgb-facet-10 ul.wpgb-pagination li a[aria-current="true"],
.wpgb-facet-19 ul.wpgb-pagination li a[aria-current="true"],
.seva-comm-pagination .current {
background-color: #004C77 !important;
color: #ffffff !important;
font-weight: 500 !important; /* supprime le gras */
text-decoration: none !important;
}
/* Hover numéros */
.wpgb-facet-10 ul.wpgb-pagination li.wpgb-page:not(.wpgb-active) a:hover,
.seva-comm-pagination .page-numbers:hover {
background:#004C77 !important;
background-color:#004C77 !important;
color:#ffffff !important;
opacity:1 !important;
}
/* =====================
BOUTONS PREV / NEXT
===================== */
.wpgb-facet-10 ul.wpgb-pagination li.wpgb-page-prev a,
.wpgb-facet-10 ul.wpgb-pagination li.wpgb-page-next a,
.seva-comm-pagination .prev,
.seva-comm-pagination .next {
display: flex !important;
justify-content: center !important;
align-items: center !important;
width: 42px !important;
height: 42px !important;
border-radius: 0 !important;
background: #F0F2F6 !important;
font-size: 0 !important; /* cache le texte Prev / Next */
text-decoration: none !important;
transition: background-color 0.3s ease !important;
}
.jobs-feed .wpgb-facet-10 ul.wpgb-pagination li.wpgb-page-prev a {
background: #fff !important;
}
/* NEXT – état normal */
.wpgb-facet-10 ul.wpgb-pagination li.wpgb-page-next a,
.seva-comm-pagination .next {
background-color: #73B4DA !important;
}
/* Hover PREV / NEXT */
.wpgb-facet-10 ul.wpgb-pagination li.wpgb-page-prev a:hover,
.seva-comm-pagination .prev:hover {
background: #004C77 !important;
}
.wpgb-facet-10 ul.wpgb-pagination li.wpgb-page-next a:hover,
.seva-comm-pagination .next:hover {
background: #004C77 !important;
}
.seva-comm-pagination .dots:hover {
background: none !important;
color: #004C77 !important;
cursor: default !important;
pointer-events: none !important;
}
/* PREV hover – flèche blanche */
.wpgb-facet-10 ul.wpgb-pagination li.wpgb-page-prev a:hover::before,
.seva-comm-pagination .prev:hover::before {
background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNyIgaGVpZ2h0PSIyMCIgdmlld0JveD0iMCAwIDI3IDIwIiBmaWxsPSJub25lIj4KPHBhdGggZD0iTTEwLjQxNDEgMUwxLjQxNDA2IDEwTDEwLjQxNDEgMTkiIHN0cm9rZT0id2hpdGUiIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIi8+CjxwYXRoIGQ9Ik0yNS40MTQxIDEwQzI0LjEzNDEgMTAgMTQuMjE0MSAxMCA5LjQxNDA2IDEwIiBzdHJva2U9IndoaXRlIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIvPgo8L3N2Zz4=");
}
/* Icône PREV */
.wpgb-facet-10 ul.wpgb-pagination li.wpgb-page-prev a::before,
.seva-comm-pagination .prev::before {
content: "" !important;
width: 27px !important;
height: 20px !important;
display: block !important;
background-repeat: no-repeat !important;
background-size: contain !important;
background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNyIgaGVpZ2h0PSIyMCIgdmlld0JveD0iMCAwIDI3IDIwIiBmaWxsPSJub25lIj4KPHBhdGggZD0iTTEwLjQxNDEgMUwxLjQxNDA2IDEwTDEwLjQxNDEgMTkiIHN0cm9rZT0iIzczQjREQSIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiLz4KPHBhdGggZD0iTTI1LjQxNDEgMTBDMjQuMTM0MSAxMCAxNC4yMTQxIDEwIDkuNDE0MDYgMTAiIHN0cm9rZT0iIzczQjREQSIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiLz4KPC9zdmc+");
}
/* Icône NEXT */
.wpgb-facet-10 ul.wpgb-pagination li.wpgb-page-next a::before,
.seva-comm-pagination .next::before {
content: "" !important;
width: 24px !important;
height: 20px !important;
display: block !important;
background-repeat: no-repeat !important;
background-size: contain !important;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='27' height='20' viewBox='0 0 27 20' fill='none'%3E%3Cpath d='M16 1L25 10L16 19' stroke='white' stroke-width='2' stroke-linecap='round'/%3E%3Cpath d='M1 10C2.28 10 12.2 10 17 10' stroke='white' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E");
}
/* ============================
JOBS
============================ */
.jobs-feed-catline {
display: flex !important;
align-items: center !important;
gap: 8px !important;
width: 100% !important;
}
.jobs-feed-cat {
font-family: 'Fjalla One', Helvetica, Arial, Lucida, sans-serif !important;
font-size: 16px !important;
font-weight: 400 !important;
white-space: nowrap !important;
}
/* Séparateur */
.jobs-feed-item__meta-sep {
margin: 0 4px;
}
.jobs-feed-item__excerpt {
max-height: 6.4em !important; /* 4 lignes x 1.4 */
overflow: hidden !important;
}
.jobs-feed-item__excerpt strong,
.jobs-feed-item__excerpt b,
.jobs-feed-item__excerpt em,
.jobs-feed-item__excerpt i {
font-weight: 300 !important;
font-style: normal !important;
}
/* ==========================
PAGES ACTUS / AGENDA / JOBS....
========================== */
/* ecrase style acf */
.et_post_meta_wrapper {
display: none !important;
}
.wp-singular .container{
padding: 0!important;
width: 100% !important;
max-width: unset !important;
}
/* tyle custom post */
.custom-col-tiers{
}
.custom-col-tiers > .et_pb_column:nth-child(1){
width: 63% !important;
margin-right:6% !important;
}
.custom-col-tiers > .et_pb_column:nth-child(2){
width: 30% !important;
}
.custom-flex-banner > div{
display: flex !important;
}
.custom-flex-banner .et_pb_module_header{
display: none !important;
}
/* ============================
PUCES CUSTOM - DIVI (safe) - uniquement dans le contenu
============================ */
/* On cible uniquement les listes dans les modules Divi */
.et_pb_text ul,
.et_pb_post_content ul,
.et_pb_blurb_description ul,
.et_pb_tab_content ul {
list-style: none !important;
padding-left: 0 !important;
margin-left: 0 !important;
}
/* Chaque item = puce custom */
.et_pb_text ul li,
.et_pb_post_content ul li,
.et_pb_blurb_description ul li,
.et_pb_tab_content ul li {
position: relative !important;
padding-left: 22px !important;
}
/* SVG en puce */
.et_pb_text ul li::before,
.et_pb_post_content ul li::before,
.et_pb_blurb_description ul li::before,
.et_pb_tab_content ul li::before {
content: "" !important;
position: absolute !important;
left: 0 !important;
top: 0.35em !important; /* ajuste l’alignement vertical */
width: 14px !important;
height: 11px !important;
background-repeat: no-repeat !important;
background-size: contain !important;
background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2214%22%20height%3D%2211%22%20viewBox%3D%220%200%2014%2011%22%20fill%3D%22none%22%3E%3Cpath%20d%3D%22M0.0382505%204.86781C0.696836%204.69823%201.4871%203.7533%202.48555%202.55769C3.13849%201.76713%204.68113%20-0.0793221%207.2602%200.00254987C8.78656%200.04808%209.80769%200.820466%2010.0825%201.05157C11.4709%202.23559%2012.0946%204.01552%2013.4117%205.24809C13.4119%205.27198%2013.4121%205.29586%2013.4075%205.31024C11.7921%206.5221%2010.9877%208.54207%209.17437%209.55544C7.36927%2010.4206%204.6978%2010.698%202.15855%207.10444C0.85993%205.27451%200.547294%205.08681%20-5.91714e-05%204.86345C0.00946352%204.85857%200.0285098%204.84881%200.0380325%204.84393%22%20fill%3D%22%23EBA961%22%2F%3E%3C%2Fsvg%3E") !important;
}
/* ==========================================
PUCE SVG dans les accordéons Divi
========================================== */
.et_pb_toggle_content ul{
list-style: none !important;
padding-left: 0 !important;
margin-left: 0 !important;
}
.et_pb_toggle_content ul li{
position: relative !important;
padding-left: 22px !important;
margin-bottom: 8px !important;
}
/* ✅ SVG en puce */
.et_pb_toggle_content ul li:before{
content: "" !important;
position: absolute !important;
left: 0 !important;
top: 6px !important;
width: 14px !important;
height: 11px !important;
background-repeat: no-repeat !important;
background-size: contain !important;
background-position: center !important;
background-image: url("data:image/svg+xml;utf8,") !important;
}
/* ==========================
Personnalisés l'icon du bouton Divi téléchargement / bouton Page éditio
========================== */
.download-btn:after{
content: "" !important;
display: inline-block !important;
width: 22px !important;
height: 22px !important;
margin-left: 10px !important;
vertical-align: middle !important;
background-repeat: no-repeat !important;
background-size: contain !important;
background-position: center !important;
/* ✅ IMPORTANT : pas de !important dans le data:image */
background-image: url("data:image/svg+xml;utf8,") !important;
}
/* ✅ Supprimer l’icône Divi si data-icon est activé */
a.et_pb_button.download-btn[data-icon]:after{
content: "" !important;
}
/* ==========================================
ACCORDEON DIVI — icône OK + titre open bleu + texte blanc
========================================== */
/* Le titre prend toute la largeur */
.et_pb_accordion .et_pb_toggle_title{
display: block !important;
width: 100% !important;
position: relative !important;
padding: 20px 70px 20px 25px !important; /* place l’icône à droite */
margin: 0 !important;
}
/* Ouvert : fond bleu UNIQUEMENT sur le titre */
.et_pb_accordion .et_pb_toggle_open .et_pb_toggle_title{
background: #004C77 !important;
}
/* Ouvert : texte blanc UNIQUEMENT sur le titre */
.et_pb_accordion .et_pb_toggle_open .et_pb_toggle_title,
.et_pb_accordion .et_pb_toggle_open .et_pb_toggle_title *{
color: #fff !important;
-webkit-text-fill-color: #fff !important;
}
/* Contenu : reste normal */
.et_pb_accordion .et_pb_toggle_content{
padding-left: 25px !important;
padding-right: 25px !important;
}
/* ✅ Accordéon : pas d'espace en plus entre les items */
.et_pb_accordion_0 .et_pb_toggle{
margin-bottom: 0 !important; /* <= enlève l'écart */
}
/* Base icône */
.et_pb_accordion .et_pb_toggle_title:before{
font-family: "ETmodules" !important;
font-size: 22px !important;
line-height: 22px !important;
position: absolute !important;
right: 18px !important;
top: 50% !important;
transform: translateY(-50%) !important;
margin-top: 1px !important; /* ✅ descend un poil = plus centré */
display: block !important;
pointer-events: none !important;
}
/* ✅ fermé = + */
.et_pb_accordion .et_pb_toggle_close .et_pb_toggle_title:before{
content: "\4c" !important;
}
/* ✅ ouvert = - */
.et_pb_accordion .et_pb_toggle_open .et_pb_toggle_title:before{
content: "\4b" !important;
color:#EBA961 !important;
}
/* ==========================
BOUTONS DANS ACCORDEON (Divi)
========================== */
/* Bouton normal */
.et_pb_accordion .et_pb_button,
.et_pb_accordion a.et_pb_button {
background-color: #EBA961 !important;
color: #ffffff !important;
padding: 15px 22px !important;
border: none !important;
border-radius: 0 !important;
font-family: 'Fjalla One', Helvetica, Arial, Lucida, sans-serif !important;
font-size: 16px !important;
display: inline-block !important;
transition: all 0.25s ease !important;
}
/* Hover */
.et_pb_accordion .et_pb_button:hover,
.et_pb_accordion a.et_pb_button:hover {
background-color: #73B4DA !important;
color: #ffffff !important;
padding-left: 28px !important; /* petit effet slide */
}
/* Supprime l’icône automatique Divi si besoin */
.et_pb_accordion a.et_pb_button:after {
display: none !important;
}
/* ==========================
Fix margin-bottom accordéon Divi (tous contextes)
========================== */
.et_pb_accordion .et_pb_toggle,
.et_pb_accordion_item,
.et_pb_module.et_pb_accordion {
margin-bottom: 0 !important;
}
/* Neutralise le margin-bottom générique Divi sur les modules dans les colonnes 3/4 */
.et_pb_column.et_pb_column_3_4 > .et_pb_row_inner > .et_pb_gutters3
.et_pb_column_3_4 > .et_pb_row_inner > .et_pb_column_4_4
.et_pb_module.et_pb_accordion {
margin-bottom: 0 !important;
}
/* ==========================
TEXT ON IMG
========================== */
.dih_img_wrapper.mdn-malin .dih_content_wrapper:before {
position: absolute !important;
bottom: 0 !important;
left: 0 !important;
width: 100% !important;
height: 100% !important;
background-color: var(--background-color) !important;
background: #004C77 !important;
background: linear-gradient(180deg, rgba(0, 76, 119, 0.00) 70%, rgba(0, 76, 119, 0.70) 100%) !important;
content: "" !important;
-webkit-transform: translate3d(0, 10px, 0) !important;
transform: translate3d(0, 10px, 0) !important;
}
/* ==========================
MULTI-COLONNES
========================== */
@media only screen and (max-width: 980px) {
.multi-colonnes .et_pb_column {
width: 50% !important;
}
}
@media only screen and (max-width: 479px) {
.multi-colonnes .et_pb_column {
width: 50% !important;
}
}
/*place button modules next to each other in the same column*/
.pa-inline-buttons .et_pb_button_module_wrapper {
display: inline-block !important;
}
/* ==========================
BREADCRUMBS SPECIAUX
========================== */
.breadcrumb-custom {
font-family: Rubik !important;
font-size: 14px !important;
color: #fff !important;
}
.breadcrumb-custom a {
color: #fff !important;
text-decoration: none !important;
}
.breadcrumb-custom a:hover {
text-decoration: underline !important;
}
.breadcrumb-custom .sep {
margin: 0 8px !important;
color: #EBA961 !important;
}
.breadcrumb-custom .current {
color: #EBA961 !important;
}
/* =========================================
BLURB VIDEO (image + titre dessous) : Classe Divi : seva-video-card
========================================= */
.seva-video-card{
position:relative !important;
}
/* WRAP IMAGE */
.seva-video-card .et_pb_image_wrap{
position:relative !important;
display:block !important;
overflow:hidden !important;
}
/* IMAGE ZOOM */
.seva-video-card .et_pb_image_wrap img{
display:block !important;
width:100% !important;
height:auto !important;
transition:transform .6s ease !important;
}
.seva-video-card:hover .et_pb_image_wrap img{
transform:scale(1.08) !important;
}
/* OVERLAY FILTRE */
.seva-video-card .et_pb_image_wrap:before{
content:"" !important;
position:absolute !important;
inset:0 !important;
background:rgba(0,76,119,0.20) !important;
z-index:2 !important;
transition:background .35s ease !important;
}
.seva-video-card:hover .et_pb_image_wrap:before{
background:rgba(0,76,119,0.50) !important;
}
/* DESACTIVE LE ROND CSS (CONFLIT AVEC UI JS) */
.seva-video-card .et_pb_image_wrap:after{
content:none !important;
display:none !important;
}
/* UI INJECTEE */
.seva-video-card .seva-video-ui{
position:absolute !important;
inset:0 !important;
z-index:10 !important;
pointer-events:none !important;
}
/* ICON CENTRE */
.seva-video-card .seva-video-ui .seva-video-icon{
position:absolute !important;
top:50% !important;
left:50% !important;
width:56px !important;
height:56px !important;
border-radius:28px !important;
display:flex !important;
align-items:center !important;
justify-content:center !important;
transform:translate(-50%,-50%) !important;
background:#004C77 !important;
z-index:10 !important;
opacity:1 !important;
transition:background-color .25s ease !important;
}
.seva-video-card:hover .seva-video-ui .seva-video-icon{
background:#fff !important;
}
/* SVG ICON */
.seva-video-card .seva-video-ui .seva-video-icon svg{
width:22px !important;
height:22px !important;
display:block !important;
}
/* SWAP NORMAL/HOVER */
.seva-video-card .seva-video-ui .seva-video-icon .icon-normal{
display:block !important;
}
.seva-video-card .seva-video-ui .seva-video-icon .icon-hover{
display:none !important;
}
.seva-video-card:hover .seva-video-ui .seva-video-icon .icon-normal{
display:none !important;
}
.seva-video-card:hover .seva-video-ui .seva-video-icon .icon-hover{
display:block !important;
}
/* BOUTON LIRE LA VIDEO */
.seva-video-card .more-link-video{
position:absolute !important;
bottom:24px !important;
left:24px !important;
font-family:'Fjalla One', Helvetica, Arial, Lucida, sans-serif !important;
font-size:16px !important;
font-weight:400 !important;
line-height:130% !important;
letter-spacing:0.16px !important;
color:#fff !important;
text-decoration:underline !important;
opacity:0 !important;
transition:opacity .35s ease !important;
z-index:11 !important;
pointer-events:auto !important;
}
.seva-video-card:hover .more-link-video{
opacity:1 !important;
}
/* FLECHE BAS DROITE */
.seva-video-card .arrow-video{
position:absolute !important;
bottom:24px !important;
right:24px !important;
width:27px !important;
height:20px !important;
opacity:0 !important;
transform:translateY(5px) !important;
transition:opacity .3s ease,transform .3s ease !important;
z-index:11 !important;
}
.seva-video-card:hover .arrow-video{
opacity:1 !important;
transform:translateY(0) !important;
}
.seva-video-card .arrow-video svg{
width:27px !important;
height:20px !important;
display:block !important;
}
/* Ajustement optique du triangle dans le rond */
.seva-video-card .seva-video-ui .seva-video-icon svg{
transform: translateX(1px) translateY(0px) !important;
}
/* =========================
blurb-ressource - pages ressources
========================= */
/* =========================
CADRE IMAGE FIXE
========================= */
.blurb-ressource .et_pb_main_blurb_image{
height:190px;
border:1px solid #73B4DA;
background:#fff;
display:flex;
align-items:center;
justify-content:center;
margin-bottom:20px !important;
line-height:0;
}
/* =========================
WRAPPER INTERNE AVEC PADDING
========================= */
.blurb-ressource .et_pb_main_blurb_image .et_pb_image_wrap{
padding:15px;
box-sizing:border-box;
width:100%;
height:100%;
display:flex;
align-items:center;
justify-content:center;
}
/* =========================
IMAGE
========================= */
.blurb-ressource .et_pb_main_blurb_image img{
max-width:100% !important;
max-height:100% !important;
width:auto !important;
height:auto !important;
object-fit:contain !important;
display:block;
}
/* =========================
RESPONSIVE
========================= */
/* Tablette */
@media (max-width: 1024px){
.blurb-ressource .et_pb_main_blurb_image{
height: 140px;
}
.blurb-ressource .et_pb_main_blurb_image .et_pb_image_wrap{
padding: 16px;
}
}
/* Mobile */
@media (max-width: 768px){
.blurb-ressource .et_pb_main_blurb_image{
height: 120px;
}
.blurb-ressource .et_pb_main_blurb_image .et_pb_image_wrap{
padding: 12px;
}
}
/* Force la hauteur fixe du cadre même si Divi surcharge */
.et_pb_module.blurb-ressource .et_pb_main_blurb_image,
div.blurb-ressource .et_pb_main_blurb_image {
height: 190px !important;
min-height: 190px !important;
max-height: 190px !important;
overflow: hidden !important;
border: 1px solid #73B4DA !important;
background: #fff !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
margin-bottom: 20px !important;
line-height: 0 !important;
box-sizing: border-box !important;
}
/* Wrapper interne */
.et_pb_module.blurb-ressource .et_pb_main_blurb_image .et_pb_image_wrap,
div.blurb-ressource .et_pb_main_blurb_image .et_pb_image_wrap {
padding: 15px !important;
box-sizing: border-box !important;
width: 100% !important;
height: 100% !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
flex-shrink: 0 !important;
}
/* Image contenue dans le cadre */
.et_pb_module.blurb-ressource .et_pb_main_blurb_image img,
div.blurb-ressource .et_pb_main_blurb_image img {
max-width: 100% !important;
max-height: 160px !important; /* 190px - 2x15px padding */
width: auto !important;
height: auto !important;
object-fit: contain !important;
display: block !important;
flex-shrink: 0 !important;
}
/* Tablette */
@media (max-width: 1024px) {
.et_pb_module.blurb-ressource .et_pb_main_blurb_image {
height: 140px !important;
min-height: 140px !important;
max-height: 140px !important;
}
.et_pb_module.blurb-ressource .et_pb_main_blurb_image img {
max-height: 108px !important;
}
}
/* Mobile */
@media (max-width: 768px) {
.et_pb_module.blurb-ressource .et_pb_main_blurb_image {
height: 120px !important;
min-height: 120px !important;
max-height: 120px !important;
}
.et_pb_module.blurb-ressource .et_pb_main_blurb_image img {
max-height: 90px !important;
}
}
/* =========================
Shortcode : [seva-event-lien] et [seva-actus-lien] lien vers paroisses, services diocesains etc
========================= */
/* === STRUCTURE EVENTS === */
/* conteneur des 3 events */
.seva-events-row{
display:grid !important;
grid-template-columns:repeat(3,1fr) !important;
align-items:stretch !important;
width:100% !important;
border-top:1px solid rgba(0,76,119,0.30) !important;
border-bottom:1px solid rgba(0,76,119,0.30) !important;
background:#fff !important;
margin-top:-25px !important;
position:relative !important;
z-index:2 !important;
}
.titre-events{
position:relative !important;
z-index:1 !important;
}
/* colonnes */
.seva-event-col{
display:flex !important;
padding:0px !important;
background:#fff !important;
height:100% !important;
}
.seva-event-white-wrap{
background:#fff !important;
padding:40px !important;
width:100% !important;
height:100% !important;
}
.seva-event-grey-wrap{
background:#F0F2F6 !important;
padding:55px !important;
width:100% !important;
height:100% !important;
}
.seva-event-grey-wrap{
display:flex !important;
justify-content:center !important;
}
/* séparateurs verticaux */
.seva-event-col:not(:last-child){
border-right:1px solid rgba(0,76,119,0.30) !important;
}
/* cadre blanc */
.seva-event-white-wrap{
background:#fff !important;
padding:37px !important;
width:100% !important;
}
/* cadre gris */
.seva-event-grey-wrap{
background:#F0F2F6 !important;
padding:37px !important;
width:100% !important;
}
/* vignette */
.seva-event-grey-wrap .agenda-feed-item{
background:#fff !important;
width:100% !important;
max-width:none !important;
margin:0 !important;
min-height:auto !important;
height:100% !important;
display:flex !important;
flex-direction:column !important;
padding:24px !important;
padding-bottom:28px !important;
}
/* responsive tablette */
@media (max-width:980px){
.seva-events-row{
grid-template-columns:repeat(3,1fr) !important;
margin-top:-22px !important;
}
.seva-event-white-wrap{
padding:25px !important;
}
.seva-event-grey-wrap{
padding:25px !important;
}
/* supprime l'espace au-dessus du shortcode */
.bloc-event-lien .et_pb_code,
.bloc-event-lien .et_pb_code_inner{
padding:0px !important;
margin:0px !important;
}
.bloc-event-lien .et_pb_row,
.bloc-actus-lien .et_pb_row{
padding-top:0 !important;
padding-bottom:0 !important;
}
}
/* responsive mobile */
@media (max-width:767px){
.seva-events-row{
grid-template-columns:1fr !important;
margin-top:-22px !important;
}
.seva-event-white-wrap{
padding:0px !important;
}
.seva-event-grey-wrap{
padding:24px !important;
}
/* supprimer lignes verticales */
.seva-event-col{
border-right:none !important;
border-bottom:1px solid rgba(0,76,119,0.30) !important;
}
.seva-event-col:last-child{
border-bottom:none !important;
}
/* dernier event pas de bordure */
.seva-event-col:last-child{
border-bottom:none !important;
}
/* supprime l'espace au-dessus du shortcode */
.bloc-event-lien .et_pb_code,
.bloc-event-lien .et_pb_code_inner{
padding:0px !important;
margin:0px !important;
}
.bloc-event-lien .et_pb_row,
.bloc-actus-lien .et_pb_row{
padding-top:0 !important;
padding-bottom:0 !important;
}
}
/* === STRUCTURE ACTUS === */
/* conteneur des 3 actus */
.seva-actus-row{
display:grid !important;
grid-template-columns:repeat(3,1fr) !important;
align-items:stretch !important;
width:100% !important;
border-top:1px solid rgba(0,76,119,0.30) !important;
border-bottom:1px solid rgba(0,76,119,0.30) !important;
background:#fff !important;
margin-top:-25px !important;
position:relative !important;
z-index:2 !important;
}
.titre-actus{
position:relative !important;
z-index:1 !important;
}
/* colonnes */
.seva-actu-col{
display:flex !important;
padding:0px !important;
background:#fff !important;
height:100% !important;
}
/* séparateurs verticaux */
.seva-actu-col:not(:last-child){
border-right:1px solid rgba(0,76,119,0.30) !important;
}
/* cadre blanc */
.seva-actu-white-wrap{
background:#fff !important;
padding:37px !important;
width:100% !important;
height:100% !important;
}
/* cadre gris */
.seva-actu-grey-wrap{
background:#F0F2F6 !important;
padding:37px !important;
width:100% !important;
height:100% !important;
display:flex !important;
justify-content:center !important;
}
/* carte actu */
.seva-actu-card{
background:#F0F2F6 !important;
width:100% !important;
height:100% !important;
display:flex !important;
flex-direction:column !important;
}
/* image */
.seva-actu-thumb{
display:block !important;
height:200px !important;
background-size:cover !important;
background-position:center !important;
background-repeat:no-repeat !important;
position:relative !important;
overflow:hidden !important;
}
/* hover overlay */
.seva-actu-thumb::before{
content:"" !important;
position:absolute !important;
inset:0 !important;
background:rgba(0,0,0,.35) !important;
opacity:0 !important;
transition:.3s !important;
}
.seva-actu-thumb:hover::before{
opacity:1 !important;
}
/* bouton lire */
.seva-actu-thumb::after{
content:"Lire l’article" !important;
position:absolute !important;
left:16px !important;
bottom:16px !important;
color:#fff !important;
font-size:14px !important;
text-decoration:underline !important;
opacity:0 !important;
transform:translateY(8px) !important;
transition:.3s !important;
}
.seva-actu-thumb:hover::after{
opacity:1 !important;
transform:translateY(0) !important;
}
/* flèche */
.seva-actu-arrow{
position:absolute !important;
right:16px !important;
bottom:16px !important;
width:27px !important;
height:20px !important;
background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='27' height='20' viewBox='0 0 27 20' fill='none'%3E%3Cpath d='M16 1L25 10L16 19' stroke='white' stroke-width='2' stroke-linecap='round'/%3E%3Cpath d='M1 10H24' stroke='white' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") !important;
background-repeat:no-repeat !important;
background-size:contain !important;
opacity:0 !important;
transform:translateY(8px) !important;
transition:all .3s ease !important;
}
.seva-actu-thumb:hover .seva-actu-arrow{
opacity:1 !important;
transform:translateY(0) !important;
}
/* meta */
.seva-actu-meta{
padding-top:12px !important;
display:flex !important;
flex-direction:column !important;
gap:4px !important;
}
/* date */
.seva-actu-date{
color:#004C77 !important;
font-size:12px !important;
font-weight:500 !important;
}
/* titre */
.seva-actu-title{
font-size:18px !important;
font-style:normal !important;
font-weight:400 !important;
line-height:130% !important;
color:#061D29 !important;
margin:0 !important;
font-family: 'Rubik',Helvetica,Arial,Lucida,sans-serif !important;
}
/* ========== RESPONSIVE TABLETTE ======= */
@media (max-width:980px){
.seva-actus-row{
grid-template-columns:repeat(3,1fr) !important;
margin-top:-22px !important;
}
.seva-actu-white-wrap{
padding:25px !important;
}
.seva-actu-grey-wrap{
padding:25px !important;
}
.bloc-actus-lien .et_pb_code,
.bloc-actus-lien .et_pb_code_inner{
padding:0px !important;
margin:0px !important;
}
.seva-actu-title{
font-size:17px !important;
}
}
/* =========== RESPONSIVE MOBILE ========== */
@media (max-width:767px){
.seva-actus-row{
grid-template-columns:1fr !important;
margin-top:-22px !important;
}
.seva-actu-white-wrap{
padding:0px !important;
}
.seva-actu-grey-wrap{
padding:24px !important;
}
/* supprimer lignes verticales */
.seva-actu-col{
border-right:none !important;
border-bottom:1px solid rgba(0,76,119,0.30) !important;
}
.seva-actu-col:last-child{
border-bottom:none !important;
}
.bloc-actus-lien .et_pb_code,
.bloc-actus-lien .et_pb_code_inner{
padding:0px !important;
margin:0px !important;
}
.seva-actu-title{
font-size:15px !important;
}
}
/* =========================
Shortcodes :
[seva-prochains-events]
[seva-dernieres-actus]
========================= */
/* espace blanc plus grand en bas */
.seva-prochains-events .seva-event-white-wrap,
.seva-dernieres-actus .seva-actu-white-wrap{
padding-bottom:80px !important;
}
/* =========================
seva-popup POPUP manuel Seva-Divi
========================= */
/* Show/hide the popup overlay wrapper when "is-visible" class changes, apply the CSS to frontend only */
body:not(.et-fb) .seva-popup-wrapper {
position: fixed;
z-index: 99999999 !important; /* ← doit être > header */
top: 0;
right: 0;
bottom: 0;
left: 0;
transition: all .5s cubic-bezier(.14,.06,.41,1.39);
opacity: 1;
visibility: hidden;
}
body:not(.et-fb) .seva-popup-wrapper.popup-is-visible {
opacity:1;
visibility:visible;
z-index: 999999999 !important;
}
/* Allow the content inside the popup wrapper to scroll */
.seva-popup-inside {
height:100%;
overflow-y: scroll;
}
/* Prevent Body from Scrolling when Popup is visible */
body.seva-noscroll {
overflow: hidden;
}
/* Center Align Popup Content inside the Section */
.seva-popup-content {
display:flex;
flex-direction:column;
justify-content: center;
}
.seva-popup-content .et_pb_row {
margin-top:0;
margin-bottom:0;
}
/* Adjust the position of the popup overlay for admin bar */
@media (min-width:600px) and (max-width:782px) {
body:not(.et-fb).admin-bar .seva-popup-wrapper {
top:46px;
}
}
@media (min-width:783px) {
body:not(.et-fb).admin-bar .seva-popup-wrapper {
top:32px;
}
}
/* Mave the popup on top of other elements */
.et_builder_inner_content.popup-is-visible {
z-index:99999999999999999999;
}
/* Add a hand cursor to the close trigger element */
.seva-popup-close {
cursor:pointer;
}
/* état normal */
.seva-popup-content .et_pb_row{
transform:scale(.85);
opacity:0;
transition:all .35s cubic-bezier(.22,.61,.36,1);
}
/* ouverture popup */
.seva-popup-wrapper.popup-is-visible .et_pb_row{
transform:scale(1);
opacity:1;
}
/* animation fermeture popup */
.seva-popup-wrapper.popup-is-closing .et_pb_row{
animation: seva-scale-out .35s ease forwards;
}
@keyframes seva-scale-out{
0%{
transform:scale(1);
opacity:1;
}
100%{
transform:scale(.9);
opacity:0;
}
}
.seva-popup-wrapper.popup-is-visible {
backdrop-filter: blur(6px);
}
/* =========================
seva-popup POPUP manuel Seva-Divi
========================= */
.sevanova-newsletter-form{
display:flex !important;
max-width:420px !important;
}
.sevanova-newsletter-form input{
flex:1 !important;
padding:14px !important;
border:1px solid #F0F2F6 !important;
background-color: #F0F2F6 !important;
border-right:none !important;
border-radius:0 !important;
font-family: 'Fjalla One', Helvetica, Arial, Lucida, sans-serif !important;
font-size:16px !important;
font-style:normal !important;
font-weight:400 !important;
line-height:130% !important;
letter-spacing:0.16px !important;
color:rgba(6, 29, 41, 0.80) !important;
}
.sevanova-newsletter-form input::placeholder{
font-family: 'Fjalla One', Helvetica, Arial, Lucida, sans-serif !important;
font-size:16px !important;
font-style:normal !important;
font-weight:400 !important;
line-height:130% !important;
letter-spacing:0.16px !important;
color:rgba(6, 29, 41, 0.80) !important;
}
.newsletter-submit{
width:61px !important;
height:61px !important;
display:flex !important;
align-items:center !important;
justify-content:center !important;
background:#73B4DA !important;
border:none !important;
border-radius:0 !important;
cursor:pointer !important;
}
.newsletter-submit svg{
width:24px !important;
height:auto !important;
}
.newsletter-submit:hover{
background:#004C77 !important;
}
/* =========================
Correction probleme d'alignement des boutons Divis
========================= */
.et_pb_button_module_wrapper{
text-align:left !important;
}
.et_pb_button_module_wrapper:has(.btn-center){
text-align:center !important;
}
.et_pb_button.btn-center{
margin-left:0 !important;
margin-right:auto !important;
display:inline-block !important;
}
/* ==========================
Titre tourné actus / events...
========================== */
.news-banner, .church-banner, .event-banner, .jobs-banner, .serv-banner, .comm-banner, .mouv-banner, .sanctu-banner, .communique-banner {
width: 100% !important;
background: #004C77 !important;
min-height: 530px !important;
position: relative !important;
}
.communique-banner p, .comm-banner p, .event-banner p, .serv-banner p, .jobs-banner p, .news-banner p, .church-banner p, .sanctu-banner p, .mouv-banner p {
/* H2 */
font-family: 'Fjalla One', Helvetica, Arial, Lucida, sans-serif !important;
font-size: 56px !important;
font-style: normal !important;
font-weight: 400 !important;
line-height: 130% !important;
transform: rotate(-90deg) !important;
position: absolute !important;
white-space: nowrap !important;
}
.communique-banner p, .event-banner p, .serv-banner p, .jobs-banner p, .news-banner p, .church-banner p, .sanctu-banner p, .mouv-banner p {
color: white !important;
}
.event-banner p {
bottom: 110px !important;
padding-bottom: 0px !important;
padding-right: 40px !important;
}
.serv-banner p {
bottom: 110px !important;
padding-bottom: 0px !important;
padding-right: 30px !important;
}
.jobs-banner p {
bottom: 100px !important;
padding-bottom: 0px !important;
padding-right: 80px !important;
}
.news-banner p, .church-banner p {
bottom: 100px !important;
}
.communique-banner p {
bottom: 120px !important;
padding-bottom: 80px !important;
}
.mouv-banner p {
bottom: 120px !important;
padding-bottom: 40px !important;
padding-right: 0px !important;
}
.sanctu-banner p {
bottom: 100px !important;
padding-bottom: 50px !important;
}
.comm-banner p {
bottom: 120px !important;
padding-bottom: 90px !important;
color: #004C77 !important;
}
.news-banner{background: #EBA961 !important;}
.communique-banner{background: #597d91 !important;}
.church-banner{background: #C2544F !important;}
.event-banner, .sanctu-banner{background: #73b4da !important;}
.jobs-banner{background: #60609B !important;}
.serv-banner{background: #046755 !important;}
.mouv-banner{background: #B74888 !important;}
.comm-banner{background: #B3CAD7 !important;}
.sanctu-banner{background: #6CAE75 !important;}
/* Aligne le bas des colonnes sur la ligne */
.align-bottom-row.et_pb_row {
display: flex !important;
align-items: flex-end !important;
}
/* Chaque colonne s'étire correctement */
.align-bottom-row .et_pb_column {
display: flex !important;
flex-direction: column !important;
justify-content: flex-end !important;
}
/* Complianz footer */
.cmplz-button {
display: inline-block !important;
}
.cmplz-show-banner {
color: #fff !important;
font-family: 'Rubik',Helvetica,Arial,Lucida,sans-serif !important;
font-weight: 300;
font-size: 14px;
letter-spacing: 0.2px;
line-height: 120%;
@media (max-width:767px){
font-size: 12px;
}
}