@import url('https://fonts.googleapis.com/css2?family=Be+Vietnam+Pro:ital,wght@0,300;0,400;0,500;0,700;0,900;1,300;1,400;1,500;1,700;1,900&display=swap');
html {
/* L'image est positionnée en fond et est centrée */
	background: url(/squelettes/images/fondsmh.webp) no-repeat center center fixed;
	/* Ajout de la propriété avec les préfixes pour tous les moteurs de rendu */
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}
.center {
	text-align: center; margin: 0 auto;
}

.right {float: right;}
.left {float: left;}

.none {display: none;}

.clear {clear: both;}

body {
  font-family: 'Be Vietnam Pro', sans-serif;
	background-color: rgba(255,255,255,0.7);
}
h1, h2, h3, h4, h5, h6 {
  font-family: 'Be Vietnam Pro', sans-serif;
}

h1 {
	font-size: 2.5em;
}
a {
  border-bottom: 0;
}

#header .logo {
  font-family: 'Be Vietnam Pro', sans-serif;
  font-size: 2rem; 
  color : #004000;
}
header p {
  font-family: 'Be Vietnam Pro', sans-serif;
  font-size: 1.1em;
  font-weight: 600;
  letter-spacing: 0.075em;
  margin-top: -0.5em;
  text-transform: none; /*uppercase;*/
}
#banner {
	padding: 2em auto;}
	
.button {
    padding: 0 1.25em;
}
.button_accueil {
    margin: 0.5rem 0.5rem;
}
.button_accueil:first-child {
    margin: 0.5rem 0.5rem 0.5rem 0;
}
.button_accueil:last-child {
    margin: 0.5rem 0rem 0.5rem 0.5rem;
}

#main > .inner > section {
  padding: 2em 0 1em 0 ;
  border-top: solid 2px rgba(210, 215, 217, 0.75);
}

section div, .div {
	background: rgba(255,255,255,0.5);
	padding: 1rem 1rem 1rem 2rem; 
	min-height: 2rem;  
	margin: 0 0 1rem 0;
}
@media (max-width: 599px) {
	section div, .div {
	background: rgba(255,255,255,0.5);
	padding: 0.21rem 0.21rem 0.21rem 0.21rem; 
	min-height: 1rem;  
	margin: 0 0 0.51rem 0;
	}
}

.div {min-height: none;}

div.choix {
	padding: 0.21rem 1rem 0.21rem 2rem; 
} 

section div.video-intrinsic-wrapper {
	background: rgba(255,255,255,0.0);
}

/* Menu */
#menu {
	background-color: rgba(255,255,255,0.9);
}

#menu ul {
  font-family: 'Be Vietnam Pro', sans-serif;
}

#menu ul a, #menu ul span {
	padding: 0.625em 0.5em;
}

/* Button */
.button.tarteaucitronManager {
  box-shadow: inset 0 0 0 0 #008000;
  color: #fff !important;
}
.boutons{float: right;}

.copyright {
	margin: 3rem 0;
	padding: 1rem 0; 
}

footer p {
		background: rgba(0,0,0,0.3);
		color: white; 
		

}

.ciwidget_commun_video {
  background: none;
}

div .tablesorter-resizable-handle,
div .formidable_ts-wrapper, 
div .tablesorter-resizable-container, 
div .tablesorter-header-inner,
div .header-title,
div .ajaxbloc,
div .formulaire_spip, div .editer-groupe {background: transparent; color: black;}

.li_impair, .li_pair {
    margin-bottom: 1.4rem;
    min-height: 4rem;
}

