@charset "utf-8";
@import url("../webfonts/Rubik_Dirt/stylesheet.css");
@import url("../webfonts/Impact_Label/stylesheet.css");
@import url("../webfonts/Impact_Label/stylesheet.css");
@import url("../webfonts/Impact_Label/stylesheet.css");
@import url("../webfonts/Impact_Label/stylesheet.css");
@import url("../webfonts/Impact_Label/stylesheet.css");
@import url("../webfonts/ImpactLabel/stylesheet.css");
@import url("../webfonts/Snowflake/stylesheet.css");








/* CSS Document */
.image-container {
	
	width: 100%; /* ou la hauteur que vous souhaitez */
}

.image-container img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  transition: opacity 5s; /* transition douce de l'opacité */
}

.top-image {
  opacity: 0; /* l'image du dessus est initialement invisible */
}

.image-container:hover .top-image {
  opacity: 1; /* Rend l'image du dessus visible lorsque l'utilisateur survole le conteneur */
}

.top{
	text-align: center;
	background-image: url(../img/topbg.fw.png);
	width: 100%;
	height: auto;
	background-size: cover;
	margin-bottom:1.5rem;
	padding:1rem;
	position:sticky;
	top:0;
	z-index:1;
	}
	
	.text-overlay {

	top: 0;
	left: 0;
	width: 100%; /* Couvre toute la largeur de l'élément parent */
	height: 100%; /* Couvre toute la hauteur de l'élément parent */
	background: rgba(0, 0, 0, 0.5); /* Noir semi-transparent, ajustez la couleur et l'opacité selon besoin */
	color: #FFC1FF; /* Couleur du texte */
	padding: 20px; /* Ajoute un peu d'espace autour du texte */
}

.text-overlay p {
    margin: 0; /* Retire la marge par défaut des paragraphes */
}
	
	
.acd {
	text-decoration:bold;
	  font-size: 1.27rem;
 
  }
      @font-face {
            font-family: 'Snowflake';
            src: url('./fonts/Snowflake.ttf') format('truetype');
        }

.titrecarte {
	margin: 0.67em 0.3em;
	font-size: 3vw;
	color: #DABAE2;
	font-family: "Snowflake";
	font-weight: bold;
	/* [disabled]font-size: clamp(5rem, 2.5vw, 2rem); */
	word-wrap: break-word; /* Ancienne syntaxe pour les navigateurs plus anciens */
	overflow-wrap: break-word; /* Préféré pour les navigateurs modernes */
	padding-bottom: 2vw;
	/* [disabled]text-align: center; */
}

.soustitre {
	margin: 0.67em 0.3em;
	font-family: "Snowflake";
	color: #DABAE2;
	font-size: 1.5vw;

}

.titre {
	margin: 0.67em 0.3em;
	color: #DABAE2;
	font-size: 6vw;
	font-family: "Snowflake";




}	

.ico{
    max-width: 50%;
    height: auto;
}



.imgvw {
    width: 10vw; /* l'image prendra 20% de la largeur de la fenêtre d'affichage */
}

@media (max-width: 800px) {
.titrecarte{
        font-size: 20px; /* Fixe un minimum pour les petits écrans */
    }
}

@media (max-width: 1200px) {
.titrecarte {
        font-size: 24px; /* Fixe un maximum pour les grands écrans */
    }
}