@font-face {
  font-family: "Exo";
  src: url("../fonts/Exo-Regular.woff2") format("woff2");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "Exo";
  src: url("../fonts/Exo-Italic.woff2") format("woff2");
  font-weight: normal;
  font-style: italic;
}
@font-face {
  font-family: "Exo";
  src: url("../fonts/Exo-SemiBold.woff2") format("woff2");
  font-weight: 600;
  font-style: normal;
}
@font-face {
  font-family: "Exo";
  src: url("../fonts/Exo-SemiBoldItalic.woff2") format("woff2");
  font-weight: 600;
  font-style: italic;
}
@font-face {
  font-family: "Exo";
  src: url("../fonts/Exo-Bold.woff2") format("woff2");
  font-weight: bold;
  font-style: normal;
}
@font-face {
  font-family: "Exo";
  src: url("../fonts/Exo-BoldItalic.woff2") format("woff2");
  font-weight: bold;
  font-style: italic;
}
.is-xxs, .is-xs, .is-s, .is-m, .is-l, .is-xl {
  display: none;
}

@media only screen and (min-width: 320px) {
  .is-xxs {
    display: block;
  }
}

@media only screen and (min-width: 570px) {
  .is-xs {
    display: block;
  }
}

@media only screen and (min-width: 740px) {
  .is-s {
    display: block;
  }
}

@media only screen and (min-width: 1100px) {
  .is-m {
    display: block;
  }
}

@media only screen and (min-width: 1300px) {
  .is-l {
    display: block;
  }
}

@media only screen and (min-width: 1600px) {
  .is-xl {
    display: block;
  }
}

.only-xxs, .only-xs, .only-s, .only-m, .only-l, .only-xl {
  display: none;
}

@media only screen and (min-width: 0px) and (max-width: 320px) {
  .only-xxs {
    display: block;
  }
}

@media only screen and (min-width: 321px) and (max-width: 570px) {
  .only-xs {
    display: block;
  }
}

@media only screen and (min-width: 571px) and (max-width: 740px) {
  .only-s {
    display: block;
  }
}

@media only screen and (min-width: 741px) and (max-width: 1100px) {
  .only-m {
    display: block;
  }
}

@media only screen and (min-width: 1101px) and (max-width: 1300px) {
  .only-l {
    display: block;
  }
}

@media only screen and (min-width: 1301px) {
  .only-xl {
    display: block;
  }
}

*:focus {
  outline: none !important;
}

html {
  line-height: 1.15;
  -webkit-text-size-adjust: 100%;
}

main {
  display: block;
}

.pointer {
  cursor: pointer;
}

strong {
  font-weight: 600;
}

.alert {
  line-height: 1.8rem;
}

a:hover {
  text-decoration: none;
}

img {
  width: 100%;
  height: auto;
}

.swiper-container {
  position: relative;
}
.swiper-container .swiper-slide {
  background-position: center;
  background-size: cover;
}
.swiper-container .swiper-slide .swiper-button-white {
  transition: 0.5s ease;
  margin-left: 10px;
  margin-right: 10px;
}
.swiper-container .swiper-slide .swiper-button-white:hover {
  transform: scale(1.2);
  transition: 0.5s ease;
}

.show {
  display: block;
}

.hide {
  display: none;
}

.container-fluid {
  padding: 0 !important;
}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
  display: block;
}

ol, ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

blockquote:before, blockquote:after {
  content: "";
  content: none;
}

q:before, q:after {
  content: "";
  content: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

#loader {
  z-index: 9999;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100vw;
  height: 100vh;
  display: flex;
  justify-content: center;
  align-items: center;
  background: #ffffff;
}
#loader .loading {
  height: 20vw;
  margin: auto;
}
@media only screen and (max-width: 1100px) {
  #loader .loading {
    width: 50vw;
    height: auto;
  }
}
@media only screen and (max-width: 740px) {
  #loader .loading {
    width: 90vw;
  }
}

.fade-in {
  opacity: 0;
}

.slide-up-fade-in {
  position: relative;
  opacity: 0;
  transform: translateY(50px);
}

.slide-right-fade-in {
  position: relative;
  opacity: 0;
  transform: translateX(-50px);
}

.slide-left-fade-in {
  position: relative;
  opacity: 0;
  transform: translateX(50px);
}

html, body {
  width: 100vw;
  color: #092D7D;
  font-family: "Arial";
  margin: 0;
  padding: 0;
  scroll-behavior: smooth;
  scroll-padding-top: 400px;
}
@media only screen and (max-width: 1100px) {
  html, body {
    scroll-padding-top: 140px;
  }
}
@media only screen and (max-width: 1100px) {
  html, body {
    overflow-x: hidden;
  }
}
html ::-moz-selection, body ::-moz-selection {
  background: #0096D2;
}
html ::selection, body ::selection {
  background: #0096D2;
}
html ::-moz-selection, body ::-moz-selection {
  background: #0096D2;
}
html a, body a {
  color: #0096D2;
  font-weight: normal;
}
html a:hover, body a:hover {
  color: #092D7D;
}
html img, body img {
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  pointer-events: none;
}

body {
  overflow-x: hidden;
  position: absolute;
  background-color: #F3F6FC;
}

h1, h2, h3, h4, h5 {
  font-family: "Exo";
}

h1 {
  font-size: 40px;
  font-weight: bold;
  line-height: 50px;
}
@media only screen and (max-width: 1100px) {
  h1 {
    font-size: 30px;
    line-height: 36px;
  }
}
@media only screen and (max-width: 740px) {
  h1 {
    font-size: 24px;
    line-height: 30px;
  }
}

h2, h3, h4, h5 {
  font-weight: 600;
}

h2 {
  font-size: 28px;
}
@media only screen and (max-width: 1100px) {
  h2 {
    font-size: 25px;
  }
}
@media only screen and (max-width: 740px) {
  h2 {
    font-size: 22px;
  }
}

h3 {
  font-size: 24px;
  margin-bottom: 20px;
}
@media only screen and (max-width: 1100px) {
  h3 {
    font-size: 22px;
  }
}
@media only screen and (max-width: 740px) {
  h3 {
    font-size: 20px;
  }
}

h4 {
  font-size: 20px;
}
@media only screen and (max-width: 1100px) {
  h4 {
    font-size: 18px;
  }
}
@media only screen and (max-width: 740px) {
  h4 {
    font-size: 16px;
  }
}

a {
  text-decoration: none;
}

p, a, ul, h4 {
  font-size: 20px;
  line-height: 24px;
}
@media only screen and (max-width: 1100px) {
  p, a, ul, h4 {
    font-size: 18px;
    line-height: 22px;
  }
}
@media only screen and (max-width: 740px) {
  p, a, ul, h4 {
    font-size: 16px;
    line-height: 20px;
  }
}

p, ul {
  margin-bottom: 20px;
}

hr {
  border-top: 1px solid #0096D2;
}

.active {
  font-weight: bolder !important;
  color: #092D7D !important;
}
.active span {
  font-weight: bolder !important;
  color: #092D7D !important;
}
.active .badge {
  color: #ffffff !important;
}

