html {
  scroll-behavior: smooth;
}

:root {

  /* Valeurs qui sont semblables tout texte */
  --font-style : normal;
  --font-variant : normal;
  --font-family: "Poppins";
  
  /*  'Graisse' de la police  */
  --normal : 400;
  --bold : 700;
  --semi-bold : 600;

  /* 'Taille' de la police (Font-size) */
  --fs-14 : 14px;
  --fs-15 : 15px;
  --fs-17 : 17px;
  --fs-20 : 20px;

  /*  'Hauteur' de ligne (line-height)  */
  --lh-22 : 22px;
  --lh-33 : 33px;


  --header-z-index: 50;
  --video-z-index: 0;
  --lifras-logo-small-width : 50px;
  --max-width : 1920px;

  --video-max-height : 104vh; /*1120px; */

  /* Margin utilisé */
  --margin-5 : 5px;
  --margin-10 : 10px;
  --margin-15 : 15px;
  --margin-20 : 20px;
  --margin-30 : 30px;
  --margin-40 : 40px;
  --margin-50 : 50px;
  --margin-60 : 60px;
  --margin-80 : 80px;

  /* Padding utilisés */
  --padding-5 : 5px;
  --padding-10 : 10px;
  --padding-15 : 15px;
  --padding-20 : 20px;
  --padding-30 : 30px;
  --padding-40 : 40px;
  --padding-50 : 50px;
  --padding-60 : 60px;
  --padding-75 : 75px;
  --padding-120 : 120px;
  
  --global-padding : 250px; /* La valeur de cette variable est réduite selon les écrans */
  --global-sub-section-padding : 250px; /* La valeur de cette variable est réduite selon les écrans */
  --global-sub-sub-section-padding : 80px; /* La valeur de cette variable est réduite selon les écrans */

  /* Blur utilisé */
  --blur-7 : blur(7px);
  --blur-10 : blur(10px);
  --blur-20 : blur(20px);
  --blur-30 : blur(30px);
  --blur-40 : blur(40px);
  --blur-60 : blur(60px);

  /* GAP utilisé */
  --gap-10 : 10px;
  --gap-15 : 15px;
  --gap-20 : 20px;
  --gap-30 : 30px;
  --gap-35 : 35px;
  --gap-40 : 40px;
  --gap-50 : 50px;
  --gap-60 : 60px;
  --gap-70 : 70px;
  --gap-80 : 80px;
  --gap-100 : 100px;

  /* Border radius utilisés */
  --border-radius-5 : 5px;
  --border-radius-10 : 10px;
  --border-radius-15 : 15px;
  --border-radius-20 : 20px;
  --border-radius-25 : 25px;
  --border-radius-30 : 30px;
  --border-radius-45 : 45px;
  --border-radius-50 : 50px;

  /** Couleurs utilisées dans l'application **/
  --color-white : #FFFFFF;
  --color-blue-muted-10 : #48768B1A;
  --color-blue-muted-20 : #48768B33;
  --color-blue-very-light : #F2F9FC;
  --color-blue-pastel : #D8E0EC;
  --color-blue-soft : #CEEEFE;
  --color-blue-sky : #C4ECFF;
  --color-blue-baby : #BEEAFF;
  --color-blue-aqua : #92D7DF;
  --color-blue-light : #7EBBD8;
  --color-blue-light-hover : #5FA4C6;
  --color-blue-medium : #4F8EAB;
  --color-blue-steel : #53849B;
  --color-blue-dark : #48768B;
  --color-blue-deep : #13516E;

  /* Font utilisé à différents endroits */
  --text-sm : normal normal normal 15px/25px Poppins;
  --text-span-bold : normal normal 600 15px/33px Poppins;
  --text-span-bold-sm : normal normal 600 15px/25px Poppins;
  --title-bold : normal normal bold 38px/55px Poppins;
  --text-link : normal normal normal 15px/33px Poppins;

}

p {
  margin-block-start: 0em;
  margin-block-end: 0em;
}

textarea {
  resize: none;
}

.justify-center {
  justify-content: center;
}
.justify-left {
  justify-content: left;
}

.align-center {
  align-content: center;
}

.btn-scroll-top {
  z-index:999;
  position:fixed;
  right:50px;
  top:750px;
  font : normal normal 600 25px/33px Poppins;
  height:50px;
  width:50px;
  background: var(--color-blue-aqua) 0% 0% no-repeat padding-box;
  border-radius:var(--border-radius-45);
  align-content:center;
  text-align: center;
  rotate:-90deg;
  cursor:pointer;
  color: white;
  display: none;
  visibility: hidden;
}

.btn-scroll-top.active {
  display: block;
  visibility: visible;
}

.btns-wrapper {
  display:flex;
  flex-direction: row;
  gap: var(--gap-10);
  flex-wrap: wrap;
  align-items: center
}

.btns-wrapper-n-centered {
  margin-top: var(--margin-15);
  align-items: flex-start;
}

.btn-modal {
  margin-left:-4px;
}

.title_span_bold {
  font: var(--title-bold);
  letter-spacing: 0px;
  color: var(--color-blue-deep);
}

.txt_span_bold_white {
  font: var(--text-span-bold);
  letter-spacing: 0px;
  color: white;
}

.txt_span_bold {
  font: var(--text-span-bold);
  letter-spacing: 0px;
  color: var(--color-blue-dark);
}

.udnerline {
  text-decoration: underline;
}

.txt_span_bold_sm {
  font: var(--text-span-bold-sm);
  letter-spacing: 0px;
  color: var(--color-blue-dark);
}

/* .btn-scroll-chevron {
  font : normal normal 600 25px/33px Poppins;
} */

.sub-sub-section-margin {
  margin : var(--global-sub-sub-section-padding);
}

html {
  font-family: 'Poppins', sans-serif;
  font-weight: 400;
}

body { 
  margin : auto;
  min-width: 300px;
}

.white-section {
  background-color: var(--color-white);
}

.colored-section {
  background-color:var(--color-blue-very-light);
}

.sub-section {
  padding:var(--padding-40) var(--global-sub-section-padding) var(--padding-40) var(--global-sub-section-padding);
  display: flex;
  flex-direction: column;
  gap:var(--gap-80);
  border-top-left-radius:var(--border-radius-30);
  border-top-right-radius:var(--border-radius-30);
  position:relative;
}

.sub-section-rounded {
  border-radius : var(--border-radius-30);
}

.sub-sub-section {
  display:flex;
  flex-direction:column;
  gap:var(--gap-80);
  padding:var(--global-sub-sub-section-padding);
  background-color:var(--color-blue-very-light);
  border-radius : var(--border-radius-30);
}


.sub-sub-section-no-padding {
  padding: 0px;
}

.sub-sub-section-with-margin {
  margin:var(--global-sub-sub-section-padding);
}

.global-section {
  padding:var(--padding-120) var(--global-padding) var(--padding-120) var(--global-padding);
  display: flex;
  flex-direction: column;
  gap:var(--gap-80);
  margin-top:-35px;
  margin-bottom: -25px;
  border-top-left-radius:var(--border-radius-30);
  border-top-right-radius:var(--border-radius-30);
  position:relative;
}

.section-without-img {
  margin-top:-378px;
}

.noborder-section {
  border-radius: 0px;;
}

.section-w-xsm-padding { padding-bottom: 150px; }
.section-w-sm-padding { padding-bottom: 250px; }
.section-w-medium-padding { padding-bottom:300px; }
.section-w-padding { padding-bottom:350px; }
.section-w-xl-padding { padding-bottom:500px; }

.section-w-nmargin-top-xm { margin-top: -500px; }
.section-w-nmargin-top { margin-top: -250px; }
.section-w-nmargin-top-sm { margin-top: -200px; }
.section-w-margin-top { margin-top: 200px; }

.box-shadow {
  box-shadow: 10px 10px 40px #13516E33;
}

.no-border-radius {
  border-radius: 0px;
}

.brevet-section-wrapper {
  padding:var(--gap-60);
  margin: 0px var(--margin-60) var(--margin-60) var(--margin-60);
  display:flex;
  flex-direction:column;
  gap : var(--gap-30);
}

.footer-section {
  padding:35px 230px 15px 230px;
  background: var(--color-blue-medium) 0% 0% no-repeat padding-box;
  opacity:1;
  color:var(--color-white);
  border-radius:var(--border-radius-30) var(--border-radius-30) 0px 0px; /* top-left top-right bottom-right bottom-left*/
}

.footer-wrapper {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}

.max-sized {
  max-width: var(--max-width);
  margin-left: auto;
  margin-right: auto;
  width: 100%;
}

.footer-items {
  display: flex;
  flex-direction: column;
}

.footer-content {
  display: flex;
  flex-direction: column;
}

.footer-title {
  font: normal normal 600 17px/25px Poppins;
  margin-bottom:var(--margin-20);
}

.footer-text {
  font: var(--text-sm);
  gap: 0px var(--gap-10);
  align-items: center;

}

.footer-anchor {
  display: flex;
  flex-direction: row;
  text-decoration: none;
}

.footer-subtext {
  font-style : var(--font-style);
  font-variant: var(--font-variant);
  font-weight: var(--normal);
  font-size: var(--fs-15);
  line-height: var(--lh-33);
  font-family: var(--font-family);
  letter-spacing: 0px;
  color:var(--color-blue-sky);
}

.footer-barinf-text {
  font: normal normal normal 14px/25px Poppins;
  color:var(--color-white);
}

.h-full {
  height: 100%;
}

.h-fit {
  height: fit-content;
}

.min-h-content {
  min-height: max-content;
}

.h-video {
  height: var(--video-max-height);
}

.h-500 {
  height: 500px;
}

.gap-sm  {
  gap:var(--gap-40);
}

.gap-xsm  {
  gap: var(--gap-20);
}

.mx-auto {
  margin-left: auto;
  margin-right: auto;
}

.mt-80 {
  margin-top: var(--margin-80);
}

.txt_grid_wrapper {
  display:flex;
  flex-direction:row;
  gap:var(--gap-100);
  color:var(--color-blue-dark);
  font: var(--text-link);
  letter-spacing: 0px;
}

.link_w_chevron {
  display:flex;
  flex-direction:row;
  gap: var(--gap-10);
  align-items: center;
  justify-content: center;
}

button, .link_w_something {
  border-radius:var(--border-radius-25);
  padding:8px 25px 8px 25px;
  text-align: center;
  align-content:center;
  width: fit-content;
  font: var(--text-link);
}

.link-news {
  position: relative;
  display:flex;
  flex-direction:row;
  gap: var(--gap-10);
  width:fit-content;
  margin-top: var(--margin-30);
  color:var(--color-blue-light);
  font: normal normal normal 17px/33px Poppins;
  border-radius: 0px;
  padding: 0px;
}

.link-news::after {
  content: "";
  position: absolute;
  left: 0;
  bottom : -2px;
  width: 100%;
  height: 1px;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.3s ease-in-out;
  background: var(--color-blue-light);
}

.link-news:hover::after {
  transform: scaleX(1);
}

.link_w_something span#menu-chevron {
  display: inline-block;
  transition: transform 0.3s ease;
}
.link_w_something:hover span#menu-chevron {
  transform: translateX(3px);
}

.link_w_bg_blue {
  background-color:var(--color-blue-light);
  color: var(--color-white);
  width:fit-content;
  transition: background-color 0.3s ease-in-out;
}

.link_w_bg_blue:hover {
  background-color:var(--color-blue-light-hover);
}

.link_w_border_light_blue{
  border: 1px solid var(--color-blue-aqua);
  color: var(--color-blue-aqua);
} 

.link_w_bg_dark_blue {
  background: var(--color-blue-medium) 0% 0% no-repeat padding-box;
  color: var(--color-white);
}

.link_w_bg_steel_blue {
  background: var(--color-blue-steel) 0% 0% no-repeat padding-box;
  color: var(--color-white);
}

.link_w_bg_light_blue {
  background: var(--color-blue-aqua) 0% 0% no-repeat padding-box;
} 

.link_w_bg_white {
  backdrop-filter: var(--blur-20);
  color : var(--color-white);
  background: #FFFFFF4D;
}

.link_w_bg_white_squared {
  border-radius: var(--border-radius-10);
  backdrop-filter: var(--blur-10);
  opacity: 1;
  cursor: pointer;
}

.link_w_border_blue {
  border: 1px solid var(--color-blue-light);
  color:var(--color-blue-light);
}

.link_w_border_white {
  border: 1px solid var(--color-white);
}

