/********************************************** GLOBAL *******************************************/
/********************************************** MENU *********************************************/
/********************************************** MAIN *********************************************/
/********************************************** FOOTER *******************************************/
/********************************************** VIDEOJS ******************************************/
/********************************************** MODALS *******************************************/
/********************************************** CONTENT STYLES ***********************************/
/********************************************** SEARCH *******************************************/
/********************************************** CAROUSEL *****************************************/

/********************************************** GLOBAL *******************************************/
body {
  font-family: "proxima-nova", arial, helvetica, sans-serif;
  color: var(--color-grey3);
}

a#main-content {
  display: none;
}

h1, h2, h3, h4, h5
{
  color: var(--color-primary-1);
  font-family: "proxima-nova-bold";
}

h1{
  text-transform: uppercase;
}

strong, .strong 
{
  font-family: "proxima-nova-bold";
}

hr {
  -moz-border-bottom-colors: none;
  -moz-border-left-colors: none;
  -moz-border-right-colors: none;
  -moz-border-top-colors: none;
  
  border-image: none;
  border-style: solid none none;
  border-width: 1px 0 0;
  margin-bottom: 20px;
  margin-top: 20px;

  border-color: var(--color-primary-1);
}

#btn-cookies-management {
  cursor: pointer;
}


.img-responsive {
  max-width: 100%;
  height: auto;
}

.fs-5 {
  font-size: 1rem !important;
}

.fs-6 {
  font-size: 0.75rem !important;
}

/*width 30%*/
.w30p {
  max-width: 30%;
}

@media (min-width: 1400px) {
    .container-xxl, .container-xl, .container-lg, .container-md, .container-sm, .container {
/*        max-width: 1170px;*/
    }
}

@media (max-width: 576px) {
    #btn-cookies-management {
      font-size: 12px;
    }
}

/********************************************** MENU *********************************************/
header {
  position: fixed;
  width: 100%;
  z-index: 500;
  background-color: var(--color-main-background);
}

header .header-top {
  color: var(--color-grey8);
}

header .header-top .logo {
  max-width: 500px;
}

header .header-menu {
  background-color: var(--color-primary-1);
  color: var(--color-white);
}

header .header-menu li {
  min-width: 130px;
}

header .header-menu li,
header .header-menu a {
  color: var(--color-white);

  -webkit-transition: background 1.5s, color 1.5s;
  -moz-transition: background 1.5s, color 1.5s;
  -ms-transition: background 1.5s, color 1.5s;
  -o-transition: background 1.5s, color 1.5s;
  transition: background 1.5s, color 1.5s;
}

header .header-menu li:hover {
  background-color: var(--color-secondary-light-blue);

}
header .header-menu li .fa-caret-down {
  font-size: 12px;
}

header .header-menu .sub-menu {
  position: absolute;
  background: rgba(223, 223, 223, 0.9) none repeat scroll 0 0;
  border-bottom: 1px solid var(--color-primary-1);
}


header .header-menu .sub-menu li,
header .header-menu .sub-menu a {
  color: var(--color-primary-1);
  font-weight: bold;

  -webkit-transition: none;
  -moz-transition: none;
  -ms-transition: none;
  -o-transition: none;
  transition: none;
}


header .header-menu .sub-menu li:hover > a {
  color: var(--color-white);
}

header .header-menu .sub-menu li.active a {
  color: var(--color-primary-2);
}

header .header-menu .sub-menu .sub-menu
{
    left: 100%;
    margin-top: 0;
    padding: 0;
    margin-top: -7px; /*on soustrait le padding du li*/
}

@media (max-width: 768px) {
  header {
    position: static;
  }
}

/*****************************************/
/*GLOBAL NETWORK MENU*********************/
/*****************************************/

header .global-network-dropdown a {
  color: var(--color-grey8);
}

header .global-network-dropdown .dropdown-toggle::after {
  display: none;
}

header .global-network-dropdown .dropdown-menu.show {
  width: 100%;
}

header .global-network-dropdown .dropdown-menu li:hover{
  background-color: var(--color-grey9);
  color: var(--color-main-white);
}

/*****************************************/
/*MENU MOBILE ****************************/
/*****************************************/
#navbar-mobile {
  background-color: var(--color-grey13);
}

