/* ===========================
   Search (page résultats) — propre & scoped
   =========================== */

/* Conteneur centré */
#main-content .search-results {
  max-width: 1100px;
  margin: 0 auto;
}

/* Carte : [vignette] | [titre+description] | [extraits] */
#main-content .search-results .resource{
  display: grid !important;
  grid-template-columns: 150px 1fr 1fr !important;
  gap: 16px !important;
  align-items: start !important;
  padding: 12px !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 12px !important;
  background: #fff !important;
  margin: 12px 0 !important;
}

/* Vignette (colonne 1) */
#main-content .search-results .resource > img,
#main-content .search-results .resource .thumbnail img,
#main-content .search-results .resource .media img{
  grid-column: 1 !important;
  width: 150px !important;
  height: 200px !important;
  object-fit: cover !important;
  border-radius: 8px !important;
}

/* Titre (colonne 2→3) : un SEUL cadre vert clair, pas de ruban du thème */
#main-content .search-results .resource > h4{
  grid-column: 2 / 4 !important;
  margin: .1rem 0 .5rem !important;
  font-size: 1.08rem !important;
  line-height: 1.25 !important;
  display: inline-block !important;

  /* cadre vert clair */
  background: #69D876 !important;
  color: #0f172a !important; /* mets #fff si tu préfères */
  padding: .45rem .9rem !important;
  border-radius: 10px !important;
  box-shadow: none !important;
}
/* Neutralise les décos du thème */
#main-content .search-results .resource > h4::before,
#main-content .search-results .resource > h4::after{
  display: none !important; content:"" !important;
}
/* Lien du titre sans second fond */
#main-content .search-results .resource > h4 > a{
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
  border-radius: 0 !important;
  color: inherit !important;
  text-decoration: none !important;
}
#main-content .search-results .resource > h4 > a:hover{
  text-decoration: underline !important;
}

/* Description (colonne 2) */
#main-content .search-results .resource > .description{
  grid-column: 2 !important;
  color: #4b5563 !important;
  font-size: .95rem !important;
  line-height: 1.5 !important;
}

/* Extraits / highlights (colonne 3) */
#main-content .search-results .resource > .search-highlights-section{
  grid-column: 3 !important;
  align-self: flex-start !important;
  background: #f9fafb !important;
  border: 1px solid #eef0f2 !important;
  border-radius: 10px !important;
  padding: 10px !important;
  color: #374151 !important;
  font-size: .95rem !important;
  line-height: 1.45 !important;
  max-height: none !important;  /* complet */
  overflow: visible !important;
}
#main-content .search-highlights-section-comment{
  display: block; font-size: .9rem; color:#6b7280; margin-bottom:.4rem;
}
#main-content ul.search-highlights{ list-style:none; margin:0; padding:0; }
#main-content li.search-highlight{ margin:.25rem 0; }
#main-content li.search-highlight q{ display:block; color:#374151; line-height:1.45; }

/* Surlignage */
#main-content .search-results mark,
#main-content .search-results em{
  background:#ffec80 !important;
  font-style:normal !important;
  padding:0 .12em !important;
  border-radius:2px !important;
}

/* Responsive */
@media (max-width: 980px){
  #main-content .search-results .resource{
    grid-template-columns: 150px 1fr !important;
  }
  #main-content .search-results .resource > .search-highlights-section{
    grid-column: 1 / -1 !important; /* en dessous, pleine largeur */
  }
}
@media (max-width: 640px){
  #main-content .search-results .resource{
    grid-template-columns: 1fr !important;
  }
  #main-content .search-results .resource > img{
    width: 100% !important; height: 200px !important;
  }
}
/* ==== Patch d'agencement sur 2 lignes ==== */
#main-content .search-results .resource{
  grid-template-columns: 150px 1fr 1fr !important;
  grid-auto-rows: auto !important;
  align-items: start !important;
}

/* Titre = ligne 1, sur toutes les colonnes */
#main-content .search-results .resource > h4{
  grid-column: 1 / -1 !important;   /* colonnes 1 à 3 */
  grid-row: 1 !important;           /* première ligne */
  margin-bottom: .6rem !important;
}

/* Image = ligne 2, colonne 1 */
#main-content .search-results .resource > img,
#main-content .search-results .resource .thumbnail img,
#main-content .search-results .resource .media img{
  grid-column: 1 !important;
  grid-row: 2 !important;
  float: none !important;            /* neutralise un éventuel float du thème */
}

/* Description = ligne 2, colonne 2 */
#main-content .search-results .resource > .description{
  grid-column: 2 !important;
  grid-row: 2 !important;
}

