@import url('https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,100..1000;1,9..40,100..1000&display=swap');


:root {
  --body-background-color: #ffffff;
  --width-defaut: 1024px;
  --width-wide: 1360px;
  --width-full: 100%;
  --border-radius: 5px;

  --top-background-color: #0783c5;
  --top-text-color:#fff;

  --nav-background-color: rgba(255, 255, 255, 0.7);
  --nav-menu-color: #0783c5;
  --nav-menu-color-hover: #169847;

  --color-principale: #0783c5;
  --color-principale-hover: #a9bdd2;
  --color-secondaire: #169847;
  --color-secondaire-hover: #0783c5;
  --color-tertiaire: #a9bdd2;
  --color-light: #faf7f2;

  --cta-background-color: rgba(7, 131, 197, 0.5);
  --cta-text-color: #fff;
  --cta-bouton-background-color: #fff;
  --cta-bouton-text-color: #0783c5;

  --footer-background-color: #0783c5;
  --footer-text-color: #fff;
  --footer-picto-color: #fff;

  --font-base: "DM Sans", sans-serif;
  --font-titre: "DM Sans", sans-serif;
  --font-titre--weight: 700;
  --font-size-defaut: 20px;
  --line-height-defaut:1.4em;
/*
  --wp--preset--font-size--small: clamp(20px, 1.2vw, 24px);
  --wp--preset--font-size--medium: clamp(26px, 1.3vw, 32px);
  --wp--preset--font-size--large: clamp(32px, 1.4vw, 40px);
  --wp--preset--font-size--x-large: clamp(42px, 2.8vw, 52px);
  

  --wp--custom--line-height: 1.2;

  --wp--preset--font-size--26-px: clamp(19px, 1.5vw, 26px);
*/
}

.wp-block-post-content {
  font-family: var(--font-base);
  font-size: var(--font-size-defaut);
  /*color: var(--color-principale);*/
}

/*
.editor-styles-wrapper{
  line-height: 1.4em;
  color: blueviolet;
}
  */
  


.wp-block-heading {
  font-family: var(--font-titre);
  font-weight: var(--font-titre--weight);
}
/*
.has-x-large-font-size {
  font-size: var(--wp--preset--font-size--x-large) !important;
}
*/
.has-noir-color {
  color: #000;
}

.has-noir-background-color {
  background-color: #000;
}

.has-blanc-color {
  color: #fff;
}

.has-blanc-background-color {
  background-color: #fff;
}

.has-principale-color {
  color: var(--color-principale);
}

.has-principale-background-color {
  background-color: var(--color-principale);
}

.has-secondaire-color {
  color: var(--color-secondaire);
}

.has-secondaire-background-color {
  background-color: var(--color-secondaire);
}

.has-gris-light-background-color {
  background-color: var(--color-light);
}

.gutenberg .wp-block-group:not(.alignwide, .alignfull) {
  width: 100%;
  max-width: var(--width-defaut);
  margin-left: auto;
  margin-right: auto;
}

.wp-block-cover,
.wp-block-separator,
.wp-block-media-text,
.wp-block-columns,
.wp-block-heading,
.wp-block-list,
.wp-block-image,
.wp-block-details,
.wp-block-embed,
.wp-block-accordion,
.wp-block.wp-block-heading,
p {
  width: 100%;
  max-width: var(--width-defaut);
  margin-left: auto;
  margin-right: auto;
}

.wp-block.wp-block-heading{

}


.wp-block[data-align="wide"],
.wp-block[data-align="wide"] .wp-block-media-text,
.wp-block[data-align="wide"] .wp-block-columns {
  width: 100%;
  max-width: var(--width-wide);
  margin-left: auto;
  margin-right: auto;
}

.wp-block[data-align="full"],
.wp-block[data-align="full"] .wp-block-media-text,
.wp-block[data-align="full"] .wp-block-columns {
  width: 100%;
  max-width: var(--width-full);
  margin-left: auto;
  margin-right: auto;
}

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

.alignfull {
  width: 100%;
  max-width: var(--width-full);
}

/*
.editor-styles-wrapper .is-root-container .wp-block-paragraph{
  line-height: var(--line-height-defaut) !important;
  color: purple;
}
  */

/* Taille typo Gutenberg */

.has-12-px-font-size {
  font-size: 12px;
  line-height: var(--line-height-defaut);
}
.has-14-px-font-size {
  font-size: 14px;
  line-height: var(--line-height-defaut);
}
.has-16-px-font-size {
  font-size: 16px;
  line-height: var(--line-height-defaut);
}
.has-18-px-font-size {
  font-size: 18px;
  line-height: var(--line-height-defaut);
}
.has-20-px-font-size {
  font-size: clamp(18px, 1.5vw, 20px);
line-height: var(--line-height-defaut);
}
.has-22-px-font-size {
  font-size: clamp(18px, 1.5vw, 22px);
  line-height: var(--line-height-defaut);
}
.has-24-px-font-size {
  font-size: clamp(19px, 1.5vw, 24px);
 line-height: var(--line-height-defaut);
}