#navbar-mobile a {
  color: var(--color-primary-1);
}

#navbar-mobile a li.active {
  color: var(--color-primary-2);
}

#navbar-mobile .global-network-dropdown a {
  background-color: var(--color-main-white);
}

#navbar-mobile .sub-menu {
  background-color: var(--color-grey14);
}

#navbar-mobile .sub-menu .sub-menu a {
  color: var(--color-grey2);
}
/********************************************** MAIN *********************************************/
.region-content {
  padding: 0;
  padding-top: 100px;
}

.node-banner {
  height: 340px;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}

.node-banner.mobile {
/*  max-height: 150px;*/
}

.node img {
  max-width: 100%;
  height: auto;
}

.node img.align-left {
  margin-right: 7px;
  margin-bottom: 7px;
}
.node img.align-right {
  margin-left: 7px;
  margin-bottom: 7px;
}

@media (max-width: 768px) {
  .region-content {
    padding: 0;
  }
}

/********************************************** FOOTER *******************************************/
footer {
  background-color: var(--color-primary-1);
  color: var(--color-white);
}

footer a,
footer a:hover {
  color: var(--color-white);
}

/********************************************** VIDEOJS ******************************************/
/* Modifier la couleur du bouton de lecture principal */
.vjs-big-play-button {
    background-color: var(--color-primary-1) !important; /* Couleur de fond du bouton de lecture */
    color: var(--color-main-white) !important; /* Couleur de l'icône de lecture */
    border: none !important; /* Supprimer la bordure si nécessaire */
    border-radius: 50%; /* Arrondir le bouton pour un effet circulaire */
}

/* Modifier la couleur de la barre de contrôle */
.vjs-control-bar {
    background-color: var(--color-primary-1) !important; /* Couleur de fond de la barre de contrôle */
    color: var(--color-main-white) !important; /* Couleur des icônes de contrôle */
}

/* Assurez-vous que tous les éléments enfants héritent de la bonne couleur */
.vjs-control-bar * {
    color: var(--color-main-white) !important; /* Couleur blanche pour les icônes */
}

/* Modifier la couleur des boutons de la barre de contrôle au survol */
.vjs-control-bar .vjs-button:hover {
    color: var(--color-primary-1) !important; /* Changer la couleur des icônes au survol */
}

/* Modifier la couleur de la barre de progression */
.vjs-progress-holder {
    background-color: rgba(255, 255, 255, 0.2) !important; /* Couleur de fond de la barre de progression */
}

.vjs-play-progress {
    background-color: var(--color-main-white) !important; /* Couleur de la partie lue de la vidéo */
}

.vjs-load-progress {
    background-color: rgba(255, 255, 255, 0.4) !important; /* Couleur de la partie chargée de la vidéo */
}

/* Pour s'assurer que le fond de la barre de contrôle ne soit pas transparent */
.vjs-control-bar {
    background: var(--color-primary-1) !important; /* Couleur de fond solide */
    opacity: 1 !important; /* Forcer l'opacité à 100% */
}

/********************************************** MODALS *******************************************/
#popup-cookies .dismiss a {
  color: var(--color-main-black);
}

#btn-cookies-settings {
  background-color: var(--color-main-background);
}
#btn-cookies-settings:hover {
  background-color: var(--color-grey13);
}

@media (max-width: 576px) {
    #popup-cookies .btn {
      font-size: 12px;
    }

    #popup-cookies .cookies-btn-group > div {
      padding: 0;
    }
    #popup-cookies .cookies-btn-group > div.offset-md-1 {
      padding-left: 7px;
    }
}


/********************************************** CONTENT STYLES ***********************************/

/***** STYLE BLUE *************************************/
.style-corporate_blue .bg-primary {
  background-color: rgba(var(--color-primary-1-rgb), var(--bs-bg-opacity)) !important;
  color: var(--color-white);
}

.style-corporate_blue .border-primary {
  border-color: rgba(var(--color-primary-1-rgb), var(--bs-border-opacity)) !important;
}

.style-corporate_blue h1, .style-corporate_blue h2, .style-corporate_blue h3, .style-corporate_blue h4, .style-corporate_blue h5, .style-corporate_blue a {
  color: var(--color-primary-1);
  font-weight: bold;
}