.hover {
  color: #092D7D !important;
}

.biskoui-mount .biskoui-cookie-banner p, .biskoui-mount .biskoui-cookie-banner a {
  font-size: inherit;
}

.white-block, .blue-block, .big-white-block, .big-blue-block {
  border-radius: 10px;
  box-shadow: 0px 10px 15px -3px rgba(0, 0, 0, 0.1);
}

.white-block, .blue-block {
  padding: 30px;
}
@media only screen and (max-width: 1100px) {
  .white-block, .blue-block {
    padding: 50px;
  }
}
@media only screen and (max-width: 740px) {
  .white-block, .blue-block {
    padding: 20px;
  }
}

.big-white-block, .big-blue-block {
  padding: 100px;
}
@media only screen and (max-width: 1100px) {
  .big-white-block, .big-blue-block {
    padding: 50px;
  }
}
@media only screen and (max-width: 740px) {
  .big-white-block, .big-blue-block {
    padding: 20px;
  }
}

.white-block, .big-white-block {
  background-color: #ffffff;
  color: #092D7D;
}

.blue-block, .big-blue-block {
  background-color: #092D7D;
  color: #ffffff;
}
.blue-block a:hover, .big-blue-block a:hover {
  color: #ffffff;
}

button {
  background-color: #ffffff;
  border: 1px solid #092D7D;
  border-radius: 10px;
  box-shadow: 0px 10px 15px -3px rgba(0, 0, 0, 0.1);
  padding: 10px 20px;
  color: #092D7D;
  cursor: pointer;
}
button:hover {
  background-color: #092D7D;
  color: #ffffff;
}

.link-arrow {
  display: flex;
  justify-content: left;
  align-items: center;
  width: -moz-fit-content;
  width: fit-content;
}
.link-arrow span {
  display: flex;
  align-items: center;
  padding-left: 10px;
  transition: padding 0.5s ease;
}
.link-arrow span svg {
  height: 20px;
  width: auto;
  margin: auto;
}
.link-arrow:hover span {
  padding-left: 20px;
  transition: padding 0.5s ease;
}

.dropdown-arrow {
  display: flex;
  justify-content: left;
  align-items: center;
  width: -moz-fit-content;
  width: fit-content;
}
.dropdown-arrow:hover {
  cursor: pointer;
}
.dropdown-arrow:hover span {
  color: #092D7D;
}
.dropdown-arrow .icon {
  margin-left: 10px;
  display: flex;
  align-items: center;
  transition: transform 0.5s ease;
}
.dropdown-arrow .icon svg {
  height: 20px;
  width: auto;
  margin: auto;
}

.badge {
  margin-left: 10px;
  color: white !important;
}

.img, img {
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  border-radius: 10px;
  box-shadow: 0px 10px 15px -3px rgba(0, 0, 0, 0.1);
  -o-object-fit: cover;
     object-fit: cover;
}

.swiper-button-next, .swiper-button-prev {
  color: #ffffff;
}

.swiper-pagination-bullet {
  background: #ffffff;
}