/* Extraits = ligne 2, colonne 3 */
#main-content .search-results .resource > .search-highlights-section{
  grid-column: 3 !important;
  grid-row: 2 !important;
}
/* === Bandeau titre : taille au texte, centré, ne passe plus sous l'image === */
#main-content .search-results .resource > h4{
  grid-column: 1 / -1 !important;   /* titre sur la ligne 1 */
  grid-row: 1 !important;
  background: transparent !important;   /* plus de fond sur tout le h4 */
  padding: 0 !important;
  margin: 0 0 .75rem 0 !important;
  text-align: center;                    /* on centre le contenu */
}

#main-content .search-results .resource > h4 > a{
  display: inline-block !important;      /* le “pavé” vert épouse le texte */
  background: #69D876 !important;
  color: #0f172a !important;             /* ou #fff si tu préfères */
  border-radius: 10px !important;
  padding: .45rem .9rem !important;
  background-image: none !important;     /* neutralise effets du thème */
  box-shadow: none !important;
}

/* Centrer verticalement la vignette par rapport à la description */
#main-content .search-results .resource > img,
#main-content .search-results .resource .thumbnail,
#main-content .search-results .resource .media{
  align-self: center;       /* centre sur l'axe vertical de la rangée */
}

/* (optionnel) s'assure que l'image ne crée pas d'espace supplémentaire */
#main-content .search-results .resource .thumbnail img,
#main-content .search-results .resource .media img,
#main-content .search-results .resource > img{
  display: block;
}
/* Titre "Description :" au-dessus du texte */
#main-content .search-results .resource > .description:not(:empty)::before{
  content: "Description :";   /* NBSP avant les deux-points */
  display: block;
  font-weight: 700;
  margin-bottom: .35rem;
  color: #111827;             /* gris très foncé ; ajuste si besoin */
  font-size: .95rem;
}

/* (optionnel) légère séparation visuelle quand la description est longue */
#main-content .search-results .resource > .description{
  /* tu as déjà des règles ici ; on peut ajouter si désiré : */
  line-height: 1.5;
}
/* "Description :" — underlined and spaced down a bit */
#main-content .search-results .resource > .description:not(:empty)::before{
  content: "Description :";
  display: block;                 /* forces it on its own line */
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: .15em;   /* nicer underline offset */
  text-decoration-thickness: 1px; /* optional */
  margin: .5rem 0 .4rem;          /* TOP space ↓ then a bit below */
  color: #111827;
  font-size: .95rem;
}
/* =========================================
   Classy Search Result Card — POLISH PASS
   (safe overrides; paste after your current CSS)
   ========================================= */

/* Card: softer border, shadow, more room */
#main-content .search-results .resource{
  gap: 22px;
  padding: 18px 20px;
  border: 1px solid #e9eef3;
  border-radius: 16px;
  background: #ffffff;
  box-shadow: 0 8px 24px rgba(17,24,39,.06);
  transition: box-shadow .2s ease, transform .2s ease;
}
#main-content .search-results .resource:hover{
  box-shadow: 0 12px 30px rgba(17,24,39,.09);
  transform: translateY(-1px);
}

/* Thumbnail: framed & centered vertically */
#main-content .search-results .resource > img{
  width: 150px; height: 200px; object-fit: cover;
  border-radius: 12px;
  border: 1px solid #e6e9ef;
  box-shadow: 0 4px 14px rgba(17,24,39,.08);
  align-self: center;                 /* ← vertical centering */
}

/* Title pill: sleeker green, rounded, centered above text */
#main-content .search-results .resource > h4{
  align-self: start;
  justify-self: center;               /* centers the pill above the description column */
  background: linear-gradient(180deg,#69D876,#53cf67);
  color: #0a3818 !important;
  padding: .55rem 1rem !important;
  border-radius: 999px !important;
  box-shadow: 0 2px 8px rgba(16,185,129,.18);
  margin: 4px 0 10px;
}
#main-content .search-results .resource > h4 > a{
  color: inherit !important;          /* use the pill’s text color */
  text-decoration: none !important;
}

/* Description: a proper label with an underline rule */
#main-content .search-results .resource > .description{
  color: #1f2937;                     /* a touch darker for body text */
}
#main-content .search-results .resource > .description:not(:empty)::before{
  content: "Description";
  display: block;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .06em;
  font-size: .8rem;
  color: #0f172a;
  margin: .6rem 0 .5rem;              /* ↓ space from the pill */
  padding-bottom: .35rem;
  border-bottom: 2px solid #e6ecf2;   /* clean underline rule */
}

/* Highlight panel: airy + label chip */
#main-content .search-results .resource > .search-highlights-section{
  background: #f8fafc;
  border: 1px solid #e8eef5;
  border-radius: 14px;
  padding: 14px 16px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.7);
}
#main-content .search-highlights-section-comment{
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  background: #eef6ff;
  color: #0f3b82;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .04em;
  font-size: .72rem;
  padding: .25rem .5rem;
  border-radius: 999px;
  margin-bottom: .6rem;
  border: 1px solid #d9e7ff;
}

