/* Style général */
@import url("https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap");
@font-face {
  font-family: "Alexandria_Light";
  src: url("../fonts/Alexandria/static/Alexandria-Light.ttf") format("truetype");
  font-weight: 300;
  font-style: normal;
}

@font-face {
  font-family: "Alexandria_Regular";
  src: url("../fonts/Alexandria/static/Alexandria-Regular.ttf")
    format("truetype");
  font-weight: 300;
  font-style: normal;
}
@font-face {
  font-family: "Alexandria_SemiBold";
  src: url("../fonts/Alexandria/static/Alexandria-SemiBold.ttf")
    format("truetype");
  font-weight: 300;
  font-style: normal;
}

@font-face {
  font-family: "Alexandria_Medium";
  src: url("../fonts/Alexandria/static/Alexandria-Medium.ttf")
    format("truetype");
  font-weight: 300;
  font-style: normal;
}
@font-face {
  font-family: "Alexandria_Bold";
  src: url("../fonts/Alexandria/static/Alexandria-Bold.ttf") format("truetype");
  font-weight: 300;
  font-style: normal;
}

:root {
  --color-1: #00b451;
  --color-1-hover: #077d3c;
  --color-2: #000000;
  --color-3: #3b3b3b;
  --color-4: #ffffff;
  --color-5: #e0e0e0;
  --color-6: #f2fbf6;
  --color-7: #808080;
  --color-8: rgba(148, 216, 178, 0.07);
  --color-9: #f9f9f9;
  --color-10: #767676;
  --color-11: #f98091;
  --color-12: #013648;
  --color-13: rgba(242, 251, 246, 0.39);
  --color-14: #c9c9c8;
  --font-light: "Alexandria_Light";
  --font-regular: "Alexandria_Regular";
  --font-semi: "Alexandria_SemiBold";
  --font-bold: "Alexandria_Bold";
}

body {
  font-family: "Alexandria_Regular", sans-serif;
  margin: 0;
  padding: 0;
  color: var(--color-3);
}

.text-right {
  text-align: right !important;
}
.green-color {
  color: var(--color-1);
}
.bg-greeen-dark{
  background-color: #19352D;
}
.white-color{
  color: var(--color-4)!important;
}
/*------------ Padding/Margin-----------------------*/


.p-60{
  padding-top: 60px;
  padding-bottom: 60px;
}
/*------------------- Header----------------*/

header {
  background-image: linear-gradient(180deg, #e8f8ef, #ffffff);
}

header nav {
  padding: 15px 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.nav-links {
  display: flex;
  list-style: none;
  margin: 0;
  padding: 0;
  gap: 20px;
}
.nav-links li i {
  padding-right:4px;
}
.nav-links.show {
  display: block;
}

.menu-toggle {
  font-size: 30px;
  background: none;
  border: none;
  cursor: pointer;
}

.nav-links li a {
  text-decoration: none;
  color: rgb(0, 0, 0);
  font-size: 15px;
  transition: color 0.3s;
}

.nav-links li a:hover {
  color: #00b451;
}

.buttons {
  display: flex;
  gap: 10px;
}

.add-btn {
  position: relative;
}

.add-btn::after {
  content: attr(data-tooltip);
  position: absolute;
  top: 125%;
  left: 50%;
  transform: translateX(-50%);
  background-color: rgba(0, 0, 0, 0.7);
  color: #fff;
  padding: 5px 10px;
  border-radius: 5px;
  font-size: 12px;
  visibility: hidden;
  opacity: 0;
  width: max-content;
  transition: opacity 0.3s ease-in-out;
}

.add-btn:hover::after {
  visibility: visible;
  opacity: 1;
}

.donate-btn {
  background-color: #e74c3c;
  color: white;
}

.green-btn {
  background-color: #00b451;
  color: white;
}

.donate-btn:hover,
.green-btn:hover {
  opacity: 0.8;
}

.btn-outline-green {
  padding: 10px 22px;
  --bs-btn-color: var(--color-1);
  --bs-btn-border-color: var(--color-1);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--color-1);
  --bs-btn-hover-border-color: var(--color-1);
  --bs-btn-focus-shadow-rgb: 25, 135, 84;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--color-1);
  --bs-btn-active-border-color: var(--color-1);
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: var(--color-1);
  --bs-btn-disabled-bg: transparent;
  --bs-btn-disabled-border-color: var(--color-1);
  --bs-gradient: none;
  border-radius: 32px;
}
.btn-outline-green:hover {
  color: var(--bs-btn-hover-color);
  background-color: var(--color-1);
  border-color: var(--color-1);
}
.btn-outline-green:hover svg path {
  fill: white;
}
/* Bouton menu hamburger */
.menu-toggle {
  display: none;
  font-size: 24px;
  background: none;
  border: none;
  cursor: pointer;
}

nav ul li a:hover {
  color: #00b451;
}

/* Logo à gauche */
.logo {
  height: 90px;
  width: auto;

  order: -1;
}

/* Boutons à droite */
.buttons {
  display: flex;
  gap: 10px;
}

.buttons .add-btn {
  width: 50px;
  height: 50px;
  padding: 0;
  background-color: #ffffff;
  color: #00b451;
  font-size: 18px;
  display: flex;
  cursor: pointer;
  transition: all 0.3s ease;
  border-radius: 50%;
  border: 1px solid #00b451;
  align-items: center;
  justify-content: center;
}