nav {
  z-index: 900;
  position: fixed !important;
  height: 100px;
  width: calc(100vw - 100px);
  margin: 20px 50px 0px 50px;
  padding: 0px 30px !important;
  background: #ffffff;
  box-shadow: 0px 10px 15px -3px rgba(0, 0, 0, 0.1);
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 10px;
  transition: top 0.5s ease;
  color: #0096D2;
}
@media only screen and (max-width: 1100px) {
  nav {
    width: calc(100vw - 40px);
    margin: 20px 20px 0px 20px;
    padding: 0px 50px !important;
  }
}
@media only screen and (max-width: 740px) {
  nav {
    width: calc(100vw - 20px);
    margin: 10px 10px 0px 10px;
    padding: 0px 20px !important;
  }
}
nav .container-fluid {
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
nav .container-fluid .logo {
  height: 60px;
  width: auto;
  float: left;
  box-shadow: none;
  border-radius: unset;
}
nav .container-fluid button {
  box-shadow: none;
  border: none;
}
nav .container-fluid button:focus {
  box-shadow: none;
}
nav .container-fluid .links {
  flex-direction: row-reverse;
}
nav .container-fluid .links .content {
  display: flex;
  margin-bottom: 0;
  font-size: 20px;
  padding-left: 0;
}
nav .container-fluid .links .content li a {
  margin-right: 50px;
  cursor: pointer;
}
nav .container-fluid .links .content li .lang-switcher a {
  margin-left: 5px;
  margin-right: 5px;
}
nav .container-fluid .links .content li .lang-switcher a:first-child {
  margin-left: 0;
}
nav .container-fluid .links .content li .lang-switcher a:last-child {
  margin-right: 0;
}
nav .container-fluid .links .content .dropdown-link .nav-dropdown {
  position: absolute;
  display: none;
  z-index: 1;
  top: 100px;
  padding: 20px;
  margin-left: -20px;
  background-color: #ffffff;
  border-radius: 10px;
  box-shadow: 0 3px 12px rgba(0, 0, 0, 0.15);
}
@media only screen and (max-width: 1100px) {
  nav .container-fluid .links .content .dropdown-link .nav-dropdown {
    position: static;
  }
}
nav .container-fluid .links .content .dropdown-link .nav-dropdown li {
  margin-bottom: 20px;
}
nav .container-fluid .links .content .dropdown-link .nav-dropdown li:last-child {
  margin-bottom: 0px;
}
nav .container-fluid .links .content .badge-secondary {
  background-color: #0096D2;
}
@media only screen and (max-width: 1100px) {
  nav .container-fluid .links {
    position: fixed;
    top: 120px;
    left: 0px;
    width: calc(100vw - 40px);
    margin: 20px 20px 0px 20px;
    padding: 0px 50px;
    background: #ffffff;
    box-shadow: 0px 10px 15px -3px rgba(0, 0, 0, 0.1);
    flex-wrap: wrap;
    text-align: center;
    border-radius: 10px;
    padding: 0px 50px;
  }
  nav .container-fluid .links .content {
    flex-wrap: wrap;
    flex-direction: row;
    padding: 20px;
  }
  nav .container-fluid .links .content li {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
  }
  nav .container-fluid .links .content li a {
    display: block;
    margin: 15px 0px;
  }
  nav .container-fluid .links .content li .lang-switcher {
    display: flex;
    margin: 15px 0px;
  }
  nav .container-fluid .links .content li .lang-switcher a {
    margin: 0px 10px;
  }
  nav .container-fluid .links .content .dropdown-link {
    display: flex;
    flex-wrap: wrap;
    padding-left: 10px;
  }
  nav .container-fluid .links .content .dropdown-link .dropdown-arrow {
    display: flex;
    flex-wrap: wrap;
  }
  nav .container-fluid .links .content .dropdown-link .nav-dropdown {
    width: 100%;
    padding: 0px;
    background-color: #F3F6FC;
    box-shadow: none;
  }
  nav .container-fluid .links .content .dropdown-link .nav-dropdown li {
    margin-bottom: 0px;
  }
}
@media only screen and (max-width: 740px) {
  nav .container-fluid .links {
    top: 110px;
    width: calc(100vw - 20px);
    margin: 10px 10px 0px 10px;
    padding: 0px 10px;
  }
  nav .container-fluid .links .content {
    padding: 10px;
  }
  nav .container-fluid .links .content li a {
    margin: 10px 0px;
  }
  nav .container-fluid .links .content li a .lang-switcher {
    margin: 10px 0px;
  }
}
nav .container-fluid .navbar-toggler {
  padding: 0;
}
nav .container-fluid .navbar-toggler:hover {
  background-color: transparent;
}
nav .container-fluid .navbar-toggler .animated-burger {
  width: 30px;
  height: 20px;
  position: relative;
  margin: 0px;
  transform: rotate(0deg);
  transition: 0.5s ease-in-out;
  cursor: pointer;
}
nav .container-fluid .navbar-toggler .animated-burger span {
  display: block;
  position: absolute;
  height: 3px;
  width: 100%;
  border-radius: 9px;
  opacity: 1;
  left: 0;
  transform: rotate(0deg);
  transition: 0.25s ease-in-out;
  background: #092D7D;
}
nav .container-fluid .navbar-toggler .animated-burger span:nth-child(1) {
  top: 0px;
}
nav .container-fluid .navbar-toggler .animated-burger span:nth-child(2), nav .container-fluid .navbar-toggler .animated-burger span:nth-child(3) {
  top: 10px;
}
nav .container-fluid .navbar-toggler .animated-burger span:nth-child(4) {
  top: 20px;
}
nav .container-fluid .navbar-toggler .animated-burger.open span:nth-child(1) {
  top: 11px;
  width: 0%;
  left: 50%;
}
nav .container-fluid .navbar-toggler .animated-burger.open span:nth-child(2) {
  transform: rotate(45deg);
}
nav .container-fluid .navbar-toggler .animated-burger.open span:nth-child(3) {
  transform: rotate(-45deg);
}
nav .container-fluid .navbar-toggler .animated-burger.open span:nth-child(4) {
  top: 11px;
  width: 0%;
  left: 50%;
}

footer {
  width: calc(100vw - 100px);
  margin: 0px 50px 20px 50px;
  padding: 60px 100px;
  background: #092D7D;
  box-shadow: 0px 10px 15px -3px rgba(0, 0, 0, 0.1);
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-radius: 10px;
  transition: top 0.5s ease;
  color: #ffffff;
  font-weight: normal;
  font-size: 16px;
}
@media only screen and (max-width: 1100px) {
  footer {
    width: calc(100vw - 40px);
    margin: 0px 20px 20px 20px;
    padding: 30px 50px;
  }
}
@media only screen and (max-width: 740px) {
  footer {
    width: calc(100vw - 20px);
    margin: 0px 10px 10px 10px;
    flex-direction: column;
    padding: 30px 20px;
  }
}
footer a, footer p {
  width: -moz-fit-content;
  width: fit-content;
  color: #ffffff;
  font-weight: normal;
  font-size: 16px;
  margin-bottom: 10px;
}
footer a:hover {
  color: #ffffff;
  text-decoration: underline;
}
footer .infos, footer .partners, footer .links {
  width: 33%;
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
}
@media only screen and (max-width: 1100px) {
  footer .infos, footer .partners, footer .links {
    width: 100%;
  }
}
@media only screen and (max-width: 740px) {
  footer .infos, footer .partners, footer .links {
    width: 100%;
    text-align: center;
    align-items: center;
  }
}
footer .infos .name {
  font-size: 24px;
}
footer .infos a:last-child, footer .infos p:last-child {
  margin-bottom: 0;
}
@media only screen and (max-width: 740px) {
  footer .infos {
    margin: 0;
  }
}
footer .partners {
  flex-direction: row;
  justify-content: center;
  align-items: center;
}
footer .partners a {
  display: block;
  height: -moz-fit-content;
  height: fit-content;
  margin: 0px 20px;
  opacity: 0.5;
}
footer .partners a:first-child {
  margin-left: 0px;
}
footer .partners a:last-child {
  margin-right: 0px;
}
@media only screen and (max-width: 1100px) {
  footer .partners a {
    margin: 10px 0px;
  }
}
@media only screen and (max-width: 740px) {
  footer .partners a {
    margin: 0px 20px;
  }
  footer .partners a:first-child {
    margin-left: 0px;
  }
  footer .partners a:last-child {
    margin-right: 0px;
  }
}
footer .partners a img {
  border-radius: 0;
  box-shadow: none;
  width: 150px;
}
footer .partners a:hover {
  opacity: 1;
}
@media only screen and (max-width: 740px) {
  footer .partners {
    margin-top: 30px;
  }
}
footer .links {
  text-align: right;
  display: flex;
  align-content: flex-end;
}
footer .links a, footer .links p {
  align-self: flex-end;
}
footer .links a:last-child, footer .links p:last-child {
  margin-bottom: 0;
}
@media only screen and (max-width: 740px) {
  footer .links a, footer .links p {
    align-self: center;
    text-align: center;
  }
}
@media only screen and (max-width: 740px) {
  footer .links {
    margin: 0;
    margin-top: 30px;
    align-content: center;
  }
}

header, main {
  width: 80vw;
  max-width: 1600px;
  margin: 0 auto;
  padding: 0;
}
@media only screen and (max-width: 1100px) {
  header, main {
    width: calc(100vw - 40px);
  }
}
@media only screen and (max-width: 740px) {
  header, main {
    width: calc(100vw - 20px);
  }
}

header {
  margin-top: 140px;
  margin-bottom: 100px;
  padding-top: 130px;
}
@media only screen and (max-width: 740px) {
  header {
    margin-top: 60px;
  }
}
header h1 {
  text-align: center;
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  margin-bottom: 130px;
}
@media only screen and (max-width: 740px) {
  header h1 {
    margin-bottom: 70px;
    padding: 10px;
  }
}
header .video-container {
  border-radius: 10px;
  box-shadow: 0px 10px 15px -3px rgba(0, 0, 0, 0.1);
  overflow: hidden;
}
header .video-container .button-play {
  z-index: 100;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  pointer-events: none;
  height: 200px;
  width: 200px;
  transition: 0.5s ease;
}
@media only screen and (max-width: 740px) {
  header .video-container .button-play {
    height: 150px;
    width: 150px;
  }
}
header .video-container .button-play svg {
  height: 50%;
  width: 50%;
  fill: rgba(255, 255, 255, 0.6);
  color: #ffffff;
}
header .video-container .button-play svg path:last-child {
  fill: #ffffff;
}
header .video-container #home-video {
  position: relative;
  width: 100%;
  aspect-ratio: 8/3;
  overflow: hidden;
  background: #092D7D;
}
@media only screen and (max-width: 740px) {
  header .video-container #home-video {
    aspect-ratio: 16/9;
  }
}
header .video-container #home-video a {
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  height: 100%;
  width: 100%;
}
header .video-container #home-video a img {
  margin-bottom: -20%;
  transform: scale(1.1);
  transition: transform 0.5s ease;
}
@media only screen and (max-width: 1100px) {
  header .video-container #home-video a img {
    margin-bottom: -10%;
  }
}
@media only screen and (max-width: 740px) {
  header .video-container #home-video a img {
    margin-bottom: 0%;
  }
}
header .video-container:hover .button-play svg {
  height: 70%;
  width: 70%;
  transition: 0.5s ease;
  text-shadow: 0px 10px 15px -3px rgba(0, 0, 0, 0.1);
}
header .video-container:hover img {
  transform: scale(1);
  transition: 0.5s ease;
}