/***** STYLE RED *************************************/
.style-corporate_red .bg-primary {
  background-color: rgba(var(--color-primary-2-rgb), var(--bs-bg-opacity)) !important;
  color: var(--color-white);
}


.style-corporate_red .border-primary {
  border-color: rgba(var(--color-primary-2-rgb), var(--bs-border-opacity)) !important;
}

.style-corporate_red h1, .style-corporate_red h2, .style-corporate_red h3, .style-corporate_red h4, .style-corporate_red h5, .style-corporate_red a {
  color: var(--color-primary-2);
  font-weight: bold;
}

/***** STYLE BLACK *************************************/
.style-corporate_black .bg-primary {
  background-color: rgba(var(--color-main-black-rgb), var(--bs-bg-opacity)) !important;
  color: var(--color-white);
}

.style-corporate_black .border-primary {
  border-color: rgba(var(--color-main-black-rgb), var(--bs-border-opacity)) !important;
}

.style-corporate_black h1, .style-corporate_black h2, .style-corporate_black h3, .style-corporate_black h4, .style-corporate_black h5, .style-corporate_black a {
  color: var(--color-main-black);
  font-weight: bold;
}

/***** STYLE LIGHT ORANGE *************************************/
.style-light_orange .bg-primary {
  background-color: rgba(var(--color-secondary-light-orange-rgb), var(--bs-bg-opacity)) !important;
  color: var(--color-white);
}

.style-light_orange .border-primary {
  border-color: rgba(var(--color-secondary-light-orange-rgb), var(--bs-border-opacity)) !important;
}

.style-light_orange h1, .style-light_orange h2, .style-light_orange h3, .style-light_orange h4, .style-light_orange h5, .style-light_orange a {
  color: var(--color-secondary-light-orange);
  font-weight: bold;
}

/***** STYLE LIGHT GREEN *************************************/
.style-light_green .bg-primary {
  background-color: rgba(var(--color-secondary-light-green-rgb), var(--bs-bg-opacity)) !important;
  color: var(--color-white);
}

.style-light_green .border-primary {
  border-color: rgba(var(--color-secondary-light-green-rgb), var(--bs-border-opacity)) !important;
}

.style-light_green h1, .style-light_green h2, .style-light_green h3, .style-light_green h4, .style-light_green h5, .style-light_green a {
  color: var(--color-secondary-light-green);
  font-weight: bold;
}

/***** STYLE LIGHT BLUE *************************************/
.style-light_blue .bg-primary {
  background-color: rgba(var(--color-secondary-light-blue-rgb), var(--bs-bg-opacity)) !important;
  color: var(--color-white);
}

.style-light_blue .border-primary {
  border-color: rgba(var(--color-secondary-light-blue-rgb), var(--bs-border-opacity)) !important;
}

.style-light_blue h1, .style-light_blue h2, .style-light_blue h3, .style-light_blue h4, .style-light_blue h5, .style-light_blue a {
  color: var(--color-secondary-light-blue);
  font-weight: bold;
}

/********************************************** SEARCH *******************************************/
#search-form {

}

#search-results .views-exposed-form {
  display: none;
}

#search-results .views-field-title {
/*  display: none;*/
}

#search-results h2 {
  margin-top: 15px;
}

#search-results .view-content {
  margin-bottom: 15px;
}


/********************************************** CAROUSEL *****************************************/
.owl-item .bg-primary h1,
.owl-item .bg-primary h2,
.owl-item .bg-primary h3,
.owl-item .bg-primary h4,
.owl-item .bg-primary h5,
.owl-item .bg-primary h6 {
  color: var(--color-white);
}

.owl-item .bg-primary a {
  text-decoration: underline;
  color: var(--color-white);
} 

@media (max-width: 576px) {
  .owl-item .position-absolute > *,
  .owl-item .position-absolute .text-big,
  .owl-item .position-absolute .text-bigger,
  .owl-item .position-absolute .text-large, 
  .owl-item .position-absolute .text-larger 
  {
    font-size: 9px !important;
  }

  .owl-item .position-absolute p {
    margin-bottom: 0.3rem;
  }
}