.link_w_border_dark_blue {
  border: 1px solid var(--color-blue-deep);
  color:var(--color-blue-deep);
}

.open-burger {
  height: 35px;
  width: 35px;
}

.close-burger {
  height: 25px;
  width: 25px;
  margin-left: 10px;
  margin-top: 5px;
}

.svg.active {
  display : flex;
  filter : invert(1);
}

.svg {
  display: none;
}

.overflow-hidden {
  overflow: hidden;
}

.header-navbar-burger-submenu-items {
  max-height: 0px;
  opacity: 0;
  overflow: hidden;
  transition: 
    opacity 0.4s ease-in-out,
    max-height 0.4s ease-in-out;
}

.header-navbar-burger-submenu-items.active {
  max-height : 800px;
  opacity: 1; 
}

.header-navbar-burger-items {
  color: var(--color-white);
  padding: var(--padding-10) var(--padding-20) var(--padding-20) var(--padding-20);
}

.header-wrapper {
  position: relative;
  width: 100%;
}

.header-navbar-burger-wrapper {
  opacity: 0;
  overflow: hidden;
  max-height: 0px;
  z-index: var(--header-z-index);
  position: relative;
  backdrop-filter: var(--blur-30);

  transition: 
  opacity 0.4s ease-in-out,
  max-height 0.4s ease-in-out;
  /* visibility 0s 0.4s; */

}

.newsCardTitle {
  font: normal normal 600 20px/33px Poppins;
  margin-top:var(--margin-10);
  color:var(--color-blue-deep);
}

.newsCardSubtitle {
  -webkit-line-clamp : 2;
  overflow: hidden;
  font : normal normal normal 17px/33px Poppins;
  color: var(--color-blue-dark);
  text-align: left;
}

.newsCardDesc {
  position: relative;
  height: 140px;
  overflow: hidden;
  font: var(--text-link);
  margin-top:20px;
  color:var(--color-blue-dark);
}

.newsCardDate {
  font: var(--text-sm);
  margin-top: var(--margin-30);
  color:var(--color-blue-dark);
}

.header-navbar-wrapper {
  z-index: var(--header-z-index);
  position: relative;
  padding : 55px var(--global-padding) 15px var(--global-padding);
  backdrop-filter: var(--blur-60);
  background-color: #53849B80;
}

.header-navbar {
  display:flex;
  flex-direction:row;
  justify-content:space-between;
  gap: 150px;
}

.header-text {
  color : var(--color-white);  
  padding : 0px 0px 0px 250px;
}

.header-page-title {
  top:0px;
  left:0px;
  padding: 250px 0px 10px 0px;
  position:absolute;
  color:var(--color-white);
  font: normal normal bold 54px/80px Poppins;
  width: 100%;
  display: flex;
  justify-content: center;
  text-align: center;
}

.header-title-wrapper-text {
  top:0px;
  left:0px;
  gap:30px 0px;
  position:absolute;
  display:flex;
  flex-direction:column;
  padding:350px var(--global-padding) 10px var(--global-padding);
  max-width:1050px;
  width: fit-content;
  color:var(--color-white);
}

.header-title-texte-big {
  font: normal normal normal 60px/80px Poppins;
}

.header-title-texte-big-bold {
  font: normal normal bold 60px/80px Poppins;
}

.header-title-texte-small {
  font: normal normal normal 17px/33px Poppins;
}

.header-navbar-chevron.active {
  transform: matrix(0, 1, -1, 0, 0, 0);
  /* height: 24px; */
}

.header-navbar-chevron {
  transform: matrix(0, -1, 1, 0, 0, 0);
  /* height: 24px; */

  transition: transform 0.4s ease-in-out;
}

.header-navbar-items-burger { display: none; }

.header-navbar-items {
  display: flex;
  flex-direction: row;
  justify-content:space-between;
  width:100%;
  margin-right: 10px;
  align-items: center;

}

.menu-list-item {
  width: fit-content;
  list-style: none;
  position: relative;
  height: 24px;
}

.menu-list-item::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -2px;
  width: 100%;
  height: 1px;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.3s ease-in-out;
  background: white;
}

.menu-list-item:hover::after {
  transform: scaleX(1);
}

.header-navbar-items li {
  color:var(--color-white);
  list-style-type: none;
  display: flex;
  align-items: center;
  flex-direction: row;
  gap: 0px 10px;
  cursor: pointer;
  text-align: left;
  height: 24px;
}

.header-navbar-items a {
  text-decoration: none;
  color: var(--color-white);
  list-style: none;
}

.header-logo-lifras-small {
  width: var(--lifras-logo-small-width);
  display: none;
}
.header-logo-lifras { width: 160px; }
.footer-logo-lifras { width:160px; }

.footer-social-networks {
  width:45px;
  height:45px;
}

.icon {
  height: 15px;
  width: 15px;
  padding-top: 5px;
}

.flex {
  display: flex;
}

.hidden {
  visibility: hidden;
}

.display-none {
  display: none;
}

.top-100 { top : 100px; }

.footer-grid-col-3 {
  grid-column: 3;
}

.footer-grid-col-2 {
  grid-column: 2;
}

.revert {
  transform: scaleX(-1);
}

.background-submenu-colored.active {
  background-color: #4F8EABf0;
}

.background-submenu-not-colored {
  background-color: #53849B80; /* 80 = environ 50% d'opacité */
}

.header-subnavbar.active.absolute {
  position: absolute;
}

.header-subnavbar.active {
  opacity: 1;
  visibility: visible;
  transition: 
    opacity 0.4s ease-in-out,
    visibility 0s 0s;

}

.header-subnavbar {
  opacity: 0;
  visibility: hidden;

  position:absolute;
  top:122px;
  left:0px;
  width: 100%;
  color:var(--color-white);
  display: flex;
  gap:0px 60px;
  backdrop-filter: var(--blur-40);
  z-index: var(--header-z-index);
  overflow: hidden;

  transition: 
    opacity 0.4s ease-in-out,
    visibility 0s 0.4s;
}

.header-subnavbar-wrapper {
  display: flex;
  flex-direction: row;
  gap:0px 60px;
  padding:30px var(--global-padding) 40px var(--global-padding);

}

.header-subnavbar-text-black {
  color: black;
}


.header-subnavbar-text-wrapper {
  display:flex;
  flex-direction:column;
  max-width:350px;
  gap: var(--gap-20);
  font: normal normal 400 15px/33px Poppins;
}

.vertical-bar {
  border-left:solid 1px var(--color-white);
}

.vertical-bar-black {
    border-left:solid 1px black;

}

.header-subnavbar-items {
  display:flex;
  flex-direction:column;
  gap:10px 0px;
  margin-block-start: 0px;
  margin-block-end: 0px;
}

ul {
    margin-block-start: 0px;
    margin-block-end: 0px;
    padding-inline-start: 20px;
}

.Texte_Footer ol li::marker, ul li::marker {
  color : var(--color-blue-aqua);
}


.Texte_Footer ol li::marker, ul li {
  font: normal normal 400 15px/20px Poppins;
  letter-spacing: 0px;
  margin-top: 10px;
}

ul li .menu-list-item {
  list-style-type: none;
  text-align: left;
}

a, ul li a {
  text-decoration: none;
  color: var(--color-white);
  cursor: pointer;
}

/** Pour les menus qui sont cachés par le blan du contenu. **/
.vertical-bar-black ul li a {
  color : black
}
/** Infos pratiques dans le détail d'une activité, ils peuvent être <p> ou <ul> avec <li> **/
.liste-infos-pratique ul li, .liste-infos-pratique p {
  font: normal normal normal 17px/25px Poppins;
  color: var(--color-blue-dark);
}

.colored-list {
  margin-block-start: 0px;
  margin-block-end: 0px;
  padding-inline-start: 20px;
}

.colored-list-item {
  /* text-decoration: disc; */
  font: normal normal normal 15px/20px Poppins;
  letter-spacing: 0px;
  color: var(--color-blue-dark);
  margin-top: 10px;
}

.colored-list-item::marker {
  color:var(--color-blue-aqua)
}

.txt_n_list_wrapper {
  display:flex;
  flex-direction:column;
  gap: var(--gap-20);
}

.header-video {
  display: block;
  width: inherit;
  position: relative;
  object-fit: cover;
  height: 100%;

}

.video {
  height: inherit;
  object-fit: cover;
}

.video-container {
  display: block;
  position: absolute;
  width: inherit;
  top: 0px;
  left: 0px;
  height: inherit;

}

.header-image {
  display: block;
  width: inherit;
  position: relative;
  object-fit: cover;
  height: 100%;
}

.header-img-container {
  width: inherit;
  position:absolute;
  top:0px;
  left:0px;
  height: 490px;
}

.mb-20 {
  margin-bottom: 20px;
}

.bold {
  font-style : var(--font-style);
  font-variant: var(--font-variant);
  font-weight: var(--bold);
  font-size: var(--fs-14);
  line-height: var(--lh-22);
  font-family: var(--font-family);
}

.contact-address-item {
  display:flex;
  flex-direction: row;
  gap: var(--gap-10);
  align-items: center;
  font: normal normal normal 17px/33px Poppins;
  letter-spacing: 0px;
  color: var(--color-blue-dark);
}

.horizontal-bar {
  width:100%;
  margin-top:20px;
  margin-bottom:15px;
  height:0.5px;
  background:var(--color-white);
}

.horizontal-bar-pastel {
  margin-top:10px;
  width:100%;
  border: 1px solid #D8E0EC;
  background: var(--color-blue-pastel);
}

.semi-bold {
  font: var(--text-span-bold-sm);
}

.regular {
  font-style : var(--font-style);
  font-variant: var(--font-variant);
  font-weight: var(--normal);
  font-size: var(--fs-14);
  line-height: var(--lh-22);
  font-family: var(--font-family);
  letter-spacing:0px;
  color: var(--color-white);
}

.flex-row {
  display: flex;
  flex-direction: row;
}

.flex-col {
  display: flex;
  flex-direction: column;
  /* align-items: center; */
}

.justify-between {
  justify-content: space-between
}

.decoration-none {
  text-decoration: none;
}

.footer-organica {
  font-style : var(--font-style);
  font-variant: var(--font-variant);
  font-weight: var(--semi-bold);
  font-size: var(--fs-14);
  line-height: var(--lh-33);
  font-family: var(--font-family);
  letter-spacing: 0px;
  color: var(--color-white);
}

.barinf {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  max-width: var(--max-width);
  margin-left: auto;
  margin-right: auto;
}

.barinf-items {
  display: flex;
  flex-direction: row;
  align-items: center;
}

/* Pré-header -> Rechercher - Accès membre - Whois */
.whois {
  background: var(--color-blue-light) 0% 0% no-repeat padding-box;
}

.acces-membre {
  background: var(--color-blue-aqua) 0% 0% no-repeat padding-box;
}

.pre-header-wrapper {
  color:var(--color-white);
  position:absolute;
  display:flex;
  flex-direction:row;
  gap:0px 10px;
  z-index:51;
  right: var(--global-padding);
}

.pre-header-text {
  font: normal normal 400 14px/23px Poppins;
}

.pre-header-wrapper-item {
  border-radius:0px 0px 14px 14px;
  backdrop-filter:var(--blur-20);
  padding:12px 24px 12px 24px;
}

.pre-header-wrapper-items {
  height: fit-content;
  border-radius:0px 0px 14px 14px;
  background: var(--color-blue-aqua) 0% 0% no-repeat padding-box;
  backdrop-filter:var(--blur-20);
  display:flex;
  flex-direction:row;
  gap:12px 12px;
  padding:12px 24px 12px 24px;
}

.search-input {
  opacity: 0;
  position: relative;
  font-size: 15px;
  font-family: 'Poppins';
  z-index: 1000;

  background-color: #92D7DF;
   height:fit-content;
  width: 0px;

  outline: none;
  border: none;
  box-shadow: none;
  color: white;

  transition:
    width 0.8s ease-in-out,
    opacity 0.6s ease-in-out;

}
.search-input::placeholder {
  color: white;
}

.search-input.active {
  opacity : 1;
  width: 150px;
}

.recherche {
  background: rgba(255, 255, 255, 0.3) 0% 0% no-repeat padding-box;
  backdrop-filter: var(--blur-20);
}

.custom-select {
  max-height: 50px;
  border-radius: var(--border-radius-25);
  border: none;
  padding: 5px 40px 13px 25px;
  color:var(--color-white);
  outline:none;
  cursor: pointer;
  font: var(--text-link);
  appearance: none;
}