/* Quoted snippets: slightly larger line-height for comfort */
#main-content li.search-highlight q{
  line-height: 1.55;
  color: #1f2937;
}

/* Marked terms: softer yellow with rounded edges */
#main-content .search-results mark,
#main-content .search-results em{
  background: linear-gradient(180deg,#fff6a9,#ffed7a);
  padding: .08em .22em;
  border-radius: 4px;
  font-style: normal;
}

/* Responsive niceties */
@media (max-width: 900px){
  #main-content .search-results .resource{
    gap: 16px;
  }
  #main-content .search-results .resource > h4{
    justify-self: start;              /* keeps pill with the text on narrow screens */
  }
}
@media (max-width: 600px){
  #main-content .search-results .resource > img{
    width: 100%; height: 220px;
  }
}
/* Titre (pastille verte) — version pastel + plus haut + gras */
#main-content .search-results .resource > h4{
  /* remonte légèrement le bandeau dans la carte */
  margin: 0 0 8px !important;
  transform: translateY(-38px);        /* ajuste l’offset ici (-4px à -14px) */

  /* style visuel du bandeau */
  display: inline-block;
  background: linear-gradient(180deg, #CFF5DB, #BAEEC9) !important; /* vert pastel */
  border: 1px solid #9FDFB0 !important;
  border-radius: 18px !important;
  padding: .5rem .9rem !important;
  box-shadow: 0 1px 2px rgba(0,0,0,.06);
}

/* Lien du titre : texte foncé + gras, pas de fond/padding doublon */
#main-content .search-results .resource > h4 > a{
  background: transparent !important;
  padding: 0 !important;
  border-radius: 0 !important;
  color: #10462A !important;   /* vert foncé lisible */
  font-weight: 700 !important; /* GRAS */
  text-decoration: none !important;
}
#main-content .search-results .resource > h4 > a:hover{
  text-decoration: underline !important;
}





.jumbotron-search input[type="text"] {
    font-family: Cambria, serif  !important;
}

/****************     Boutons "English" ************/
/*************************************************/
.english-button {
    background-color: #007BFF;
    color: white;
    padding: 2px 6px;      /* hauteur: 2px / largeur: 6px */
    border-radius: 3px;
    font-size: 0.9em;       /* un peu plus petit que le texte normal */
    text-decoration: none;
    font-weight: bold;
}

.english-button:hover {
    background-color: #0056b3;
}

.english-button:visited {
    color: white;
}




/****************      Page  Menu hierachique ************/
/*************************************************/
.hierarchy-row .resource-list .item.resource {
    display: flex; /* Structure image + texte */
    align-items: center; /* Aligne verticalement le contenu */
    text-align: left; /* Texte aligné à gauche */
    width: 100%; /* Largeur complète */
    margin: 10px auto; /* Espacement autour */
    position: relative; /* Nécessaire pour positionner le texte */
}

.hierarchy-row .resource-list .item.resource img {
    max-width: 150px; /* Taille maximale de l'image */
    height: auto; /* Maintient le ratio */
    border-radius: 5px; /* Coins arrondis */
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); /* Ombre subtile */
    display: block; /* S'assure que l'image reste un bloc */
   border: 8px solid #ccc;
    /*background-color: #f0f0f0; */ 
}

.hierarchy-row .resource-list .item.resource .resource-name {
    font-size: 16px; /* Taille du texte */
    font-weight: bold; /* Texte en gras */
    color: #1868be; /* Couleur par défaut */
    text-decoration: none; /* Supprime le soulignement */
    margin: 0; /* Évite un espacement parasite */
    position: absolute; /* Position absolue pour placer le texte précisément */
    left: 170px; /* Décalage à droite de l'image (150px + 20px de marge) */
    top: 50%; /* Aligne verticalement au centre de l'image */
    transform: translateY(-50%); /* Ajuste pour centrer parfaitement */
}

.hierarchy-row .resource-list .item.resource .resource-name:hover {
    color: #007BFF; /* Couleur au survol */
    text-decoration: underline; /* Soulignement au survol */
}





/*******************************/
/* Menu galerie Thématique */
/*******************************/


.main-navigation .navigation > li > ul {
    display: none; /* Masque le sous-menu par défaut */
    position: absolute; /* Positionné sous le parent */
    top: 100%; /* Aligne sous l'élément parent */
    left: 0;
    background-color: rgba(19, 123, 210, 0.9); /* Bleu pastel */
    border-radius: 4px; /* Coins arrondis */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15); /* Ombre douce */
    padding: 7px 8px !important; /* Supprime les espaces internes */
    margin: 0; /* Supprime les marges */
    display: flex; /* Flexbox pour empiler les liens */
    flex-direction: column;
    gap: 1px !important;
    z-index: 1000;
    width: max-content; /* Limite la largeur au contenu */
    min-width: 150px; /* Optionnel : largeur minimale */
    max-width: 300px; /* Optionnel : empêche un conteneur trop large */
}

