:root {
  --Radius: 10px;
  --GREY-8: #666;
  --GREY-1: #fdfdfd;
  --GREY-2: #eeeef4;
  --GREY-4: #ddd;
  --CP-9: #1d206b;
}


* {
  margin: 0;
  padding: 0;
  list-style: none;
}

body {
  font-family: Poppins, Arial, Helvetica, sans-serif;
  line-height: 1.6;
  min-width: 320px;
}

.content {
  max-width: 1240px;
  margin: 0 auto;
}

.label {
  background-color: white;
  display: block;
  text-transform: uppercase;
  font-size: 14px;
  padding: 2px 8px;
  border-radius: 20px;
  font-weight: 600;
  width: fit-content;
  color: #4e4eea;
}

/* BOX */

@media (max-width: 1240px) {
  .content {
    flex-direction: column !important;
    width: calc(100% - 40px) !important;
    padding: 0 20px;
  }
  section {
    width: 100%;
  }
  .box50 {
    justify-content: center !important;
    margin-top: 20px;
    width: 100% !important;
  }

  form {
    width: calc(100% - 60px) !important;
    padding: 30px !important;
    max-width: 800px;
  }
  main {
    width: 320px;
  }
}

/* FORM */

form {
  border-radius: 26px;
  background: var(--GREY-White, #fff);
  box-shadow: 0px 4px 250px 0px rgba(0, 0, 0, 0.05);
  display: flex;
  width: 450px;
  padding: 40px;
  flex-direction: column;
  align-items: flex-start;
  gap: 20px;
  flex-shrink: 0;
}

.form-group {
  width: 100%;
}

.form-group50 {
  display: flex;
  gap: 20px;
}

.form-group-checkbox {
  display: flex;
}

.form-group-checkbox label {
  font-size: 12px !important;
}

.form-group-checkbox a {
  color: var(--GREY-8);
}

.form-group label {
  display: block;
  margin-bottom: 5px;
  font-size: 16px;
  color: var(--GREY-8);
}
.form-group input,
select {
  width: 100%;
  padding: 14px;
  box-sizing: border-box;
  border-radius: var(--Radius, 10px);
  border: 1px solid var(--GREY-4, #ddd);
  background: var(--GREY-1, #fdfdfd);
}

select {
  appearance: none;
  background-image: url("/img/select-arrow.png");
  background-repeat: no-repeat;
  background-position: right 0.7rem top 50%;
  background-size: 1rem auto;
}

.form-group input[type="checkbox"] {
  accent-color: var(--Color); /* Fond rouge de la checkbox */
  margin-right: 10px;
  margin-top: -6px;
  width: 25px;
  height: 35px;
}

.form-group-box {
  width: 50%;
}

form .button {
  width: 100%;
}

/* BUTTON */

.button {
  display: flex;
  height: 49px;
  padding: 0px 20px;
  justify-content: center;
  align-items: center;
  gap: var(--Radius);
  border-radius: 12px;
  background-color: var(--Color);
  cursor: pointer;
  border: none;
  animation-duration: 30ms;
  color: white;
  font-weight: 600;
  font-size: 18px;
  text-decoration: none;
  line-height: 18px;
  width: fit-content;
}

button:hover {
  background-color: var(--ColorHover);
}

/* H */

h1 {
  color: var(--CP-9);
  font-size: 60px;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
  letter-spacing: 0.2px;
}

h2 {
  color: var(--CP-9);
  font-size: 40px;
  font-weight: 600;
}

h1 span {
  background-color: var(--Color);
  padding: 5px 10px;
  border-radius: 10px;
  display: inline;
  color: white;
}

h3 {
  color: var(--CP-9, #404092);
  font-size: 19px;
  font-style: normal;
  font-weight: 600;
}

h4 {
  color: var(--CP-9);
  font-size: 22px;
  font-style: normal;
  font-weight: 600;
}

h5 {
  color: #444570;
  text-align: center;
  font-size: 18px;
  font-weight: 600;
}

@media (max-width: 1240px) {
  h1 {
    font-size: 40px;
  }
  h2 {
    font-size: 27px;
  }
  h4 {
    font-size: 20px;
  }
  h5 {
    font-size: 16px;
  }
}

.box50 {
  flex: 1;
  min-width: 300px;
  width: 50%;
}

.box30 {
  min-width: 300px;
  width: 30%;
}

.box70 {
  min-width: 300px;
  width: 70%;
}

.line {
  background-color: #d8d7ff;
  width: 137px;
  height: 1px;
  display: block;
}

.section-padding-5 {
  padding: 5% 0;
}

.section-padding-3 {
  padding: 3% 0;
}

/******************************** ICON THEME 1 *********************************/

.icons-theme {
  position: relative;
}

.icons-theme li {
  width: 45px;
  height: 45px;
  background-color: white;
  border-radius: 10px;
  box-shadow: 0px 2.179px 23.968px 0px rgba(47, 50, 125, 0.1);
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;

  /*transform: rotate(-2deg);*/
}

.icons-theme li img {
  width: 70%;
  height: 70%;
}

.icons-theme li .full-svg {
  width: 100% !important;
  height: 100%;
}

/******************************** SECTION 1 *********************************/

#section1 {
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  background: linear-gradient(
    295deg,
    rgba(255, 255, 255, 0) 50.62%,
    var(--ColorLight) 102.17%
  );
  padding-top: 0%;
}

#section1 .subtitle {
  font-size: 22px;
  margin-bottom: 10px;
  display: block;
}

.senza-formations-logo span {
  text-transform: uppercase;
  font-weight: 500;
  color: #9797a6;
}
.senza-formations-logo {
  position: relative;
  font-size: 24px;
  letter-spacing: 0.08px;
  text-align: left;
  display: inline-block;
  color: #1e1f4b;
  font-family: Poppins;
  padding: 30px;
}

#section1 .content {
  display: flex;
  align-items: center;
}

#section1 .box50 {
  display: flex;
  justify-content: right;
  position: relative;
}

