body {
  font-family: Verdana, Geneva, sans-serif;
  font-size: 10px;
  margin: 0;
  padding: 0;
}

body {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

.container
{
  max-width:1240px
}
.container title {
  display: flex;
  justify-content: center;
  padding: 20px;
}

header {
  flex-shrink: 0;
}

footer {
  flex-shrink: 0;
}

#content-wrapper {
  flex-grow: 1;
  padding: 20px;
}

.zone-content {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  padding: 0 20px 0 20px; /* haut, droite, bas et gauche */
  align-items: flex-start;  /* pour éviter que les colonnes s'aligne en terme de hauteur à la plus grande des colonnes */
  max-width: 1520px;
  margin: 0 auto;
  box-sizing: border-box; !important;
}

.zone-content-full {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  padding: 0 20px 0 20px; /* haut, droite, bas et gauche */
  align-items: flex-start;  /* pour éviter que les colonnes s'aligne en terme de hauteur à la plus grande des colonnes */
  max-width: 1520px;
  margin: 0 auto;
  margin-bottom: 0;
  box-sizing: border-box; !important;
}

.zone-content, .zone-content *::before, .zone-content *::after {
  box-sizing: content-box !important;
}


.centered-title {
  display: flex;
  justify-content: center;
  padding: 20px;
}

.centered-content {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  max-width: 1520px;
  margin: 0 auto;
  box-sizing: border-box;
  padding: 20px;
}

.column {
  flex: 0 0 calc(33.333% - 20px);
  margin: 5px;
  padding: 10px;
  min-width: 471px; /* empeche que les colonnes passe en dessous de cette taille */
 /* min-height: 580px; taille minimal*/ 
  height: auto; /* auteur automatique et adaptative au contenu de la colonne */
  background-color: #F8F8FF;
  border-radius: 8px;
  box-sizing: border-box;
  /* align-items: stretch; */  /* Ajout de la propriété pour étirer les blocs en hauteur*/
}

.column .block {
  margin-bottom: 15px;
  padding: 15px 15px 15px 15px; /* haut, droite, bas et gauche */
  background-color: #C0DDFF;
  border-radius: 8px;
}

.column-full {
  flex: 1 0 calc(100% - 20px);
  min-width: 471px; /* empeche que la colonne passe en dessous de cette taille */
  margin: 0px 0px 0px 0px;   /* haut, droite, bas et gauche */
  padding: 10px 10px 10px 10px;   /* haut, droite, bas et gauche */
  background-color: #F8F8FF;
  border-radius: 8px;
  box-sizing: border-box;
}

.column-full .block {
  margin-bottom: 0;
  padding: 15px;
  background-color: #C0DDFF;
  border-radius: 8px;
}

.column .block:last-child { /* pour le dernier block de la colonne nous mettons le margin bas à 0 */
  margin-bottom: 0;
}

.column .block .row_content:last-child { /* pour le dernier row_content du block nous mettons le margin bas à 0 */
  margin-bottom: 0;
}

.column .block .row_content_haut:last-child { /* pour le dernier row_content_haut du block nous mettons le margin bas à 0 */
  margin-bottom: 0;
}

