/* Polices Google
font-family: 'Alex Brush', cursive;
font-family: 'Montserrat', sans-serif;
font-family: 'Poppins', sans-serif;
*/

/* Palette de couleurs
 Vermillon : #F64740
 Vert Mer : #499167
 Blé : #F5DEB3
 Bleu Pacifique : #06AED5
 */

.rouge {color:#DB504A!important;}
.vermilon {color:#F64740!important;}
.seagreen {color:#499167!important;}
.wheat {color:#F5DEB3!important;}
.pacificblue {color:#06AED5!important;}


.bg-rouge {background-color:#DB504A!important;}
.bg-vert {background-color:#499167!important;}
.bg-jaune {background-color:#F5DEB3!important;}
.bg-bleu {background-color:#06AED5!important;}

body { 

}

/* Hide scrollbar for Chrome, Safari and Opera */
.noscroll::-webkit-scrollbar {
  display: none;
}

/* Hide scrollbar for IE, Edge and Firefox */
.noscroll {
  -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: none;  /* Firefox */
}

.logo-jn {
    /*font-family: 'Alex Brush', cursive;
    font-size: 2.4rem;*/
    font-family: 'Montserrat', sans-serif;
    font-size: 1.275rem;
    font-weight: 300;
}

.logo-jn span {
    text-transform: uppercase;
    /*color:#F64740;*/
    color:#FFF;
    font-weight: 500;
}


.bg-dark {
    background-color: #171717!important;
}


body {
    font-family: 'Montserrat', sans-serif;
    background-color: #171717;
    text-align: justify;
}

p, li, a, h5, .nav-link {font-size: 0.875rem;}

.card-text{text-align: justify;}
p.card-text, .dropdown-item {font-size: 0.8125rem;}

p.strong {font-weight: 600;}


conteneur-accueil {
    margin-top:0;
}

main {overflow-x: hidden;}

.nomCabinet {
  display: none;
}

.show-nomCabinet {
  display: initial;
}

.dropdown-item.active, .dropdown-item:active {
    background-color: #F64740;
}

.titre {
    /*text-transform: uppercase;*/
    color:#fff;
    font-family: 'Alex Brush', cursive;
    /*font-weight: 400;*/
    /*font-size: 3.6rem;*/
    font-size: 6rem;
    margin: 0 0 0 0;
}

.sous-titre {
    color: #F5DEB3;
    /*font-style: italic;*/
    font-size: 1.875rem;
    margin: -1.875rem 0 0 0;
    font-weight: 400;
}

.titre.en-construction {font-size: 10rem;}
.sous-titre.en-construction {font-size: 6rem;color:#F64740;}
#countdown {font-size: 1.85rem;color:#F5DEB3;}

.carousel {
    margin-top: 2rem;
}

.carousel-item {
    min-height: 200px;
}
.carousel-caption {
    bottom: 2.2rem;
    z-index: 2;
}
.carousel-caption h5 {
    color:#FFF;
    text-transform: uppercase;
    font-weight: 500;
    font-size: 1.4rem;
    margin-top: 2rem;
}
.carousel-caption p {
    color:#F5DEB3;
    margin: auto;
    font-size: 0.938rem;
}
.carousel-caption a {
    text-decoration: none;
    background: #F64740;
    border-radius: 0.25rem;
    padding: 0.5rem 1.5rem;
    display: inline-block;
    color: #fff;
    margin-top: 1.2rem;
    line-height: 2rem;
}

.carousel-caption a:hover {
    background-color: #fff;
    color: #F64740;
}

.carousel-inner:before {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: rgba(0, 0, 0, 0.7);
    border-radius: 0.25rem;
    z-index: 1;
}


.chevron-down-link {
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  bottom: 40px;
  left: 50%;
  transform: translateX(-50%);
  text-decoration: none;
  color: #ffffff;
  transition: color 0.3s ease;
  /*background-color: rgba(255, 255, 255, 0.2);
  border-radius: 50%;*/
  width: 50px;
  height: 50px;
}

.chevron-down-link:hover {
  color: #ccc;
}

.glowing {
  text-shadow: 0 0 10px #fff, 0 0 20px #fff, 0 0 30px #fff;
}


.video-background-holder {
  position: relative;
  background-color: black;
  height: 100vh;
  min-height: 25rem;
  width: 100%;
  overflow: hidden;
}

.video-background-holder.en-construction {
  height:100vh;
}

.video-background-holder video {
  position: absolute;
  top: 50%;
  left: 50%;
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  z-index: 0;
  -ms-transform: translateX(-50%) translateY(-50%);
  -moz-transform: translateX(-50%) translateY(-50%);
  -webkit-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
}

.video-background-content {
  position: relative;
  z-index: 2;
}

.video-background-overlay {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background-color: black;
  opacity: 0.1;
  z-index: 1;
}

/*--------------------------------------------------------------
# Contact
--------------------------------------------------------------*/

.contact .map {
  margin-bottom: 40px;
}

.contact .map iframe {
  border: 0;
  width: 100%;
  height: 400px;
}

.contact .php-email-form {
  box-shadow: 2px 2px 2px 1px rgb(0 0 0 / 50%);
  padding: 15px;
  border-radius: 4px;
  background-color: #373737;
}

.contact .php-email-form .error-message {
  display: none;
  color: #fff;
  background: #F93943;
  text-align: left;
  padding: 0.938rem;
  font-weight: 600;
}

.contact .php-email-form .error-message br + br {
  margin-top: 1.563rem;
}

.contact .php-email-form .sent-message {
  display: none;
  color: #fff;
  background: #18d26e;
  text-align: center;
  padding: 0.938rem;
  font-weight: 600;
}

.contact-btn {
    padding: 0.625rem 1.25rem;
    margin: 2.5rem 3rem 0 3rem;
    color: #fff;
    transition: 0.3s;
    font-weight: 600;
    font-size: 1.25rem;
    display: block;
    border: none;
    background: #F93943;
    border-radius: 0.25rem;
    text-align: center;
}

.contact-btn:hover {
  background: #F93943;
  color: #fff;
}

.contact .php-email-form .loading {
  display: none;
  background: #fff;
  text-align: center;
  padding: 0.938rem;
}

.contact .php-email-form .loading:before {
  content: "";
  display: inline-block;
  border-radius: 50%;
  width: 1.25rem;
  height: 1.25rem;
  margin: 0 0.625rem -6px 0;
  border: 3px solid #18d26e;
  border-top-color: #eee;
  -webkit-animation: animate-loading 1s linear infinite;
  animation: animate-loading 1s linear infinite;
}

.contact .php-email-form .form-group {
  margin-bottom: 15px;
}

.contact .php-email-form input, .contact .php-email-form textarea {
  box-shadow: none;
  font-size: 0.938rem;
  border-radius: 4px;
}

.contact .php-email-form input:focus, .contact .php-email-form textarea:focus {
  border-color: #2E2E2E;
}

.form-control {background-color:#F5DEB3;border-color:#171717;}

.contact .php-email-form input {
  padding: 0.5rem;
}

.contact .php-email-form textarea {
  padding:0.5rem;
}

.contact .php-email-form button[type="submit"] {
  background: #F64740;
  border: 0;
  padding: 0.5rem 2rem;
  color: #fff;
  transition: 0.4s;
  border-radius: 4px;
}

.contact .php-email-form button[type="submit"]:hover {
  background: #FFF;
  color:#F64740;
}

section {padding-top:58px;min-height: 100vh;}
section.contact {min-height: calc(100vh - 112px);}
section h3, h4 {color:#F5DEB3;}
section h5 {color:#F64740;}

section h2 {padding: 0;margin: 0 0 1.625rem 0; text-transform: uppercase; color:#F5DEB3; border-bottom:2px solid #F5DEB3;}

section#cabinet, section#maitre-njaboum, section#equipe {background-color:white;}
section#cabinet h2, section#cabinet h3, section#cabinet, section#maitre-njaboum h2, section#maitre-njaboum h3, section#maitre-njaboum h4, 
section#equipe h2, section#equipe h3, section#equipe h4 {color:#2E2E2E;border-bottom:2px solid #2E2E2E;}

section#equipe hr {visibility: hidden;margin: 0.725rem 0;}

section#contact  h4 {font-size: 1.125rem;text-transform: uppercase;}

section#contact p, section#honoraires p, section.expertise p {color:white;}
section#contact a {color: white;}
section p strong {color:#F5DEB3;}

section.contact ul, section.expertise ul {
  list-style: none;
  padding: 0;
}

section.contact  ul li a, a.btnModal {
  color: white;
  text-decoration: none;
}

section.contact  ul li a:hover, a.btnModal:hover {
  color: #F5DEB3;
}

section.contact ul li {
  position: relative;
  padding-left: 1.5rem;
}

section.expertise ul li {
  color: #FFF;
  position: relative;
  padding-left: 1.5rem;
}

section.expertise ul li::before {
  content: '\f560';
  color: #F5DEB3;
  font-family: 'Font Awesome 5 Free';
  font-weight: 900;
  position: absolute;
  left: 0;
  top: 0;
}

section.contact ul li a::before {
  content: '\f054';
  color: #F5DEB3;
  font-family: 'Font Awesome 5 Free';
  font-weight: 900;
  position: absolute;
  left: 0;
  top: 0;
}

.card {text-align:center;background-color: #373737;color:#fff}
.card-title {color:#F5DEB3;}


section#equipe .card {text-align:left;background-color: white;color:#2e2e2e;}
section#equipe .card-title {
  text-align: center;
  color: #FFF;
  font-weight: 600;
  padding: 0.52rem 0;
  margin-left: -1rem;
  margin-top: -1rem;
  margin-right: -1rem;
  background-color: #F64740;
}

.card .btn-honoraires, .btn-cookies {
    background-color: #F64740;
    border-color: #F64740;
    color: #FFFFFF;
    border-radius: 0.25rem;
    font-weight: 400;
    text-decoration: none;
    padding: 0.5rem 1.5rem;
}

.card .btn-honoraires:hover, .btn-cookies:hover {
    background-color: #fff;
    border-color: #fff;
    color: #F64740;
}

.nous-contacter {
  list-style-type: none;
  padding: 0;
}

.nous-contacter li::before {
  color: #F5DEB3;
  font-family: 'Font Awesome 5 Free';
  font-weight: 900;
  position: absolute;
  left: 0;
  top: 0;
}

.nous-contacter .mobile::before {
  content: "\f3cd";
}

.nous-contacter .phone::before {
  content: "\f095";
}

.nous-contacter .fax::before {
  content: "\f1ac";
}

.nous-contacter .adresse::before {
  content: "\f3c5";
}


.nous-contacter {
  color: white;
}

.nous-contacter i {
  color: #F5DEB3;
}

.nous-contacter i:hover {
  color: #F64740;
}

.horizontal-divider {
    border-top: 1px solid white;
    margin: 0 0 0.8125rem 0;
}

.nav-link:hover {color:white;}
.nav-link.active{font-weight:600;border-bottom: 2px solid white;}

.btnRDV {
    background: #F64740;
    margin-left: 0.5rem;
    border-radius: 0.25rem;
    font-weight: 400;
    color: #fff;
    text-decoration: none;
    border: none;
}

.btnRDV:hover, .btn.active:hover {
    background: #FFF;
    color: #F64740!important;
    font-weight: 400;
}

.btnRDV.active {
    border: none;
    font-weight: 400;
}

ul.flag {
  position: absolute;
  bottom: 0.8125rem;
  right: 0.8125rem;
  /* background-color: #171717; */
  z-index: 3000;
  margin: 0;
}

a.flag, span.flag {
  font-size: 0.8125rem;
  font-weight: 700;
  display: block;
  padding-right: 0.25rem;
  padding-left: 0.25rem;
  color: #FFFFFF8C;
  text-decoration: none;
  transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out;

}

span.flag {padding-left:0;padding-right:0;}

a.flag:hover {cursor: pointer;color:white;}

/* FOOTER */

.footer {
  background-color: #171717;
  color: white;
}
.footer a:hover {
  color: #F5DEB3;
}

.footer .copyright {
  font-size: 0.875rem;
}

.footer .reseaux-sociaux i {
  margin-right: 0.3125rem;
}

a.icones-réseaux-sociaux {
  color:#fff;
}

a.icones-réseaux-sociaux:hover {
  color:#F64740;
}

.navbar-nav {
  align-items: center;
}

.nav-item {
  display: flex;
  align-items: center;
}

.modal-body h4 {color:#F64740;}

#loader {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #171717;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  z-index: 2000;
}

.loader-logo {
  width: 187px; 
  margin-bottom: 20px; 
}

.dots {
  display: flex;
}

.dots span {
  width: 10px;
  height: 10px;
  background-color: white;
  border-radius: 50%;
  margin-right: 15px;
  opacity: 0;
  animation: dot 1s 1;
}

@keyframes dot {
  0% { opacity: 0; }
  20% { opacity: 0; }
  100% { opacity: 1; }
}

/* Changez le délai de l'animation pour chaque point */
.dots span:nth-child(1) { animation-delay: 0.1s; }
.dots span:nth-child(2) { animation-delay: 0.2s; }
.dots span:nth-child(3) { animation-delay: 0.3s; }
.dots span:nth-child(4) { animation-delay: 0.4s; }
.dots span:nth-child(5) { animation-delay: 0.5s; }
.dots span:nth-child(6) { animation-delay: 0.6s; }
.dots span:nth-child(7) { animation-delay: 0.7s; }
.dots span:nth-child(8) { animation-delay: 0.8s; }
.dots span:nth-child(9) { animation-delay: 0.9s; }
.dots span:nth-child(10) { animation-delay: 1s; }