#section1 .box50:first-child {
  gap: 40px;
  flex-direction: column;
  display: flex;
}

#section1 p {
  font-size: 20px;
  font-style: normal;
  font-weight: 400;
  line-height: 36px; /* 180% */
  color: var(--GREY-8);
}

#section1 .logo-CPF {
  width: 329px;
  height: 175px;
  transform: rotate(-2deg);
  box-shadow: 0px 6px 50px 0px rgba(112, 111, 229, 0.1);
  display: block;
}

#section1 .icons-theme {
  position: absolute;
  width: 100%;
}

#section1 .icons-theme li:nth-child(1) {
  right: -20px;
  top: -30px;
  transform: rotate(-15deg);
}

#section1 .icons-theme li:nth-child(2) {
  right: -30px;
  top: 290px;
  transform: rotate(15deg);
  z-index: -10;
}

#section1 .icons-theme li:nth-child(3) {
  left: 60px;
  top: 230px;
  transform: rotate(-15deg);
}

#section1 .icons-theme li:nth-child(4) {
  left: -30px;
  top: 120px;
  width: 50px;
  height: 50px;
  transform: rotate(-15deg);
}

#section1 .icons-theme li:nth-child(5) {
  left: 30px;
  top: 50px;
  transform: rotate(-25deg);
}
#section1 .icons-theme li:nth-child(6) {
  left: -120px;
  top: -20px;
  transform: rotate(-15deg);
}
@media (max-width: 1240px) {
  #section1 .icons-theme {
    visibility: hidden;
    display: none;
  }
  #section1 p {
    font-size: 16px;
    line-height: 24px;
  }
  #section1 .box50 {
    gap: 20px !important;
  }
  .senza-formations-logo {
    text-align: center;
    width: 100%;
    padding: 10px 0;
    border-bottom: 1px solid var(--GREY-4);
  }

  #section1 .box50:first-child {
    justify-content: center;
    align-items: center;
  }
}

@media (max-width: 380px) {
  #section1 .content img {
    width: 100%;
    height: auto;
  }
}

line {
  background-color: #ebdede;
  height: 0.5px;
  display: block;
  margin: 10px 0;
}

#section1 form span {
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  line-height: 110%;
  color: var(--Color);
}

#section1 form strong {
  font-size: 16px;
  font-style: normal;
  font-weight: 600;
  line-height: 110%;
  color: var(--CP-9);
}

#section1 form p {
  color: var(--CP-9);
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 150%;
}

/******************************** SECTION 2 *********************************/

#section2 {
  padding: 3% 0;
  max-width: 1000px;
  margin: auto;
}