.menu-link {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.menu-link img {
    max-height: 50px; /* Hauteur maximale pour les images */
    max-width: 100%; /* Largeur maximale pour les images */
    height: auto; /* Assure que la hauteur est ajustée automatiquement pour conserver les proportions */
    width: auto; /* Assure que la largeur est ajustée automatiquement pour conserver les proportions */
}


.li_impair {background: rgba(180,220,180,0.3);}
.li_pair {background: rgba(128,188,128,0.3);}

@media screen and (max-width: 936px)
#wrapper .spip_logo {float: none;}

.eclates {width: 48%; min-height: 20rem; display: block; border: 0px solid black; float: right; clear: right;}
.manuels {width: 48%;  min-height: 20rem; display: inline-block; border: 0px solid green;}


/* svg */

/* Videos responsives */
.video-responsive {
 overflow:hidden;
 padding-bottom:56.25%; 
 position:relative;
 height:0;
}
.video-responsive iframe {
 left:0;
 top:0;
 height:100%;
 width:100%;
 position:absolute;
}

.responsive-iframe-container {
  position: relative;
  width: 100%;
  /* hauteur basée sur le ratio largeur/hauteur original, ex: 600x400 = 2:3 (66.66%) */
  padding-bottom: 66.66%;
  height: 0;
  overflow: hidden;
}

.responsive-iframe-container iframe {
  position: absolute;
  top: 0; left: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

/* BREVO Mailing */
  @font-face {
    font-display: block;
    font-family: Roboto;
    src: url(https://assets.brevo.com/font/Roboto/Latin/normal/normal/7529907e9eaf8ebb5220c5f9850e3811.woff2) format("woff2"), url(https://assets.brevo.com/font/Roboto/Latin/normal/normal/25c678feafdc175a70922a116c9be3e7.woff) format("woff")
  }

  @font-face {
    font-display: fallback;
    font-family: Roboto;
    font-weight: 600;
    src: url(https://assets.brevo.com/font/Roboto/Latin/medium/normal/6e9caeeafb1f3491be3e32744bc30440.woff2) format("woff2"), url(https://assets.brevo.com/font/Roboto/Latin/medium/normal/71501f0d8d5aa95960f6475d5487d4c2.woff) format("woff")
  }

  @font-face {
    font-display: fallback;
    font-family: Roboto;
    font-weight: 700;
    src: url(https://assets.brevo.com/font/Roboto/Latin/bold/normal/3ef7cf158f310cf752d5ad08cd0e7e60.woff2) format("woff2"), url(https://assets.brevo.com/font/Roboto/Latin/bold/normal/ece3a1d82f18b60bcce0211725c476aa.woff) format("woff")
  }

@font-face {
    font-family: 'ImpactWeb';
    src: url(#CHEMIN{fonts/impact.ttf}) format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'ArialWeb';
    src: url(#CHEMIN{fonts/arial.ttf}) format('truetype');
    font-weight: normal;
    font-style: normal;
}

  #sib-container input:-ms-input-placeholder {
    text-align: left;
    font-family: Helvetica, sans-serif;
    color: #c0ccda;
  }

  #sib-container input::placeholder {
    text-align: left;
    font-family: Helvetica, sans-serif;
    color: #c0ccda;
  }

  #sib-container textarea::placeholder {
    text-align: left;
    font-family: Helvetica, sans-serif;
    color: #c0ccda;
  }

  #sib-container a {
    text-decoration: underline;
    color: #2BB2FC;
  }
  
.affiche1, .affiche2 {
	 display: inline-block; 
	 vertical-align: top; 
	 text-align: center; 
	 margin: 0.21rem; 
	 width: 32%; 
	 min-height: 320px;
 }
 
 .affiche2 {
	  width: 24%;
 }
 
 .conteneur
{
position: relative; text-align: center;
}

.conteneur iframe
{
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}


/*Modif du 12-06*/
/* Logo responsive */
.logo-responsive {
  display: block;
  max-width: 100%;
  height: auto;
  margin: 0 auto;
}

/* Conteneur logo */
.image.object.spip_logo_right {
  max-width: 100%;
  text-align: center;
}

/* Optionnel : adapter le h1 aussi */
#logo_site_spip.logo {
  font-size: 1.5rem;
  text-align: center;
  margin-top: 0.5rem;
}

/* Conteneur principal */
.actu-pro {
  clear: both;
  margin: auto;
  width: 90%;
  max-width: 1000px;
  border: 3px solid green;
  padding: 10px;
}

/* Grille responsive pour les actus */
.actu-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  margin-top: 10px;
}

.actu-item {
  border: 1px solid #aaa;
  padding: 10px;
  text-align: center;
}

@media screen and (max-width: 640px) {
  .actu-grid {
    grid-template-columns: 1fr;
  }
}


/* Empêche les blocs de se rétrécir sur mobile */
.formulaire_spip.formidable {
  max-width: 100% !important;
  width: 100% !important;
  margin: 0 auto;
  padding: 1em;
}

/* Neutralise les conteneurs intermédiaires souvent limitants */
.formulaire_spip.formidable .editer-groupe,
.formulaire_spip.formidable .editer {
  max-width: 100% !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Les champs aussi doivent s'étendre */
.formulaire_spip.formidable input,
.formulaire_spip.formidable textarea,
.formulaire_spip.formidable select {
  width: 100% !important;
  box-sizing: border-box;
}

.formulaire_spip.formidable {
  background: rgba(255, 0, 0, 0.05);
}

.evenements-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin-top: 10px;
}
@media screen and (max-width: 640px) {
  .evenements-grid {
    grid-template-columns: 1fr;
  }
}

.formulaire-responsive {
  max-width: 100%;
  padding: 1em;
  box-sizing: border-box;
}

.formulaire-responsive input,
.formulaire-responsive select,
.formulaire-responsive textarea,
.formulaire-responsive button {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  margin-bottom: 1em;
  font-size: 1rem;
}

.formulaire-responsive .editer-groupe {
  display: flex;
  flex-direction: column;
  gap: 1em;
}

@media (min-width: 600px) {
  .formulaire-responsive .editer-groupe {
    flex-direction: column; /* RESTE EN COLONNE */
  }

  .formulaire-responsive .editer-groupe > * {
    flex: 1 1 100%; /* Largeur totale */
  }
}

@media (max-width: 599px) {
  .ajax-form-container,
  .ajax,
  .formulaire-responsive,
  .formulaire-responsive > div,
  .formulaire-responsive > div > div {
    margin: 0 !important;
    padding: 0 !important;
  }

  #formulaire_formidable_bbq_pro_25 {
    margin: 0 !important;
    padding: 0 !important;
  }
}

.button-no-label {display: !none;}

