@import url('https://fonts.googleapis.com/css2?family=Comfortaa:wght@300..700&display=swap');
.video-container2 {
    height:850px;
    width: 100%;
    overflow: hidden;
    position: relative;
  }
  .video-container2 video {
    min-width: 100%;
    min-height: 100%;
    position: absolute;
    top: 60%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
  }
  .video-container2::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.25); 
    pointer-events: none; /* Permet les interactions avec la vidéo sous le voile */
}
  .video-container2 .caption {
    z-index: 1;
    font-family: "Comfortaa", sans-serif;
  position: relative;
  text-align: center;
  padding-left: 10px;
  padding-top: 200px;
  font-size: 10em;
  font-weight: 100;
  color:rgba(255, 255, 255, 0.8);
  }
  .btn{
    font-family: 'Montserrat', sans-serif;
  }
  .btn-hover-effect:link, .btn-hover-effect:visited {
    font-family: 'Montserrat', sans-serif;
    text-transform: none;
    font-size: 1.2rem;
    font-weight: 100;
    border-color: #fff;
    color: white; /* Définir la couleur de texte initiale */
    background-color: transparent;
    border-color: #aaa;
    transition: background-color 0.3s, color 0.3s; /* Transition douce pour la couleur de fond et texte */
}
.btn-hover-effect:hover  {
    background-color: rgba(255,255,255,.8); /* Couleur de fond lors du survol */
    color: #000; /* Couleur de texte lors du survol */
    font-family: 'Montserrat', sans-serif;
    font-weight: 600;
}
  .mg150 {
    margin-top: 150px;
  }
  .mg100 {
    margin-top: 100px;
  }
  .zbout {
    font-size: 16px; /* Taille du texte */
    text-transform: none;
    color: #395584; /* Couleur du texte */
    background-color: #fff; /* Couleur de fond */
    border: 1px solid #ccc; /* Couleur de bord */
    border-radius: 10px; /* Arrondis des coins */
    padding: 10px 20px; /* Espacement interne */
    text-decoration: none; /* Pas de soulignement */
    display: inline-block; /* Permet le padding correct */
    box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
}
.zbout:hover {
    background-color: #395584; /* Couleur de fond au survol */
    color:#fff;
}
/*------------------------------------------------------------------------------------------------*/
.custom-dropdown {
  position: relative;
}
.custom-dropdown-menu li {
  margin: 0; /* Assurez-vous qu'il n'y a pas de marges ajoutant de l'espace */
  padding: 0; /* Enlève le padding par défaut des éléments li */
  list-style-type: none; /* Enlève les puces */
}
.custom-dropdown-menu {
  background-color: rgba(253, 255, 255, 0.9);
  /* background-color: rgba(0,0,0,.75); */
  box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2);
  z-index: 1000;
  list-style-type: none;
  padding: 0;
  display: none; /* Cache le menu déroulant par défaut */
  position: absolute;
  width: 350px; /* Optionnel: ajuster selon la largeur désirée */
  left: 0;
}
.custom-dropdown-menu {
  margin: 0;
  line-height: 1;
  padding: 10px;
}
.custom-dropdown-menu a {
  padding: 3px 3px; /* Padding réduit déjà en place */
  text-decoration: none;
  display: block;
  color: #333 !important; /* Couleur du texte */
  font-size: 0.8rem !important; /* Taille de la police ajustée */
  width:100%;
  box-sizing: border-box; 
  border-radius: 0;
  line-height: 1.2rem !important; /* Ajoutez cette ligne pour réduire l'espacement inter-lignes */
}
.custom-dropdown-menu a:hover {
  color: #fff !important;
  background-color: #31528e !important;
  box-shadow: rgba(50, 50, 93, 0.25) 0px 6px 12px -2px, rgba(0, 0, 0, 0.3) 0px 3px 7px -3px;
}
.custom-dropdown:hover .custom-dropdown-menu {
  display: block; /* Assurez-vous que cette règle pointe vers le menu correct */
}
.custom-dropdown-toggle::after {
  content: " ▼";
}
.custom-dropdown-right .custom-dropdown-menu {
  right: 0;
  left: auto;
}
.custom-no-border-radius {
  border-radius: 8px;
}
.custom-li {
  font-size: 1em; /* Taille de la police */
  color: #333333; /* Couleur du texte */
  font-family: "Montserrat", sans-serif;
}
.tti {
color: #31528e;
}
/*------------------------------------------------------------------------------------------------*/
  .footer .footer-main {
    position: relative;
    color: #000;
    z-index: 2;
    /* height: 350px; Hauteur du bandeau */
    width: 100%; /* Largeur du bandeau */
    overflow: hidden; /* Assure que l'excès de vidéo ne déborde pas */
}
#background-video {
    position: absolute;
    top: 0;
    left: 50%;
    width: 100%;
    height: 100%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    object-fit: cover; /* Assure que la vidéo couvre entièrement l'espace disponible */
    /* object-position: bottom; Cadre la vidéo sur le bas */
    /* object-position: center,center;  */
    object-position: bottom; 
    z-index: -1; /* Place la vidéo derrière le contenu */
}
.tde {
  margin-right: 20%;
}
.formatp p {
  font-family: "Montserrat", sans-serif;
	font-size: 1rem;
	line-height: 1.4rem ;
	text-align: justify;
	color :#333;
  padding-right: 40%;
  padding-left: 5%;
}
.noformatp p{
  font-family: "Montserrat", sans-serif;
	font-size: 1rem;
	line-height: 1.4rem ;
	text-align: justify;
	color :#333;
}
.espaimg {
  padding-bottom: 35px;
    }