.has-26-px-font-size {
  font-size: clamp(19px, 1.5vw, 26px);
  line-height: var(--line-height-defaut);
}


.has-28-px-font-size {
  font-size: clamp(19px, 1.6vw, 28px);
 line-height: var(--line-height-defaut);
}

.has-30-px-font-size {
  font-size: clamp(20px, 1.6vw, 30px);
  line-height:calc(var(--line-height-defaut) - 0.01em);
}

.has-32-px-font-size {
  font-size: clamp(20px, 1.7vw, 32px);
  line-height: calc(var(--line-height-defaut) - 0.1em);
}


.has-34-px-font-size {
  font-size: clamp(20px, 1.8vw, 34px);
  line-height: calc(var(--line-height-defaut) - 0.15em);
}


.has-36-px-font-size {
  font-size: clamp(24px, 1.9vw, 36px);
  line-height: calc(var(--line-height-defaut) - 0.2em);
}


.has-38-px-font-size {
  font-size: clamp(25px, 2.0vw, 38px);
  line-height: calc(var(--line-height-defaut) - 0.25em);
}

.has-40-px-font-size {
  font-size: clamp(26px, 2.1vw, 40px);
  line-height: calc(var(--line-height-defaut) - 0.26em);
}

.has-42-px-font-size {
  font-size: clamp(27px, 2.2vw, 42px);
  line-height: calc(var(--line-height-defaut) - 0.27em);
}


.has-44-px-font-size {
  font-size: clamp(28px, 2.3vw, 44px);
line-height: calc(var(--line-height-defaut) - 0.28em);
}

.has-46-px-font-size {
  font-size: clamp(29px, 2.4vw, 46px);
line-height: calc(var(--line-height-defaut) - 0.29em);}


.has-48-px-font-size {
  font-size: clamp(30px, 2.5vw, 48px);
  line-height: calc(var(--line-height-defaut) - 0.30em);
}


.has-50-px-font-size {
  font-size: clamp(31px, 2.6vw, 50px);
  line-height: calc(var(--line-height-defaut) - 0.31em);
}

.has-52-px-font-size {
  font-size: clamp(32px, 2.7vw, 52px);
  line-height: calc(var(--line-height-defaut) - 0.32em);
}

.has-54-px-font-size {
  font-size: clamp(33px, 2.8vw, 54px);
  line-height: calc(var(--line-height-defaut) - 0.33em);
}


.has-56-px-font-size {
  font-size: clamp(34px, 2.9vw, 56px);
  line-height: calc(var(--line-height-defaut) - 0.34em);
}

.has-58-px-font-size {
  font-size: clamp(35px, 3.0vw, 58px);
  line-height: calc(var(--line-height-defaut) - 0.35em);
}


.has-60-px-font-size {
  font-size: clamp(36px, 3.1vw, 60px);
 line-height: calc(var(--line-height-defaut) - 0.36em);
}


.has-62-px-font-size {
  font-size: clamp(37px, 3.2vw, 62px);
  line-height: calc(var(--line-height-defaut) - 0.37em);
}


.has-64-px-font-size {
  font-size: clamp(38px, 3.3vw, 64px);
  line-height: calc(var(--line-height-defaut) - 0.38em);
}

.has-66-px-font-size {
  font-size: clamp(39px, 3.4vw, 66px);
  line-height: calc(var(--line-height-defaut) - 0.39em);
}

.has-68-px-font-size {
  font-size: clamp(40px, 3.5vw, 68px);
  line-height: calc(var(--line-height-defaut) - 0.4em);
}

.has-70-px-font-size {
  font-size: clamp(41px, 3.6vw, 70px);
  line-height: calc(var(--line-height-defaut) - 0.4em);
}

.has-72-px-font-size {
  font-size: clamp(42px, 3.7vw, 72px);
  line-height: calc(var(--line-height-defaut) - 0.4em);
}

.is-style-abc-font-size{
font-size: clamp(20px, 9vw, 140px);
line-height: 1em;
}

/* Fin Taille typo Gutenberg */




figure.is-type-video {
  margin-left: auto;
  margin-right: auto;
}

iframe {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  height: auto;
  min-height: 400px;
}

.wp-block-table table thead tr th,
.wp-block-table table tr td {
  border-color: var(--color-principale);
}

.wp-block-table table thead {
  border-bottom: var(--color-principale) 1px solid;
}

.wp-block-table.is-style-stripes table thead tr {
  background-color: var(--color-principale);
  color: var(--color-light);
}

.wp-block-table.is-style-stripes tbody tr:nth-child(odd) {
  background-color: var(--color-secondaire);
}

.wp-block-cover .wp-block-cover__inner-container * {
  width: 100%;
  max-width: var(--width-defaut);
  margin-left: auto;
  margin-right: auto;
}

.wp-block-button a.wp-element-button,
.wp-block-button .wp-element-button {
  background-color: var(--color-principale);
  border-radius: var(--border-radius);
  transition: 0.25s;
  font-size: 18px;
  line-height: 18px;
}

.wp-block-button a.wp-element-button:hover,
.wp-block-button a.wp-element-button.has-principale-background-color:hover {
  background-color: color-mix(
    in srgb,
    var(--color-principale),
    white 20%
  ) !important;
}

