

.small-image {
  width: 50px; /* Définissez la largeur souhaitée */
  height: 50px; /* Définissez la hauteur souhaitée */
}

.small-image_2 {
  width: 70px; /* Définissez la largeur souhaitée */
  height: 70px; /* Définissez la hauteur souhaitée */
}


body {
  overflow-x: hidden; /* Masque le débordement horizontal */
}



/* FIN LIEN PAGE */



/* BOUTON POUR SITE DES ENTREPRISES */
.formgroupe {
  text-align: center; /* Pour centrer le contenu dans .formgroupe */

}


.formgroupe a span {
  margin-left: 10px; /* Espacement entre le bouton et le texte du lien */
}

.formgroupe input {
  font-family: 'Orbitron', sans-serif;
  display: block; /* Pour qu'ils ne soient plus inline */
  width: 100%;
  padding: 10px 10px; /* Pour espacer les input */
  margin: 10px auto; /* Centrer en ajustant la marge */
  border: none;
  outline: none;
  border-bottom: 3px solid #aaa;
  color: #666;
  font-size: 16px;
  transition: 0.4s ease-out;
  box-shadow: 0px 12px 15px 0px rgba(0, 0, 0, 0.5); 
}

.formgroupe .buttonsub {
  display: inline-block;
  padding: 3px 10px;
  border: 1px solid #8b97d7;
  border-radius: 999px;
  background-image: linear-gradient(
    to right,
    transparent 50%,
    #750970 50%,
    #8b97d7
    
  );
  background-size: 200%;
  color: #8b97d7;
  font-size: 16px;
  font-weight: 500;
  cursor: pointer;
  width: 200px; /* Ajout de la largeur */
}

.formgroupe .buttonsub:hover {
  color: #fff;
  background-position: 100%; /* Pour ramener le dégradé de droite à gauche */
  border: 3px solid #fff;
}



/* TAILLES DES ICONES RESEAUX */
.mx-auto a {
  margin: 0 10px; /* Ajoutez une marge entre les icônes si nécessaire */
}

.custom-icon {
  font-size: 50px; /* Ajustez la taille des icônes selon vos préférences */
  color: white; /* Changez la couleur des icônes en blanc */
}

.custom-icon:hover{
  color: #5f0347;
}

/* FIN ICONE */



/* ICONE LOGICIEL */
.container img {
  transition: transform 0.3s ease-in-out, filter 0.3s ease-in-out;
}

.container img:hover {
  transform: scale(1.2); /* Ajustez la valeur du scale selon vos préférences */
  /* filter: brightness(1.5); Ajustez la valeur de brightness selon vos préférences */
}
/* FIN ICONE LOGICIEl */

.mx-auto {
  text-align: center; /* Centre horizontalement */
}

.mx-auto img {
  display: block; /* Pour éviter le débordement de la marge automatique */
  margin: auto; /* Centre verticalement */
}

footer img {
  width: 25%;
  margin: 10px; /* Espace entre les images */
}
  

footer{
  padding-top: 40px;
  padding-bottom: 40px;
  background: linear-gradient(90deg, #c56cdb,#5f0347 );
  margin-top: 20px;
}
  /* FOND IMAGE */
  .fond-image1400px{
    /* background-image: url(../image/fond_1400px.png); */
  background-image: url(../image/fond_formulaire.png);
    background-size: cover; /* L'image couvre toute la div */
    background-repeat: no-repeat; /* L'image n'est pas répétée */
    background-position: center top; /* L'image est centrée horizontalement et alignée en haut */
    background-attachment: fixed; /* pour garder l'image en arrière-plan fixe */
    
}

h3{
  color: #fff;
  font-family: 'Orbitron', sans-serif; 
  margin-left: 20px;
}

h4{
  color: #fff;
  font-family: 'Orbitron', sans-serif; 
}


/* ///////cadre TEXTE INTRO */
.cadre{
    background: linear-gradient(90deg, #c56cdb,#5f0347 );
    border-radius: 30px;
    margin-bottom: 30px;



      border: 1px solid white; /* Contour blanc de 2 pixels */
      animation: reveal linear 1s;
    animation-timeline : view();
    animation-range-start: cover 0%;
    animation-range-end: contain 50%;
  }
  @keyframes reveal{
    from{
      transform: scale(0);
      opacity: 0;
    }
    to{
      transform: scale(1);
      opacity: 1;
    }
  }
  

  /* FIN DU CADRE */
  
  h1{
    text-align: center;
    font-family: 'Orbitron', sans-serif; 
    color: #fff;
    /* animation: reveal linear 1s;
    animation-timeline : view();
    animation-range-start: cover 0%;
    animation-range-end: contain 50%; */

    background-image: url(../image/fond_titre.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    padding: 10px;
    text-shadow: #fff;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}
/* @keyframes reveal{
  from{
    transform: scale(0);
    opacity: 0;
  }
  to{
    transform: scale(1);
    opacity: 1;
  }
} */



h2{
    text-align: center;
    font-family: 'Orbitron', sans-serif; 
    color: #fff;
    /* animation: reveal linear .9s;
    animation-timeline : view(); */
    /* animation-range-start: cover 0%;
    animation-range-end: contain 50%; */

   background-image: url(../image/fond_h2.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    padding: 10px;
   
   
}

/* @keyframes reveal{
  from{
    transform: scale(0);
    opacity: 0;
  }
  to{
    transform: scale(1);
    opacity: 1;
  }
} */

p{
    font-family: 'Inter', sans-serif;
    color: white;

    /* animation: reveal linear .8s;
    animation-timeline : view();
    animation-range-start: cover 0%;
    animation-range-end: contain 50%; */
  }

  /* @keyframes reveal{
    from{
      transform: scale(0);
      opacity: 0;
    }
    to{
      transform: scale(1);
      opacity: 1;
    } */
  /* }
   */
  
  
  @media (min-width:900px) and (max-width:1000px){
    h1{
       font-size: 24px;
}

.fond-image1400px{
  display: none;
}
}


@media (min-width:500px) and (max-width:600px){
    h1{
       font-size: 28px;
}
}

@media (min-width:450px) and (max-width:550px){
    h1{
       font-size: 23px;
}
}

@media (min-width:350px) and (max-width:451px){
    h1{
       font-size: 20px;
}

h2{
  font-size: 16px;
}
}


/* CENTRE d'INTERET */

@media (max-width:600px){
  .small-image_2 {
    width: 65px; /* Définissez la largeur souhaitée */
    height: 65px; /* Définissez la hauteur souhaitée */
  }
}

@media (max-width:420px){
  .small-image_2 {
    width: 55px; /* Définissez la largeur souhaitée */
    height: 55px; /* Définissez la hauteur souhaitée */
  }
}