.custom-select-wrapper {
  position: relative;
}

.custom-select-wrapper::after {
  content: ">";
  font-size: 1rem;
  top: 10px;
  right: 24px;
  position: absolute;
  color:var(--color-white);
  rotate :90deg;
}

.custom-select-dark-blue {
  background: var(--color-blue-medium) 0% 0% no-repeat padding-box;
}

.custom-select-ligth-blue {
  background: var(--color-blue-aqua) 0% 0% no-repeat padding-box;
}

select option {
    font: var(--text-link);
}

.custom-input-wrapper {
  height: 22px;
  display:flex;
  flex-direction:row;
  gap: var(--gap-15);
  padding:13px 25px 13px 25px;
  color:var(--color-blue-light);
  border: 1px solid var(--color-blue-light);
  border-radius: var(--border-radius-25);
  justify-content: space-between;
  align-items: center;
 }

 .custom-white-input-wrapper {
  display: flex;
  flex-direction: row;
  gap: var(--gap-15);
  padding: 13px 25px 13px 25px;
  color: var(--color-white);
  border: none;
  border-radius: var(--border-radius-25);
  justify-content: space-between;
  align-items: center;
  background-color: white;
}

.custom-white-input-wrapper input::placeholder textarea::placeholder {
    color:var(--color-blue-dark);
    font: var(--text-link);
    opacity: 0.6;
}

.custom-input {
  width: 100%;
  outline: none;
  color:var(--color-blue-light);
  font: var(--text-link);
  border:none;
  background-color:transparent;
}

.custom-input::placeholder {
  color:var(--color-blue-light);
  font: var(--text-link);
}

.custom-white-input {
  width: 100%;
  outline: none;
  color:var(--color-blue-dark);
  font: var(--text-link);
  border:none;
  background-color:white;
}

.custom-white-input::placeholder {
  color:var(--color-blue-dark);
  font: var(--text-link);
}

.search-icon {
  fill: currentColor;
}

.custom-btn-border-blue {
  border: 1px solid var(--color-blue-light);
  background-color:transparent;
  color:var(--color-blue-light);
}

.custom-btn-bg-blue {
  background: var(--color-blue-light) 0% 0% no-repeat padding-box;
  color: var(--color-white);
  border: none;
}

.custom-btn-bg-aqua {
  background: var(--color-blue-aqua) 0% 0% no-repeat padding-box;
  color: var(--color-white);
  border: none;
}

.custom-btn-bg-blue-med {
  background: var(--color-blue-medium) 0% 0% no-repeat padding-box;
}

.custom-btn {
  padding:7px 25px 7px 25px;
  border-radius: var(--border-radius-25);
  font: var(--text-link);
  cursor: pointer;
  width: fit-content;
}

.flex-wrapper {
  display:flex;
  flex-direction:row;
  gap: var(--gap-10);
}


/** Composant 2 images et 3 textes en Grid. **/
/** Wrapper global pour la section */
.img2_txt3_section {
  position:relative;
  padding:var(--padding-120) var(--global-padding) 50px var(--global-padding);
  background-color: var(--color-blue-very-light);
  border-top-left-radius:var(--border-radius-30);
  border-top-right-radius:var(--border-radius-30);
  margin-top: -30px;
}
/** Wrapper pour définir la grid */
.img2_txt3_grid_wrapper {
  display:grid;
  grid-template-columns:1fr 1fr;
  grid-template-rows:1fr 1fr;
  gap:60px 60px;
}
/** Css lié à la première image, en haut à gauche du composant */
.img2_txt3_img1 {
  object-fit:cover;
  height:520px;
  width:660px;
  border-radius : var(--border-radius-30);
}
/** Css lié aux premier texte, en haut à droite du composant, avec titre et sous texte. */
.img2_txt3_txt1 {
  padding-top:30px;
  display:flex;
  flex-direction:column;
  gap : var(--gap-30);
}

.img2_txt3_txt3 {
  display:flex;
  flex-direction:column;
  gap : var(--gap-30);
}

.txt_on_img_wrapper {
  display:flex;
  justify-content: flex-start;
  align-items: flex-end;
  padding : var(--padding-40);
  color:white;
  background-repeat:no-repeat;
  background-size: cover;
  border-radius : var(--border-radius-30);
  min-height:470px;
}

.txt-on-img-txt-wrapper {
  background: #BEEAFF4D 0% 0% no-repeat padding-box;
  backdrop-filter: var(--blur-20);
  padding : var(--padding-40);
  border-radius : var(--border-radius-30);
  display: flex;
  flex-direction: column;
  gap : var(--gap-30);
}

.margin-bottom-20 {
  margin-bottom: 20px;
}

.margin-left-mobile {
  margin-left: 0px;
}

.img-gallery-title {
  font: normal normal 600 42px/55px Poppins;
  letter-spacing: 0px;
  color: #13516E;
}

.img-gallery-txt {
  font: normal normal normal 17px/33px Poppins;
  letter-spacing: 0px;
  color: #48768B;
}

.btn-trigger-modal {
  cursor:pointer;
  position:absolute;
  top:20px;
  right:20px;
  background: #DCF5FF 0% 0% no-repeat padding-box;
  border-radius:50px;
  padding:10px 20px 10px 20px;
  color:#53849B;
  font: normal normal 600 22px/33px Poppins;
}

.img-gallery-item.active {
  min-width: 690px;
}

.img-gallery-item {
  border-radius : var(--border-radius-30);
  height:420px;
  object-fit: cover;
  width: 300px;
  transition: width 0.3s ease-in-out;
}

.img2_txt3_txt_image {
  position:absolute;
  /* top:75px; */
  left:30px;
  right:30px;
  bottom: 30px;
  color:var(--color-white);
  padding: 30px 30px 30px 30px;
  border-radius:20px;
  backdrop-filter: var(--blur-20);
  display:flex;
  flex-direction:column;
  /* align-items: flex-end; */
  /* gap: 5px 0px; */
  /* justify-content: space-between; */
	
	
   
   gap: 30px 0px;

}

.img2_txt3_banniere {
  position:absolute;
  top:445px;
  left:36%; /* 760px; */
  display:flex;
  flex-direction:row;
  justify-content:space-between;
  padding:40px 100px 40px 100px;
  width:450px;
  height:75px;
  background-color:var(--color-blue-steel);
  color:var(--color-white);
  border-radius : var(--border-radius-30);
}

.img2_txt3_titre {
  color:var(--color-blue-deep);
  font: normal normal 600 38px/33px Poppins;
}

.img2_txt3_txt_image_wrapper {
  position:relative;
  background-image: url("/LIFRAS/OWS/Images/LIFRAS_ACCUEIL_2.jpg");
  height: 320px;
  border-radius : var(--border-radius-30);
  background-size:cover
}

/** Fin Composant 2 images et 3 textes en Grid. **/

/** Composant pour les News affichées dans l'accueil **/
.newsCardWrapper {
  display: flex;
  flex-direction: row;
  gap:var(--gap-40);
  overflow-x: auto;
  overflow-y: hidden;
  scroll-behavior: auto; /* Smooth est pas ouf... */
  scrollbar-width: none;
  width: 100%;
  padding-bottom: 20px;
  min-height: 540px;
  max-height: 650px;
}

/** On cache la scroll bar */
.newsCardWrapper::-webkit-scrollbar {
  display: none;
}