.group-icons {
  display: flex;
  gap: 20px;
  align-items: center;
  justify-content: space-around;
  flex-direction: row;
  flex-wrap: wrap;
}

.group-img img {
  width: 200px;
  height: 200px;
}

.group-icon,
.group-img {
  display: flex;
  flex-direction: column;
  align-items: center;
  border: 1px solid #d8d7ff;
  border-radius: 20px;
  min-width: 200px;
  min-height: 200px;
  justify-content: center;
}

.group-icon-svg {
  background-color: white;
  padding: 15px;
  width: 70px;
  height: 70px;
  border-radius: 15px;
}

.group-img {
  border: 6px solid white;
  width: 115px;
  height: 115px;
  display: block;
  border-radius: 25px;
}

.group-icon-text {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.group-icon-text span {
  color: var(--CP-9);
  text-align: center;
  font-size: 24px;
  line-height: 36px;
  font-weight: 600;
}

.group-icon-text label {
  color: var(--GREY-8);
  text-align: center;
  font-size: 20px;
  line-height: 36px;
}

.select-city {
  display: flex;
  flex-direction: column;
  align-items: center;
  flex: 1 1 0;
  justify-content: center;
  border-left: 1px solid var(--GREY-4);
  padding-left: 32px;
}

.select-city label {
  font-size: 16px;
}

@media (max-width: 1240px) {
  /*.content .group-icons {
    align-items: baseline;
    justify-content: left;
    width: 100%;
    margin-bottom: 16px;
  }
  .content .group-icons .group-icon {
    flex-direction: row;
    align-items: center;
    text-align: left;
    min-width: 250px;
  }

  .content .group-icons .group-icon img {
    width: 40px;
    height: 40px;
    margin-bottom: 0px;
  }

  .content .group-icons .group-icon-text {
    align-items: last baseline;
    margin-left: 16px;
  }*/

  .content .group-icons .group-icon-text span,
  .content .group-icons .group-icon-text label,
  .select-city span {
    font-size: 16px !important;
    line-height: 20px;
  }
  .content .group-icon {
    margin-bottom: 0px;
    border: 1px solid #d8d7ff;
  }
  .select-city {
    border-left: 0 !important;
    padding: 0px;

    width: 100%;
  }
  .select-city img {
    margin-top: 24px;
  }
}

#section2 .icon {
  background-color: var(--Color);
  width: 50px;
  height: 50px;
  margin: auto;
  display: block;
}

.content-icon {
  background-color: var(--ColorLight);
  padding: 15px;
  border-radius: 15px;
}

#section2 .group-icon:nth-child(1) .icon {
  mask: "img/calendar.svg" no-repeat center / contain;
  -webkit-mask: url("img/calendar.svg") no-repeat center / contain;
}

#section2 .group-icon:nth-child(2) .icon {
  mask: "img/time.svg" no-repeat center / contain;
  -webkit-mask: url("img/time.svg") no-repeat center / contain;
}

/******************************** SECTION 3 *********************************/

#section-objectifs {
  background: linear-gradient(
    295deg,
    rgba(255, 255, 255, 0) 50.62%,
    var(--ColorLight) 102.17%
  );
}

#section-objectifs .content {
  display: flex;
  align-items: center;
  flex-direction: row;
}
#section-objectifs .box50 {
  display: flex;
  justify-content: center;
}

#section-objectifs .box50:first-child {
  gap: 20px;
  flex-direction: column;
  display: flex;
}
/*
#section-objectifs h2 {
  margin-bottom: 15px;
}*/

#section-objectifs ul li .icon {
  background-color: var(--Color);
  mask: "img/arrow.svg" no-repeat center / contain;
  -webkit-mask: url("img/arrow.svg") no-repeat center / contain;
  width: 20px !important;
  height: 20px !important;
  margin-right: 3px;
  display: inline-block;
  vertical-align: middle;
}

#section-objectifs ul li {
  font-size: 17px;
  text-transform: capitalize;
  font-weight: 600;
  color: var(--GREY-8);
  /*display: flex;*/
  align-items: top;
}

#section-objectifs ul {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

#section-objectifs .date-session ul {
  display: flex;
  flex-direction: row;
  gap: 10px;
  margin-top: 15px;
  flex-wrap: wrap;
}

#section-objectifs .date-session ul li {
  padding: 10px;
  background-color: var(--GREY-2);
  border-radius: 5px;
  font-weight: 400;
}

