/*
* -------------------------------------------------
* ------------------- GLOBAL ----------------------
* -------------------------------------------------
*/
/* --- IMPORT FONTS --- */
@import url("https://fonts.googleapis.com/css2?family=Manrope:ital,wght@0,100..900;1,100..900&family=Work+Sans:ital,wght@0,100..900;1,100..900&display=swap");
/* --- PAGE SETUP --- */
* {
  box-sizing: border-box;
}

:root {
  font-size: 18px;
}

body {
  font-family: "Manrope", sans-serif;
  color: #0F332F;
  font-optical-sizing: auto;
  font-size: 1rem;
  font-weight: 500;
  line-height: 1.8;
  margin: 0;
  padding: 0;
}

.page-container {
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

main#site-content {
  background-color: #FFFFFF;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  position: relative;
}

/* --- CONTAINERS --- */
.container-align-right {
  padding-left: 0;
}
@media (min-width: 768px) {
  .container-align-right {
    padding-right: calc((100vw - 720px) / 2);
  }
}
@media (min-width: 992px) {
  .container-align-right {
    padding-right: calc((100vw - 960px) / 2);
  }
}
@media (min-width: 1200px) {
  .container-align-right {
    padding-right: calc((100vw - 1140px) / 2);
  }
}
@media (min-width: 1400px) {
  .container-align-right {
    padding-right: calc((100vw - 1320px) / 2);
  }
}
@media (min-width: 768px) {
  .container-align-right .section-inner {
    padding-left: calc((100vw - 720px) / 2);
  }
}
@media (min-width: 992px) {
  .container-align-right .section-inner {
    padding-left: calc((100vw - 960px) / 2);
  }
}
@media (min-width: 1200px) {
  .container-align-right .section-inner {
    padding-left: calc((100vw - 1140px) / 2);
  }
}
@media (min-width: 1400px) {
  .container-align-right .section-inner {
    padding-left: calc((100vw - 1320px) / 2);
  }
}

.container-align-left {
  padding-right: 0;
}
@media (min-width: 768px) {
  .container-align-left {
    padding-left: calc((100vw - 720px) / 2);
  }
}
@media (min-width: 992px) {
  .container-align-left {
    padding-left: calc((100vw - 960px) / 2);
  }
}
@media (min-width: 1200px) {
  .container-align-left {
    padding-left: calc((100vw - 1140px) / 2);
  }
}
@media (min-width: 1400px) {
  .container-align-left {
    padding-left: calc((100vw - 1320px) / 2);
  }
}
@media (min-width: 768px) {
  .container-align-left .section-inner {
    padding-right: calc((100vw - 720px) / 2);
  }
}
@media (min-width: 992px) {
  .container-align-left .section-inner {
    padding-right: calc((100vw - 960px) / 2);
  }
}
@media (min-width: 1200px) {
  .container-align-left .section-inner {
    padding-right: calc((100vw - 1140px) / 2);
  }
}
@media (min-width: 1400px) {
  .container-align-left .section-inner {
    padding-right: calc((100vw - 1320px) / 2);
  }
}

/* --- MARGINS AND PADDING --- */
.mb-3 {
  margin-bottom: 35px !important;
}

.mb-5 {
  margin-bottom: 50px !important;
}

.mt-5 {
  margin-top: 50px !important;
}

.pt-5 {
  padding-top: 50px !important;
}

.pt-100 {
  padding-top: 100px !important;
}

.pb-100 {
  padding-bottom: 100px !important;
}

/* --- TEXT / BUTTONS / LINKS --- */
p,
a,
span,
label,
div,
button {
  font-size: 1rem;
}
p.bigger-text,
a.bigger-text,
span.bigger-text,
label.bigger-text,
div.bigger-text,
button.bigger-text {
  font-size: 1.25rem;
  line-height: 2;
  letter-spacing: 0.75px;
}
p.tiny-text, p.tiny-text *,
a.tiny-text,
a.tiny-text *,
span.tiny-text,
span.tiny-text *,
label.tiny-text,
label.tiny-text *,
div.tiny-text,
div.tiny-text *,
button.tiny-text,
button.tiny-text * {
  font-size: 0.75rem;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "Manrope", sans-serif;
  font-weight: 700;
  color: #1d665d;
  margin-top: 0;
  margin-bottom: 15px;
}

