.media-gauche h2 {
  font-size: 1.5rem;
  line-height: 1.8rem;
  padding: 10px;
  padding-bottom: 3px;
}
  

.media-gauche {
  margin-right: 20px !important;
  margin-bottom: 10px !important;
  display: block !important;
  width: auto !important;
}

.media-gauche img, 
.media-gauche video, 
.media-gauche .contextual-region {
	margin-top: 10px !important;
  margin-right: 20px !important;
  float: left !important;
  max-width: 250px; /* Vous pouvez ajuster cette largeur maximum */
  height: auto;
}

.views-field-title, 
.views-field-field-sumary-blog {
  display: inline; 

}
.views-view-responsive-grid__item-inner::after {
  content: "";
  display: table;
  clear: both;
}
.views-more-link {
  padding-top: 5px;
  margin-bottom: 0 !important;
  margin-top: 5px !important;
  border-block: black;
  background: black;
  margin-left: 10px;
}

.views-view-responsive-grid__item-inner {
  display: block !important;
  background-color: #ffffff;    /* Fond blanc très clair pour la nuance */
  border: 1px solid #e0e0e0;    /* Bordure fine pour délimiter */
  border-radius: 8px;           /* Coins arrondis */
  padding: 15px;                /* Espace intérieur pour que le texte ne colle pas aux bords */
  margin-bottom: 20px;          /* Espace entre les publications */
  box-shadow: 0 2px 5px rgba(0,0,0,0.05); /* Ombre légère pour le relief */
  overflow: hidden;             /* Important pour que le fond englobe les éléments flottants */
  transition: transform 0.2s ease; /* Petit effet au survol */
}

.views-view-responsive-grid__item-inner:hover {
  background-color: #f9f9f9;    /* Devient gris au survol */
  border-color: #cccccc;
  box-shadow: 0 4px 10px rgba(0,0,0,0.1);
}

@media screen and (max-width: 767px) {
  .media-gauche h2 {
    clear: both;
  }
  .views-more-link {
  	clear: both;
  }
}