.buttons :hover {
  background-color: #00b451;
  color: #ffffff;
}

.buttons .donate-btn {
  padding: 12px 26px;
  background-color: #222222;
  color: #ffffff;
  font-size: 15px;
  height: 50px;
  border: 0;
  cursor: pointer;
  transition: all 0.3s ease;
  border-radius: 32px;
}

.green-btn {
  padding: 12px 25px;
  background-color: var(--color-1);
  color: var(--color-4);
  font-size: 15px;
  cursor: pointer;
  border: none;
  transition: all 0.3s ease;
  border-radius: 32px;
}
.green-btn:hover,
.green-btn:focus,
.green-btn:active {
  background-color: var(--color-1-hover);
  color: var(--color-4);
}
.white-btn {
  padding: 12px 25px;
  background-color: var(--color-4);
  color: var(--color-1);
  font-size: 15px;
  cursor: pointer;
  border: none;
  transition: all 0.3s ease;
  border-radius: 32px;
}
.white-btn:hover,
.white-btn:focus,
.white-btn:active {
  background-color: var(--color-1);
  color: var(--color-4);
}
.btn-black {
  padding: 12px 25px;
  background-color: var(--color-2);
  color: var(--color-4);
  font-size: 15px;
  cursor: pointer;
  border: none;
  transition: all 0.3s ease;
  border-radius: 32px;
}
.btn-black:hover,
.btn-black:focus,
.btn-black:active {
  background-color: var(--color-3);
  color: var(--color-4);
}
.buttons .btn:hover {
  background-color: var(--color-4);
  color: var(--color-1);
}
.btn-bg-custom {
  background-color: var(--color-3);
}

/**-----------content-----------*/

.h2 {
  font-size: 42px;
  line-height: 52px;
  color: var(--color-2);
  font-family: var(--font-bold);
}
.h3 {
  font-size: 32px;
  font-family: var(--font-semi);
  color: var(--color-2);
}
.font-25 {
  font-size: 25px;
}
.font-40 {
  font-size: 40px;
}
.home-cover {
  background-image: url("../images/headerCover.png");
  background-size: cover;
  background-position: center;
  height: 75vh;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: left;
  color: #ffffff;
  text-align: right;
  margin: 0rem 2rem;
  border-radius: 25px;
  position: relative;
  z-index: 1;
}

.home-cover h1 {
  font-size: 3.5rem;
  margin-bottom: 1rem;
}

.home-cover h2 {
  font: 0.4rem;
  font-weight: normal;
}

.outline-btn {
  padding: 12px 16px;
  font-size: 16px;
  font-weight: medium;
  border-radius: 25px;
  border: none;
}

.outline-btn:hover {
  background-color: #00b451;
  color: #ffffff;
  transform: scale(1.05);
}

.title {
  font-weight: 600;
  line-height: 1.5;
  text-align: right;
}