/* Sous-menu - Liens */
.main-navigation .navigation > li > ul li a {
    padding: 4px 4px; /* Ajuste l'espacement interne */
    color: #FFFFF;     /* rgba(19, 123, 210, 0.9);  Texte blanc */
    font-size: 16px; /* Taille du texte */
    font-weight: 500;
    text-decoration: none;
    background-color: rgba(255, 255, 255, 0.1); /* Fond légèrement clair */
    border-radius: 3px; /* Coins arrondis */
    text-align: left;
    white-space: nowrap; /* Empêche les retours à la ligne */
    transition: background-color 0.3s ease, color 0.3s ease;
}

/* Au survol */
.main-navigation .navigation > li > ul li a:hover {
    background-color: rgba(255, 255, 255, 0.2); /* Fond clair */
    color: #000;
}

/* Affichage au survol */
.main-navigation .navigation > li:hover > ul {
    display: flex; /* Affiche le sous-menu */
}

/* Position relative pour le parent */
.main-navigation .navigation > li {
    position: relative;
}

/***************************************/
/* Fin du Menu Galerie Thématique */
/**************************************/


/***************************************/
/*                    Bandeau CAS                         */
#user-bar {
    font-family: Cambria, serif;
    font-size: 16px;
    line-height: 24px;
     color: #104b92;  /* couleur du texte lors de l'affichage connecté comme username */
    background-color: #ddf1f9; /* Couleur de fond actuelle  bleu pastel*/
    padding: 6px 24px;
    display: flex;
    justify-content: space-between;
}

#user-bar .admin:not(:last-child):after {
    content: "•";
    margin: 0 12px;
}

#user-bar a {
    color: #006FB7 ; /* couleur du texte se connecter+CAS */
   text-decoration: none;
}

#user-bar .logout, #user-bar .login {
    font-size: 14px;
    padding: 0 6px;
    background-color: #a5d7ec; /* couleur du fond sous se connecter */
   border-radius: 3px; 
    display: inline-block;
    text-align: center;
    margin-left: 12px;
}

#user-bar .login {
    margin-left: auto;
}

#user-bar .o-icon-edit {
    margin-left: 12px;
}
#user-bar .login-with-cas {
    font-size: 14px;
    padding: 0 6px;
    background-color: #a5d7ec;  /* couleur du fond sous se connecter avec CAS*/
    border-radius: 3px;
    display: inline-block;
    text-align: center;
    margin-left: 12px;
}

/**********************************/
/*                Body                                       */
body {
    background-image: url('http://anaite.upf.pf/files/asset/tapas2.jpg'); 
    /* background-size: cover;  Pour que l'image de fond couvre toute la surface */
    background-repeat:  repeat; /* Pour éviter la répétition de l'image */
    background-attachment: fixed; /* Pour fixer l'image de fond lors du défilement */
}
/*.main-region {     NE pas utiliser pour masquer titre, faire autrement
display: none;
} */

/**********  Header ***********/

.main-header .main-header__top-bar {
    background-color: #FFF; /* Fond blanc */
   }

 .main-header {
     background-color:  #006FB7; 
           } 

.main-header__top-bar.container {
  width: 100%;
  max-width: 100%;  /* pour que le bandeau blanc du haut fasse toute la largeur */
   height: 80px;
   display: flex;
    align-items: center; /* Centre verticalement les éléments enfants */
    }

 .main-header__main-bar.container {  /* ne fait pas toute la largeur de la page */
height: 90px;
background-color:  #006FB7; 
} 


/****  image Anaite à gauche écran ********/
.additionelle-imageAnaite {    
   position: absolute;
    left: 0px;
    bottom: -6px;
 /*  transform: scale(1.1); */ 
}
.additionelle-imageAnaite img {
    max-height: 90px;
    width: auto; /* Maintient le ratio de l'image */
}

/* rajout de cette class dans header.php pour positionner le logo Anaite a droite */
.additionelle-image {    
   position: absolute;
    right: -9px;
    bottom: -8px; 
   transform: scale(0.9); 
}
.additionelle-image img {
    max-width: 100%; /* S'assure que l'image ne dépasse pas les dimensions du conteneur */
    height: auto; /* Maintient le ratio de l'image */
 }

.additionelle-logoUPF {
        position: absolute;
        left: 20px;       
}

/* Si vous voulez ajouter des styles supplémentaires à l'image */
.additionelle-logoUPF img {
    max-width: 73%;  /* S'assure que l'image ne dépasse pas les dimensions du conteneur */
      height: auto; /* Maintient le ratio de l'image */
  }

/***masquer le champs advanced search ****/
.advanced-search {
display: none;
}