.date-session-remote {
  display: flex;
  gap: 15px;
}

#section-objectifs p {
  font-size: 17px;
  font-style: normal;
  line-height: 25px;
  color: var(--CP-9);
}

#section-objectifs .circle {
  width: 400px;
  height: 400px;
  border-radius: 50%;
  border: 15px solid var(--Color);
  background: var(--ColorLight);
  position: relative;
}

#section-objectifs .circle .picture {
  width: 460px;
  position: absolute;
  bottom: 0px;
  left: 12px;
}

#section-objectifs .icons-theme li:nth-child(1) {
  right: -20px;
  top: -60px;
  transform: rotate(-15deg);
}

#section-objectifs .icons-theme li:nth-child(2) {
  right: -60px;
  top: 250px;
  width: 60px;
  height: 60px;
  transform: rotate(15deg);
}

#section-objectifs .icons-theme li:nth-child(3) {
  right: -90px;
  top: 60px;
  transform: rotate(-5deg);
}

#section-objectifs .icons-theme li:nth-child(4) {
  left: -60px;
  top: 280px;
  width: 50px;
  height: 50px;
  transform: rotate(-15deg);
}

#section-objectifs .icons-theme li:nth-child(5) {
  left: -60px;
  top: -60px;
  transform: rotate(5deg);
}

@media (max-width: 1240px) {
  #section-objectifs .content .box50 ul li,
  #section-objectifs p {
    font-size: 14px;
  }
  #section-objectifs .content {
    flex-direction: column-reverse !important;
    align-items: left;
    justify-content: center;
    /*flex-direction: row-reverse !important;
    flex-wrap: wrap;*/
  }
  #section-objectifs .box50:nth-child(2) {
    /*display: block;
    flex: 0 0 auto;
    height: 300px !important;
    width: 100% !important;*/
    flex: 0 0 auto;
    display: flex;
    margin: auto;
    height: 300px !important;
  }
  #section-objectifs .circle {
    transform: scale(0.7); /* Équivalent à scaleX(0.7) scaleY(0.7) */
  }
  #section-objectifs .box50 {
    justify-content: center;
    align-items: center;
  }
}

/******************************** SECTION Google *********************************/

#section-google {
  background-color: var(--GREY-1);
  border-top: 1px solid var(--GREY-4);
  text-align: center;
}

#ssection-google h3 {
  color: var(--Color);
}

/******************************** SECTION Format *********************************/

#section-formats {
  background-color: var(--ColorLight);
}

#section-formats h2 {
  text-align: center;
  padding-bottom: 20px;
}

#section-formats .content {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0 30px;
}

#section-formats .format {
  background-color: white;
  padding: 36px;
  border-radius: 10px;
  display: flex;
  gap: 15px;
  align-content: flex-start;
  justify-content: flex-start;
  flex-direction: column;
  border: 1px solid #e5e5e5;
  max-width: 500px;
}

#section-formats .format .icon {
  width: 90px;
  background-color: var(--Color);
  height: 90px;
  display: block;
}

#section-formats .presentiel .icon {
  mask: "img/hybride.svg" no-repeat center / contain;
  -webkit-mask: url("img/hybride.svg") no-repeat center / contain;
}

#section-formats .hybride .icon {
  mask: "img/remote.svg" no-repeat center / contain;
  -webkit-mask: url("img/remote.svg") no-repeat center / contain;
}

#section-formats .Or {
  font-size: 28px;
  font-weight: 600;
  color: var(--CP-9);
}

#section-formats .format .subtitle {
  font-size: 20px;
  font-style: normal;
  font-weight: 600;
  line-height: 160%;
  color: var(--CP-9);
}

#section-formats .format ul {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

#section-formats .format ul li span {
  color: var(--Color);
  font-size: 18px;
  font-style: normal;
  font-weight: 600;
  line-height: 160%; /* 28.8px */
}

#section-formats .format ul li p {
  color: #444570;
  padding-left: 15px;
}

/******************************** SECTION 5 *********************************/

#section5 {
  background-color: var(--ColorLight);
}

#section5 .content {
  display: flex;
  flex-direction: row;
  gap: 40px;
}

#section5 .box50 img {
  width: 365px;
  /*margin: 0 auto;*/
}

#section5 .content .box50:first-child {
  display: flex;
  align-items: center;
  text-align: center;
}