h1 {
  font-size: 3.75rem;
  letter-spacing: -2px;
  line-height: 1.1;
}

h2 {
  font-size: 3rem;
  letter-spacing: -1.45px;
  line-height: 1.4;
}
h2.title-bigger {
  font-size: 4rem;
  letter-spacing: -1.75px;
  line-height: 1.2;
}

h3 {
  font-size: 2rem;
  line-height: 1.5;
  margin-bottom: 5px;
  letter-spacing: -1px;
}
h3.title-bigger {
  font-size: 2.75rem;
  letter-spacing: -1.5px;
  line-height: 1.3;
}

h4 {
  font-size: 1.35rem;
  line-height: 1.3;
  margin-bottom: 5px;
}

h5 {
  font-size: 1.25rem;
  line-height: 1.4;
  margin-bottom: 5px;
}

h6 {
  font-size: 1rem;
  line-height: 1.4;
  margin-bottom: 5px;
}

b,
strong {
  font-weight: 600;
}

h1 b,
h1 strong,
h2 b,
h2 strong,
h3 b,
h3 strong,
h4 b,
h4 strong,
h5 b,
h5 strong,
h6 b,
h6 strong {
  font-weight: 800;
}

a {
  text-decoration: underline;
  color: #1d665d;
  transition: 0.3s;
}
a:hover {
  color: #1d665d;
}

.btn-cta {
  font-family: "Manrope", sans-serif;
  display: inline-block;
  font-size: 1.125rem;
  font-weight: 600;
  color: #1d665d;
  background-color: #FFFFFF;
  border: 2px solid #1d665d;
  padding: 5px 15px;
  border-radius: 50px;
  text-decoration: none;
  transition: 0.3s ease-in-out;
}
.btn-cta:hover {
  color: #FFFFFF;
  background-color: #1d665d;
  border-color: #1d665d;
}
.btn-cta.btn-cta-full {
  color: #FFFFFF;
  background-color: #1d665d;
}
.btn-cta.btn-cta-full:hover {
  color: #1d665d;
  background-color: transparent;
}
.btn-cta.btn-cta-small {
  font-size: 0.875rem;
  padding: 5px 10px;
}
.btn-cta.btn-cta-medium {
  font-size: 1.125rem;
  padding: 7px 15px;
}
.btn-cta.btn-cta-large {
  font-size: 1.125rem;
  padding: 12px 30px;
}

/* --- LISTS --- */
ul {
  list-style-type: disc;
  padding-left: 20px;
}
ul li::marker {
  font-size: 1.25rem;
  color: #b8d97d;
}

.bg-green-secondary ul li::marker {
  color: #1d665d;
}

/* --- IMAGES --- */
img {
  max-width: 100%;
  height: auto;
}

.image-container img {
  object-fit: cover;
  height: 100%;
}

/* --- SECTIONS --- */
section {
  padding: 50px 0;
}
section .section-title {
  margin-bottom: 35px;
}
section .section-subtitle {
  font-size: 1.25rem;
  color: #0F332F;
}
section.pt-large {
  padding-top: 100px;
}
section.pt-larger {
  padding-top: 150px;
}
section.pb-large {
  padding-bottom: 100px;
}
section.pb-larger {
  padding-bottom: 150px;
}

@media (max-width: 768px) {
  section {
    padding: 25px 0;
  }
  section.pt-large {
    padding-top: 50px;
  }
  section.pt-larger {
    padding-top: 75px;
  }
  section.pb-large {
    padding-bottom: 50px;
  }
  section.pb-larger {
    padding-bottom: 75px;
  }
}
/* --- HR --- */
hr {
  opacity: 1;
  border: none;
  background-color: #1d665d;
  height: 2px;
  width: 300px;
  margin: 35px auto;
}
hr.sidebar-section-separator {
  height: 1px;
  width: 150px;
  margin: 15px 0;
}

.bg-green-primary hr {
  background-color: #ffeddf;
}

