﻿  body { font-family:sans-serif; background:#f5f5f5; margin:0; padding:10px; }
  h1 { text-align: center;
  font-family: 'Georgia', 'Times New Roman', serif;
  font-size: 2.5em;
  font-weight: bold;
  text-transform: uppercase;
  letter-spacing: 3px;
  color: #222;
  text-shadow: 1px 1px 2px rgba(0,0,0,0.3);
  margin: 20px 0;
  border-bottom: 2px solid #000;
  padding-bottom: 10px;
;}

  /* Carte responsive */
  #map {
    height: 400px;
    width: 100%;
    max-width: 1200px;
    margin: 0 auto 20px;
    border-radius: 8px;
    box-shadow: rgba(50, 50, 93, 0.25) 0px 30px 60px -20px,
              rgba(0, 0, 0, 0.3) 0px 18px 36px -18px,
              rgba(10, 37, 64, 0.35) 0px -2px 6px 0px inset;

  }
  @media(max-width:768px){ #map { height: 300px; } }
  @media(max-width:480px){ #map { height: 250px; } }

  /* Filtres responsives */
  .filters {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
    margin: 20px 0;
  }
  .filters label {
    background: #0b6cff;
    color: white;
    padding: 8px 12px;
    border-radius: 6px;
    cursor: pointer;
    font-size: 14px;
    flex: 1 1 auto;
    text-align: center;
    box-shadow: rgba(50, 50, 93, 0.25) 0px 30px 60px -20px,
              rgba(0, 0, 0, 0.3) 0px 18px 36px -18px,
              rgba(10, 37, 64, 0.35) 0px -2px 6px 0px inset;

  }
  .filters input[type="checkbox"] { margin-right: 6px; }

  .validate-btn {
    display:block; margin:10px auto; padding:10px 20px;
    background:#28a745; color:white; border:none; border-radius:6px;
    cursor:pointer; font-size:16px;
    box-shadow: rgba(50, 50, 93, 0.25) 0px 30px 60px -20px,
              rgba(0, 0, 0, 0.3) 0px 18px 36px -18px,
              rgba(10, 37, 64, 0.35) 0px -2px 6px 0px inset;

  }

  /* Barre de recherche */
  .search-bar { text-align:center; margin:20px 0; }
  .search-bar input {
    width:90%; max-width:500px; padding:8px;
    border-radius:6px; border:1px solid #ccc;
    font-size:16px;
  }

  /* Galerie responsive */
  .gallery { column-count:4; column-gap:15px; }
  .gallery .item { break-inside:avoid; margin-bottom:15px; display:none; }
  .gallery img { width:100%; border-radius:8px; cursor:pointer; transition:transform 0.2s;  box-shadow: rgba(50, 50, 93, 0.25) 0px 30px 60px -20px,
              rgba(0, 0, 0, 0.3) 0px 18px 36px -18px,
              rgba(10, 37, 64, 0.35) 0px -2px 6px 0px inset;
}
 
  
  .gallery img:hover { transform:scale(1.03); }

  @media(max-width:1200px){ .gallery{column-count:3;} }
  @media(max-width:768px){ .gallery{column-count:2;} }
  @media(max-width:480px){ .gallery{column-count:1;} }


   
   

  @media(max-width:1200px){ .gallery{column-count:3;} }
  @media(max-width:768px){ .gallery{column-count:2;} }
  @media(max-width:480px){ .gallery{column-count:1;} }

  /* Pagination responsive */
  .pagination { text-align:center; margin:20px 0; }
  .pagination button, .pagination select {
    margin:5px; padding:8px 14px; border:none; border-radius:6px;
    background:#0b6cff; color:white; cursor:pointer; box-shadow: rgba(50, 50, 93, 0.25) 0px 30px 60px -20px,
              rgba(0, 0, 0, 0.3) 0px 18px 36px -18px,
              rgba(10, 37, 64, 0.35) 0px -2px 6px 0px inset;

  }
  .pagination select {
    background:#fff; color:#000; font-size:14px;
    box-shadow: rgba(50, 50, 93, 0.25) 0px 30px 60px -20px,
              rgba(0, 0, 0, 0.3) 0px 18px 36px -18px,
              rgba(10, 37, 64, 0.35) 0px -2px 6px 0px inset;

  }

  /* Lightbox */
  #lightbox {
    position:fixed; top:0; left:0; right:0; bottom:0;
    background:rgba(0,0,0,0.8); display:none;
    align-items:center; justify-content:center; z-index:9999;
  }
  #lightbox img { max-width:90%; max-height:90%; border-radius:8px; box-shadow: rgba(50, 50, 93, 0.25) 0px 30px 60px -20px,
              rgba(0, 0, 0, 0.3) 0px 18px 36px -18px,
              rgba(10, 37, 64, 0.35) 0px -2px 6px 0px inset;
}
.event {
  background: #e4f5fa;
  border: 1px solid #ccc;
  border-radius: 10px;
  padding: 20px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.1);
  text-align: justify;          /* justification du texte */
  text-align-last: left;        /* derniÃ¨re ligne alignÃ©e Ã  gauche */
  line-height: 1.7;             /* aÃ©ration entre les lignes */
  font-size: 1.05rem;           /* taille lÃ©gÃ¨rement augmentÃ©e */
  color: #2c2c2c;               /* texte gris foncÃ© doux */
  margin-bottom: 1.2em;         /* espace entre paragraphes */
  padding: 0.5em 1em;           /* respiration intÃ©rieure */
  background: #fdfdfd;          /* fond trÃ¨s clair */
  border-left: 4px solid #a3c4dc; /* accent pastel bleu sur le cÃ´tÃ© */
  border-radius: 6px;           /* coins arrondis */
  


.rss-box {
  break-inside: avoid;
  margin: 10px;
  background-color: rgba(255, 255, 255, 0.6);
  border: 3px ridge #0077cc;
  border-radius: 10px;
  padding: 10px;
  box-shadow: rgba(50, 50, 93, 0.25) 0px 30px 60px -20px,
              rgba(0, 0, 0, 0.3) 0px 18px 36px -18px,
              rgba(10, 37, 64, 0.35) 0px -2px 6px 0px inset;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  text-align: center;
  cursor: pointer;



}
.rss-box:hover { transform: scale(1.03); }
.rss-box img {
  width: 100%;
  height: auto;
  border-radius: 6px;
  transition: transform 0.3s ease;
  display: block;
}



	
.grave {
  text-align: center;
  font-family: 'Georgia', 'Times New Roman', serif;
  font-size: 2.5em;
  font-weight: bold;
  text-transform: uppercase;
  letter-spacing: 3px;
  color: #222;
  text-shadow: 1px 1px 2px rgba(0,0,0,0.3);
  margin: 20px 0;
  border-bottom: 2px solid #000;
  padding-bottom: 10px;
}