/****** FOOTER  ******/

.main-footer__bottom {
 /*display: none;*/
background-color: #006FB7;
} 
.main-footer__top {
 background-color:  #006FB7;
display: none;
}


/* affiche previous et next en bas de page - sert à rien.. */
.site-page-pagination  {
    display: none;
}
/*.browse-all {
    display: none;
} */
.banner {
    position: relative;
}

.banner.alignfull img {
    width: 100%;
    height: 100%;
    object-fit: scale-down;
    background-color:  #006FB7; /* couleur du bandeau */
}

/* Logo UPF + SPAA  ajout de la class dans header php */

/*.large-image {
    transform: scale(1.3); 
} */


.main-navigation .navigation li a {
  font-family: Cambria, serif; /* Applique la police Cambria aux éléments de la navigation */
  font-size: 22px; /* Modifie la taille du texte */
   color: white; 
   text-transform: none; /* Empêche la transformation du texte en majuscules */
}

h4 {   /* texte : quelques documents aux hazard */
border-radius: 5px;
 font-size: 24px;
  font-family: Cambria, serif;
     z-index: 1;
  color: white; 
   background-color:   #2e7d32; /*1FA055; */  
  padding: 5px;
  display: inline-block;  /* Affiche le texte sur une seule ligne */
  text-align: center;
  background-size: auto; /* Définit la largeur du fond bleu à la largeur du texte */
   margin: 0 auto;
   position: relative;
        top:  +40px; /* Ajustez la valeur selon vos préférences */
    } 

/*****************************************/
/*               Block Carousel                               */
/*          Accueil            LE TATOUAGE       */

.carousel-accueil.has-background {
  background-size: 85% auto;  /*  réduit la largeur à 80% */
  background-repeat: no-repeat;
  background-position: center top;
}


.carousel-accueil img {
   margin-top: 40px; 
   max-width: auto; 
    height:600px; 
    /*border: 1px solid #1FA055 ;*/ 
     border-radius: 5px;
    }
.carousel-accueil h2 {
    border-radius: 5px;
 font-size: 24px;
  font-family: Cambria, serif;
     z-index: 1;
  color: white; 
   background-color:  #2e7d32;  /*1FA055;*/  
  padding: 5px; /* taille du carré vert autour du texte */
  display: inline-block;   /* Affiche le texte sur une seule ligne ,  affecte la largeur de la bande  */
  text-align: center;
  background-size: auto; /* Définit la largeur du fond bleu à la largeur du texte */
   margin: 0 auto; 
   position: relative;
        top:   -5px; /* Ajustez la valeur selon vos préférences */
        left : +20px;
}

.carousel-accueil .slide-text {
  text-align: center; /* centre le contenu horizontalement */
  margin-top: 10px;

text-align: center;
  width: 100%;
  display: block;

}

.carousel-accueil .slide-text .title {
  display: inline-block   !important; /* ← clé pour ajuster à la largeur du texte */
  background-color: rgba(255, 255, 255, 0.95);
  color: black;
  font-family: Cambria, serif;
  font-size: 18px;
  font-weight: bold;
  padding: 10px 20px;
  border-radius: 5px;
  text-align: center;
  box-shadow: 0 3px 10px rgba(0,0,0,0.1);
  white-space: nowrap; /* facultatif : empêche les retours à la ligne */
}

.carousel-accueil .slide-text .title a {
  color: inherit;
  text-decoration: none;
  display: inline; /* pas block pour ne pas étirer la bande */
}

.carousel-accueil .slide-text .title {
  width: auto !important;
  display: inline-block !important;
}


/**************************/
/*   Block Carousel           */
/*   EXPO Tamari'i          */


.carousel-tamarii {
    text-align: center; /* Centre tout le contenu textuel à l'intérieur de ce conteneur */
}
.carousel-tamarii img {
   margin-top: 40px; 
   max-width: auto; 
    height:600px; 
    border: 14px solid  #81753e; /* rgba(122, 49, 71, 1) ; */
     border-radius: 5px;
    }
.carousel-tamarii h2 {
    border-radius: 5px;
 font-size: 24px;
  font-family: Cambria, serif;
     z-index: 1;
  color: white; 
   background-color:   #81753e;  /*#006FB7; */ 
  padding: 5px;
  /* display: inline-block;    Affiche le texte sur une seule ligne */
  text-align: center;
  background-size: auto; /* Définit la largeur du fond bleu à la largeur du texte */
   margin: 0 auto; 
   position: relative;
        top:  +20px; /* Ajustez la valeur selon vos préférences */
}
.carousel-tamarii .slide-text {
  text-align: center; /* centre le contenu horizontalement */
  margin-top: 10px;

text-align: center;
  width: 100%;
  display: block;

}