/* --- TEXT WITH ICONS --- */
.has-icon::before {
  font-family: "Font Awesome 7 Free";
  margin-right: 15px;
}
.has-icon.icon-leaf::before {
  content: "\f06c";
  font-weight: 900;
}
.has-icon.icon-flask::before {
  content: "\f0c3";
  font-weight: 900;
}
.has-icon.icon-tint::before {
  content: "\f043";
  font-weight: 900;
}
.has-icon.icon-cloud::before {
  content: "\f0c2";
  font-weight: 900;
}
.has-icon.icon-braille::before {
  content: "\f03a";
  font-weight: 900;
}
.has-icon.icon-water::before {
  content: "\f773";
  font-weight: 900;
}
.has-icon.icon-dot-circle::before {
  content: "\f192";
  font-weight: 900;
}
.has-icon.icon-plus-circle::before {
  content: "\f055";
  font-weight: 900;
}
.has-icon.icon-feather::before {
  content: "\f52d";
  font-weight: 900;
}
.has-icon.icon-shield::before {
  content: "\f3ed";
  font-weight: 900;
}
.has-icon.icon-road::before {
  content: "\f018";
  font-weight: 900;
}
.has-icon.icon-trash::before {
  content: "\f2ed";
  font-weight: 900;
}
.has-icon.icon-atom::before {
  content: "\f5d2";
  font-weight: 900;
}
.has-icon.icon-water-drop::before {
  content: "\f4c1";
  font-weight: 900;
}

/* --- BACKGROUNDS --- */
.bg-green-primary {
  background-color: #1d665d;
  color: #FFFFFF;
}
.bg-green-primary a {
  color: #FFFFFF;
}
.bg-green-primary h2,
.bg-green-primary h3,
.bg-green-primary h4,
.bg-green-primary h5,
.bg-green-primary h6,
.bg-green-primary .section-title,
.bg-green-primary .section-subtitle {
  color: #ffeddf;
}
.bg-green-primary .section-separator {
  background-color: #ffeddf;
}

.bg-green-secondary {
  background-color: #b8d97d;
}

.bg-beige {
  background-color: #ffeddf;
}

.bg-white {
  background-color: #FFFFFF;
}

.bg-grey {
  background-color: #e0ecf0;
}

.bg-grey-2 {
  background-color: #f2f4f5;
}

@media (max-width: 1400px) {
  :root {
    font-size: 16px;
  }
}
@media (max-width: 1200px) {
  :root {
    font-size: 14px;
  }
}
@media (max-width: 576px) {
  h1 {
    font-size: 3.5rem;
  }
  h2 {
    font-size: 2.5rem;
  }
  h2.title-bigger {
    font-size: 3rem;
  }
  h3 {
    font-size: 1.75rem;
  }
  h3.title-bigger {
    font-size: 2rem;
  }
}
/*
* -------------------------------------------------
* -------------------- FORMS ----------------------
* -------------------------------------------------
*/
form {
  /* --- SURFACTGREEN FORMS --- */
}
form input[type=text],
form input[type=email],
form input[type=password],
form select,
form textarea {
  display: inline-block;
  min-height: 40px;
  width: 100%;
  font-size: 0.875rem;
  line-height: 1.8;
  padding: 6px 12px;
  vertical-align: middle;
  background-color: #FFFFFF;
  color: #0F332F;
  border: 1px solid #BEBEBE;
  border-radius: 50px;
}
form input[type=text]:focus,
form input[type=email]:focus,
form input[type=password]:focus,
form select:focus,
form textarea:focus {
  outline: 1px ridge #1d665d;
}
form .field label {
  color: #0F332F;
  font-size: 0.875rem;
  position: relative;
  top: 3px;
  margin-bottom: 0;
}
form .field label::after {
  margin-left: -4px;
}
form .half-input-container {
  display: flex;
  justify-content: space-between;
}
form .half-input-container .field {
  width: calc(50% - 5px);
}
form .btn-submit,
form .button,
form .buttons {
  display: inline-block;
  font-size: 1.125rem;
  font-weight: 600;
  color: #FFFFFF;
  background-color: #1d665d;
  border: 2px solid #1d665d;
  padding: 5px 10px;
  text-decoration: none;
  transition: 0.3s ease-in-out;
  border-radius: 50px;
}
form .btn-submit:hover,
form .button:hover,
form .buttons:hover {
  color: #1d665d;
  background-color: transparent;
}
/*
-------------------------------------------------
----------------- LEAFLET MAP -------------------
-------------------------------------------------
*/
section#section-carte-distributeurs .section-inner {
  border-radius: 30px;
  overflow: hidden;
}
section#section-carte-distributeurs .section-inner #map {
  height: 650px;
}
section#section-carte-distributeurs .section-inner #map .leaflet-popup .leaflet-popup-content-wrapper {
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1), 0 0 10px rgba(0, 0, 0, 0.1);
  border-radius: 10px;
}
section#section-carte-distributeurs .section-inner #map .leaflet-popup .leaflet-popup-content-wrapper .leaflet-popup-content {
  margin: 10px 15px;
}
section#section-carte-distributeurs .section-inner #map .leaflet-popup .leaflet-popup-content-wrapper .leaflet-popup-content .partner-name {
  margin-bottom: 10px;
}
section#section-carte-distributeurs .section-inner #map .leaflet-popup .leaflet-popup-content-wrapper .leaflet-popup-content .partner-contact {
  font-family: "Karla", sans-serif;
  display: inline-block;
  font-size: 0.875rem;
  margin-bottom: 15px;
}
section#section-carte-distributeurs .section-inner #map .leaflet-popup .leaflet-popup-content-wrapper .leaflet-popup-content .partner-contact a {
  text-decoration: underline;
}
section#section-carte-distributeurs .section-inner #map .leaflet-popup .leaflet-popup-content-wrapper .leaflet-popup-content .partner-link {
  border-radius: 5px;
}
section#section-carte-distributeurs .section-inner #map .leaflet-control {
  font-size: 0.75rem;
}
section#section-carte-distributeurs .section-inner #map .leaflet-control * {
  font-size: 0.75rem;
}