#section5 span {
  background-color: var(--CP-9);
  color: white;
  font-size: 30px;
  padding: 8px 30px;
  font-weight: 600;
  border-radius: 50px;
  margin: 0 auto;
}

#section5 h2 {
  margin: 0 auto;
}

#section5 .box50 {
  display: flex;
  justify-content: right;
}

#section5 .box50:first-child {
  gap: 20px;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  font-size: 18px;
}

#section5 .box50:first-child label {
  color: #e6436a;
}

#section5 .box50:first-child p {
  font-weight: 600;
  color: var(--CP-9);
}

/******************************** SECTION 6 *********************************/

#section_france_competance .content {
  display: flex;
  flex-direction: column;
  gap: 20px;
  color: var(--CP-9);
}

#section_france_competance .france_competance {
  display: flex;
  flex-direction: row;
  gap: 40px;
  justify-content: center;
  align-items: center;
}

#section_france_competance .france_competance h6 {
  font-size: 18px;
}

#section_france_competance .content img {
  width: 380px;
  height: 129.5px;
  flex-shrink: 0;
}

#sectisection_france_competanceon6 .content div {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

#section_france_competance .content .france_competance p {
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 160%; /* 28.8px */
  color: var(--CP-9);
  margin-bottom: 20px;
}

@media (max-width: 1000px) {
  #section_france_competance .france_competance {
    flex-direction: column;
  }
}

/******************************** SECTION team SENZA *********************************/

#section_team_senza {
  background-color: var(--ColorLight);
}

#section_team_senza .content {
  display: flex;
  justify-content: center;
  gap: 70px;
}

#section_team_senza .content div {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 15px;
}

#section_team_senza .content h2 {
  font-size: 32px;
  line-height: 146%;
}

#section_team_senza ul li .icon {
  background-color: var(--Color);
  mask: "img/arrow.svg" no-repeat center / contain;
  -webkit-mask: url("img/arrow.svg") no-repeat center / contain;
  width: 20px !important;
  height: 20px !important;
  margin-right: 3px;
  display: inline-block;
  vertical-align: middle;
}
#section_team_senza ul {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

#section_team_senza ul li {
  font-size: 17px;
  text-transform: capitalize;
  font-weight: 600;
  color: var(--GREY-8);
  /*display: flex;*/
  align-items: top;
}

@media (max-width: 550px) {
  #section_team_senza img {
    width: 100%;
  }
}

/******************************** SECTION 7 *********************************/

#section7 .content {
  display: flex;
  align-items: center;
  text-align: center;
  justify-content: center;
  flex-direction: column;
}

/***  desired colors for children  ***/
#section7 .icon {
  background-color: var(--Color);
  width: 75.71px;
  height: 75.71px;
  margin: auto;
  display: block;
}

#section7 ul {
  margin-top: 20px;
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  justify-content: center;
  gap: 24px;
  margin-bottom: 20px;
}

#section7 li {
  box-shadow: 0px 5.204px 11.708px 0px rgba(0, 0, 0, 0.05);
  border: 1px #e5e5e5 solid;
  border-radius: 20px;
  padding: 30px;
  background-color: white;
  max-width: 300px;
  list-style: none;
  display: flex;
  flex-direction: column;
  align-items: center;
  display: block;
}

#section7 li p {
  font-size: 16px;
  font-weight: 400;
  line-height: 23px;
  color: var(--GREY-8);
}
#section7 li h5 {
  margin-top: 20px;
}

#section7 li:nth-child(1) .icon {
  mask: "img/icon-chat.svg" no-repeat center / contain;
  -webkit-mask: url("img/icon-chat.svg") no-repeat center / contain;
}

#section7 li:nth-child(2) .icon {
  mask: "img/icon-chat.svg" no-repeat center / contain;
  -webkit-mask: url("img/icon-language-learning.svg") no-repeat center / contain;
}
#section7 li:nth-child(3) .icon {
  mask: "img/icon-coach.png" no-repeat center / contain;
  -webkit-mask: url("img/icon-coach.svg") no-repeat center / contain;
}
#section7 li:nth-child(4) .icon {
  mask: "img/icon-certificate.svg" no-repeat center / contain;
  -webkit-mask: url("img/icon-certificate.svg") no-repeat center / contain;
}