@media (max-width: 480px) {
  .column {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.col-2.d-none {
  display: none !important;
}

.row_content {
  display: flex;
  align-items: flex-start;
  margin-bottom: 10px;
}

.row_content_haut {
  display: flex;
  align-items: top;
  margin-bottom: 10px;
}

.label {
    display: inline-block;
    width: 140px;
    height: 20px;
    color: #000;
    text-align: right;
    top: 20px;
    padding-right: 5px;
    font-size: 11px !important;
    padding-top: 5px; /* ajuste la position du titre par rapport aux champs select, input, textarea */
    /*font-weight: bold;*/
}

.label-full {
    display: inline-block;
    height: 20px;
    color: #000;
    text-align: right;
    top: 20px;
    padding-right: 5px;
    font-size: 11px; 
    /*font-weight: bold;*/
}

.label-container {
  display: block;
  width: 100%;
  text-align: center;
}


.input_content, .textarea_content, .select_content{
  height: 26px;
  width: 286px;
  resize: vertical;  /* limite le redimentionement par l'utilisateur qu'au vertical */
  font-size: 11px !important;

}

.textarea_content-full {
  width: 100%;
  resize: vertical;  /* limite le redimentionement par l'utilisateur qu'au vertical */
  margin: 0px 0px 0px 0px;    /* haut, droite, bas et gauche */
  font-size: 11px !important;
}

.column select,
.column input,
.column textarea {
  font-family: inherit; /* Utilise la police du parent */
  font-size: 16px; /* Ajustez la taille de police pour réduire la hauteur */
  line-height: 1.0; /* Ajustez la hauteur de ligne pour réduire la hauteur */
  padding: 2px 0px 2px 10px; /* haut, droite, bas et gauche *//* Ajustez le padding pour réduire la hauteur */
  border: 1px solid rgba(0, 0, 0, 0.15); /* Imiter la bordure de l'élément par défaut dans Edge */
  border-radius: 4px; /* Ajoute un arrondi aux coins */
  background-color: #ffffff;
}

/* pour les champs du form editor */

.bouton_debut_form_edit_add {
  padding: 0px 0px 10px 0px; /* haut, droite, bas et gauche *//* Ajustez le padding pour réduire la hauteur */
  display: flex; /* Ajouter une propriété flex pour aligner les boutons horizontalement */
  justify-content: center; /* Centrer les éléments horizontalement */
}
/* Ajouter une marge de 5px entre les boutons */
.bouton_debut_form_edit_add button {
  margin: 0 5px;
}

.bouton_fin_form_edit_add {
  padding: 10px 0px 10px 0px; /* haut, droite, bas et gauche *//* Ajustez le padding pour réduire la hauteur */
  display: flex; /* Ajouter une propriété flex pour aligner les boutons horizontalement */
  justify-content: center; /* Centrer les éléments horizontalement */
}
/* Ajouter une marge de 5px entre les boutons */
.bouton_fin_form_edit_add button {
  margin: 0 5px;
}

    .fields-container {
      display:-webkit-box;
      display:-ms-flexbox;
      display:flex;
      -ms-flex-wrap:wrap;
      flex-wrap:wrap;

      flex-grow: 1;
      padding: 5px 0px 5px 10px; /* haut, droite, bas et gauche *//* Ajustez le padding pour réduire la hauteur */
    }

    .position_form {
      width: 80px;
      resize: vertical;  /* limite le redimentionement par l'utilisateur qu'au vertical */
    }
    
    /* Appliquer les styles communs au div et au select avec la classe select_form */
    div.select_form,
    select.select_form {
        /* styles communs */

        resize: vertical;  /* limite le redimentionement par l'utilisateur qu'au vertical */

    }

    /* Appliquer les styles au div avec la classe select_form */
    div.select_form {
        margin: 0px 0px 0px 0px;    /* haut, droite, bas et gauche */
    }

    /* Appliquer les styles au select avec la classe select_form */
    select.select_form {
        width: 190px;
        margin: 0px 0px 0px 10px;    /* haut, droite, bas et gauche */
        height: 28px;
    	vertical-align : middle;
    	padding: 0px 0px 2px 0px;    /* haut, droite, bas et gauche */
    }

    inpute.input_content_form {
      width: 140px;
      resize: vertical;  /* limite le redimentionement par l'utilisateur qu'au vertical */
      margin: 0px 0px 0px 0px;    /* haut, droite, bas et gauche */
    }
    div.input_content_form {
      padding: 0 0 0 10px; /* haut, droite, bas et gauche *//* Ajustez le padding pour réduire la hauteur */
    }

    div.input_taille_form{
      padding: 0 0 0 10px; /* haut, droite, bas et gauche *//* Ajustez le padding pour réduire la hauteur */
    }
    input.input_taille_form{
      width: 55px;
      resize: vertical;  /* limite le redimentionement par l'utilisateur qu'au vertical */
      margin: 0px 0px 0px 0px;    /* haut, droite, bas et gauche */
    }
    
    div.input_rows_form{
      padding: 0 0 0 10px; /* haut, droite, bas et gauche *//* Ajustez le padding pour réduire la hauteur */
    }
    input.input_rows_form{
      width: 55px;
      resize: vertical;  /* limite le redimentionement par l'utilisateur qu'au vertical */
      margin: 0px 0px 0px 0px;    /* haut, droite, bas et gauche */
      font-size: 11px !important;
    }
    
    textarea.input_rows_form{
      width: 55px;
      resize: vertical;  /* limite le redimentionement par l'utilisateur qu'au vertical */
      margin: 0px 0px 0px 0px;    /* haut, droite, bas et gauche */
      font-size: 11px !important;
    }
    
    div.input_cols_form{
      padding: 0 0 0 10px; /* haut, droite, bas et gauche *//* Ajustez le padding pour réduire la hauteur */
    }
    input.input_cols_form{
      width: 55px;
      resize: vertical;  /* limite le redimentionement par l'utilisateur qu'au vertical */
      margin: 0px 0px 0px 0px;    /* haut, droite, bas et gauche */
    }
    
    input.input_valeur_form{
      width: 400px;
      resize: vertical;  /* limite le redimentionement par l'utilisateur qu'au vertical */
      margin: 0px 0px 0px 0px;    /* haut, droite, bas et gauche */
    }
    div.input_valeur_form{
      padding: 0 0 0 10px; /* haut, droite, bas et gauche *//* Ajustez le padding pour réduire la hauteur */
    }
    
    input.checkbox_form{
      width: 20px;
      resize: vertical;  /* limite le redimentionement par l'utilisateur qu'au vertical */
      margin: 0px 0px 0px 0px;    /* haut, droite, bas et gauche */
    }
    div.checkbox_form{
      padding: 4px 0 0 10px; /* haut, droite, bas et gauche *//* Ajustez le padding pour réduire la hauteur */
    }
    
    .textarea_content-full_form {
      width: 100%;
      resize: vertical;  /* limite le redimentionement par l'utilisateur qu'au vertical */
    }
    
    .form select,
    .form input,
    .form textarea {
      font-family: inherit; /* Utilise la police du parent */
      font-size: 16px; /* Ajustez la taille de police pour réduire la hauteur */
      line-height: 1.0; /* Ajustez la hauteur de ligne pour réduire la hauteur */
      border: 1px solid rgba(0, 0, 0, 0.15); /* Imiter la bordure de l'élément par défaut dans Edge */
      border-radius: 4px; /* Ajoute un arrondi aux coins */
      background-color: #ffffff;
}

/* FIN de pour les champs du form editor */

.submit-button {
  text-align: center;
  margin: 20px 20px 20px 20px;    /* haut, droite, bas et gauche */
}

.submit-button button {
  padding: 10px 20px;
  background-color: #C0DDFF;
  border: none;
  border-radius: 8px;
  font-size: 16px;
  cursor: pointer;
}


.row
{
  padding: 5px 0px 5px 0px; /* haut, droite, bas et gauche *//* Ajustez le padding pour réduire la hauteur */
}