main {
  margin-bottom: 100px;
}
main section {
  margin-bottom: 100px;
}
main section:last-child {
  margin-bottom: 0;
}

#sommaire {
  margin: 100px -100px 300px -100px;
  padding-bottom: 100px;
}
@media only screen and (max-width: 1100px) {
  #sommaire {
    margin: 0px 0px 100px 0px;
    padding-bottom: 50px;
  }
}
@media only screen and (max-width: 740px) {
  #sommaire {
    padding-bottom: 20px;
  }
}
#sommaire .triptique {
  position: relative;
  display: grid;
  grid-auto-columns: 1fr;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows: auto;
  gap: 30px 30px;
  justify-content: center;
  align-content: center;
  justify-items: stretch;
  grid-template-areas: "text1 text2 text3" "cta1 cta2 cta3" "img1 img2 img3";
}
@media only screen and (max-width: 1100px) {
  #sommaire .triptique {
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
  }
  #sommaire .triptique .text1 {
    order: 1;
  }
  #sommaire .triptique .cta1 {
    order: 2;
  }
  #sommaire .triptique .img1 {
    order: 3;
  }
  #sommaire .triptique .text2 {
    order: 4;
  }
  #sommaire .triptique .cta2 {
    order: 5;
  }
  #sommaire .triptique .img2 {
    order: 6;
  }
  #sommaire .triptique .text3 {
    order: 7;
  }
  #sommaire .triptique .cta3 {
    order: 8;
  }
  #sommaire .triptique .img3 {
    order: 9;
  }
}
@media only screen and (max-width: 740px) {
  #sommaire .triptique {
    padding-bottom: 20px;
  }
}
#sommaire .triptique p {
  margin-bottom: 0px;
}
#sommaire .triptique .img1, #sommaire .triptique .img2, #sommaire .triptique .img3 {
  position: relative;
  height: 0px;
}
@media only screen and (max-width: 1100px) {
  #sommaire .triptique .img1, #sommaire .triptique .img2, #sommaire .triptique .img3 {
    height: -moz-fit-content;
    height: fit-content;
  }
}
#sommaire .triptique .img1 img, #sommaire .triptique .img2 img, #sommaire .triptique .img3 img {
  position: absolute;
  top: 0px;
  width: 100%;
  height: 300px;
  background-color: #ffffff;
}
@media only screen and (max-width: 1100px) {
  #sommaire .triptique .img1 img, #sommaire .triptique .img2 img, #sommaire .triptique .img3 img {
    position: relative;
    height: 400px;
  }
}
@media only screen and (max-width: 740px) {
  #sommaire .triptique .img1 img, #sommaire .triptique .img2 img, #sommaire .triptique .img3 img {
    height: 200px;
  }
}

#grid-fondation .grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows: 1fr 1fr 1fr;
  gap: 30px 30px;
  grid-auto-flow: row;
  justify-content: center;
  align-content: center;
  justify-items: stretch;
  grid-template-areas: "Img-1 Img-1 Text-1" "Img-2 Text-2 Img-3" "Img-4 Img-4 Img-4";
}
@media only screen and (max-width: 1100px) {
  #grid-fondation .grid {
    grid-template-rows: auto;
    gap: 20px;
    grid-template-areas: "Text-1 Text-1 Text-1" "Img-1 Img-1 Img-2" "Text-2 Text-2 Text-2" "Img-3 Img-4 Img-4";
  }
}
#grid-fondation .grid img {
  width: 100%;
  height: 400px;
}
@media only screen and (max-width: 740px) {
  #grid-fondation .grid img {
    height: 200px;
  }
}
#grid-fondation .grid .Img-1 {
  grid-area: Img-1;
}
#grid-fondation .grid .Text-1 {
  grid-area: Text-1;
  padding-bottom: 90px;
}
@media only screen and (max-width: 1100px) {
  #grid-fondation .grid .Text-1 {
    padding: 0px 50px;
  }
  #grid-fondation .grid .Text-1 p {
    margin-bottom: 0px;
  }
}
@media only screen and (max-width: 740px) {
  #grid-fondation .grid .Text-1 {
    padding: 0px 20px;
  }
}
#grid-fondation .grid .Img-2 {
  grid-area: Img-2;
}
#grid-fondation .grid .Text-2 {
  grid-area: Text-2;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
#grid-fondation .grid .Text-2 a {
  justify-self: right;
}
#grid-fondation .grid .Img-3 {
  grid-area: Img-3;
  margin-top: -90px;
  height: 490px;
}
@media only screen and (max-width: 1100px) {
  #grid-fondation .grid .Img-3 {
    margin-top: 0px;
    height: 400px;
  }
}
@media only screen and (max-width: 740px) {
  #grid-fondation .grid .Img-3 {
    height: 200px;
  }
}
#grid-fondation .grid .Img-4 {
  grid-area: Img-4;
}

#chiffres {
  position: relative;
  height: calc(100% - 200px);
  margin-bottom: 170px;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
@media only screen and (max-width: 1100px) {
  #chiffres {
    margin-bottom: 230px;
  }
}
@media only screen and (max-width: 740px) {
  #chiffres {
    height: calc(100% - 100px);
    margin-bottom: 170px;
  }
}
#chiffres h2 {
  text-align: center;
  margin-bottom: 30px;
}
#chiffres video {
  margin-bottom: -200px;
  width: 100%;
  height: auto;
  aspect-ratio: 16/9;
  max-width: 1000px;
  border-radius: 10px;
  box-shadow: 0px 10px 15px -3px rgba(0, 0, 0, 0.1);
}
@media only screen and (max-width: 740px) {
  #chiffres video {
    margin-bottom: -100px;
  }
}

#contact-CTA {
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
#contact-CTA h2 {
  text-align: center;
  max-width: 800px;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 30px;
}

#header-card {
  z-index: 100;
  position: relative;
}
@media only screen and (max-width: 740px) {
  #header-card {
    display: flex;
    flex-direction: column-reverse;
  }
}
#header-card .texts {
  width: calc(50% + 100px);
  height: auto;
  min-height: 600px;
  margin-top: 100px;
  margin-left: -100px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