.gradient-card {
  background-image: linear-gradient(180deg, #ffffff, #e8f8ef);
  padding: 2rem;
  border-radius: 25px;
  margin: 2rem 0;
}

.gradient-card .tile {
  color: #00b451;
  font-weight: bold;
}

.green-subtitle {
  color: #00b451;
  font-weight: bold;
  font-size: 16px;
  margin-bottom: 1rem;
}

.white-card {
  background-color: #ffffff;
  padding: 1rem;
  border-radius: 25px;
  margin: 2rem 0;
  border: 1px solid #e8f8ef;
  cursor: pointer;
  margin-right: 15px;
  flex: 1 1 22%;
  height: 22rem;
}

.slider-item-inner {
  padding: 50px 25px;
  position: relative;
  justify-content: center;
  align-items: center;
  display: flex;
  flex-direction: column;

  margin: 10px;
  border-radius: 20px;
  border: 1px solid var(--color-5);
}
.slider-item-inner:after {
  position: absolute;
  left: 0;
  bottom: 0;
  background-color: var(--color-6);
  content: "";
  height: 62%;
  z-index: -9;
  width: 100%;
  border-radius: 25px;
}
.slider-item-inner img {
  width: 200px;
  object-fit: cover;
}
.slider-item-inner .team-info {
  text-align: center;
}
.slider-item-inner .image-team {
  height: 220px;
  width: 220px;
  display: flex;
  background: #fff;
  border-radius: 1000%;
  margin-bottom: 25px;
  justify-content: center;
  align-content: center;
}

.slick-dots {
  text-align: center;
}
.slick-dots li {
  margin-right: 7px;
  display: inline-block;
  list-style: none;
}
.slick-dots li.slick-active button {
  background: var(--color-1);
}
.slick-dots li button {
  font-size: 0;
  width: 12px;
  height: 12px;
  background: none;
  padding: 0;
  border: 1px solid var(--color-1);
  border-radius: 50%;
}

h3.title-border {
  position: relative;
  font-size: 38px;
  color: var(--color-2);
  font-family: var(--font-semi);
}
h3.title-border:after {
  content: "";
  position: absolute;
  height: 7px;
  width: 50%;
  background-color: var(--color-1);
  right: 0;
  bottom: -25px;
}
.box-card {
  margin-bottom: 25px;
  text-align: center;
  border: 1px solid var(--color-5);
  padding: 30px;
  border-radius: 20px;
}
.box-card p {
  padding-top: 20px;
  margin-bottom: 0;
  position: relative;
  right: -15px;
}
.box-card h3 {
  padding-top: 8px;
  color: var(--color-2);
  font-size: 20px;
}
.box-card h4 {
  padding: 10px 0;
  font-size: 16px;
}

a.card-link {
  display: block;
  margin-bottom: 30px;
}
a.card-link,
a.doc-block {
  color: var(--color-2);
  text-decoration: none;
}
a.doc-block {
  display: flex;
  gap: 20px;
  padding: 20px;
  text-align: center;
  flex-direction: column;
  align-content: center;
  justify-content: center;
}
a.doc-block img {
  width: 70px;
  margin: 0 auto;
}
a.doc-block p {
  color: var(--color-2);
  font-size: 22px;
}
a.doc-block {
  border-left: 1px solid #e1f3ea;
}
.no-border {
  border-left: 0 !important;
}
/* ---- custom list ------- */
.custom-list {
  list-style-type: none;
  padding: 0;
}

.custom-list li {
  display: flex;
  align-items: center;
  margin-top: 2rem;
  font-size: 20px;
  font-weight: 600;
}

.custom-list li::before {
  content: "";
  background-image: url("../images/check.svg");
  background-size: contain;
  background-repeat: no-repeat;
  width: 40px;
  height: 40px;
  margin-left: 10px;
}

.card-container {
  display: flex;
  flex-wrap: wrap;
  gap: 0;
}

.partners-container {
  display: flex;
  justify-content: space-between;
  gap: 20px;
}

.footer {
  background-image: linear-gradient(360deg, #e8f8ef, #ffffff);
}

footer ul {
  padding: 0;
  margin: 0;
}

footer ul li {
  margin: 0;
  text-align: right;
  padding: 0;
}

.footer li {
  list-style-type: none;
}

footer p {
  font-weight: 800;
}

footer ul li a {
  list-style-type: none;
  text-decoration: none;
  color: rgb(0, 0, 0);
  padding-bottom: 5px;
  display: block;
  font-weight: 600;
  font-size: 14px;
  transition: color 0.3s;
  text-align: right;
}

.icon {
  width: 32px;
  height: 32px;
  transition: filter 0.3s ease;
  cursor: pointer;
}

.icon:hover {
  fill: #00b451;
  color: white;
}

.partners-img .customer-img {
  max-width: 10rem;
}

.partners-img:hover {
  transform: scale(1.05);
}

.footer-text {
  font-weight: 500;
  font-size: 12px;
  text-align: right;
  font-weight: inherit;
}

.text-shadow {
  text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}

.text-line {
  line-height: 1.5;
}

.container {
  padding-left: 5px;
  padding-right: 5px;
  margin-left: auto;
  margin-right: auto;
}

.footer-card {
  border-radius: 32px;
}

.footer p {
  text-align: right;
}

.font-bold {
  font-weight: bold;
}

.green-text {
  color: #00b451;
}
.team-block .slider-item-inner img {
  width: 193px;
  height: 200px;
}
.team-block h4 {
  font-weight: 600;
}
.team-block p {
  margin: 21px 0 0 0;
  font-weight: 300;
}
.w-80 {
  width: 80%;
}
.slider-5 .btn-black {
  padding: 12px 20px;
}
.slider-5 p {
  color: var(--color-7);
  font-family: "Alexandria_Light";
  margin-top: 15px;
}
.slider-5 .slick-dots {
  display: none;
}
.fix-cards .box-card {
  position: relative;
  min-height: 256px;
}

.fix-cards .box-card img {
  display: inline;
}
.fix-cards .box-card p {
  color: var(--bs-black);
  font-family: "Alexandria_Regular";
  margin-top: 15px;
}
.fix-cards .btn-black {
  position: absolute;
  bottom: 25px;
  width: 169px;
  left: 0;
  right: 0;
  margin: 0 auto;
}
.bg-green-light {
  background-color: var(--color-8);
}
.title-fix {
  font-size: 60px;
  color: black;
}
.report-managment .box-card {
  font-family: "Alexandria_SemiBold";
  font-size: 24px;
}
.report-finance .box-card {
  text-align: right;
}
.report-finance .box-card img {
  width: 126px;
  margin-bottom: 25px;
}
.report-finance .box-card p {
  font-family: "Alexandria_Regular";
  font-size: 25px;
  margin-bottom: 10px;
}
.report-activity .box-card {
  text-align: right;
}
.report-activity .box-card img {
  width: 126px;
  margin-bottom: 25px;
}
.report-activity .box-card p {
  font-family: "Alexandria_Medium";
  font-size: 28px;
  margin-bottom: 10px;
}
#construction h1 {
  margin-top: 50px;
  color: var(--bs-black);
  font-family: "Alexandria_Bold";
  font-size: 50px;
  line-height: 80px;
  margin-bottom: 40px;
}
#construction p {
  color: var(--color-3);
  font-family: "Alexandria_Light";
  font-size: 15px;
  line-height: 35px;
  right: 0;
}
#construction .box-card h3 {
  font-family: "Alexandria_SemiBold";
  font-size: 20px;
  margin-bottom: 0px;
}
#construction .box-card {
  padding: 15px;
  margin: 0;
  min-height: 188px;
  margin-bottom: 20px;
}
.green-border {
  margin-bottom: 25px;
  border: 1px solid var(--color-1);
  padding: 30px;
  border-radius: 20px;
  height: 100%;
}
#platform-project h2 {
  font-family: "Alexandria_Bold";
  color: var(--color-1);
  margin-bottom: 40px;
}
#platform-project p {
  font-family: "Alexandria_Regular";
  font-size: 15px;
}
#platform-project h3 {
  font-family: "Alexandria_Regular";
  color: var(--color-1);
  font-size: 18px;
}
#platform-project .col-md-8 p {
  font-size: 21px;
}
#platform-project img {
  width: 250px;
  margin-bottom: 30px;
}
.title-page {
  font-family: "Alexandria_SemiBold";
  color: var(--bs-black);
  font-size: 42px;
}
.p,
.consult p {
  color: var(--bs-black);
  line-height: 35px;
  font-family: "Alexandria_Light";
}
.consult p {
  color: var(--bs-black);
  line-height: 25px;
  font-family: "Alexandria_Light";
  padding-right: 10px;
  margin-bottom: 0;
}
.consult {
  background-color: var(--color-9);
  border-radius: 15px;
  padding: 12px 15px;
}
.seconde-title {
  font-family: "Alexandria_Bold";
  color: var(--bs-black);
  font-size: 28px;
  line-height: 50px;
}
.seconde-title-semiBold {
  font-family: "Alexandria_Bold";
  color: var(--bs-black);
  font-size: 28px;
  line-height: 50px;
}
.h3-title {
  font-family: "Alexandria_Medium";
  color: var(--bs-black);
  font-size: 30px;
}
.green-bg-img {
  background: url("../images/left-bg.png") no-repeat left;
  background-size: contain;
  background-color: rgba(0, 180, 81, 0.1);
  border-radius: 25px;
}
.w-90 {
  width: 90%;
}
.membership-page h2 {
  font-family: "Alexandria_SemiBold";
  color: var(--bs-black);
  font-size: 32px;
}
.membership-page p {
  color: var(--bs-black);
  line-height: 18px;
  font-family: "Alexandria_Light";
}
.membership-page h3 {
  font-size: 35px;
}
.addcheckp svg {
  margin-left: 20px;
}
.addcheckp p {
  line-height: 35px;
}
.pmb-0 p {
  margin-bottom: 0;
  line-height: 25px;
}