.wp-block-button a.wp-element-button.has-secondaire-background-color:hover {
  background-color: color-mix(
    in srgb,
    var(--color-secondaire),
    white 20%
  ) !important;
}

.wp-block-button a.wp-element-button.has-tertiaire-background-color:hover {
  background-color: color-mix(
    in srgb,
    var(--color-tertiaire),
    white 20%
  ) !important;
}

figure.wp-block-image {
  overflow: hidden;
  margin-left: 0px;
  margin-right: 0px;
  width: 100%;
}
figure.wp-block-image img {
  width: 100%;
  height: auto;
}

figure.wp-block-media-text__media {
  overflow: hidden;
}

figure.wp-block-image img,
figure.wp-block-media-text__media img {
  transition: transform 1.5s cubic-bezier(0.25, 1, 0.5, 1);
}

figure.wp-block-image:hover img,
figure.wp-block-media-text__media:hover img {
  transform: scale(1.05);
}

.wp-block-separator {
  color: var(--color-principale);
  border-bottom-color: var(--color-principale);
  border-bottom-width: 2px;
  border-bottom-style: solid;
}

.wp-block-separator.has-background:not(.is-style-dots) {
  border-bottom: none;
  height: 2px;
}

.wp-block-separator:not(.aligncenter) {
  margin-left: 0px;
  margin-right: auto;
}

:root :where(.wp-block-separator.is-style-dots):before {
  margin-left: auto;
  margin-right: auto;
  text-align: center;
  font-size: 3em;
  padding-left: 0.3em;
  padding-right: 0.3em;
  letter-spacing: 0.5em;
}

details.wp-block-details {
  padding-left: 30px;
  padding-right: 30px;
  padding-top: 20px;
  padding-bottom: 20px;
  border-radius: var(--border-radius);
  border: var(--color-secondaire) 1px solid;
  box-sizing: border-box;
  width: 100%;
}

details summary {
  list-style: none;
  padding-right: 20px;
  &::after {
    content: "+";
    color: white;
    background-color: var(--color-principale);
    border-radius: 15px;
    font-weight: bold;
    font-size: 24px;
    line-height: 24px;
    width: 30px;
    height: 30px;
    box-sizing: border-box;
    text-align: center;
    padding-top: 3px;
    /*margin-inline-start: 25px;*/
    position: absolute;
    top: 3px;
    right: -20px;
  }
  [open] &::after {
    content: "−";
  }
}

details.wp-block-details summary {
  font-family: var(--font-titre);
  color: var(--color-principale);
  font-size: var(--wp--preset--font-size--medium);
  position: relative;
}

details.wp-block-details summary:hover {
  color: var(--color-principale-hover);
}

.quotes {
  color: var(--color-principale);
  fill: var(--color-principale);
}

.wp-block-quote {
  position: relative;
  color: var(--color-principale);
  border-left-color: var(--color-principale);
  padding-right: 60px;
}

.wp-block-quote::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 50px;
  height: 34px;

  background-color: var(--color-principale);

  -webkit-mask: url(../images/quote.svg) no-repeat center;
  mask: url(../images/quote.svg) no-repeat center;

  -webkit-mask-size: contain;
  mask-size: contain;
}

.wp-block-media-text:not(.has-media-on-the-right)
  .wp-block-media-text__content {
  padding-right: 0px;
}

.wp-block-media-text.has-media-on-the-right .wp-block-media-text__content {
  padding-left: 0px;
}

/* FORMIDABLE */

.frm_form_fields fieldset {
  border-style: none;
  padding-left: 0;
  padding-right: 0;
}

.frm_form_field {
  margin-bottom: 15px;
}

.frm_form_field label {
  width: 100%;
  box-sizing: border-box;
  display: block;
  font-size: var(--font-size-defaut);
  color: var(--color-principale);
}

.frm_form_field input[type="text"],
.frm_form_field input[type="email"],
.frm_form_field input[type="tel"] {
  height: 40px;
  width: 100%;
  box-sizing: border-box;
  display: block;
  border: var(--color-principale) 1px solid;
  border-radius: 4px;
  padding-left: 20px;
  padding-right: 20px;
  font-size: var(--font-size-defaut);
}

.frm_form_field textarea {
  height: 100px;
  width: 100%;
  box-sizing: border-box;
  display: block;
  border: var(--color-principale) 1px solid;
  border-radius: 4px;
  padding: 20px;
  font-size: var(--font-size-defaut);
}

.frm_submit {
  margin-top: 25px;
}

.frm_submit button {
  box-sizing: border-box;
  height: 40px;
  background-color: var(--color-principale);
  color: #fff;
  cursor: pointer;
  border-style: none;
  padding-left: 25px;
  padding-right: 25px;
  font-size: var(--font-size-defaut);
}

.frm_error_style {
  color: rgb(168, 5, 5);
  margin-bottom: 25px;
}

.frm_error {
  color: rgb(168, 5, 5);
  font-size: 16px;
}

/* FIN FORMIDABLE */