@media (max-width: 1300px) {
	.formatp p{
    font-family: "Montserrat", sans-serif;
    font-size: 1rem;
    line-height: 1.4rem ;
    text-align: justify;
    color :#333;
  padding-right: 0%;
  }
@media (max-width: 1140px) {
	.espaimg {
padding-bottom: 35px;
  }
.
/* Media query pour les écrans mobiles */
@media (max-width: 768px) {
  .footer .footer-main {
      height: 650px; /* Augmente la hauteur sur les écrans mobiles */
  }
  .tde {
    margin-right: 0%;
  }
  .footer .footer-main {
    position: relative;
    color: #000;
    z-index: 2;
    height: 650px ; /* Hauteur du bandeau */
    width: 100%; /* Largeur du bandeau */
    overflow: hidden; /* Assure que l'excès de vidéo ne déborde pas */
}
}
  @media (max-width: 900px) {
    .video-container2 {
      /* position: relative; */
      width: 100vw; /* Utiliser 100% de la largeur disponible */
      height: 600px; /* Ajuster la hauteur en fonction de la largeur pour conserver les proportions */
      overflow: hidden;
    }
    .video-container2 video {
      width: 100vw;  
      height: auto; 
      object-fit: cover; 
      position: relative;
      top: 65%;
      left: 50%;
    }
    .video-container2 .caption {
      z-index: 1;
      font-family: "Comfortaa", sans-serif;
      position: absolute;
      top: 40%; 
      left: 50%; 
      transform: translate(-50%, -50%); 
      text-align: center;
      font-size: 4em;
      font-weight: 100;
      color: rgba(255, 255, 255, 0.8);
    }
    .mg150 {
      margin-top: 0px;
    }
    .mg100 {
      margin-top: 0px;
    }
  }
/*----------------------------------------------------------------------------------------------------------------------------------------*/
.contact-form {
  /* max-width: 800px; */
  position: relative;
  z-index: 1;
  /* margin-bottom: 30px; */
}
.contact-form h2 {
  font-size: 30px;
  margin-bottom: 15px;
}
.contact-form .form-group {
  margin-bottom: 15px;
  position: relative;
}
.contact-form .form-group .form-control {
  height: 30px;
  color: #000;
  border: 1px solid #fff;
  /* background-color: #a8dffc45; */
  font-size: 14px;
  padding: 10px 20px;
  width: 100%;
  border-radius: 0;
}
.contact-form .form-group .form-control:focus {
  outline: none;
  border-color: #555;
  -webkit-box-shadow: none;
          box-shadow: none;
}
.contact-form .form-group textarea.form-control {
  height: auto;
}
.contact-form .with-errors {
  float: left;
  font-size: 12px;
  margin-top: 10px;
  margin-bottom: 0;
  color: #000;
  font-weight: 400;
  display: block;
}
.contact-form .text-danger {
  font-size: 18px;
  margin-top: 15px;
}
.contact-form .default-btn {
  border: 0;
  outline: none;
  width: 50%;
  text-align: center;
  border-radius: 15px;
  text-align: center;
}
.contact-form .form-group .form-control::-webkit-input-placeholder {
  color: #000;
}
.contact-form .form-group .form-control:-ms-input-placeholder {
  color: #000;
}
.contact-form .form-group .form-control::-ms-input-placeholder {
  color: #000;
}
.contact-form .form-group .form-control::placeholder {
  color: #000;
}
/*--------------------------------------------------------------------------------------------------------------------------*/