#form input,
#form textarea,
.customform {
  border-radius: 25px;
  padding: 10px 10px;
  box-shadow: 0px 0px 6px 0px rgba(0, 114, 51, 0.74);
  -webkit-box-shadow: 0px 0px 6px 0px rgba(0, 114, 51, 0.74);
  -moz-box-shadow: 0px 0px 6px 0px rgba(0, 114, 51, 0.74);
  font-family: "Inter";
}

.customform2 {
  border-radius: 25px;
  padding: 10px 10px;
  box-shadow: 0px 0px 1px 0px rgba(0, 114, 51, 0.75);
  -webkit-box-shadow: 0px 0px 1px 0px rgba(0, 114, 51, 0.75);
  -moz-box-shadow: 0px 0px 1px 0px rgba(0, 114, 51, 0.75);
  font-family: "Inter";
  text-align: right;
}
#form input::placeholder,
#form textarea::placeholder,
.customform {
  font-size: 14px;
  color: var(--color-10);
  font-family: "Inter";
  font-size: 18px;
}
.bg-form {
  background: rgb(229, 247, 238);
  background: linear-gradient(
    180deg,
    rgba(229, 247, 238, 0.23012955182072825) 0%,
    rgba(0, 180, 81, 0.15730042016806722) 100%
  );
  position: relative;
  padding-bottom: 30px;
  border-radius: 50px;
  padding-top: 100px;
}
#form img {
  position: absolute;
}
.position-relative {
  position: relative;
}

input.form-control {
  padding-left: 40px;
}
#form button {
  width: 150px;
}
#form {
  margin-top: 150px;
}
#form img {
  position: absolute;
  top: -100px;
  left: 50%;
  transform: translateX(-50%);
  width: 200px;
}