.carousel-tamarii .slide-text .title {
  display: inline-block   !important; /* ← clé pour ajuster à la largeur du texte */
  background-color: rgba(255, 255, 255, 0.95);
  color: black;
  font-family: Cambria, serif;
  font-size: 18px;
  font-weight: bold;
  padding: 10px 20px;
  border-radius: 5px;
  text-align: center;
  box-shadow: 0 3px 10px rgba(0,0,0,0.1);
  white-space: nowrap; /* facultatif : empêche les retours à la ligne */
}

.carousel-tamarii .slide-text .title a {
  color: inherit;
  text-decoration: none;
  display: inline; /* pas block pour ne pas étirer la bande */
}

.carousel-tamarii .slide-text .title {
  width: auto !important;
  display: inline-block !important;
}


/**************************/
/*  Block Carousel */
/*  EXPO Poilus          */
.carousel-poilus img {
   margin-top: 40px; 
   max-width: auto; 
    height:600px; 
    border: 14px solid rgba(122, 49, 71, 1) ; 
     border-radius: 5px;
    }
.carousel-poilus h2 {
    border-radius: 5px;
 font-size: 24px;
  font-family: Cambria, serif;
     z-index: 1;
  color: white; 
   background-color:   rgba(122, 49, 71, 1);  /*#006FB7; */ 
  padding: 5px;
  /* display: inline-block;   Affiche le texte sur une seule ligne */
  text-align: center;
  background-size: auto; /* Définit la largeur du fond bleu à la largeur du texte */
   margin: 0 auto;
   position: relative;
        top:  +20px; /* Ajustez la valeur selon vos préférences */
}
.carousel-poilus .slide-text {
  text-align: center; /* centre le contenu horizontalement */
  margin-top: 10px;

text-align: center;
  width: 100%;
  display: block;

}

.carousel-poilus .slide-text .title {
  display: inline-block   !important; /* ← clé pour ajuster à la largeur du texte */
  background-color: rgba(255, 255, 255, 0.95);
  color: black;
  font-family: Cambria, serif;
  font-size: 18px;
  font-weight: bold;
  padding: 10px 20px;
  border-radius: 5px;
  text-align: center;
  box-shadow: 0 3px 10px rgba(0,0,0,0.1);
  white-space: nowrap; /* facultatif : empêche les retours à la ligne */
}

.carousel-poilus .slide-text .title a {
  color: inherit;
  text-decoration: none;
  display: inline; /* pas block pour ne pas étirer la bande */
}

.carousel-poilus .slide-text .title {
  width: auto !important;
  display: inline-block !important;
}




/**************************/
/*  Block Carousel            */
/*  EXPO Air Tahiti         */

.carousel-airtahiti {
    text-align: center; /* Centre tout le contenu textuel à l'intérieur de ce conteneur */
}
.carousel-airtahiti img {
   margin-top: 40px; 
 max-width: auto; 
    height:600px; 
    border: 14px  solid #E74C3C;
     border-radius: 5px;
    }
.carousel-airtahiti h2 {
    border-radius: 5px;
 font-size: 24px;
  font-family: Cambria, serif;
     z-index: 1;
  color: white; 
   background-color:  #E74C3C;  /* rgba(122, 49, 71, 1); */ 
  padding: 5px;
  display: inline-block;   /*Affiche le texte sur une seule ligne */
  text-align: center;
  background-size: auto; /* Définit la largeur du fond à la largeur du texte */
   margin: 0 auto;
  position: relative; 
     top:  +20px; /* Ajustez la valeur selon vos préférences */
}

.carousel-airtahiti .slide-text {
  text-align: center; /* centre le contenu horizontalement */
  margin-top: 10px;

text-align: center;
  width: 100%;
  display: block;

}

.carousel-airtahiti .slide-text .title {
  display: inline-block   !important; /* ← clé pour ajuster à la largeur du texte */
  background-color: rgba(255, 255, 255, 0.95);
  color: black;
  font-family: Cambria, serif;
  font-size: 18px;
  font-weight: bold;
  padding: 10px 20px;
  border-radius: 5px;
  text-align: center;
  box-shadow: 0 3px 10px rgba(0,0,0,0.1);
  white-space: nowrap; /* facultatif : empêche les retours à la ligne */
}

.carousel-airtahiti .slide-text .title a {
  color: inherit;
  text-decoration: none;
  display: inline; /* pas block pour ne pas étirer la bande */
}

.carousel-airtahiti .slide-text .title {
  width: auto !important;
  display: inline-block !important;
}

/**************************/
/*   Block Carousel           */
/*    Hono Moana          */

.carousel-HonoMoana {
    text-align: center; /* Centre tout le contenu textuel à l'intérieur de ce conteneur */
}
.carousel-HonoMoana img {
   margin-top: 40px; 
   max-width: auto; 
    height:600px; 
    border: 14px solid  #81753e; /* rgba(122, 49, 71, 1) ; */
     border-radius: 5px;
    }