@media only screen and (max-width: 1100px) {
  #header-card .texts {
    width: 70%;
    min-height: auto;
    margin-top: 50px;
    margin-left: 0px;
  }
}
@media only screen and (max-width: 740px) {
  #header-card .texts {
    width: 100%;
    margin-top: 0px;
  }
}
#header-card .texts h4 {
  margin-bottom: 30px;
}
@media only screen and (max-width: 1100px) {
  #header-card .texts h4 {
    margin-bottom: 20px;
  }
}
#header-card .texts h1 {
  font-size: 28px;
  line-height: 40px;
  font-weight: 600;
  text-align: left;
  margin-bottom: 30px;
}
@media only screen and (max-width: 1100px) {
  #header-card .texts h1 {
    font-size: 24px;
    line-height: 30px;
    padding: 0px;
    margin-bottom: 20px;
  }
}
#header-card .texts p {
  margin-bottom: 0;
}
#header-card .texts ul {
  margin-top: 10px;
  list-style: disc;
}
#header-card .texts ul li {
  margin-top: 10px;
}
#header-card .header-breadcrumb {
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
}
@media only screen and (max-width: 1100px) {
  #header-card .header-breadcrumb h4 {
    margin-bottom: 4px;
  }
  #header-card .header-breadcrumb h4:last-child {
    margin-bottom: 20px;
  }
}
#header-card .header-breadcrumb h4:first-child a {
  color: #ffffff;
  opacity: 0.5;
}
#header-card .header-breadcrumb h4:first-child a:hover {
  opacity: 1;
}
#header-card .header-breadcrumb h4:nth-child(2) {
  margin: 0px 10px;
  opacity: 0.5;
}
#header-card .slideshow {
  z-index: -50;
  position: absolute;
  top: 230px;
  right: -100px;
  width: calc(70% + 100px);
  height: auto;
  aspect-ratio: 16/9;
  overflow: hidden;
  border-radius: 10px;
  box-shadow: 0px 10px 15px -3px rgba(0, 0, 0, 0.1);
}
@media only screen and (max-width: 1100px) {
  #header-card .slideshow {
    width: 70%;
    right: 0px;
    top: 0px;
  }
}
@media only screen and (max-width: 740px) {
  #header-card .slideshow {
    position: relative;
    width: 100%;
    margin-bottom: 10px;
  }
}
#header-card .slideshow video {
  width: 100%;
  height: 100%;
  border-radius: 10px;
}

#valeurs h2 {
  text-align: center;
  margin-bottom: 100px;
  max-width: 800px;
  margin-left: auto;
  margin-right: auto;
}
@media only screen and (max-width: 1100px) {
  #valeurs h2 {
    margin-bottom: 30px;
  }
}
#valeurs .grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows: auto 1fr auto;
  gap: 30px 30px;
  grid-auto-flow: row;
  justify-content: center;
  align-content: center;
  justify-items: stretch;
  grid-template-areas: "Img-1 Img-1 Img-2" "Img-3 Text-1 Img-2" "Img-3 Img-4 Img-4";
}
@media only screen and (max-width: 1100px) {
  #valeurs .grid {
    gap: 20px;
    grid-template-columns: 1fr;
    grid-template-rows: auto;
    grid-template-areas: "Img-1" "Img-2" "Text-1" "Img-3" "Img-4";
  }
}
#valeurs .grid .Img-1 {
  position: relative;
  overflow: hidden;
  grid-area: Img-1;
  background-color: #242424;
  border-radius: 10px;
}
#valeurs .grid .Img-1 h3 {
  z-index: 100;
  position: absolute;
  color: #ffffff;
  font-size: 40px;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
@media only screen and (max-width: 1100px) {
  #valeurs .grid .Img-1 h3 {
    font-size: 24px;
  }
}
#valeurs .grid .Img-2 {
  position: relative;
  overflow: hidden;
  grid-area: Img-2;
  background-color: #242424;
  border-radius: 10px;
}
#valeurs .grid .Img-2 h3 {
  z-index: 100;
  position: absolute;
  color: #ffffff;
  font-size: 40px;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
@media only screen and (max-width: 1100px) {
  #valeurs .grid .Img-2 h3 {
    font-size: 24px;
  }
}
#valeurs .grid .Img-3 {
  position: relative;
  overflow: hidden;
  grid-area: Img-3;
  background-color: #242424;
  border-radius: 10px;
}
#valeurs .grid .Img-3 h3 {
  z-index: 100;
  position: absolute;
  color: #ffffff;
  font-size: 40px;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
@media only screen and (max-width: 1100px) {
  #valeurs .grid .Img-3 h3 {
    font-size: 24px;
  }
}
#valeurs .grid .Img-4 {
  position: relative;
  overflow: hidden;
  grid-area: Img-4;
  background-color: #242424;
  border-radius: 10px;
}
#valeurs .grid .Img-4 h3 {
  z-index: 100;
  position: absolute;
  color: #ffffff;
  font-size: 40px;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
@media only screen and (max-width: 1100px) {
  #valeurs .grid .Img-4 h3 {
    font-size: 24px;
  }
}
#valeurs .grid .Text-1 {
  grid-area: Text-1;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
#valeurs .grid .Text-1 p {
  margin-bottom: 0;
}
#valeurs .grid img {
  width: 100%;
  height: 100%;
  opacity: 0.5;
  min-height: 300px;
}
@media only screen and (max-width: 1100px) {
  #valeurs .grid img {
    min-height: 200px;
    height: 200px;
  }
}
#valeurs .grid .Img-1, #valeurs .grid .Img-4 {
  max-height: 300px;
}

#fondation-intro {
  margin: 100px -100px 100px -100px;
}
@media only screen and (max-width: 1100px) {
  #fondation-intro {
    margin: 100px 0px;
  }
}
#fondation-intro h2 {
  text-align: center;
  max-width: 800px;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 30px;
}
#fondation-intro .texts {
  -moz-column-count: 2;
       column-count: 2;
  -moz-column-gap: 2;
       column-gap: 2;
}
@media only screen and (max-width: 1100px) {
  #fondation-intro .texts {
    -moz-column-count: 1;
         column-count: 1;
  }
  #fondation-intro .texts p:last-child {
    margin-bottom: 0px;
  }
}
#fondation-intro .texts ul {
  margin-top: 10px;
  list-style: disc;
}
#fondation-intro .texts ul li {
  margin-top: 10px;
}

#ra-slider {
  margin: 100px -100px 100px -100px;
  display: flex;
  flex-wrap: nowrap;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
@media only screen and (max-width: 1100px) {
  #ra-slider {
    margin: 100px 0px;
  }
}
#ra-slider h2 {
  text-align: center;
  max-width: 800px;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 60px;
}
@media only screen and (max-width: 1100px) {
  #ra-slider h2 {
    margin-bottom: 30px;
  }
}
#ra-slider .slider {
  width: 100%;
  height: auto;
  aspect-ratio: 1.414/1;
  overflow: hidden;
  background-color: #242424;
  border-radius: 10px;
  box-shadow: 0px 10px 15px -3px rgba(0, 0, 0, 0.1);
}
#ra-slider .slider .swiper {
  height: 100%;
  width: auto;
  border-radius: 0;
  box-shadow: none;
  padding: 60px;
}
@media only screen and (max-width: 1100px) {
  #ra-slider .slider .swiper {
    padding: 30px;
  }
}
#ra-slider .slider .swiper .swiper-slide {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
}
#ra-slider .slider .swiper .swiper-slide img {
  height: 100%;
  width: auto;
  border-radius: 0;
  box-shadow: none;
  -webkit-user-select: all;
     -moz-user-select: all;
          user-select: all;
  pointer-events: all;
  cursor: zoom-in;
}
#ra-slider .slider .swiper .swiper-slide-zoomed img {
  cursor: zoom-out;
}
#ra-slider .slider .swiper .swiper-button-next, #ra-slider .slider .swiper .swiper-button-prev {
  height: 100%;
  width: 60px;
  background-color: rgba(0, 0, 0, 0.5);
  margin: 0;
}
@media only screen and (max-width: 1100px) {
  #ra-slider .slider .swiper .swiper-button-next, #ra-slider .slider .swiper .swiper-button-prev {
    width: 30px;
  }
  #ra-slider .slider .swiper .swiper-button-next:after, #ra-slider .slider .swiper .swiper-button-prev:after {
    font-size: 30px;
  }
}
#ra-slider .slider .swiper .swiper-button-next {
  top: 0;
  right: 0;
}
#ra-slider .slider .swiper .swiper-button-prev {
  top: 0;
  left: 0;
}