/* Hide the default calendar icon in flatpickr */
.dateform::-webkit-calendar-picker-indicator {
  display: none;
}
/* Add your custom icon */
.dateform {
  background-image: url('data:image/svg+xml,<svg width="20" height="15" viewBox="0 0 20 15" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M3.52441 0H16.5244C17.3201 0 18.0831 0.316071 18.6457 0.87868C19.2083 1.44129 19.5244 2.20435 19.5244 3V12C19.5244 12.7956 19.2083 13.5587 18.6457 14.1213C18.0831 14.6839 17.3201 15 16.5244 15H3.52441C2.72876 15 1.9657 14.6839 1.40309 14.1213C0.840485 13.5587 0.524414 12.7956 0.524414 12V3C0.524414 2.20435 0.840485 1.44129 1.40309 0.87868C1.9657 0.316071 2.72876 0 3.52441 0ZM3.52441 1C3.02441 1 2.58441 1.17 2.24441 1.47L10.0244 6.5L17.8044 1.47C17.4644 1.17 17.0244 1 16.5244 1H3.52441ZM10.0244 7.71L1.65441 2.28C1.57441 2.5 1.52441 2.75 1.52441 3V12C1.52441 12.5304 1.73513 13.0391 2.1102 13.4142C2.48527 13.7893 2.99398 14 3.52441 14H16.5244C17.0548 14 17.5636 13.7893 17.9386 13.4142C18.3137 13.0391 18.5244 12.5304 18.5244 12V3C18.5244 2.75 18.4744 2.5 18.3944 2.28L10.0244 7.71Z" fill="%23767676"/></svg>');
  background-repeat: no-repeat;
  background-position: left 17px center;
  padding-left: 35px;
  direction: rtl;
  text-align: right;
  background-size: 23px;
}
.new-box {
  font-family: "Inter";
  text-align: right;
}
.new-box img {
  width: 80%;
  display: block;
  margin: 0 auto;
}
.new-box h5 {
  color: var(--color-3);
  font-size: 17px;
  font-weight: 600;
}
.new-box h6 {
  color: var(--color-11);
  font-size: 15px;
  font-weight: 600;
  margin-top: 10px;
}
.new-box span {
  color: var(--color-10);
  font-size: 15px;
}
.new-box p {
  color: var(--color-10);
  font-size: 15px;
  right: 0;
  padding-top: 8px;
}
.date-section {
  position: relative;
  padding-right: 30px;
}
.date-section::after {
  content: "";
  background-image: url('data:image/svg+xml,<svg width="24" height="20" viewBox="0 0 24 20" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M8.5 1.75C8.63261 1.75 8.75979 1.80268 8.85355 1.89645C8.94732 1.99021 9 2.11739 9 2.25V3.25H16V2.25C16 2.11739 16.0527 1.99021 16.1464 1.89645C16.2402 1.80268 16.3674 1.75 16.5 1.75C16.6326 1.75 16.7598 1.80268 16.8536 1.89645C16.9473 1.99021 17 2.11739 17 2.25V3.253C17.2447 3.255 17.4627 3.26367 17.654 3.279C18.019 3.309 18.339 3.372 18.635 3.522C19.1053 3.76189 19.4875 4.14451 19.727 4.615C19.878 4.911 19.941 5.231 19.971 5.595C20 5.95 20 6.387 20 6.929V14.571C20 15.113 20 15.551 19.971 15.904C19.941 16.269 19.878 16.589 19.727 16.885C19.4874 17.3551 19.1051 17.7374 18.635 17.977C18.339 18.128 18.019 18.191 17.655 18.221C17.3 18.25 16.863 18.25 16.322 18.25H8.679C8.137 18.25 7.699 18.25 7.346 18.221C6.981 18.191 6.661 18.128 6.365 17.977C5.89451 17.7375 5.51189 17.3553 5.272 16.885C5.122 16.589 5.059 16.269 5.029 15.905C5 15.55 5 15.112 5 14.57V6.93C5 6.455 5 6.062 5.02 5.733L5.029 5.597C5.059 5.232 5.122 4.912 5.272 4.616C5.51173 4.14535 5.89435 3.76272 6.365 3.523C6.661 3.373 6.981 3.31 7.345 3.28C7.53767 3.26467 7.756 3.256 8 3.254V2.25C8 2.11739 8.05268 1.99021 8.14645 1.89645C8.24021 1.80268 8.36739 1.75 8.5 1.75ZM8 4.75V4.253C7.8088 4.25458 7.61771 4.26225 7.427 4.276C7.125 4.3 6.951 4.346 6.819 4.413C6.53651 4.55685 6.30685 4.78651 6.163 5.069C6.096 5.201 6.05 5.375 6.026 5.677C6 5.986 6 6.382 6 6.95V7.5H19V6.95C19 6.382 19 5.986 18.974 5.677C18.95 5.375 18.904 5.201 18.837 5.069C18.6931 4.78651 18.4635 4.55685 18.181 4.413C18.049 4.346 17.875 4.3 17.573 4.276C17.3823 4.26225 17.1912 4.25458 17 4.253V4.75C17 4.88261 16.9473 5.00979 16.8536 5.10355C16.7598 5.19732 16.6326 5.25 16.5 5.25C16.3674 5.25 16.2402 5.19732 16.1464 5.10355C16.0527 5.00979 16 4.88261 16 4.75V4.25H9V4.75C9 4.88261 8.94732 5.00979 8.85355 5.10355C8.75979 5.19732 8.63261 5.25 8.5 5.25C8.36739 5.25 8.24021 5.19732 8.14645 5.10355C8.05268 5.00979 8 4.88261 8 4.75ZM19 8.5H6V14.55C6 15.118 6 15.515 6.026 15.823C6.05 16.125 6.096 16.299 6.163 16.431C6.30685 16.7135 6.53651 16.9431 6.819 17.087C6.951 17.154 7.125 17.2 7.427 17.224C7.736 17.25 8.132 17.25 8.7 17.25H16.3C16.868 17.25 17.265 17.25 17.573 17.224C17.875 17.2 18.049 17.154 18.181 17.087C18.4635 16.9431 18.6931 16.7135 18.837 16.431C18.904 16.299 18.95 16.125 18.974 15.823C19 15.515 19 15.118 19 14.55V8.5Z" fill="%23767676"/><path d="M10.5 6.2395C10.3674 6.2395 10.2402 6.28121 10.1464 6.35544C10.0527 6.42967 10 6.53035 10 6.63534C10 6.74032 10.0527 6.841 10.1464 6.91523C10.2402 6.98947 10.3674 7.03117 10.5 7.03117H13.5C13.6326 7.03117 13.7598 6.98947 13.8536 6.91523C13.9473 6.841 14 6.74032 14 6.63534C14 6.53035 13.9473 6.42967 13.8536 6.35544C13.7598 6.28121 13.6326 6.2395 13.5 6.2395H10.5ZM9.5 10.5937C9.5 10.8036 9.39464 11.005 9.20711 11.1535C9.01957 11.3019 8.76522 11.3853 8.5 11.3853C8.23478 11.3853 7.98043 11.3019 7.79289 11.1535C7.60536 11.005 7.5 10.8036 7.5 10.5937C7.5 10.3837 7.60536 10.1823 7.79289 10.0339C7.98043 9.88541 8.23478 9.802 8.5 9.802C8.76522 9.802 9.01957 9.88541 9.20711 10.0339C9.39464 10.1823 9.5 10.3837 9.5 10.5937ZM9.5 13.3645C9.5 13.5745 9.39464 13.7758 9.20711 13.9243C9.01957 14.0728 8.76522 14.1562 8.5 14.1562C8.23478 14.1562 7.98043 14.0728 7.79289 13.9243C7.60536 13.7758 7.5 13.5745 7.5 13.3645C7.5 13.1545 7.60536 12.9532 7.79289 12.8047C7.98043 12.6562 8.23478 12.5728 8.5 12.5728C8.76522 12.5728 9.01957 12.6562 9.20711 12.8047C9.39464 12.9532 9.5 13.1545 9.5 13.3645ZM12 11.3853C12.2652 11.3853 12.5196 11.3019 12.7071 11.1535C12.8946 11.005 13 10.8036 13 10.5937C13 10.3837 12.8946 10.1823 12.7071 10.0339C12.5196 9.88541 12.2652 9.802 12 9.802C11.7348 9.802 11.4804 9.88541 11.2929 10.0339C11.1054 10.1823 11 10.3837 11 10.5937C11 10.8036 11.1054 11.005 11.2929 11.1535C11.4804 11.3019 11.7348 11.3853 12 11.3853ZM13 13.3645C13 13.5745 12.8946 13.7758 12.7071 13.9243C12.5196 14.0728 12.2652 14.1562 12 14.1562C11.7348 14.1562 11.4804 14.0728 11.2929 13.9243C11.1054 13.7758 11 13.5745 11 13.3645C11 13.1545 11.1054 12.9532 11.2929 12.8047C11.4804 12.6562 11.7348 12.5728 12 12.5728C12.2652 12.5728 12.5196 12.6562 12.7071 12.8047C12.8946 12.9532 13 13.1545 13 13.3645ZM15.5 11.3853C15.7652 11.3853 16.0196 11.3019 16.2071 11.1535C16.3946 11.005 16.5 10.8036 16.5 10.5937C16.5 10.3837 16.3946 10.1823 16.2071 10.0339C16.0196 9.88541 15.7652 9.802 15.5 9.802C15.2348 9.802 14.9804 9.88541 14.7929 10.0339C14.6054 10.1823 14.5 10.3837 14.5 10.5937C14.5 10.8036 14.6054 11.005 14.7929 11.1535C14.9804 11.3019 15.2348 11.3853 15.5 11.3853Z" fill="%23767676"/></svg>'); /* Replace with your icon path */
  background-size: contain;
  background-repeat: no-repeat;
  width: 23px; /* Adjust the width of your icon */
  height: 20px; /* Adjust the height of your icon */
  position: absolute;
  right: 0;
  top: 0px;
}
.new-details h3 {
  font-family: "Alexandria_Medium";
  color: var(--bs-black);
  font-size: 20px;
}
.new-details h4 {
  font-family: "Alexandria_Medium";
  color: var(--bs-black);
  font-size: 16px;
}
.new-details p {
  font-family: "Alexandria_Light";
  color: var(--bs-black);
  font-size: 14px;
  line-height: 25px;
}
.slick-prev:before,
.slick-next:before {
  color: red !important;
}
.news-slider img {
  display: block;
  width: 90%;
  margin: 0 auto;
}
.news-slider {
  padding-left: 20px;
  padding-right: 20px;
}