.carousel-HonoMoana h2 {
    border-radius: 5px;
 font-size: 24px;
  font-family: Cambria, serif;
     z-index: 1;
  color: white; 
   background-color:   #81753e;  /*#006FB7; */ 
  padding: 5px;
  /* display: inline-block;    Affiche le texte sur une seule ligne */
  text-align: center;
  background-size: auto; /* Définit la largeur du fond bleu à la largeur du texte */
   margin: 0 auto; 
   position: relative;
        top:  +20px; /* Ajustez la valeur selon vos préférences */
}
.carousel-HonoMoana .slide-text {
  text-align: center; /* centre le contenu horizontalement */
  margin-top: 10px;

text-align: center;
  width: 100%;
  display: block;

}

.carousel-HonoMoana .slide-text .title {
  display: inline-block   !important; /* ← clé pour ajuster à la largeur du texte */
  background-color: rgba(255, 255, 255, 0.95);
  color: black;
  font-family: Cambria, serif;
  font-size: 18px;
  font-weight: bold;
  padding: 10px 20px;
  border-radius: 5px;
  text-align: center;
  box-shadow: 0 3px 10px rgba(0,0,0,0.1);
  white-space: nowrap; /* facultatif : empêche les retours à la ligne */
}

.carousel-HonoMoana .slide-text .title a {
  color: inherit;
  text-decoration: none;
  display: inline; /* pas block pour ne pas étirer la bande */
}

.carousel-HonoMoana .slide-text .title {
  width: auto !important;
  display: inline-block !important;
}

/**************************/
/*  Block Carousel */
/*  EXPO Sciences          */
.carousel-poilus img {
   margin-top: 40px; 
   max-width: auto; 
    height:600px; 
    border: 14px solid rgba(122, 49, 71, 1) ; 
     border-radius: 5px;
    }
.carousel-science h2 {
    border-radius: 5px;
 font-size: 24px;
  font-family: Cambria, serif;
     z-index: 1;
  color: white; 
   background-color:   rgba(122, 49, 71, 1);  /*#006FB7; */ 
  padding: 5px;
  /* display: inline-block;   Affiche le texte sur une seule ligne */
  text-align: center;
  background-size: auto; /* Définit la largeur du fond bleu à la largeur du texte */
   margin: 0 auto;
   position: relative;
        top:  +20px; /* Ajustez la valeur selon vos préférences */
}
.carousel-science .slide-text {
  text-align: center; /* centre le contenu horizontalement */
  margin-top: 10px;

text-align: center;
  width: 100%;
  display: block;

}

.carousel-science .slide-text .title {
  display: inline-block   !important; /* ← clé pour ajuster à la largeur du texte */
  background-color: rgba(255, 255, 255, 0.95);
  color: black;
  font-family: Cambria, serif;
  font-size: 18px;
  font-weight: bold;
  padding: 10px 20px;
  border-radius: 5px;
  text-align: center;
  box-shadow: 0 3px 10px rgba(0,0,0,0.1);
  white-space: nowrap; /* facultatif : empêche les retours à la ligne */
}

.carousel-science .slide-text .title a {
  color: inherit;
  text-decoration: none;
  display: inline; /* pas block pour ne pas étirer la bande */
}

.carousel-science .slide-text .title {
  width: auto !important;
  display: inline-block !important;
}


/**********************************/
/* Texte du Manège à contenus */
/**********************************/

.carousel-block .slide-text .title {
  font-family: Cambria, serif; /* Applique la police Cambria aux titres d'une slide */
  font-size: 17px;
   text-decoration: none; /* Pour supprimer le soulignement des liens */
  background-color:  white; 
    display: inline-block;
    text-align: center;
   position : relative; 
   top: -10px;
}

.carousel-block {
     position: relative; 
  /*  background-color: white;   en commentaire pour permettre affichage background */
   /* background-color: rgba(255, 192, 203, 0.3);  Rose pastel avec 50% de transparence */
 }
   


/****************************/
/*   ITEM SHOWCASE       */
/* pour images aléatoires */

.item-showcase .item.resource {
    display: inline-block;
    margin-right: 1;  /* Espace entre chaque élément  photo*/
    position: relative; 
   top: 13px;  /* Déplace l'élément de 15px vers le bas */
   left: 31px;  /* Déplace l'élément vers la droite */
 /* border: 8px solid #93b09e ;  Ajoutez cette ligne pour le cadre */
     text-decoration: none;
}
.block-randomItems {
  background-color: rgba(144, 238, 144, 0.2); /* 0.5 représente l'opacité, avec 0 étant complètement transparent et 1 étant complètement opaque */
    width: 100%;
  margin-left: auto;
  margin-right: auto; 
}
.item-showcase .item.resource img {
    display: block;   
    position: relative;
   width: 100%; /* Remplit la largeur du conteneur */
    height: 400px; /* Fixe une hauteur uniforme pour toutes les images */
        object-fit: contain;
}