#ra-listing {
  margin: 100px -100px 100px -100px;
  display: flex;
  flex-wrap: nowrap;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
@media only screen and (max-width: 1100px) {
  #ra-listing {
    margin: 100px 0px;
  }
}
#ra-listing h2 {
  text-align: center;
  max-width: 800px;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 60px;
}
@media only screen and (max-width: 1100px) {
  #ra-listing h2 {
    margin-bottom: 30px;
  }
}
#ra-listing .listing {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  padding: 20px;
}
@media only screen and (max-width: 1100px) {
  #ra-listing .listing {
    padding: 14px;
  }
}
#ra-listing .listing:nth-child(odd) {
  background-color: #F3F6FC;
}
#ra-listing .listing h3, #ra-listing .listing a, #ra-listing .listing button {
  margin: 0;
}
@media only screen and (max-width: 1100px) {
  #ra-listing .listing h3 {
    font-size: 14px;
  }
  #ra-listing .listing button {
    font-size: 14px;
    padding: 8px 12px;
  }
}

#organigramme {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
}
#organigramme h2 {
  text-align: center;
  max-width: 800px;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 30px;
}
#organigramme img {
  box-shadow: none;
  max-width: 80%;
}
@media only screen and (max-width: 1100px) {
  #organigramme img {
    max-width: 100%;
  }
}

#historique {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}
#historique .texts {
  margin-left: -100px;
  padding-right: 200px;
  width: calc(60% + 200px);
  height: auto;
  min-height: 600px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
@media only screen and (max-width: 1100px) {
  #historique .texts {
    margin-left: 0px;
    padding-right: 20px;
    width: 100%;
    min-height: auto;
  }
}
#historique .texts h2 {
  margin-bottom: 30px;
}
#historique .slider {
  margin: 250px -200px 0 -100px;
  width: calc(40% + 100px);
  height: auto;
  aspect-ratio: 16/9;
}
@media only screen and (max-width: 1100px) {
  #historique .slider {
    margin: 20px 0px 0px 0px;
    width: 100%;
  }
}
@media only screen and (max-width: 740px) {
  #historique .slider {
    margin: 10px 0px 0px 0px;
  }
}

#processus {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}
#processus .video {
  z-index: 100;
  margin: 250px -100px 0 -100px;
  width: calc(40% + 100px);
  height: auto;
  aspect-ratio: 16/9;
}
@media only screen and (max-width: 1100px) {
  #processus .video {
    margin: 0px 0px 20px 0px;
    width: 100%;
  }
}
@media only screen and (max-width: 740px) {
  #processus .video {
    margin: 0px 0px 10px 0px;
  }
}
#processus .video #processus-video {
  position: relative;
  width: 100%;
  aspect-ratio: 16/9;
  overflow: hidden;
  background: #092D7D;
  box-shadow: 0px 10px 15px -3px rgba(0, 0, 0, 0.1);
  border-radius: 10px;
}
#processus .video #processus-video .button-play {
  z-index: 100;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  pointer-events: none;
  height: 200px;
  width: 200px;
  transition: 0.5s ease;
}
@media only screen and (max-width: 740px) {
  #processus .video #processus-video .button-play {
    height: 150px;
    width: 150px;
  }
}
#processus .video #processus-video .button-play svg {
  height: 50%;
  width: 50%;
  fill: rgba(9, 45, 125, 0.6);
  color: #ffffff;
}
#processus .video #processus-video .button-play svg path:last-child {
  fill: #ffffff;
}
#processus .video #processus-video a {
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  height: 100%;
  width: 100%;
}
#processus .video #processus-video a img {
  transform: scale(1.2);
  transition: transform 0.5s ease;
}
#processus .video #processus-video:hover .button-play svg {
  height: 70%;
  width: 70%;
  transition: 0.5s ease;
  text-shadow: 0px 10px 15px -3px rgba(0, 0, 0, 0.1);
}
#processus .video #processus-video:hover img {
  transform: scale(1.1);
  transition: 0.5s ease;
}
#processus .texts {
  margin-right: -100px;
  padding-left: 200px;
  width: calc(60% + 200px);
  height: auto;
  min-height: 600px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
@media only screen and (max-width: 1100px) {
  #processus .texts {
    margin-right: 0px;
    padding-left: 20px;
    width: 100%;
    min-height: auto;
  }
}
#processus .texts h2 {
  margin-bottom: 30px;
}

.stuck #filtre {
  pointer-events: none;
}
.stuck #filtre .filtre-titre .icon {
  visibility: visible;
}
.stuck #filtre .filtre-listing {
  visibility: hidden;
}
.stuck #filtre .filtre-bg {
  pointer-events: all;
  top: 0px;
  height: 200px;
  box-shadow: 0px 10px 15px -3px rgba(0, 0, 0, 0.1);
}

.stuck-show .filtre-titre .icon {
  transform: rotate(180deg);
}
.stuck-show .filtre-listing {
  visibility: visible !important;
  pointer-events: initial;
}
.stuck-show .filtre-bg {
  height: calc(100% + 20px) !important;
}

#filtre {
  position: sticky;
  top: 0px;
  padding-top: 140px;
  z-index: 50;
  margin-bottom: 100px;
}
#filtre .filtre-titre {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  text-align: center;
  max-width: 800px;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 30px;
}
#filtre .filtre-titre h2 {
  margin-right: 10px;
  margin-bottom: 0px;
}
#filtre .filtre-titre .icon {
  display: flex;
  visibility: hidden;
  align-items: center;
}
#filtre .filtre-titre .icon svg {
  height: 24px;
  width: auto;
  margin: auto;
}
#filtre .filtre-listing {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
  gap: 20px 20px;
}
@media only screen and (max-width: 1100px) {
  #filtre .filtre-listing {
    grid-template-columns: 1fr 1fr 1fr;
  }
}
@media only screen and (max-width: 740px) {
  #filtre .filtre-listing {
    grid-template-columns: 1fr 1fr;
    gap: 10px 10px;
  }
}
#filtre .filtre-listing button {
  width: 100%;
  height: 100%;
  font-size: 18px;
  line-height: 22px;
}
@media only screen and (max-width: 1100px) {
  #filtre .filtre-listing button {
    font-size: 16px;
    line-height: 20px;
  }
}
@media only screen and (max-width: 740px) {
  #filtre .filtre-listing button {
    word-break: break-word;
  }
}
#filtre .filtre-listing button.new {
  position: relative;
  padding-top: 20px;
}
#filtre .filtre-listing button.new .badge {
  position: absolute;
  margin: 0;
  top: -10px;
  left: 50%;
  transform: translateX(-50%);
  background-color: #0096D2;
}
#filtre .filtre-bg {
  z-index: -50;
  position: absolute;
  top: -100px;
  left: -5000px;
  width: calc(100% + 10000px);
  height: calc(100% + 130px);
  background-color: #F3F6FC;
}