.news-slider .slick-dots {
  bottom: -50px;
}
.news-slider .slick-dots li {
  margin: 0 0.25rem;
}
.news-slider .slick-dots button {
  display: block;
  width: 1rem;
  height: 1rem;
  padding: 0;
  border: none;
  border-radius: 100%;
  /* background-color: blue; */
  text-indent: -9999px;
  border: 2px solid var(--color-1);
}
.news-slider .slick-dots li.slick-active button {
  background-color: var(--color-1);
}
[dir="rtl"] .slick-next {
  right: auto;
  left: -5px !important;
  border: 1px solid #94d8b2;
  width: 40px;
  height: 40px;
  border-radius: 50%;
}
[dir="rtl"] .slick-prev {
  right: -5px !important;
  left: auto;
  border: 1px solid #94d8b2;
  width: 40px;
  height: 40px;
  border-radius: 50%;
}
[dir="rtl"] .slick-next:before {
  content: "" !important;
  background-image: url('data:image/svg+xml,<svg width="23" height="20" viewBox="0 0 23 20" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M9.37898 17.8165L2.29222 9.68369M2.29222 9.68369L9.53574 1.67421M2.29222 9.68369L20.7169 9.84226" stroke="%2394D8B2" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/></svg>');
  background-size: contain;
  background-repeat: no-repeat;
  width: 23px; /* Adjust the width of your icon */
  height: 20px; /* Adjust the height of your icon */
  position: absolute;
  right: 6px;
  top: 9px;
}
[dir="rtl"] .slick-prev:before {
  content: "" !important;
  background-image: url('data:image/svg+xml,<svg width="22" height="20" viewBox="0 0 22 20" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M13.0858 2.1851L20.2001 10.3232M20.2001 10.3232L12.9121 18.3273M20.2001 10.3232L1.68281 10.151" stroke="%2394D8B2" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/></svg>');
  background-size: contain;
  background-repeat: no-repeat;
  width: 23px; /* Adjust the width of your icon */
  height: 20px; /* Adjust the height of your icon */
  position: absolute;
  right: 6px;
  top: 9px;
}
.volunteer-secion {
  border: 1px solid var(--color-5);
  padding: 30px;
  border-radius: 20px;
}
.volunteer-secion p {
  font-family: "Alexandria_Light";
  color: var(--bs-black);
  font-size: 14px;
  line-height: 25px;
}
.volunform {
  background-color: rgba(217, 217, 217, 0.07);
  border-radius: 25px;
  padding: 20px;
}
.volunteer-secion img {
  width: 70%;
}
.volunteer-secion label {
  font-weight: 600;
  font-size: 14px;
  color: var(--color-10);
}
.login-block {
  background-color: var(--color-12);
  border-radius: 25px;
  padding: 60px 30px 30px 30px;
}
.login-block h1,
label {
  color: var(--color-4);
}
.login-block label {
  font-size: 15px;
  margin-bottom: 13px;
}
.login-block a {
  text-decoration: none;
  color: var(--color-4);
  font-weight: 400;
  font-family: "Inter";
}
.don-block {
  padding: 10px;
  border: 1px solid var(--color-5);
  border-radius: 15px;
}
.don-block .don-logo {
  background-color: rgba(230, 247, 238, 0.54);
  border-radius: 15px 15px 0 0;
  text-align: center;
}
.don-block .don-logo img {
  padding: 30px 0;
  width: 60%;
}
.don-block h6 {
  font-family: "Alexandria_SemiBold";
  color: var(--bs-black);
  font-size: 18px;
}
.don-block p {
  font-family: "Alexandria_Regular";
  color: var(--bs-black);
  font-size: 20px;
}
.don-block {
}
input[type="range"] {
  /* removing default appearance */
  -webkit-appearance: none;
  appearance: none;
  /* creating a custom design */
  width: 100%;
  cursor: pointer;
  outline: none;
  /*  slider progress trick  */
  overflow: hidden;
  border-radius: 16px;
}