@media (max-width: 992px) {
  section#section-carte-distributeurs {
    padding: 0;
  }
  section#section-carte-distributeurs .section-wrapper {
    padding: 0;
  }
  section#section-carte-distributeurs .section-wrapper .section-inner {
    border-radius: 0;
  }
}
@media (max-width: 768px) {
  section#section-carte-distributeurs .section-inner #map {
    height: 400px;
  }
}
/*
-------------------------------------------------
------------------ PAGINATION -------------------
-------------------------------------------------
*/
.pagination-wrapper {
  margin-top: 50px;
}
.pagination-wrapper .navigation .nav-links {
  margin: 0 auto;
}
.pagination-wrapper .navigation .nav-links .page-numbers {
  display: inline-block;
  color: #1d665d;
  font-weight: 600;
  border: 1px solid #1d665d;
  border-radius: 50%;
  width: 35px;
  height: 35px;
  line-height: 35px;
  text-align: center;
  text-decoration: none;
  margin: 0 2.5px;
}
.pagination-wrapper .navigation .nav-links .page-numbers.current, .pagination-wrapper .navigation .nav-links .page-numbers:hover {
  background-color: #1d665d;
  color: #FFFFFF;
}
.pagination-wrapper .navigation .nav-links .page-numbers.prev, .pagination-wrapper .navigation .nav-links .page-numbers.next {
  background-color: #1d665d;
  color: #FFFFFF;
  border-radius: 5px;
}

@media (max-width: 768px) {
  .pagination-wrapper {
    margin-top: 25px;
  }
}
/*
-------------------------------------------------
------------------- MODALS ----------------------
-------------------------------------------------
*/
.modal-content-dom {
  display: none !important;
}

.modal-button.modal-info {
  cursor: pointer;
  position: relative;
}
.modal-button.modal-info::after {
  display: none;
  content: "\f129";
  font-family: "Font Awesome 7 Free";
  font-weight: 900;
  position: absolute;
  top: 10px;
  right: 10px;
  background: #E5E5E5;
  border: 1px solid #0F332F;
  color: #0F332F;
  width: 30px;
  height: 30px;
  text-align: center;
  border-radius: 50%;
}
.modal-button.modal-info:hover::after {
  display: inline-block;
}