#section7 li:nth-child(5) .icon {
  mask: "img/icon-elearning.svg" no-repeat center / contain;
  -webkit-mask: url("img/icon-elearning.svg") no-repeat center / contain;
}

@media (max-width: 1240px) {
  #section7 li {
    padding: 16px;
  }
  #section7 li p {
    font-size: 14px;
  }
  #section7 .icon {
    width: 50px;
    height: 50px;
  }
}

/******************************** SECTION 7 *********************************/

footer {
  background-color: #2e3e5c;
  padding: 3% 0 12px 0;
  color: white;
}

footer .footer-logo {
  display: flex;
  width: 100%;
  justify-content: space-between;
  align-content: flex-end;
  align-items: center;
  padding-bottom: 16px;
  border-bottom: solid 1px #627085;
  flex-wrap: wrap;
}

footer .footer-logo-qualiopi {
  display: flex;
  margin: 12px 0;
  font-size: 14px;
  align-items: center;
  padding-bottom: 16px;
  border-bottom: solid 1px #627085;
  flex-wrap: wrap;
}

footer .footer-logo-qualiopi img {
  display: flex;
  width: 130px;
  margin-right: 16px;
}

footer ul {
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: center;
  gap: 16px;
  margin-top: 12px;
}

footer ul li a {
  text-decoration: none;
  font-size: 12px;
  color: white;
}

footer ul li a:hover {
  color: var(--Color);
}

@media (max-width: 1240px) {
  footer .footer-logo {
  }
  footer .footer-logo button {
    min-width: 300px;
    margin-top: 20px;
  }
  footer .footer-logo-qualiopi div {
    margin-top: 20px;
  }
}

/******************************** MODAL *********************************/

.modal {
  width: 100vw;
  height: 100vh;
  background: rgba(46, 62, 92, 0.5);
  position: fixed;
  z-index: 1;
  top: 0px;
  left: 0px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--CP-9);
  display: none;
  overflow: scroll;
  /*opacity: 0;  Par défaut, invisible 
  transition: opacity 0.5s ease;*/ /* Transition pour l'opacité */
}

.modal h3 {
  font-size: 22px;
}

.modal .content-modal {
  position: relative;
  width: 600px;
  background-color: white;
  border-radius: 26px;
  background: var(--GREY-White, #fff);
  box-shadow: 0px 4px 250px 0px rgba(0, 0, 0, 0.05);
  display: flex;

  padding: 40px;
  flex-direction: column;
  align-items: flex-start;
  gap: 20px;
  flex-shrink: 0;
}

.modal .close-modal {
  display: block;
  width: 20px;
  height: 20px;
  position: absolute;
  right: 24px;
  top: 24px;
  background: url("/img/close.svg") no-repeat center center;
  padding: 5px;
  border: #666 solid 1px;
  border-radius: 5px;
  cursor: pointer;
  background-color: var(--GREY-2);
}

.modal-show {
  display: flex;
  opacity: 1;
}

#modal .close-modal:hover {
  background-color: var(--GREY-4);
}

/******************************** MENTION LEGALE *********************************/

#modal-confidentiel p {
  font-size: 14px;
  color: var(--GREY-8);
}

#modal-confidentiel h2 {
  font-size: 22px;
  color: var(--CP-9);
  margin-top: 14px;
}

#modal-confidentiel h3 {
  font-size: 1px;
  color: var(--GREY-8);
}

#modal-confidentiel .content-modal {
  width: 80%;
  height: 80%;
  overflow: scroll;
  gap: 8px;
}

/******************************** Programme *********************************/
#programme .content {
  padding: 50px 0;
}

#programme .content .congratulation p {
  font-size: 22px;
}

#programme .content .congratulation {
  display: flex;
  gap: 30px;
  border-bottom: 1px solid var(--GREY-4);
  padding-bottom: 18px;
}

#programme button {
  background-color: #4e4eea;
}

#programme button:hover {
  background-color: #2828ae;
}

#programme h1,
#programme h2 {
  color: #2828ae;
}

#programme h1 {
  font-size: 35px;
}

#programme h2 {
  font-size: 18px;
}
#programme h3 {
  font-size: 16px;
  margin-top: 15px;
}

#programme .section {
  margin: 20px 0px;
}
#programme ul {
  margin: 10px 0;
  padding-left: 20px;
}
#programme li {
  margin: 5px 0;
}
#programme .note {
  font-size: 0.9em;
  color: #666;
}