/* Track: webkit browsers */
input[type="range"]::-webkit-slider-runnable-track {
  height: 15px;
  background: #e8e8e8;
  border-radius: 16px;
}

/* Track: Mozilla Firefox */
input[type="range"]::-moz-range-track {
  height: 15px;
  background: #e8e8e8;
  border-radius: 16px;
}

/* Thumb: webkit */
input[type="range"]::-webkit-slider-thumb {
  /* removing default appearance */
  -webkit-appearance: none;
  appearance: none;
  /* creating a custom design */
  height: 15px;
  width: 15px;
  background-color: #fff;
  border-radius: 50%;
  border: 2px solid var(--color-11);
  /*  slider progress trick  */
  box-shadow: -407px 0 0 400px var(--color-11);
}

/* Thumb: Firefox */
input[type="range"]::-moz-range-thumb {
  height: 15px;
  width: 15px;
  background-color: #fff;
  border-radius: 50%;
  border: 1px solid var(--color-11);
  /*  slider progress trick  */
  box-shadow: -407px 0 0 400px var(--color-11);
}
.number span {
  cursor: pointer;
}

.number {
  /* margin: 100px; */
  /* display: flex; */ /* Align elements horizontally */
  align-items: center;
  position: relative;
  width: 140px;
}

.number .minus,
.number .plus {
  color: var(--color-1);
  cursor: pointer;
  font-weight: bold; /* Bold for visibility */
  position: absolute;
}
.number .minus {
  top: 8px;
  right: 6px;
}
.number .plus {
  top: 8px;
  left: 6px;
}
.number input {
  /* height: 34px; */
  width: 140px;
  text-align: center;
  /* font-size: 26px; */
  border: 1px solid #ddd;
  border-radius: 25px;
  padding: 12px 25px; /* Space between input and minus/plus buttons */
}
.donconfirmpage h3 {
  font-size: 25px;
  color: var(--bs-black);
  font-weight: bold;
}
.donconfirmpage label {
  color: var(--color-10);
  margin-bottom: 15px;
}
.donconfirmpage button {
  width: 150px;
}
.table td {
  padding: 20px;
  font-family: "Alexandria_Light";
  color: rgba(0, 0, 0, 0.8);
  border-style: none solid solid none;
  vertical-align: middle;
}