.modal-wrapper {
  display: none;
}
.modal-wrapper .modal-container {
  position: fixed;
  top: 0;
  left: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  z-index: 500;
}
.modal-wrapper .modal-container .modal-content {
  position: relative;
  background: white;
  width: 650px;
  max-width: 90%;
  margin: auto;
  padding: 25px;
  overflow: hidden;
  border-radius: 10px;
  box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.2);
  text-align: center;
}
.modal-wrapper .modal-container .modal-content .modal-title {
  text-align: left;
  margin-bottom: 15px;
}
.modal-wrapper .modal-container .modal-content .modal-text {
  width: 100%;
  margin-bottom: 30px;
  color: #0F332F;
  text-align: left;
}
.modal-wrapper .modal-container .modal-content .modal-input {
  border-radius: 50px;
}
.modal-wrapper .modal-container .modal-content .emulgreen-table {
  margin-bottom: 15px;
}
.modal-wrapper .modal-container .modal-content img {
  width: 75%;
}
.modal-wrapper .modal-container .modal-content button.btn-cross {
  position: absolute;
  top: 10px;
  right: 10px;
  width: 30px;
  height: 30px;
  border: 1px solid silver;
  border-radius: 100px;
  color: silver;
  text-align: center;
  transition: 0.2s;
}
.modal-wrapper .modal-container .modal-content button.btn-cross:hover, .modal-wrapper .modal-container .modal-content button.btn-cross:active {
  background: silver;
  color: white;
  transition: 0.2s;
}
.modal-wrapper .modal-container .modal-content form {
  margin-bottom: 50px;
}
.modal-wrapper .modal-container .modal-content form .form-response {
  margin: 0;
}
.modal-wrapper .modal-container .modal-content form .form-response.success {
  color: #1d665d;
  margin-top: 15px;
}
.modal-wrapper .modal-container .modal-content form .form-response.error {
  color: #DD0000;
  margin-top: 15px;
}

/*
-------------------------------------------------
------------------- TABLES ----------------------
-------------------------------------------------
*/
.emulgreen-table {
  width: 100%;
  border-collapse: collapse;
  border-radius: 25px;
  overflow: hidden;
}
.emulgreen-table th,
.emulgreen-table td {
  padding: 10px;
  text-align: left;
  border: 2px solid #FFFFFF;
}
.emulgreen-table th {
  background-color: #1d665d;
  color: #FFFFFF;
}
.emulgreen-table tr td {
  background-color: #b8d97d;
}
.emulgreen-table tr:nth-child(even) td {
  background-color: rgb(217.53125, 237.96875, 218.2125);
}

/*
-------------------------------------------------
----------------- ANIMATIONS --------------------
-------------------------------------------------
*/
.animated {
  opacity: 0;
  will-change: opacity, transform;
  transform: translateZ(0);
}
.animated.is-visible {
  opacity: 1 !important;
  transform: none !important;
}

/* --- SLIDE --- */
.slide-in-up {
  opacity: 1;
  transform: translateY(50px);
}

.slide-in-left {
  opacity: 1;
  transform: translateX(-100%);
}

.slide-in-right {
  opacity: 1;
  transform: translateX(100%);
}

.slide-in-bottom {
  opacity: 1;
  transform: translateY(-100%);
}

/* --- FADE --- */
.fade-in-up {
  transform: translateY(50px);
}

.fade-in-left {
  transform: translateX(-50px);
}

.fade-in-right {
  transform: translateX(50px);
}

.fade-in-bottom {
  transform: translateY(-50px);
}

/*
-------------------------------------------------
------------------- OTHER -----------------------
-------------------------------------------------
*/
/* --- PAGE PRODUITS --- */
body.page-template-page-produits section#section-produits {
  padding-top: 100px;
  padding-bottom: 100px;
}

@media (max-width: 576px) {
  body.page-template-page-produits section#section-produits {
    padding-top: 0px;
    padding-bottom: 0px;
  }
}
/* --- PAGE 404 --- */
body.error404 section#section-404 h1.error-code {
  font-size: 10rem;
  margin-bottom: 15px;
}
body.error404 section#section-404 .error-message {
  font-size: 1.5rem;
  margin-bottom: 50px;
}

/* --- PLL SWITCHER SELECT --- */
.pll-switcher-select {
  font-size: 1rem;
  background: none;
  border: 1px solid #0F332F;
  border-radius: 10px;
  padding: 2px 5px;
}
.pll-switcher-select option {
  font-size: 0.875rem;
}

/*# sourceMappingURL=main.css.map */