/** On cache la scroll bar */
.newsCardWrapper {
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.newsSectionScrollable {
  padding: 120px var(--global-padding) 120px var(--global-padding);
}

.newsCarouselWrapper {
  display:flex;
  flex-direction:column;
  gap:30px 30px;
}

.custom-scrollbar {
  position: relative;
  bottom: 5px;
  left: 0;
  height: 8px;
  background: var(--color-blue-light);
  border-radius: var(--border-radius-10);
  width: 100%;
  margin-top: var(--margin-10);
}

.custom-scrollbar-thumb {
  width: 50px;
  height: 100%;
  background: transparent;
  border-radius: var(--border-radius-10);
  cursor: pointer;
  position: absolute;
  left: 0;
  opacity: 1;
}

.newsScrollableContent {
  display:flex;
  flex-direction:column;
  gap: var(--gap-15);
  position: relative;
}

.scroll-btn {
  background-color: transparent;
  cursor:pointer;
  padding:8px 17px 7px 18px;
  border: 1px solid var(--color-blue-light);
  height:50px;
  width:50px;
  border-radius:var(--border-radius-50);
  color:var(--color-blue-light);
}
.scroll-btn-text {
  font: normal normal normal 25px/56px Poppins;
  margin-top: -12px;
}

.scroll-btn:disabled {
  opacity: 0.3;
}

.onClick {
  cursor: pointer;
}

/* .scrollbar-wrapper {
  display:flex;
  flex-direction:row;
  gap: var(--gap-20);
  align-items:center;
  padding-right:250px;
} */

.scroll-btn-wrapper {
  display:flex;
  flex-direction:row;
  gap: var(--gap-10);
}

.newsCard {
  text-align: left;
  /* max-width:660px; */
}

.newsCardImg {
  height:320px;
  width:660px;
  border-radius : var(--border-radius-30);
  object-fit: cover;
}

.newsCardImg-small {
  width:100%; 
}

.newsCarouselHeader {
  display:flex;
  flex-direction:row;
  justify-content: space-between;
  /* padding-right:310px; */
}

.link-news-wrapper {
  justify-items:left;
}
/** Fin composant pour les News **/

/** Composants pour les partners */
.sectionPartners {
  padding:var(--padding-120) var(--global-padding) var(--padding-120) var(--global-padding);  
}

.partners {
  display:flex;
  flex-direction:column;
  gap : var(--gap-30);

}


.partnersCardsWrapper {
  display:flex;
  flex-direction: row;
  gap:25px;
  flex-wrap: wrap;
  justify-content: flex-start;
}

.partnerCard {
  width:150px;
  height:150px;
  background:var(--color-blue-light) 0% 0% no-repeat padding-box;
  border-radius:20px;
  align-content:center;
  text-align: center;
}

.partnersLogo {
  object-fit: cover;
  max-width: 85%;
  max-height: 85%;
}
/** Fin composant pour les partners **/

/** Début composant pour les revues Hippocampe **/
.sectionHippocampeReview {
  padding:var(--padding-120) var(--global-padding) var(--padding-120) var(--global-padding);
  background-color: var(--color-blue-very-light);
  border-top-left-radius:var(--border-radius-30);
  border-top-right-radius:var(--border-radius-30);
}

.hippocampeReviewTitleWrapper {
  display:flex;
  flex-direction:row;
  justify-content: space-between;
  align-items: center;
}

.hippocampeReviewTitle {
  font: normal normal 600 42px/33px Poppins;
  color: var(--color-blue-deep);
}

.hippocampeCardsWrapper {
  display:flex;
  flex-direction:row;
  gap:var(--gap-35);
  flex-wrap: wrap;
}

.hippocampReviewCard {
  border-radius : var(--border-radius-30);
  padding:380px 30px 30px 30px;
  width:385px;
  background-size: cover;
  background-position: center;
}

.hippocampReviewCardSmall {
  padding:290px 30px 30px 30px;
  width:265px;
  /* height: 320px; */
}

.hippocampReviewCardSmallDefaut {    background-size: 50% auto;
    background-repeat: no-repeat;
    background-color: #4F8EAB;width: 300px;}

.hippocampReviewCardText{
  display:flex;
  flex-direction:row;
  gap:var(--gap-40);
  color:var(--color-white);
  justify-content:space-between;
  align-items:center;
  backdrop-filter: var(--blur-7);
  -webkit-backdrop-filter: var(--blur-7);
  height:110px;
  width:386px;
  padding:0px var(--padding-30) 0px var(--padding-30);
  border-radius:var(--border-radius-20);
}

.hippocampReviewCardTextWrapper {
  color:var(--color-white);
  border-radius: 20px;
  backdrop-filter: var(--blur-7);
  display:flex;
  flex-direction:row;
  gap: var(--gap-15);
  padding: var(--padding-20);
  justify-content: space-between;
  align-items: center;
}
/** Fin composant pour les revues Hippocampe **/


/** Début des composants pour Img_n_Text */
.img_n_txt_wrapper {
  display:flex;
  flex-direction:row;
  gap:var(--gap-80);
}

.img_n_txt_img {
  height:420px;
  min-width:460px; /*460px; */
  border-radius : var(--border-radius-30);
  object-fit: cover;
}

.img_n_txt_img_lg {
  height:520px;
  min-width:660px;
}

.img_n_txt_btn_txt_wrapper {
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap : var(--gap-30);
}

.img_n_txt_title {
  font: normal normal 600 42px/55px Poppins;
  color:var(--color-blue-deep);
}

.img_n_txt_txt {
  letter-spacing: 0px;
  color:var(--color-blue-dark);
  font: normal normal normal 17px/33px Poppins;
}
/** Fin composant pour Img_n_Text **/

/** Début composant pour le executive board **/
.executive-board-cards-wrapper {
  display:flex;
  flex-direction: row;
  gap : var(--gap-30);
  flex-wrap: wrap;
  justify-content: flex-start;
}

.board-executive-card {
  position:relative;
  height:380px;
  width:325px;
}
.board-card-tel-email-wrapper {
  top:20px;
  filter: brightness(1.1);
  background: #4F8EAB8C;

}

.responsable-executive-card-tel-email-wrapper {
  bottom: 20px;
  filter: brightness(1.2);
  background: #53849B8C;

}

.card-tel-email-wrapper {
  position:absolute;
  right:20px;
  display:flex;
  flex-direction:row;
  gap: var(--gap-15);
  border-radius:38px;
  backdrop-filter: var(--blur-7);
  padding:12px var(--padding-15) 12px var(--padding-15);
}

.board-executive-card-telecom {
  width:20px;
  height:20px;
}

.executive-board-wrapper {
  display:flex;
  flex-direction:column;
  gap : var(--gap-30);
  flex-wrap: wrap;
  width: 100%;
}

.responsible-types {
  display:flex;
  flex-direction:row;
  gap: var(--gap-10);
  flex-wrap: wrap;
  /* justify-content: center; */
}

.w-full {
  min-width: max-content
}

.responsible-types a {
  transition: background 400ms ease-in-out, color 400ms ease-in-out;
}

.card-tel-email-wrapper:hover {
  background-color: #6097B0;
  transform: scale(1.1);
}

.responsible-card-wrapper {
  display:flex;
  flex-direction:row;
  gap : var(--gap-30);
  flex-wrap:wrap;
}

.responsible-wrapper {
  display:flex;
  flex-direction:column;
  gap : var(--gap-30);
}

.responsible-card {
  position:relative;
  background: var(--color-blue-steel) 0% 0% no-repeat padding-box;
  border-radius:20px;
  padding:20px 20px 20px 20px;
  height:83px;
  width:285px;
  opacity: 0;
  animation: fadeInCard 1500ms cubic-bezier(0.4, 0, 0.2, 1) forwards;
}

@keyframes fadeInCard {
  to {
    opacity: 1;
    transform: scale(1) translateY(0);
  }
}

.executive-board-section {
  margin-top:-150px;
}
/** Fin composant pour le executive board **/
/** Début composant pour le infos complémentaire **/
.txt_n_btn_img_wrapper {
  /* padding:0px 40px 40px 40px; */ /* A été remplacé par du margin dans le composant enfant txt_n_btn_wrapper*/
  display:flex;
  background-repeat:no-repeat;
  background-size:cover;
  border-radius : var(--border-radius-30);
  justify-content: flex-start;
  word-break: break-word;
}

.txt_n_btn_img_wrapper_translation {
  translate: 0% -50%;
  margin-top: -130px;
  margin-bottom:-215px;
}

.txt_n_btn_wrapper {
  background: #BEEAFF4D 0% 0% no-repeat padding-box;
  backdrop-filter: var(--blur-20);
  padding:40px 40px 40px 40px;
  height:fit-content;
  border-radius : var(--border-radius-30);
  max-width:880px;
  display:flex;
  flex-direction:column;
  gap : var(--gap-30);
  margin-top: 100px;
  margin-left: 40px;
  margin-bottom: 40px;
  margin-right: 40px;
}


.info-complementaire-global-wrapper {
  position:relative;
  height:470px;
  width:100%;
  translate: 0% -50%;
}

.info-complementaire-wrapper {
  color:var(--color-white);
  position:absolute;
  left:40px;
  bottom:40px;
  width:878px;
  padding : var(--padding-40);
  border-radius : var(--border-radius-30);
  background: #BEEAFF4D 0% 0% no-repeat padding-box;
  backdrop-filter: var(--blur-20);
  display:flex;
  flex-direction:column;
  gap : var(--gap-30);
}

/* .section-info-complementaire {
  padding-top: 0px;
  padding-bottom: 0px;
} */

/** Fin composant pour le infos complémentaire **/

/** Début composant pour l'event calendar */
.calendar-event-global-wrapper {
  background: var(--color-blue-very-light) 0% 0% no-repeat padding-box;
  display:flex;
  flex-direction:column;
  gap : var(--gap-30);
  border-radius : var(--border-radius-30);
  text-align: left;
  /* padding:80px;
  width: 100%;
  max-width: calc(var(--max-width) - 160px);
  margin-left: auto;
  margin-right: auto; */
}

.calendar-card-global-wrapper {
  display:flex;
  flex-direction:row;
  flex-wrap:wrap;
  gap : var(--gap-30);
  margin-left: 80px;
  margin-right: 80px;
  margin-bottom: 80px;
}

.calendar-card-wrapper {
  padding : var(--padding-40);
  display:flex;
  flex-direction:column;
  gap : var(--gap-30);
  box-shadow: 5px 5px 30px var(--color-blue-muted-10);
  background: var(--color-white) 0% 0% no-repeat padding-box;
  border-radius : var(--border-radius-30);
  width:305px;
  justify-content : space-between;
  /* flex-grow: 1; */
}

/* .calendar-card-wrapper:last-of-type {
  flex-grow: 0;
} */


.icon-n-text-wrapper {
  display:flex;
  flex-direction:row;
  gap: var(--gap-10);
  align-items: center;
}

.calendar-btn-wrapper {
  display:flex;
  flex-direction:row;
  gap:var(--gap-40);
  margin-left: 80px;
  margin-right: 80px;
  /* flex-wrap:wrap; */

}

.calendar-global-title {
  text-align: left;
  font: normal normal 600 42px/55px Poppins;
  color: var(--color-blue-deep);
}
/** Fin composant pour l'event calendar */
/** Début composant pour les records */
.records-wrapper {
  display:flex;
  flex-direction:column;
  gap : var(--gap-30);
}

.records-title {
  font: normal normal 600 42px/55px Poppins;
  letter-spacing: 0px;
  color: var(--color-blue-deep);
}

.records-global-items-wrapper {
  display:flex;
  flex-direction:row;
  gap:var(--gap-40);
}

.records-items-wrapper {
  /* display:flex; */
  display:grid;
  grid-template-columns:repeat(2,1fr);
  grid-template-rows:repeat(2,fit-content(100px));
  padding : var(--padding-40);
  background: var(--color-blue-very-light) 0% 0% no-repeat padding-box;
  border-radius : var(--border-radius-30);
  gap: var(--gap-20);
  flex-direction: row;
  flex-wrap: wrap;
  width: 100%;
}

.record-item-open-wrapper {
  padding:30px;
  background: #FFFFFF 0% 0% no-repeat padding-box;
  height:fit-content;
  border-radius: 20px;
  justify-content: space-between;
  align-items: center;
  position: relative;
flex-grow: 1;
}

.record-item {
  display:flex;
  flex-direction:row;
  justify-content: space-between;
  align-items: center;
  height: fit-content;
  cursor: pointer;
}

.record-item-title {
  font:normal normal 600 18px/33px Poppins;
  letter-spacing:0px;
  color: var(--color-blue-deep);
}

.record-item-chevron {
  transform: matrix(0, 1, -1, 0, 0, 0);
  font: normal normal 600 18px/33px Poppins;
  letter-spacing: 0px;
  color: var(--color-blue-deep);

}

.record-item-detail {
  visibility: hidden;
  display: none;
  margin-top:20px;
}

.record-item-detail-opened {
  margin-top:20px;
  visibility:visible;
  display: block;
}

.record-item-detail.active {
  display:flex;
  flex-direction:column;
  visibility: visible;
  gap: var(--gap-20);
}

.record-item-detail-part {
  display:flex;
  flex-direction:column;
}

.record-item-detail-part-title {
  font: var(--text-span-bold);
  letter-spacing: 0px;
  color: var(--color-blue-steel);
}

.record-item-detail-part-txt {
  font: normal normal medium 15px/33px Poppins;
  letter-spacing: 0px;
  color: var(--color-blue-aqua);
}

.record-item-detail-part-result {
  font: var(--text-link);
  letter-spacing: 0px;
  color: var(--color-blue-steel);
}

.record-item-detail-poeple {
  font: var(--text-sm);
  letter-spacing: 0px;
  color: var(--color-blue-steel);
}

.record-item-detail-add-txt {
  font: normal normal normal 12px/33px Poppins;
  letter-spacing: 0px;
  color: var(--color-blue-aqua);
}

.divider {
  height:0px;
  border: 1px solid #D8E0EC;
}

/** Fin composant pour les records */

/** Début composant pour les kids Discover **/
.card-w-video-n-text {
  background:#FFFFFF 0% 0% no-repeat padding-box;
  border-radius : var(--border-radius-30);
  padding:var(--gap-60);
  display:flex;
  flex-direction:row;
  gap:60px;
  align-items:center;
}

.monitorat-section {
  padding:var(--gap-60);
  margin: -60px 60px 60px 60px;
  display:flex;
  flex-direction:column;
  gap:40px
}

.flex-row-reverse {
  display: flex;
  flex-direction: row-reverse
}

.card-w-video-text-wrapper {
  display:flex;
  flex-direction:column;
  gap: var(--gap-20);
}

.card-w-video-text-title {
  font: normal normal 600 20px/33px Poppins;
  letter-spacing: 0px;
  color: var(--color-blue-deep);
}

.card-w-video-text-text {
  color: var(--color-blue-dark);
  letter-spacing: 0px;
}

.play-video-btn {
  position:absolute;
  right:30px;
  top:30px;
  display:flex;
  justify-content: center;
  align-items: center;
  height:55px;
  width:55px;
  background: #FFFFFF4D 0% 0% no-repeat padding-box;
  opacity: 1;
  backdrop-filter: blur(10px);
  margin-left:80px;
  border-radius:40px;
}

.video-infos {
  display:flex;
  flex-direction:column;
  gap:10px;
  justify-content: flex-end;
  margin-left: 30px;
  margin-bottom: 30px;
}

.card-w-video-video-wrapper {
  display:flex;
  /* padding:30px; */
  border-radius : var(--border-radius-30);
  background-size:cover;
  background-repeat:no-repeat;
  width: 100%;
  background-position: center;
  min-height: 300px;
  /* max-width: 350px; */
}

.card-w-img-img-wrapper {
  display:flex;
  border-radius : var(--border-radius-30);
  background-size:cover;
  background-repeat:no-repeat;
  width: 100%;
  background-position: center;
  min-height: 300px;
  max-width: 100%;
}

.card-w-video-video-wrapper-sm {
  height: 320px;
  width: 100%;
}

.card-w-video-video-title {
  font: normal normal normal 20px/33px Poppins;
  letter-spacing: 0px;
  color: #F6F7F9;
  max-width:210px;
}

.card-w-video-video-subtitle {
  font: var(--text-link);
  letter-spacing: 0px;
  color: #FFFFFF;
}



.white-card-wrapper {
  padding:var(--gap-60);
  background: #FFFFFF 0% 0% no-repeat padding-box;
  border-radius : var(--border-radius-30);
}

.Texte_Footer h2, .txt-title {
  font: normal normal 600 38px/55px Poppins;
  letter-spacing: 0px;
  color: var(--color-blue-deep);
}

.liens-utiles-title {
  font: normal normal 600 20px/33px Poppins;
}

.documents-utiles-title {
  font: normal normal medium 28px/33px Poppins;
}


.Texte_Footer h3, .txt-sub-title {
  font: normal normal 600 17px/33px Poppins;
  letter-spacing: 0px;
  color: var(--color-blue-deep);
}

.txt-sub-title-white {
  color: white;
}

.Texte_Footer li, .Texte_Footer a, .Texte_Footer p, .txt-normal {
  font: normal normal normal 15px/32px Poppins;
  letter-spacing: 0px;
  color: var(--color-blue-dark);
}

.txt-normal  img {
  max-width: var(--max-width);
  width: inherit; /*% !important;  !important car, on peut définir une largeur directement dans le composant avec soit, style='width....' OU width='xxx' */
}

.txt-normal iframe {
  max-width: var(--max-width);
  width: inherit; /*100% !important; !important car, on peut définir une largeur directement dans le composant avec soit, style='width....' OU width='xxx' */
}

.txt-citation {
  font: normal normal normal 22px/33px Poppins;
  letter-spacing: 0px;
  color: var(--color-blue-dark);
}

.txt-normal-bold {
  font: normal normal 600 15px/32px Poppins;
  letter-spacing: 0px;
  color: var(--color-blue-dark);
}

.txt-normal-white {
  color: white;
}

.txt-title-bold {
  font: var(--title-bold);
}

.subtitle-span-bold {
    font: normal normal bold 24px/55px Poppins;
}

.txt-span-bold {
  font: normal normal 600 15px/32px Poppins;
  color: var(--color-blue-dark);
  letter-spacing: 0px;
}

.txt-citation-span-bold {
    font: normal normal 600 22px/33px Poppins;
  color: var(--color-blue-dark);
  letter-spacing: 0px;
}

.txt-title-white {
  color: white;
}

.subtitle_n_txt_wrapper {
  display:flex;
  flex-direction: column;
  gap: var(--gap-20);
}
/** Fin composant pour les kids Discover **/

/** Début composant pour les Clubs **/
.club-list-items-wrapper {
  display:flex;
  flex-direction:column;
  gap:var(--gap-40);
}

.club-list-item {
  display:flex;
  flex-direction:row;
  gap:var(--gap-40);
}

.club-item-logo-lg {
  display:flex;
  align-items: center;
  justify-content: center;
  min-width:140px;
  /* min-height:140px; */
  background: var(--color-blue-very-light) 0% 0% no-repeat padding-box;
  border-radius : var(--border-radius-30);
  padding: 40px;
  height: 156px;  
}

.club-item-logo-sm {
  display: none;
  visibility: hidden;
}

.club-item-content {
  display:flex;
  flex-direction:column;
  gap : var(--gap-30);
  padding : var(--padding-40);
  background: var(--color-blue-very-light) 0% 0% no-repeat padding-box;
  border-radius : var(--border-radius-30);
  width:100%;
}
/** Fin composant pour les Clubs **/

/** Début composant pour la gallerie Video **/
.video-gallery-wrapper {
  display:flex;
  flex-direction:column;
  gap:45px;
}

.video-gallery-first-item {
  display:flex;
  flex-grow:1;
  height: 350px;
  /* background-size: contain; */
  background-position: center;
  background-repeat: no-repeat;
  /* background-color: black; */
  border-radius : var(--border-radius-30);
  max-width: none;
}

.video-gallery-items-wrapper {
  display:flex;
  flex-direction:row;
  gap:var(--gap-40);
  margin-top:40px;
  /* flex-wrap: wrap;*/
  justify-content: space-between; 
  
}

/** Fin composant pour la gallerie Video **/

/** Début composant pour les types de brevets **/
.licence-type-items-wrapper-kids-lg {
  display:flex;
  flex-direction:row;
  gap: var(--gap-10);
  justify-content: space-between;
}

.licence-type-items-wrapper-lg {
  display: flex;
  flex-direction:row;
  gap:var(--gap-40);
  justify-content: space-between;
}

.card-w-img-txt-btn-wrapper {
  position:relative;
  display:flex;
  flex-direction:column;
  gap : var(--gap-30);
  justify-content: center;
  align-items: center;
  background: transparent linear-gradient(180deg, var(--color-blue-very-light) 0%, #E9F8FE 100%) 0% 0% no-repeat padding-box;
  border-radius : var(--border-radius-30);
  padding:30px;
  text-align: center;
}

.licence-type-item-wrapper-sm {
  display:flex;
  flex-direction:row;
  gap: var(--gap-10);
  width: 100%;
  justify-content: space-around;
  align-items: center;
}

.licence-type-item-wrapper-sm:hover {
  cursor: pointer;
}

/** Fin composant pour les types de brevets **/

.club-item-detail-wrapper {
  display:flex;
  flex-direction:row;
  gap:var(--gap-40);
}

.card-w-texts-wrapper {
  display:flex;
  flex-direction:column;
  gap : var(--gap-30);
  background: #FFFFFF 0% 0% no-repeat padding-box;
  box-shadow: 10px 10px 40px #13516E33;
  border-radius : var(--border-radius-30);
  padding:var(--gap-60);
}

.club-list-title-wrapper {
  display:flex;
  flex-direction:row;
  justify-content: space-between;
}

/** Début composant Missions **/
.mission-items-wrapper {
  display:flex;
  flex-direction:row;
  gap:var(--gap-35);
  overflow-x: auto;
  scroll-behavior: auto;
  scrollbar-width: none;
}

.mission-item-wrapper {
  display:flex;
  flex-direction:column;
  gap: var(--gap-20);
  padding : var(--padding-40);
  background: transparent linear-gradient(180deg, #DCF5FF 0%, #DCF5FF 61%, #BEEAFF 100%) 0% 0% no-repeat padding-box;
  border-radius: 20px;
  width: 300px;
  /* height: 250px; */
  min-width: 245px;
  min-height: 250px;
  justify-content: space-between
}

.mission-card-logo {
  height:45px;
  width:45px;
}


.mission-card-title {
  font: normal normal 500 24px/33px Poppins;
  color: var(--color-blue-deep);
}

.mission-card-txt {
  font: normal normal normal 17px/25px Poppins;
  color: var(--color-blue-steel);
  letter-spacing: 0px;
}

.monitorat-brevet-card-title {
  font: normal normal 600 17px/33px Poppins;
  letter-spacing: 0px;
  color: var(--color-blue-steel);
  text-align: center;
}

.mission-global-wrapper {
  display:flex;
  flex-direction:column;
  gap : var(--gap-30);
}

.document-utile-vide-white {
  background: #ffffff 0% 0% no-repeat padding-box;
}

.document-utile-vide-colored {
  background: var(--color-blue-very-light) 0% 0% no-repeat padding-box;
}

.document-utile-vide-wrapper {
  word-break: normal;
  min-height: auto;
  padding: 40px;
  border-radius: 20px;
  max-width: 250px;
}


/** Fin composant Missions **/

/** Debut composant Mission Accordion **/

#kid-progress-certif .mission-cards-wrapper {
  gap: var(--gap-10);
  flex-wrap: wrap;
}

#kid-progress-certif .mission-acc-item-wrapper:not(.active) {
  flex: 0 1 0px;
}

.mission-acc-item-wrapper {
  position: relative;
  display:flex;
  flex-direction:column;
  gap: var(--gap-20);
  padding: 30px;
  background: transparent linear-gradient(180deg, #DCF5FF 0%, #DCF5FF 61%, #BEEAFF 100%) 0% 0% no-repeat padding-box;
  border-radius: 20px;
  /* height: 350px; */
  max-height: 550px;
  overflow: hidden;
  transition: all 0.7s ease-in-out;
  flex: 0 1 25px;
}

.mission-acc-item-wrapper .mission-card-logo {
  position: absolute;
  left:50%;
  right:50%;
  /* top: 90%; */
  transform: translate(-50%, -50%);
  transition: bottom 0.4s ease-in-out, 0.4s ease-in-out, left 0.4s ease-in-out;
  height: 35px;
  width: 35px;
}

.mission-acc-item-wrapper.active .mission-card-logo {
  top: 40px;
  left: 40px;
  transform: translate(0%, 0%);
  visibility: visible;
  display: block;
  height: 45px;
  width: 45px;
}

.no-transition {
  transition: none;
}

.mission-acc-item-wrapper.active {
  align-items:flex-start;
  flex-grow: 1;
}

.mission-acc-item-wrapper.active .mission-acc-item-chevron {
 visibility: hidden;
 opacity: 0;
}

.mission-acc-item-wrapper.active .mission-card-txt-wrapper {
  margin-top: 75px;
  transition: opacity 0.7s ease, visibility 0.7s; /** max-height 0.5s ease, **/
}

.mission-acc-item-wrapper:not(.active) .mission-card-txt-wrapper {
  max-height: 0px;
  opacity: 0;
  visibility: hidden;
}

.page404-txt {
  font: normal normal 600 42px/33px Poppins;
  color: var(--color-blue-deep);
}

.page404-title {
  font: normal normal 800 290px/33px Poppins;
  color: var(--color-blue-deep);
  line-height: normal;
  /* margin-top: 50px; */
  display: flex;
  justify-content: center;
}

.page404-container {
  display: flex;
  flex-direction: column;
  gap:var(--gap-40);
  margin-bottom: 40px;
}

.Img404 {
  width: 100%;
}

.image404 {
  text-align: center;
  position:relative;
  /* min-height: 87vh; */
  background-image: url("/LIFRAS/OWS/Images/404-background.svg");
  background-size: cover;
}

.page404-bouee {
  margin-top : 10px;
}

.header-color-blue {
  background-color:#4F8EAB;
}

.mission-acc-item-chevron {
  position:absolute;
  top:5px;
  left:12px;
  transform: matrix(-0.71, -0.71, 0.71, -0.71, 0, 0);
  font: normal normal 600 22px/33px Poppins;
  color:white;
  transition: oapcity 0.5s ease-in-out;
}

.mission-cards-wrapper {
  display:flex;
  flex-direction:row;
  gap: var(--gap-20);
  width: 100%;
  align-items: stretch;
}

.mission-accordion-global-wrapper {
  display:flex;
  flex-direction:column;
  gap : var(--gap-30);
}

.mission-card-child-title {
  position: absolute;
  font: normal normal 500 24px/33px Poppins;
  color: var(--color-blue-deep);
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  writing-mode: sideways-lr;

}


.mission-acc-item-wrapper.active .mission-card-child-title {
  display: none;
  visibility: hidden;
}
/** Fin composant Mission Accordion **/


/** Début composant Se former bannière **/
.se-former-btn {
  font: normal normal 500 17px/33px Poppins;
  color: var(--color-blue-deep);
  letter-spacing: 0px;
  border-radius: 15px;
  height: auto;
  min-height: 55px;
}

.se-former-btn.active {
  background: var(--color-blue-aqua) 0% 0% no-repeat padding-box;
  color: var(--color-white);
  border: none;
}

.se-former-nav-global-wrapper {
  background: var(--color-blue-very-light) 0% 0% no-repeat padding-box;
  box-shadow: 1px 4px 20px #48768B33;
  border-radius: 20px;
  padding:var(--padding-10);
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
  margin-top: -170px;
  position: relative;
  z-index: 1;
}

.se-former-nav-global-wrapper .btns-wrapper {
  justify-content: center;
}
/** Fin composant Se former bannière **/

/** Début composant se former 'découverte' **/
.img-w-460 {
  height: 460px;
  min-height: auto;
} 

.img-h-520 {
  width: 520px;
  min-width:auto;
}
/** Fin composant se former 'découverte' **/

/** Début composants Google map **/
.map_translation {
  display:flex;
  flex-direction:column;
  gap : var(--gap-30);
  translate: 0% -80%;
}

.map_google {
  width:100%;
  height:500px;
  z-index:1;
  border-radius : var(--border-radius-30);
  position : relative;
}

.map_google_sm {
  height:250px;
}

.map_google_info_box:active {
  display: block;
}

.map_google_info_box {
  position: absolute;
  bottom: 40px;
  right: 40px;
  z-index: 30;
  box-shadow: 10px 10px 10px #48768B0D;
  background: #FFFFFF 0% 0% no-repeat padding-box;
  border-radius : var(--border-radius-30);
  padding: 40px;
  display: none;
}


.map_btns_wrapper {
  display:flex;
  flex-direction:row;
  justify-content: space-between;
}

.map_clubs_wrapper {
  margin-top: -450px;
}

.map_clubs_labellise_wrapper {
  display:flex;
  flex-direction:column;
  gap : var(--gap-30);
  margin-top: -450px;
}

.map_google_info_box .info-box-icon {
  height:20px;
  width:18px;
} 

.map_google_info_box_Secondaires svg {
  height: 15px;
  width: 15px;
} 

.centre-labellise-items-wrapper {
  display:flex;
  flex-direction:column;
  gap:var(--gap-80);
}

.map-empty-section {
  height:270px;
}

.gm-style-cc {display: none;}
.gm-style a[rel="noopener"] {display: none;visibility: hidden;}
.gm-style-pbc {display: none;}

/** Fin composants Google map **/


.formation-continue-items {
  display:flex;
  flex-direction:row;
  gap:var(--gap-80);
  width: 100%;
}

.erasmus-global-cards-wrapper {
  display:flex;
  flex-direction:row;
  gap:var(--gap-40);
}

.ersamus-card-txt {
  text-align: center;
  background: transparent linear-gradient(180deg, var(--color-blue-very-light) 0%, #E9F8FE 100%) 0% 0% no-repeat padding-box;
  border-radius : var(--border-radius-30);
  padding:100px 30px 100px 30px;
}

.erasmus-max-width {
    max-width:260px;
}

.calendar-title-wrapper {
  display:flex;
  flex-direction:row;
  justify-content: space-between;
  gap: var(--gap-10);
  margin-top: 80px;
  margin-left:80px;
  margin-right: 80px;
}

.audiovisuel-items-wrapper {
  display:flex;
  flex-direction:row;
  gap: var(--gap-20);
  overflow-x:auto;
  scroll-behavior:auto;
  scrollbar-width:none;
}

.audiovisuel-photo-item {
  color:var(--color-blue-steel);
  text-align: center;
  align-content:center;
  min-width:280px;
  width:280px;
  height:85px;
  background: transparent linear-gradient(180deg, #DCF5FF 0%, #DCF5FF 61%, #BEEAFF 100%) 0% 0% no-repeat padding-box;
  border-radius:20px;
  padding-left: 10px;
  padding-right: 10px;
}

.audiovisuel-global-wrapper {
  display:flex;
  flex-direction:row;
  gap:var(--gap-80);
  justify-content:space-between;
  margin: 80px;
}

.flex-row-reverse {
  display: flex;
  flex-direction: row-reverse
}

.audiovisuel-item-img {
  max-width:460px;
  height:520px;
  border-radius : var(--border-radius-30);
  object-fit:cover;
}

.audio-visuel-txt-scroll-wrapper {
  display:flex;
  flex-direction:column;
  gap:var(--gap-40);
  justify-content: center;
  max-width:720px;
  width:50%;
}

.flex-end {
  justify-content: flex-end;
}

.audiovisuel-video-wrapper {
  display:flex;
  flex-direction:column;
  gap : var(--gap-30);
  height:520px;
  border-radius:0px 0px 200px 0px;
  background-color:var(--color-blue-steel);
  justify-content:center;
  align-items:flex-start;
  padding:0px 50px 0px 250px;
  width:100%;
}

.audiovisuel-video-wrapper-img {
  margin-left:-100px;
  height:520px;
  object-fit:cover;
  z-index:-1;
  width:100%;
}


.mission-acc-item-wrapper-lg {
  display: none;
  visibility: hidden;
  background: transparent linear-gradient(180deg, #DCF5FF 0%, #DCF5FF 61%, #BEEAFF 100%) 0% 0% no-repeat padding-box;
  padding: 30px 40px 30px 40px;
  border-radius: 20px;
}

.img-gallery-items-wrapper {
  display:flex;
  flex-direction:row;
  gap : var(--gap-30);
  overflow-x:auto;
  scroll-behavior: auto;
  scrollbar-width: none;
}

.img-gallery-global-wrapper {
  display:flex;
  flex-direction:column;
  gap:var(--gap-40);
  width: 100%;
}

.formation-continue-txt {
  display:flex;
  flex-direction:column;
  gap : var(--gap-30);
  justify-content:center;
  width:100%
}

.centre-labellise-item-wrapper {
  display:flex;
  flex-direction:row;
  gap:var(--gap-40);
}

.centre-labellise-img {
  object-fit:cover;
  max-width:420px;
  height:320px;
  border-radius : var(--border-radius-30);
}

.centre-labellise-img-mobile {
  display: none;
  visibility: hidden;
}

.maps-padding {
  padding-bottom: 400px;
}

.maps-padding-xl {
  padding-bottom: 450px;
}

.follow-maps-wrapper {
  margin-top: -475px;
}

.follow-maps-contact {
  margin-top: -400px;
}

.bg-very-light-blue {
  background: var(--color-blue-very-light) 0% 0% no-repeat padding-box;
}

.document-utile-items-wrapper {
  display:flex;
  flex-direction:row;
  gap:var(--gap-40);
  flex-wrap:wrap;
}


.liens-utile-items-wrapper {
  column-count: 3;
  gap:var(--gap-40);

  /* display: block;
  width: max-content;
  max-width: 100%;
  margin-left: auto;
  margin-right: auto; */

}

.liens-utile-card {
  /* display: inline-block; */
  
  border-radius : var(--border-radius-30);
  background: #FFFFFF 0% 0% no-repeat padding-box;
  padding : var(--padding-40);
  height: fit-content;
  break-inside: avoid;
  margin-bottom: 40px;
  /* width: 80%; */
}

.title_btn_wrapper {
  display:flex;
  flex-direction:row;
  justify-content: space-between;
}

.actualite-filtres-wrapper  {
  display:flex;
  flex-direction:row;
  gap: var(--gap-10);
  align-items:center;
}

.newsCard-small {
  width:100%;
}

.actualites-cards-wrapper {
  display: grid;
  grid-template-columns: 50% 50%;
  column-gap: 20px;
  row-gap: 30px;
}

.events-cards-wrapper {
  display: grid;
  grid-template-columns: 50% 50%;
  column-gap: 20px;
  row-gap: 40px;
}

.activite-btns-wrapper {
  display:flex;
  flex-direction:row;
  justify-content: space-between;
}

.badge {
  border-radius: var(--border-radius-25);
  backdrop-filter: var(--blur-10) brightness(2);
  padding:var(--padding-10) var(--padding-15) var(--padding-10) var(--padding-15);
}

.sub-header-detail {
  color:white;
  position:absolute;
  /* top:345px; */ /* Dans le cas où le titre est trop grand, il est coupé par les badges. On ne va pas se baser sur le top mais sur le bottom */
  bottom: 50px;
  left:0px;
  width:100%;
  display:flex;
  flex-direction:row;
  gap: var(--gap-10);
  justify-content:center;
  text-align: center;
  font: var(--text-sm);
}

.sub-header-detail-all {
  color:white;
  position:absolute;
  top:175px;
  left:var(--global-padding);
  justify-content:left;
  text-align:left;
  font: var(--text-sm);
}

.filters {
  justify-content: space-between;
  align-items: center;
}

.acti-details {
  display:flex;
  flex-direction:column;
  gap:var(--gap-40);
}

.acti-details-left {
  max-width:60%;
}

.acti-details-right {
  max-width:32%;
}

.acti-details-wrapper {
  gap:var(--gap-100);
}

.modal-wrapper {
  display:flex;
  flex-direction:column;
  gap: var(--gap-20);
}

.document-utile-item {
  word-break: break-all;
}

.iframe-video {
  height: 550px;
  width: 700px;
}

.monitorat-floating-number {
  position:absolute;
  left:-85px;
  top:-7px;
  display:flex;
  justify-content:center;
  align-items:center;
  width: 50px;
  height: 50px;
  background: #DCF5FF 0% 0% no-repeat padding-box;
  border-radius:var(--border-radius-50);
  font: normal normal bold 20px/33px Poppins;
  color: var(--color-blue-steel);
}

.colored-list .colored-list-item .subtitle_n_txt_wrapper {
  text-align: left;
}

.h-350 {
  height: 350px;
}

.top-350 {
  top : 350px;
}

.top-550 {
  top : 550px;
}

.top-90 {
  top : 90%;
}

.card-img-white {
  background-color:white;
  padding:18px 73px 18px 73px;
}

.news-carousel-btn-padding {
  padding-right: var(--news-padding);
}

.whois-img-n-txt-wrapper {
  margin-bottom:-25px;
  max-width:50%;
  position:relative;
}

.whoIsInputError.active {
  box-shadow: 0 0 10px 2px rgba(255, 0, 0, 0.3)
}

.whoIsInputError {
  box-shadow: 'none';
}

/* .whois-img-n-txt-wrapper-sm {
  display: none;
  visibility: hidden;
} */

.whois-txt-img {
  position:absolute;
  padding : var(--padding-40);
  border-radius:20px;
  backdrop-filter: var(--blur-20);
  background: #BEEAFF99 0% 0% no-repeat padding-box;
  justify-self: anchor-center;
  align-self: anchor-center;
  max-width: 500px;
}

.global-txts-wrapper {
  display:flex;
  flex-direction:column;
  gap:var(--gap-40);
}

.erasmus-global-wrapper {
  display:flex;
  flex-direction:column;
  gap:var(--gap-40);
  margin-top: var(--margin-30);
}

.club-list-global-wrapper {
  display:flex;
  flex-direction:column;
  gap : var(--gap-30);
  /* margin-top:50px; */
}

.hippocampe-wrapper {
  display:flex;
  flex-direction:column;
  gap : var(--gap-30);
  /* max-width: var(--max-width);
  margin-left: auto;
  margin-right: auto; */
}
.maps-padding-contact {
  padding-bottom : 450px;
}

.maps-padding-chercher-club {
  padding-bottom: 400px;
}

/* .clubsDetails-schedule div::before {
  content: "°";
  color: var(--color-blue-steel);
} */

.whois-result-brevet-wrapper {
  display: flex;
  flex-direction: column;
  gap: var(--gap-20);
}

.whois-result-brevet-header {
  display: flex;
  flex-direction: row;
  gap:var(--gap-50);
  justify-content: flex-end;

}

.whois-result-brevet-header-item {
  color: var(--color-blue-aqua);
  font: var(--text-span-bold);
  margin-right: 16px;
}


.whois-result-brevet-item-wrapper {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;

}

.whois-result-brevet-item {
  color: var(--color-blue-steel);
  font: var(--text-span-bold);
}

.whois-result-brevet-bar:not(:last-of-type) {
  border: 1px solid #D8E0EC;
}

.whois-result-brevet-name {
  width: 100%;
}

.whois-result-brevet-date-wrapper {
  display:flex;
  flex-direction:row;
  gap:var(--gap-50);
}

.submit-search, .submit-search.active {
  /* display: none; */
  opacity: 0;
  width: 0px;
}

.whois-result-brevet-item-date {
  color: #138895;
  font: normal normal 500 15px/33px Poppins;
}

  .hidden-mobile {
    display: block;
  }

  .hidden-desktop {
    display: none;
  }


  .recherche-mobile {
    display: none;
  }



@media screen and (max-width: 1600px) {

  :root {
    --global-padding : 50px;
    --global-sub-section-padding: 15px;
    --global-sub-sub-section-padding : 30px;
  }

  .max-sized {
    max-width: none;
    margin-left: 0;
    margin-right: 0;
    width: auto;
  }

  .header-subnavbar {
    gap : 0px 0px;
  }

  .header-navbar-wrapper {
    padding : 55px var(--global-padding) 15px var(--global-padding);
  }

  .header-navbar {
    gap:var(--gap-50);
  }

  .footer-content { align-items: center; }

  /* On réduit le padding sur les plus petits écrans */
  .footer-section { padding: 30px 40px 15px 40px; }

  /* Passage de flex-col à grid quand on réduit l'écran, 2 lignes de 3 colonnes */
  .footer-wrapper {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: repeat(2, 1fr);
    justify-content: center;
    gap: var(--gap-10);
  }

  /* Chaque item du footer est centré */
  .footer-items { align-items: center; }

  .img2_txt3_grid_wrapper {
    display: flex;
    flex-direction: column;
    gap: 0px 0px;
    align-items: center;
  }

  .img2_txt3_txt3 {
    width: 100%;
    align-items:center;
  }

  .img2_txt3_section {
    padding:var(--gap-60) var(--global-padding) 60px var(--global-padding);
  }

  .img2_txt3_banniere {
    position: relative;
    top:0px;
    left:0px;
    margin-top: 25px;
    width: 100%;
	  box-sizing:border-box;
    padding:41px var(--global-padding) 40px var(--global-padding);
    height: fit-content;
    justify-content:space-around;

  }

  .img2_txt3_titre {
    text-align: center;
    font: normal normal 600 36px/33px Poppins;
  }

  .img2_txt3_txt_image_wrapper {
    width:100%;
  }

  .img2_txt3_txt_image {
    align-items: center;
  }

  .newsSectionScrollable {
    padding:var(--gap-60) 0px 60px var(--global-padding);
  }

  .newsCarouselHeader {
    padding-right:50px;
  }

  .sectionPartners {
    padding:var(--gap-60) var(--global-padding) 60px var(--global-padding);
  }

  .partners {
    text-align: center;
    align-items: center;
  }

  .partnersCardsWrapper {
    justify-content: center;
  }

  .audiovisuel-global-wrapper {
    flex-direction: column;
  }

  .audiovisuel-item-img {
    width: 100%;
    max-width:none;
  }

  .audio-visuel-txt-scroll-wrapper {
    max-width: none;
    width: 100%;
  }

  .calendar-event-global-wrapper {
    width: auto;
  }
}

@media screen and (max-width: 1400px){

  .executive-board-cards-wrapper{
    grid-template-columns: repeat(3,fit-content(100px));
    justify-content: center;
  }

  .audiovisuel-video-wrapper-img {
    visibility: hidden;
    display: none;
  }

  .audiovisuel-video-wrapper {
    border-radius: 0px;
    text-align: center;
    align-items: center;
    padding: 0px;
    background-color: transparent;
    background-image: url("/LIFRAS/OWS/Images/LIFRAS_AUDIOVISUEL_2.jpg");
    background-size: cover;
  }

  .audiovisuel-video-wrapper .btns-wrapper a {
    background: transparent;
  }

}

@media screen and (max-width: 1200px) {

  .search-input.active {
    opacity : 1;
    width: 100px;
  }

  .submit-search.active {
    display: flex;
    padding: 5px;
    border-radius: 0px 0px 10px 10px;

    width: 30px;
    opacity: 1;

    justify-content:center;
    align-items: center;

    transition:
      width 0.8s ease-in-out,
      opacity 0.6s ease-in-out;
  }

  .hidden-desktop {
    display: block;
  }

  #info-box.map_google_info_box.map_google_info_boxRechClub {
    bottom : 170px;
  }
  .card-w-video-video-wrapper-sm {
    width: auto;
  }

  .WhoIsResult_nested-div {
    text-align: center;
  }

  .maps-padding-chercher-club {
    padding-bottom: 200px;
  }

  .maps-padding-contact {
    padding-bottom : 300px;
  }

  .mission-acc-item-wrapper {
    display: none;
    visibility: hidden;
  }
  
  .mission-acc-item-wrapper.active {
    width: auto;
    height: fit-content;
    padding: var(--padding-20);
  }

  .mission-acc-item-wrapper-lg {
    position: relative;
    display: block;
    visibility: visible;
    flex-grow: 1;
    padding:25px;
  }

  /* .map_google_info_box.map_google_info_boxRechClub{bottom:175px;} */
  
  .header-subnavbar {
    top : 136px; /* hauteur du menu sur plus petit écrans */
  }

  .header-subnavbar-items ul {
    padding-inline-start: 40px;
  }


  .header-navbar-items {
    padding-inline-start: 0px;
  } 

  .header-navbar-wrapper {
    /* flex-direction: column; */
    padding : 20px var(--global-padding) 15px var(--global-padding);
  }

  .header-navbar {
    flex-direction: column;
    gap: var(--gap-15);
  }

  .hippocampeCardsWrapper {
    justify-content: center;
    align-items: center;
  }

  .hippocampeReviewTitleWrapper {
    flex-direction:column;
    gap:var(--gap-40);
    text-align: center;
  }

  /* .hippocampReviewCard {
    width: 97%;
  } */

  .img_n_txt_wrapper {
    flex-direction: column;
  }

  .img_n_txt_img {
    width: auto;
    min-width:auto;
    height: 350px;
  }

  .executive-board-cards-wrapper{
    grid-template-columns: repeat(2,fit-content(100px));
  }

  .responsible-card {
    width: 275px;
  }

  .info-complementaire-wrapper {
    left: 20px;
    bottom:20px;
    right:20px;
    width: 80%;
  }

  .calendar-event-global-wrapper {
    padding : 40px;
  }

  .calendar-card-global-wrapper {
    gap: var(--gap-20);
    justify-content: center;
  }

  .records-global-items-wrapper {
    flex-direction: column;
    align-items:center
  }

  .txt-on-img-img {
    max-height:470px;
  }

  .card-w-video-n-text {
    flex-direction: column;
    align-items: center;
  }

  .club-item-detail-wrapper {
    flex-direction: column;
  }

  .mission-cards-wrapper  {
    gap: var(--gap-15);
    flex-wrap: wrap;
  }

  .map_btns_wrapper {
    flex-direction: column-reverse;
    gap: var(--gap-20);
  }

  .map_clubs_wrapper {
    margin-top: -350px;
  }

  .map_reverse {
    flex-direction: column-reverse;
  }

  .map_translation {
    translate: 0% -53%;
  }

.map_labellise_translation {
  translate: 0% -80%;
}

  .map-empty-section {
    height: 100px;
  }

  .calendar-btn-wrapper .justify-right {
    margin-left: 0px;
  }

  .calendar-btn-wrapper {
    flex-wrap: wrap;
    margin-left: 0px;
    margin-right: 0px;
    justify-content: center;

  }

  .video-gallery-items-wrapper {
    flex-wrap: wrap;
  }

  .card-w-video-video-wrapper {
    flex-grow: 1;
  } 

  .licence-type-items-wrapper-kids-lg {
    flex-wrap: wrap;
    justify-content: center;
  }

  .licence-type-items-wrapper-lg {
    flex-wrap: wrap;
    justify-content: center;
    gap: var(--gap-20);
  }

  .formation-continue-items {
    flex-direction:column;
    gap:var(--gap-40);
  }

  .audiovisuel-global-wrapper {
    align-items: center;
  }

  .centre-labellise-img-mobile {
    display: block;
    visibility: visible;
    object-fit:cover;
    width: 100%;
    height:320px;
    border-radius : var(--border-radius-30);
  }

  .centre-labellise-img {
    display: none;
    visibility: hidden;
  }

  .section-w-xl-padding {
    padding-bottom: 300px;
  }

  .map_clubs_labellise_wrapper {
    margin-top: -200px;
  }

  .maps-padding {
    padding-bottom: 200px;
  }

  .maps-padding-xl {
    padding-bottom: 450px;
  }

  .follow-maps-wrapper {
    margin-top : -400px;
  }

  .follow-maps-contact {
    margin-top: -275px;
  }

  .liens-utile-items-wrapper {
    column-count: 2;
  }

  .flex-row {
    flex-direction: column;
    align-items: center;
  }

  .no-align-center {
    align-items: normal;
  }

  .newsCard-small {
    width: 100%;
  }

  .acti-details-right {
    width: 100%;
    max-width: none;
  }

  .acti-details-left {
    width: 100%;
    max-width: none;
  }

  .acti-details-wrapper {
    gap:var(--gap-50);
  }
  
  .erasmus-max-width {
    max-width: 100%;
  }

  .whois-img-n-txt-wrapper {
    max-width: 100%;
  }

  
  /* .card-w-video-video-wrapper {
    min-width: auto;
    width: auto;
  } */

	/* .map_google_info_box{bottom: 200px;} */

  .audiovisuel-global-wrapper {
    margin: 40px;
  }

}

@media screen and (max-width: 1010px) {
	.img2_txt3_txt_image{top:65px;}
}

@media screen and (max-width: 850px) {

  .link-news {
    max-width: fit-content;
  }

  .events-cards-wrapper {
    grid-template-columns: 1fr;
  }

  .actualites-cards-wrapper {
    grid-template-columns: 100%;
    row-gap: 40px;
  }


  .recherche-mobile {
    display: flex;
  }

  .recherche {
    display: none;
  }

  .whois-result-brevet-header {
    display: none;
    visibility: hidden;
  }

  .whois-result-brevet-item-wrapper {
    flex-direction: column;
    gap: var(--gap-15);
  }

  .whois-result-brevet-name {
    text-align: center;
  }

  .club-item-content {
    padding: var(--padding-20);
  }

  .centre-labellise-item-content-wrapper {
    padding: var(--padding-20);
  }

  .document-utile-vide-wrapper {
    align-self: center;
  }
  
  .se-former-nav-global-wrapper {
    margin-top: -120px;
  }

  .img2_txt3_txt_image{top:70px;}
	
  .section-w-padding {
    padding-bottom: 450px;
  }

  .flex-row {
    flex-direction: column;
  }

  .header-title-wrapper-text {
    padding : 320px 20px 15px 20px;
  }

  .header-page-title {
    font: normal normal bold 45px/65px Poppins;
  }

  .header-title-texte-big {
    font: normal normal normal 40px/40px Poppins;
  }

  .header-title-texte-big-bold {
    font: normal normal bold 35px/70px Poppins;
  }

  .header-navbar-burger-items ul {
    padding-inline-start: 20px;
  }

  .header-navbar-burger-items li {
    display: flex;
    flex-direction: row;
    gap: 0px 10px;
  }

  .header-navbar-burger-wrapper.active {
    opacity: 1;
    max-height: 800px;
    /* visibility : visible; */
    position: absolute;
    width: 100%;
  }

  .header-logo-lifras-small {
    display: flex;
  }

  .header-logo-lifras {
    display: none;
  }

  .header-navbar-wrapper {
    padding-top: 65px;
  }

  .header-navbar {
    gap : 0px;
    flex-direction: row;
    align-items: center;
  }

  /* Cache le menu princpal pour afficher le burger*/
  .header-navbar-items {
    display: none;
  }

  .header-navbar-items-burger {
    display: flex;
    height: 30px; 
    width: 30px; 

  }

  /* On cache le texte des 2 boutons dans le header, sur petit ecran */
  .pre-header-text:is(:last-child) {
    display: none;
  }

  /* Footer - Horaire & Réseaux */
  .footer-grid-col-3 { grid-column: auto; }
  .footer-grid-col-2 { grid-column: auto; }

  
  /* Passage de grid à grid quand on réduit l'écran, 5 lignes de 1 colonnes */
  .footer-wrapper {
    grid-template-columns: repeat(1,1fr);
    grid-template-rows: auto;
    gap:var(--gap-50);
  }

  .footer-title { margin-bottom: 0px; }

  .footer-items { justify-content: center; }

  .footer-subtext,
  .footer-text {
    text-align : center;
  }

  .barinf {
    flex-direction: column;
    align-items: center;
  }

  .barinf-items { flex-direction: column; }

  .img2_txt3_banniere {  
    gap:var(--gap-50);
  }

  .img2_txt3_img1 {
    width: 100%;
    height: 250px;
  }

  .img2_txt3_txt_image_wrapper {
	  height: 357px;
  }

  .img2_txt3_txt_image {
    align-items: center;
  }

  .scroll_link {
    scroll-behavior: smooth;
  }

  .link_w_something  {
    width: 150px; /* Certains boutons sont sur 2 lignes alors qu'ils ont la place ppur être sur 1seul */
  }

  .link_w_border_white {
    width: 150px;
  }

  .newsCard {
    /* max-width:310px; Même valeur que newsCardImg.width */
  }

  .newsCard-small {
    width: 100%;
    /* max-width: none; */
  }

  .newsCardImg {
    height:320px;
    /* width:310px; Même valeur que newsCard.max-width */
    border-radius : var(--border-radius-30);
  }

  .newsCarouselHeader {
    flex-direction: column;
    align-items: center;
    gap: 30px 30px;
    text-align: center;
    padding-right: 0px;
  }

  /* .partnerCard {
    height: 85px;
    width: 85px;;
  }

  .partnersLogo {
    height:65px;
    width:65px;
  } */

  .wrapper-2btn {
    flex-direction: column;
    align-items: center;
  }

  .wrapper-2btn-row {
    flex-direction: row;
    justify-content: space-around;
  }

  .hippocampReviewCardTextWrapper {
    flex-direction: column;
    padding:var(--padding-10);
  }

  .img_n_txt_wrapper {
    gap:var(--gap-50);
  }

  .img_n_txt_btn_txt_wrapper {
    /* text-align: center; */
    align-items: center;
  }

  
  .global-section {
    padding: 30px var(--global-padding) 30px var(--global-padding);
    gap:var(--gap-50);
  }

  .maps-padding-chercher-club {
    padding-bottom: 275px;
  }

  .maps-padding-contact {
    padding-bottom: 350px;
  }

  .section-w-medium-padding {
    padding-bottom: 400px;
  }

  .gap-sm {
    gap:var(--gap-40);
  }

  .maps-padding {
    padding-bottom: 300px;
  }

  .maps-padding-xl {
    padding-bottom: 450px;
  }

  .section-w-xsm-padding {
    padding-bottom: 150px;
  }

  .section-w-padding {
    padding-bottom: 550px;
  }

  .executive-board-wrapper {
    align-items: center;
    text-align: center;
    align-content: center;

  }

  .executive-board-cards-wrapper{
    grid-template-columns: repeat(1,fit-content(100px));
  }

  .responsible-card {
    width: 230px;
  }

  .responsible-card-wrapper {
    justify-content: center;
    gap: var(--gap-10);
  }

  .responsible-wrapper {
    align-items: center;
  }

  .responsible-types {
    justify-content: center;
  }

  /* .responsible-card {
    width: 100%;
  } */

  .info-complementaire-global-wrapper {
    height: 565px;
  }

  .info-complementaire-wrapper {
    gap : 10px;
    justify-content: space-between;
  }

  .executive-board-section {
    margin-top: -250px;
  }

  .calendar-event-global-wrapper {
    align-items: center;
    margin-top: 50px;
    padding: var(--padding-20);
  }

  .calendar-btn-wrapper {
    justify-content: center;
  }
  .txt_grid_wrapper {
    flex-direction: column;
    /* text-align: center; */
    gap:var(--gap-40);
  }

  .flex-col {
    flex-direction: column;
    align-items: center;
  }

  .records-wrapper {
    align-items: center;
  }

  .records-items-wrapper {
    grid-template-columns:repeat(1,1fr)
  } 

  .info-complementaire-wrapper {
    padding: var(--padding-20);
  }

  .txt_n_btn_img_wrapper {
    padding:var(--padding-10);
    min-height: fit-content;
  }

  .txt_n_btn_wrapper {
    padding: var(--padding-10);
    margin-left: var(--margin-10);
    margin-right: var(--margin-10);
    margin-bottom: var(--margin-10);
  }

  .btns-wrapper-n-centered {
     margin-top : 0px;
  }

  .section-w-sm-padding {
    padding-bottom: 300px;
  }

  /* .card-w-video-video-wrapper {
    min-width: auto;
    width: auto;
  } */

  .sub-sub-section {
    padding : var(--global-sub-section-padding);
    gap:var(--gap-35);
  }

  .card-w-video-n-text {
    padding: var(--padding-20);
    gap: var(--gap-20);
  }

  .card-w-texts-wrapper {
    padding: var(--padding-20);
    align-items: center;
  }

  .white-card-wrapper {
    padding: var(--padding-20);
  }

  .club-item-logo-lg {
    display: none;
    visibility: hidden;
  }

  .club-item-logo-sm {
    display: flex;
    visibility: visible;
  }

  .club-list-title-wrapper {
    flex-direction: column;
    gap: var(--gap-20);
    align-items: center;
    text-align: center;
  }

  .mission-item-wrapper {
    padding: var(--padding-20);
    width: 100%;
  }

  .mission-accordion-global-wrapper {
    align-items: center;
  }

  .mission-cards-wrapper {
    flex-wrap: nowrap;
    flex-direction: column;
  }

  .mission-acc-item-wrapper.active .mission-card-logo {
    top: 20px; 
    left:20px;
  }

  .mission-acc-item-wrapper .mission-card-title {
    margin-top : -65px;
    margin-left : 65px;
  }
  
  .map_btns_wrapper .btns-wrapper {
    flex-direction: row;
    align-items: flex-start
  }

  .map_btns_wrapper .flex-wrapper {
    flex-wrap: wrap;
    justify-content: center
  }

  .map-empty-section {
    height: 350px;
  }

  .ersamus-card-txt {
    max-width:100%;
  }

  .card-w-img-txt-btn-wrapper {
    max-width: 100%;
    padding: var(--padding-15);
    gap: var(--gap-15);
  }

  .calendar-global-title {
    text-align: center;
  }

  .calendar-title-wrapper {
    align-items: center;
    margin-top: 0px;
    margin-left: 0px;
    margin-right: 0px;
  }
  
  .scroll-btn-wrapper {
    justify-content:center;
  }

  /* .img-gallery-global-wrapper {
    text-align: center;
  } */

  .img-gallery-title {
    text-align: center;
  }

  .img-gallery-item {
    min-width:100%;
  }

  .formation-continue-txt {
    /* text-align: center; */
    /* align-items: center; */
  }

  .section-w-xl-padding {
    padding-bottom: 300px;
  }

  .map_clubs_labellise_wrapper {
    text-align: center;
  }

  /* .subtitle_n_txt_wrapper {
    text-align: center;
  } */

  .map_clubs_wrapper  {
    margin-top: -200px;
  }

  .map_translation {
    translate: 0% -37%;
  }

  .map_labellise_translation {
    translate: 0% -64%;
  }

  .map_contact_translation {
    translate: 0% -53%;
  }

  .follow-maps-wrapper {
    margin-top: -250px;
    /* margin-top: -300px; */
  }

  .follow-maps-labellise {
    margin-top: -350px;
  }

  .document-utile-items-wrapper {
    flex-direction: row;
    justify-content: center;
    /* flex-wrap: wrap; */
  }

  .liens-utile-items-wrapper {
    flex-direction: row;
    justify-content: center;
  }

  .hippocampeCardsWrapper {
    flex-direction: row;
    align-items: center;
  }

  .title_btn_wrapper {
    flex-direction: column;
    align-items: center;
    gap: var(--gap-15);
  }

  .liens-utile-items-wrapper {
    column-count: 1;
    margin: 0 auto;
  }

  .newsCardImg-small {
    width: 100%;
  }

  .activite-btns-wrapper  {
    flex-direction: column;
    gap:var(--gap-50);
    align-items: center
  }

  .sub-header-detail-all {
    width: 100%;
    display: flex;
    justify-content: center;
    text-align: center;
    left:0px;
  }

  .hidden-mobile {
    display: none;
  }

  .agendaCardImg {
    width: 100%;
  }

  .agendaCard {
    width: 100%;
    max-width: none;
  }

  .monitorat-section {
    padding: var(--padding-15);
    margin: var(--margin-15);
  }

  .iframe-video {
    height: 350px;
    width: 480px;
  }

  dialog#myModalpopupcall {
    padding: var(--padding-15);
  }

  .monitorat-floating-number {
    left:-45px;
  }

  .video-gallery-first-item {
    height: auto;
  }

  .video-gallery-items-wrapper {
    margin-top: 0px;
  }

  .txt-title {
    text-align: center;
  }

  .section-w-nmargin-top {
    margin-top : -200px;
  }

  .brevet-section-wrapper {
    padding: var(--padding-15);
    margin: 0px var(--margin-15) var(--margin-15) var(--margin-15);
  }

  .whois-txt-img {
    max-width: 75%;
    padding: var(--padding-20);
  }

  .card-w-video-text-wrapper {
    align-items: center;
  }

  /* .link_w_border_white {
    width: 170px;
  } */
  

  .margin-left-mobile {
    margin-left: 20px;
  }

}

@media screen and (max-width: 650px) {
  .page404-title {
    font: normal normal 800 210px/23px Poppins;
  }

  .page404-txt {
    font : normal normal 600 42px/50px Poppins;
  }
}

@media screen and (max-width: 650px) {
  .page404-title {
    display: none;
  }

  .page404-txt {
    margin-top: 150px;
  }
}

@media screen and (max-width: 614px) {
  .img2_txt3_txt_image{
    top:60px;
  }
}
@media screen and (max-width: 461px) {
  .img2_txt3_txt_image{
    top: 45px;
  }
}
@media screen and (max-width: 370px) {
  .img2_txt3_txt_image{
    top: 30px;
    gap: var(--gap-10);
  }
}

@media screen and (max-width : 773px){
  #info-box.map_google_info_box.map_google_info_boxRechClub {
    bottom : 230px;  
  }
}
@media screen and (max-width : 468px){

  .img2_txt3_txt_image_wrapper {
	  height: 420px;
  }


  #info-box.map_google_info_box.map_google_info_boxRechClub {
    bottom : 280px;
  }
}

@media screen and (max-width: 442px) {
  #info-box.map_google_info_box.map_google_info_boxRechClub {
    bottom : 338px;
  }
}

@media screen and (max-width: 320px) {
  .img2_txt3_txt_image{
    top:10px;
  }
}


@media screen and (max-width: 550px) {

    .header-title-wrapper-text {
    padding : 250px var(--padding-5) var(--padding-15) var(--padding-5); 
  }

  .whois-result-brevet-date-wrapper {
    flex-direction: column;
    gap: var(--gap-20);
  }

  .audiovisuel-global-wrapper {
    margin : var(--margin-20);
  }

  :root {
    --global-padding : 15px;
  }

  .txt-title-on-img {
    font : normal normal 600 33px/39px Poppins
  }

  .calendar-card-wrapper {
    width: 100%;
    padding: var(--padding-20);
  }

  .btns-wrapper {
    justify-content: center;
  }

  .info-complementaire-wrapper {
    top:10px;
    left:10px;
    right:10px;
    bottom: 10px;
  }

  .se-former-decouverte-wrapper {
    padding: var(--padding-20);
  }

  .se-former-nav-global-wrapper {
    margin-top: 0px;
  }

  .maps-padding {
    padding-bottom: 300px;
  }

  .map_translation {
    translate: 0% -31%;
  }

  .map_labellise_translation {
    translate: 0% -57%;
  }

  .map_contact_translation {
    translate: 0% -53%;
  }

  /* .follow-maps-contact {
    margin-top: -150px;
  } */

  /* .liens-utile-card {
    width: 70%;
  } */

 .section-w-xsm-padding {
    padding-bottom: var(--padding-75);
  }

  .sub-header-detail {
    visibility: hidden;
    display: none;
  }


  .iframe-video {
    height: 100%;
    width: 100%;
  }

  .section-w-margin-top {
    margin-top:300px;
  }

  .audiovisuel-photo-item {
    min-width: 220px;
    width: 220px;
  }

  .card-w-video-video-wrapper {
    /* min-width: max-content; */
    /* width: auto; */
  }

  .Whois_Separateur {
    width: 100%;
  }

}

@media screen and (max-width: 450px) {

  .img2_txt3_banniere {
    flex-direction:column;  
  }
  .records-items-wrapper {
    width: 100%;
    padding: var(--padding-10);
  }

  .records-wrapper {
    gap: var(--gap-15);
  }

  .records-global-items-wrapper  {
    gap: var(--gap-15);
  }

  .txt-on-img-txt-wrapper {
    padding: var(--padding-20);
  }

  .txt_on_img_wrapper {
    padding: var(--padding-20);
  }

  .txt-title-on-img{
    font: normal normal 600 23px/30px Poppins;
  }

  .mission-items-wrapper {
    gap: var(--gap-15);
  }

  .newsCardImg-small {
    width: 100%;
  }
}

@media screen and (max-width: 350px) {

  :root {
    --news-padding : 35px;
    --global-padding : 15px;
  }


  .newsSectionScrollable {
    padding:var(--padding-60) 0px var(--padding-60) var(--news-padding);
  }

  .news-scrollbar-wrapper {
    margin-right: var(--news-padding); /** Permet de centrer les boutons pour faire défiler les news */
  }

  .link-news-wrapper {
    justify-items:center;
  }

  .news-scrollbar-wrapper {
    justify-items:center;
  }

  .newsCard {
    text-align: center;
    /* max-width:250px; */
  }

  .newsCardImg {
    height:320px;
    width:250px;
    border-radius : var(--border-radius-30);
  }

  .newsCardImg-small {
    width: 100%;
  }

  .header-title-wrapper-text {
    padding : 190px var(--padding-5) var(--padding-15) var(--padding-5); 
  }
  
  .pre-header-wrapper {
    width: 100%;
    justify-content: center;
    right: 0px;
  }

  .board-executive-card {
    width: 260px;
  }

  .calendar-global-title {
    font : normal normal 600 33px/38px Poppins;
  }

  .custom-input {
    width: 85px;
  }

  .calendar-btn-wrapper {
    gap: var(--gap-20);
  }

  .header-page-title {
    font: normal normal bold 38px/65px Poppins;
  }

  .txt-title-bold {
    font: normal normal bold 36px/55px Poppins;
  }

  .mission-acc-item-wrapper .mission-card-title {
    margin-top : 0px;
    margin-left : 0px;
  }

  .mission-acc-item-wrapper.active .mission-card-logo {
    display: none;
    visibility: hidden;
  }
  .mission-acc-item-wrapper.active .mission-card-txt-wrapper {
    margin-top:  0px;
  }

  .card-img-white {
    padding: 0px;
  }

  .mission-acc-item-wrapper-lg {
    padding: var(--padding-10) var(--padding-5) var(--padding-10) var(--padding-5);
  }

}

@media screen and (max-width: 550px) {
  .txt-title {
    word-break: break-word;
  }
}