.table td:first-child {
  font-family: "Alexandria_SemiBold";
  color: var(--bs-black);
  font-size: 14px;
  border-right: solid 1px var(--color-14);
}

.table th:last-child,
.table td:last-child {
  text-align: center;
}
.table td:last-child {
  text-align: center;
  border-left: solid 1px var(--color-14);
}

.table th {
  background-color: rgba(230, 247, 238, 0.54) !important;
  font-family: "Alexandria_SemiBold";
  color: var(--bs-black);
  padding: 20px;
}

.table tr:last-child td,
.table tr:last-child span {
  background-color: #fafdfb !important;
  font-family: "Alexandria_SemiBold";
  color: var(--bs-black);
}
.donrevmpage .btn-black {
  width: 150px;
}
.donrevmpage .table tr:last-child td {
  background-color: #fafdfb !important;
  font-family: "Alexandria_light";
  color: var(--bs-black);
}
.fixlastr tr:last-child td:first-child {
  font-family: "Alexandria_SemiBold";
}
.table {
  border-collapse: separate;
  border-spacing: 0;
}

.table tr:first-child th:first-child {
  border-top-right-radius: 10px;
}
.table tr:first-child th:last-child {
  border-top-left-radius: 10px;
}

.table tr:last-child td:first-child {
  border-bottom-right-radius: 10px;
}
.table tr:last-child td:last-child {
  border-bottom-left-radius: 10px;
}

.table tr:first-child td {
  border-top-style: solid;
}
.table tr td:last-child {
  border-left-style: solid;
}
.title-page-cover{
      z-index:-1 !important;
      background-image: url(../images/bg-title.jpg);
      background-size: cover;
      background-position: center;
      height: 55vh;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: left;
      color: #ffffff;
      text-align: right;
      border-radius: 25px;
      position: relative;
      z-index: 1;
}
.title-page-cover-1{
      background-image: url(../images/bg-title-1.jpg);
      background-size: cover;
      background-position: center;
      height: 45vh;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: left;
      color: #ffffff;
      text-align: right;
      border-radius: 25px;
      position: relative;
      z-index: 1;
}
.bg-cta {
   background-image: url(../images/bg-cta.jpg);
   background-size: cover;
   background-position: center;
   height: 40vh;
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: left;
   color: #ffffff;
   text-align: right;
   border-radius: 25px;
   position: relative;
   z-index: 1;
}
.item-donation {
  padding: 30px;
  border: 1px solid var(--color-5);
  border-radius: 20px;
}

.item-donation a {
  width: 100%;
  display: block;
}

.item-donation img {
  max-width: 100%;
  width: 100%;
  border-radius: 20px;
  display: block;
  object-fit: cover;
}

.number-block {
  padding: 35px;
  border-radius: 25px;
}
.number-block-item{
  display: flex;
    gap: 15px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.number-block-item h3{
  font-size: 16px;
  font-weight: 300;
  margin-bottom: 0;
  margin-top: 5px;
  color: var(--color-4);
}
.number-block-item strong{
  display: block;
  color: var(--color-4);
  font-size: 35px;
}
.row {
  align-items: stretch;
}

.step-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  padding: 25px;
  border: 1px solid var(--color-5);
  border-radius: 20px;
  text-align: center;
  height: 100%;
}

.step-item img {
  width: 100px;
  margin-bottom: 25px;
}

.step-item h3 {
  margin-bottom: 25px;
}

.step-item p {
  margin-top: auto;
}
    .payment-option {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        padding: .;
        border: 0;
        border-radius: 2rem;
        cursor: pointer;
        transition: border-color 0.3s;
        flex-direction: row-reverse;
    }

    .payment-option input[type="radio"] {
        display: none;
    }

    .payment-option img {
        height: 70px;
        max-width: 100%;
    }

    .payment-option .custom-radio {
        width: 22px;
        height: 22px;
        border: 2px solid #ccc;
        border-radius: 50%;
        display: inline-block;
        position: relative;
    }

    .payment-option input[type="radio"]:checked + .custom-radio::after {
        content: "";
        width: 14px;
        height: 14px;
        background-color: green;
        border-radius: 50%;
        position: absolute;
        top: 2px;
        left: 2px;
    }

    .payment-option:hover {
        border-color: #888;
    }
/*------------------------- Responsive Design --------------------------*/
@media (max-width: 768px) {
  .slider-5 .slick-dots {
    display: block;
  }
  .nav-links {
    display: none;
    /* Masquer la navigation */
    flex-direction: column;
    position: absolute;
    top: 70px;
    right: 20px;
    background: #ffffff;
    padding: 20px;
    box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
    border-radius: 8px;
    z-index: 1000;
  }

  .nav-links.active {
    display: flex;
  }

  .menu-toggle {
    display: block;
  }

  .buttons {
    display: none;
    /* Masquer les boutons pour mobile */
  }
}@media (max-width: 991.98px) {
    #products_grid:not(.o_wsale_layout_list) .o_wsale_products_grid_table_wrapper td {


            display: inline-block;
        width: 80% !important;
        margin-right: 40px !important;
    }