.block-cards {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  margin-bottom: 100px;
}
@media only screen and (max-width: 1100px) {
  .block-cards {
    flex-direction: column-reverse;
  }
}
.block-cards .texts {
  margin-left: -100px;
  padding-right: 200px;
  width: calc(60% + 200px);
  height: auto;
  min-height: 600px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
@media only screen and (max-width: 1100px) {
  .block-cards .texts {
    margin-left: 0px;
    padding-right: 50px;
    width: 100%;
    min-height: auto;
  }
}
@media only screen and (max-width: 740px) {
  .block-cards .texts {
    padding-right: 20px;
  }
}
.block-cards .texts h2, .block-cards .texts h4 {
  margin-bottom: 20px;
}
.block-cards .slider {
  margin: 250px -200px 0 -100px;
  width: calc(40% + 100px);
  height: auto;
  aspect-ratio: 16/9;
}
@media only screen and (max-width: 1100px) {
  .block-cards .slider {
    margin: 0px 0px 20px 0px;
    width: 100%;
  }
}
@media only screen and (max-width: 740px) {
  .block-cards .slider {
    margin: 0px 0px 10px 0px;
  }
}
.block-cards .slider #vimeo-link {
  position: relative;
  width: 100%;
  height: 100%;
  aspect-ratio: 16/9;
  overflow: hidden;
  background: #092D7D;
}
.block-cards .slider #vimeo-link .button-play {
  z-index: 100;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  pointer-events: none;
  height: 200px;
  width: 200px;
  transition: 0.5s ease;
}
@media only screen and (max-width: 740px) {
  .block-cards .slider #vimeo-link .button-play {
    height: 150px;
    width: 150px;
  }
}
.block-cards .slider #vimeo-link .button-play svg {
  height: 50%;
  width: 50%;
  fill: rgba(9, 45, 125, 0.6);
  color: #ffffff;
}
.block-cards .slider #vimeo-link .button-play svg path:last-child {
  fill: #ffffff;
}
.block-cards .slider #vimeo-link a {
  height: 100%;
  width: 100%;
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
}
.block-cards .slider #vimeo-link a img {
  filter: brightness(0.5);
  transform: scale(1.2);
  transition: transform 0.5s ease;
}
.block-cards .slider #vimeo-link a .video_iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}
.block-cards .slider #vimeo-link a .video_iframe iframe {
  filter: brightness(0.4);
  position: absolute;
  width: 100%;
  height: 100%;
}
.block-cards .slider #vimeo-link:hover .button-play svg {
  height: 70%;
  width: 70%;
  transition: 0.5s ease;
  text-shadow: 0px 10px 15px -3px rgba(0, 0, 0, 0.1);
}
.block-cards .slider #vimeo-link:hover img {
  transform: scale(1.1);
  transition: 0.5s ease;
}
.block-cards:nth-child(even) {
  flex-direction: row-reverse;
}
@media only screen and (max-width: 1100px) {
  .block-cards:nth-child(even) {
    flex-direction: column-reverse;
  }
}
.block-cards:nth-child(even) .texts {
  margin-left: 0px;
  padding-right: 100px;
  margin-right: -100px;
  padding-left: 200px;
}
@media only screen and (max-width: 1100px) {
  .block-cards:nth-child(even) .texts {
    padding-right: 50px;
    margin-right: 0px;
    padding-left: 50px;
  }
}
@media only screen and (max-width: 740px) {
  .block-cards:nth-child(even) .texts {
    padding-right: 20px;
    padding-left: 20px;
  }
}
.block-cards:nth-child(even) .slider {
  margin: 250px -100px 0 -200px;
}
@media only screen and (max-width: 1100px) {
  .block-cards:nth-child(even) .slider {
    margin: 0px 0px 20px 0px;
  }
}
@media only screen and (max-width: 740px) {
  .block-cards:nth-child(even) .slider {
    margin: 0px 0px 10px 0px;
  }
}
.block-cards:last-child {
  margin-bottom: 0px;
}

#intro {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}
#intro .slider {
  margin: 250px -100px 0 -100px;
  width: calc(40% + 100px);
  height: auto;
  aspect-ratio: 16/9;
}
@media only screen and (max-width: 1100px) {
  #intro .slider {
    margin: 0px 0px 20px 0px;
    width: 100%;
  }
}
@media only screen and (max-width: 740px) {
  #intro .slider {
    margin: 0px 0px 10px 0px;
  }
}
#intro .texts {
  margin-right: -200px;
  padding-left: 200px;
  width: calc(60% + 200px);
  height: auto;
  min-height: 600px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
@media only screen and (max-width: 1100px) {
  #intro .texts {
    margin-right: 0px;
    padding-left: 50px;
    width: 100%;
    min-height: auto;
  }
}
@media only screen and (max-width: 740px) {
  #intro .texts {
    padding-left: 20px;
  }
}
#intro .texts h2 {
  margin-bottom: 30px;
}

#grid h2 {
  text-align: center;
  margin-bottom: 100px;
  max-width: 800px;
  margin-left: auto;
  margin-right: auto;
}
#grid .grid {
  position: relative;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows: auto 1fr auto;
  gap: 30px 30px;
  grid-auto-flow: row;
  justify-content: center;
  align-content: center;
  justify-items: stretch;
  grid-template-areas: "Img-1 Img-1 Img-2" "Img-3 Text-1 Img-2" "Img-3 Img-4 Img-4";
}
@media only screen and (max-width: 1100px) {
  #grid .grid {
    grid-template-rows: auto;
    gap: 20px 20px;
    grid-template-areas: "Img-1 Img-1 Img-2" "Text-1 Text-1 Text-1" "Img-3 Img-4 Img-4";
  }
}
#grid .grid .Img-1 {
  grid-area: Img-1;
}
#grid .grid .Img-2 {
  grid-area: Img-2;
}
#grid .grid .Img-3 {
  grid-area: Img-3;
}
#grid .grid .Img-4 {
  grid-area: Img-4;
}
#grid .grid .Text-1 {
  grid-area: Text-1;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