.item-showcase .item.resource h3 {
    font-family: Cambria, serif;
    font-size: 17px;
    text-decoration: none;
    background-color:  /*#1FA055;*/ white; 
    display: inline-block;
    text-align: center;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    margin: 0;
    padding: 10px;
    color: black;
    /*background: rgba(255, 255, 255, 1);*/
    box-sizing: border-box;
    transition: all 0.3s ease;
}
.item-showcase .item.resource h3 a {
    text-decoration: none !important; /* Si le h3 contient des liens, ajoutez cette ligne */
}

/****************************************/
/*        Recherche       en haut de page   */

/*.advanced-search {
  display: none;
 } */

.jumbotron-search form {
    display: flex;
    align-items: center;
    /* margin-bottom:  4px;  16px; */
   /* padding: 2px 6px; */
    background: #FFF;
   border: 8px solid rgba(0, 111, 183, 0.8);
  border-radius: 1px;  /* angle arrondi */
  /*  box-shadow: 0 5px 15px rgba(0, 0, 0,1); */
}


/* Réduire la taille de la police */
.block-jumbotron-search input[type="text"] {
    font-size: 18px; 
    font-family: Cambria, serif;
    height:   26px
} 

/****************      Page collections ************/
/*************************************************/
.resource__content a {
      font-family: Cambria, serif; /* Définissez la police Cambria ou une police de secours si Cambria n'est pas disponible */
    text-align:  center;
   font-size: 19px; /* Modifie la taille du texte des titres */
  text-decoration: none; /* Pour supprimer le soulignement des liens */
   font-weight: bold;
 /*   justify-content: center;   Centrer horizontalement, désactivé car pas joli à voir */
  }

.item.resource {
/*   border: 2px solid #ccc;  Ajouter une bordure grise de 2 pixels */
    border-radius: 5px; /* Arrondir les coins de la bordure */
    margin-bottom: 20px; /* Ajouter une marge en bas de chaque élément */
 background-color: #f0f0f0;  Ajouter un fond gris clair 
   /*   padding: 10px;  Ajouter un espace intérieur de 10 pixels */
}
.resource__thumbnail {
 border-radius:5px;
  background-color: #CACFD2;  /*Gris clair, sous la photo */
/* background: radial-gradient(circle, #696969, #F0F0F0); */
/* background: linear-gradient(to right, #696969, #F0F0F0);   dégradé de gris */
    padding: 6px; /* créé la bordure autour de l'image */
}

.resource__thumbnail img {
    width: 200px; /* Définir la largeur de l'image */
    height: auto;  /*Garder le rapport hauteur-largeur */ 
}
.item.resource:hover {
   /* transform: translateY(-5px);   Légère élévation au survol Ne surtout pas utiliser BUG sticky header */
    box-shadow: 0 8px 12px rgba(0, 0, 0, 0.2); /* Accentuation de l'ombre */
}


/* === Style du bloc "Nouveau sur Ana'ite" === */
.carousel-146 img {
  border-radius: 10px;
  /* box-shadow: 0 10px 20px rgba(0, 0, 0, 0.25);*/
box-shadow: 0 6px 15px rgba(0, 0, 0, 0.15);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.carousel-146 .slide-text {
    position: absolute;
    bottom: 180px; /* descendre le bandeau texte */
    left: 0;
    width: 100%;
    box-sizing: border-box;
    z-index: 1;
    text-decoration: none !important;
   display: none ;  /* Pour le moment on masque car cache le titre des revues */
}

.carousel-146 .slide-text .title {
    font-family: Cambria, serif;
    font-size: 17px;
    font-weight: bold;
    background-color: rgba(255, 255, 255, 0.95);
    color: black;
    padding: 10px;
    margin: 0;
    text-align: center;
    width: 100%;
    display: block;
   text-decoration: none !important;
}
.carousel-146 > div {
    position: relative;
}
.carousel-146 img {
    width: 100%;
    height: 450px !important;
    object-fit: contain;
    display: block;
     border-radius: 8px;
}
.carousel-146 {
    background-color: #E5E7E9;
    padding: 20px;
    border-radius: 10px;
}

.carousel-146 a,
.carousel-146 a:visited,
.carousel-146 a:hover,
.carousel-146 a:focus {
    text-decoration: none !important;
    color: inherit;
}


/* texte "Nouveau sur Ana'ite" */
.texte-nouveau h4 {
  font-family: Cambria, serif;
  font-size: 24px;
  color: white;
  background-color: #2e7d32;
  padding: 6px 10px;
  border-radius: 5px;
  display: inline-block;
  margin-left: 5%;
  margin-bottom: -10px;
}