#grid .grid .Text-1 p {
  margin-bottom: 0;
}
#grid .grid img {
  width: 100%;
  height: 100%;
  min-height: 300px;
}
@media only screen and (max-width: 1100px) {
  #grid .grid img {
    height: 200px;
  }
}
#grid .grid .Img-1, #grid .grid .Img-4 {
  max-height: 300px;
}
#grid .grid .grid-background {
  z-index: -50;
  position: absolute;
  top: 100px;
  left: -100px;
  height: calc(100% - 200px);
  width: calc(100% + 200px);
  background-color: #092D7D;
  box-shadow: 0px 10px 15px -3px rgba(0, 0, 0, 0.1);
  border-radius: 10px;
}

#basic h2, #basic h3, #basic h4 {
  margin: 60px 0px 20px 0px;
}
#basic ul {
  list-style-type: disc;
}
#basic ul li {
  margin-bottom: 10px;
}

.contact main .grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows: 1fr 1fr 1fr;
  gap: 30px 30px;
  grid-auto-flow: row;
  justify-content: center;
  align-content: center;
  justify-items: stretch;
  grid-template-areas: "Map Infos Contact" "Map Form Form" "Map Form Form";
}
@media only screen and (max-width: 1100px) {
  .contact main .grid {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto;
    gap: 20px 20px;
    grid-template-areas: "Map Map" "Infos Infos" "Contact Contact" "Form Form";
  }
}
.contact main .Map {
  cursor: grab;
  grid-area: Map;
  position: relative;
  overflow: hidden;
}
@media only screen and (max-width: 1100px) {
  .contact main .Map {
    height: 300px;
  }
}
.contact main .Map:active {
  cursor: grabbing;
}
.contact main .Map #map {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
}
.contact main .Map #map .marker {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 100;
  background-image: url("../images/PRFN-marker.svg");
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  width: 50px;
  height: 50px;
  cursor: pointer;
}
.contact main .Map #map .mapboxgl-canvas {
  height: 100% !important;
  width: 100% !important;
}
@media only screen and (max-width: 1100px) {
  .contact main .Map #map .mapboxgl-control-container {
    display: none;
  }
}
.contact main .Map #map .mapboxgl-control-container .mapboxgl-ctrl-bottom-left, .contact main .Map #map .mapboxgl-control-container .mapboxgl-ctrl-top-left {
  display: none;
}
.contact main .Map #map .mapboxgl-control-container button {
  box-shadow: none;
  border-radius: initial;
}
.contact main .Map #map .mapboxgl-control-container .mapboxgl-ctrl-group:not(:empty) {
  border-radius: 10px;
  box-shadow: 0px 10px 15px -3px rgba(0, 0, 0, 0.1);
  overflow: hidden;
}
.contact main .Map #map .mapboxgl-control-container .mapboxgl-ctrl-attrib.mapboxgl-compact {
  min-height: 24px;
  box-shadow: 0px 10px 15px -3px rgba(0, 0, 0, 0.1);
}
.contact main .Map #map .mapboxgl-control-container .mapboxgl-ctrl-attrib.mapboxgl-compact .mapboxgl-ctrl-attrib-button {
  padding: initial;
  border-radius: 10px;
}
.contact main .Map #map .mapboxgl-control-container .mapboxgl-ctrl-attrib.mapboxgl-compact .mapboxgl-ctrl-attrib-inner a {
  font-size: 12px;
  color: #0096D2;
}
.contact main .Map #map .mapboxgl-control-container .mapboxgl-ctrl-attrib.mapboxgl-compact .mapboxgl-ctrl-attrib-inner a:hover {
  color: #092D7D;
}
.contact main .Infos {
  grid-area: Infos;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.contact main .Infos p {
  margin-bottom: 0;
}
.contact main .Contact {
  grid-area: Contact;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.contact main .Form {
  grid-area: Form;
  display: flex;
  align-items: center;
}
.contact main .Form form {
  display: flex;
  flex-wrap: wrap;
}
.contact main .Form form .left, .contact main .Form form .right {
  width: calc(50% - 15px);
}
@media only screen and (max-width: 1100px) {
  .contact main .Form form .left, .contact main .Form form .right {
    width: calc(50% - 10px);
  }
}
@media only screen and (max-width: 740px) {
  .contact main .Form form .left, .contact main .Form form .right {
    width: 100%;
  }
}
.contact main .Form form .left label, .contact main .Form form .left input, .contact main .Form form .left select, .contact main .Form form .left textarea, .contact main .Form form .right label, .contact main .Form form .right input, .contact main .Form form .right select, .contact main .Form form .right textarea {
  width: 100%;
}
.contact main .Form form .left input, .contact main .Form form .left select, .contact main .Form form .left textarea, .contact main .Form form .right input, .contact main .Form form .right select, .contact main .Form form .right textarea {
  margin-bottom: 20px;
  padding: 10px;
  border: 1px solid #092D7D;
  border-radius: 10px;
  color: #092D7D;
}
.contact main .Form form .left ::-moz-placeholder, .contact main .Form form .right ::-moz-placeholder {
  color: rgba(9, 45, 125, 0.5);
}
.contact main .Form form .left ::placeholder, .contact main .Form form .right ::placeholder {
  color: rgba(9, 45, 125, 0.5);
}
.contact main .Form form .left textarea, .contact main .Form form .right textarea {
  min-height: 200px;
  max-height: 200px;
  resize: none;
}
.contact main .Form form .left .g-recaptcha, .contact main .Form form .right .g-recaptcha {
  margin-bottom: 20px;
  float: left;
}
.contact main .Form form .left button, .contact main .Form form .right button {
  min-width: 50%;
  float: right;
}
.contact main .Form form .left {
  margin-right: 15px;
}
@media only screen and (max-width: 1100px) {
  .contact main .Form form .left {
    margin-right: 10px;
  }
}
@media only screen and (max-width: 740px) {
  .contact main .Form form .left {
    margin-right: 0px;
  }
}
.contact main .Form form .right {
  margin-left: 15px;
}
@media only screen and (max-width: 1100px) {
  .contact main .Form form .right {
    margin-left: 10px;
  }
}
@media only screen and (max-width: 740px) {
  .contact main .Form form .right {
    margin-left: 0px;
  }
}

#g-recaptcha-response {
  display: block !important;
  position: absolute;
  margin: -100px 0 0 -20px !important;
  width: 302px !important;
  height: 76px !important;
  min-height: initial !important;
  max-height: initial !important;
  z-index: -999999;
  opacity: 0;
}

.thanks header {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  flex-direction: column;
}
.thanks header h1 {
  margin-bottom: 30px;
}
.thanks header h2 {
  text-align: center;
  width: 100%;
  max-width: 800px;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 30px;
}
.thanks main {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  flex-direction: column;
}
.thanks main > h3 {
  text-align: center;
  margin-bottom: 30px;
}
.thanks main .big-white-block {
  margin: 0 auto;
  max-width: 800px;
  margin-bottom: 30px;
}
@media only screen and (max-width: 1100px) {
  .thanks main .big-white-block {
    width: 100%;
    max-width: 100%;
  }
}
.thanks main h4 {
  margin-bottom: 30px;
  color: #0096D2;
}
.thanks main p {
  margin-bottom: 0;
  margin-top: 30px;
}
.thanks main a {
  margin: 0 auto;
  margin-bottom: 30px;
}

.error {
  height: 100vh;
  padding-top: 100px;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
}