/**
 * CSS DOCUMENT 5.2024
**/
@font-face {
  font-family: "LibreFranklin";
  src: url('Fonts/LibreFranklin-wght.woff2') format('woff2-variations');
  font-weight: 125 950;
  font-style: normal;
}
@font-face {
  font-family: "Baker";
  src: url('Fonts/baker_signet_std_regular-webfont.woff2') format('woff2'), 
       url('Fonts/baker_signet_std_regular-webfont.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "TrdGotBC20";
  src: url('Fonts/TrdGotBC20.woff2') format('woff2'), 
       url('Fonts/TrdGotBC20.woff') format('woff');
  font-weight: 700;
  font-style: normal;
}

/* Fontello */
@font-face {
  font-family: 'pictos';
  src: url('Fonts/pictos.eot?29070695');
  src: url('Fonts/pictos.eot?29070695#iefix') format('embedded-opentype'),
       url('Fonts/pictos.woff2?29070695') format('woff2'),
       url('Fonts/pictos.woff?29070695') format('woff'),
       url('Fonts/pictos.ttf?29070695') format('truetype'),
       url('Fonts/pictos.svg?29070695#pictos') format('svg');
  font-weight: normal;
  font-style: normal;
}
/* Chrome hack: SVG is rendered more smooth in Windozze. 100% magic, uncomment if you need it. */
/* Note, that will break hinting! In other OS-es font will be not as sharp as it could be */
/*
@media screen and (-webkit-min-device-pixel-ratio:0) {
  @font-face {
    font-family: 'pictos';
    src: url('../font/pictos.svg?78404900#pictos') format('svg');
  }
}
*/
[class^="icon-"]:before, [class*=" icon-"]:before {
  font-family: "pictos";
  font-style: normal;
  font-weight: normal;
  speak: never;

  display: inline-block;
  text-decoration: inherit;
  width: 1em;
  margin-right: .2em;
  text-align: center;
  /* opacity: .8; */

  /* For safety - reset parent styles, that can break glyph codes*/
  font-variant: normal;
  text-transform: none;

  /* fix buttons height, for twitter bootstrap */
  line-height: 1em;

  /* Animation center compensation - margins should be symmetric */
  /* remove if not needed */
  margin-left: .2em;

  /* you can be more comfortable with increased icons size */
  /* font-size: 120%; */

  /* Font smoothing. That was taken from TWBS */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;

  /* Uncomment for 3D effect */
  /* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */
}
.icon-menu:before { content: '\e800'; } /* '' */
.icon-close:before { content: '\e801'; } /* '' */
.icon-arrow-left:before { content: '\e802'; } /* '' */
.icon-arrow-right:before { content: '\e803'; } /* '' */

/* ======================================================
   GLOBAL RESET
====================================================== */
*, html, body, iframe, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h5, h5, h6, pre, form, label, fieldset, input, p, blockquote, table, th, td, audio, video { 
	margin:0; padding:0; outline:0; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; 
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, img { display:block; }
table { border-collapse:collapse; border-spacing:0; }
table td { vertical-align:top; }
iframe, fieldset, img, a img { border:0 none; }
address, caption, cite, code, dfn, th, var { font-style:normal; font-weight:normal; text-align:left; } 
h1, h2, h3, h5, h5, h6 { font-size:100%; }
blockquote::before, blockquote::after, q::before, q::after { content:''; content:none; }
html>body * a { position:relative; }  /* Gets links displaying over a PNG background */
a { outline:none; } /* Gets rid of Firefox's dotted borders */
textarea, table, td, th, code, pre, samp { 
  word-wrap: break-word; /* passage à la ligne forcé */
  -webkit-hyphens: auto; -moz-hyphens: auto; hyphens: auto; /* césure propre */
}
input, select { vertical-align:middle; }
ul li { margin:0.5rem 1rem; padding: 0 0.25rem; list-style:disc; }
ol li { margin:0.5rem 1rem; padding: 0 0.25rem; list-style:decimal; }
strong, b { font-weight:700; }
em, i { font-style:italic; }
img { margin: auto; width: 100%; }
span { white-space: nowrap; }

/**------------------------------
 * GENERAL CLASSES and SETTINGS
--------------------------------**/
:root {
  --mainColor: #802440;
  --mainColorBg: #b2dddc;
  --turquoiseDark: #00afb1;
  --brun: #956c23;
  --mauve: #ddd1e6;
  --sable: #f3e9cc;
  --white: #FFFFFF;
  --black: #000000;
  --red: #ff0000;
  --green: #00ff00;
}

html { width:100%; height:100%; font-family:'LibreFranklin', Arial, Helvetica, sans-serif; font-size:110%; line-height:1.5; font-weight:300; }
body { position:relative; width:100%; min-height:100%; color:var(--black); background:var(--white); text-align:left; }
h1 { position:relative; padding-top:1em; /*important pour smooth scrolling*/ margin:0 auto 1em; font:normal 2.8rem/.85 'Baker', serif; color:var(--mainColor); }
h2 { position:relative; margin: 1.5rem 0 0; font:700 2rem/1 'TrdGotBC20', Arial, Helvetica, sans-serif; color:var(--brun); }
h3 { position:relative; margin: 1.5rem 0 0; font:700 1.5rem/1.1 'TrdGotBC20', Arial, Helvetica, sans-serif; color:var(--mainColor); }
h4 { margin: 1.5rem 0 .5rem; font-size: 1.2rem; font-weight:500; line-height: 1.1; }
h5 { margin: 1.5rem 0 .5rem; font-size: 1rem; font-weight:500; line-height: 1.5; }
h6 { margin: 1.5rem 0 .5rem; font-size: 1rem; font-weight:500; line-height: 1.5; }
a { color: var(--black); text-decoration: underline; }
a:hover, a:focus { color: var(--mainColor); text-decoration: underline; }
a[href ^= 'tel:'] { text-decoration: none; }
p { margin:1.5em 0; }
ul, ol { margin:0; }

/* ======================================================
   TRANSITIONS & ANIMATIONS
====================================================== */
a, button, .button, .toggle-menu, a.link-menu::after { transition: all ease-in-out 0.2s; }

/* ======================================================
   CLASSES GLOBALES and *
====================================================== */
.ctn-msg { margin:1em auto; padding:0 }
form .ctn-msg p { margin:.5rem 0 }
.success { margin: 1.5rem 0; padding: 1px 1rem; font-style: italic; color: #008a00; border: 1px solid #008a00; border-radius:1em; background-color: #fff; }
.error { margin: 1.5rem 0; padding: 1px 1rem; font-style: italic; color: #e00; border: 1px solid #e00; border-radius:1em; background-color: #fff; }
.responsive { position: relative; padding-top: 30px; padding-bottom:33%; height: 0; overflow: hidden; }
.responsive iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.responsive img { margin:.5rem auto; width: 100%; height: auto; max-height: none; max-width: none; }
.lozad { opacity: 0; transition: opacity 1.5s ease-in-out; }
.loaded { opacity: 1; }
.more { text-transform: uppercase; white-space:nowrap; }
.button, a.button, button { display:inline-block; padding:.5rem 1.5rem; font-weight:600; color: var(--mainColorBg); letter-spacing:.2em; word-spacing:.2em; text-transform:uppercase; text-decoration:none; white-space:nowrap; background-color: var(--mainColor); border:0; border-radius:.5em; cursor:pointer; }
a.button:hover, a.button:focus, button:hover, button:focus { opacity: 0.8; }
.clear-fix:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; }
.center { text-align:center; }
#go2top { display:none; position:fixed; bottom:5%; right:2%; margin: .5rem; padding: .5rem 0; width: 40px; height: 40px; font-size: 1rem; line-height: 1; color: var(--mainColor); text-align:center; background-color: rgba(255, 255, 255, .3); border: 1px solid var(--mainColor); border-radius:25px; opacity:.5; z-index:30; }
#go2top:hover { color: var(--white); background-color:var(--mainColor); opacity:1; }
#accesslinks { position: absolute; left: -999px; }

/* ======================================================
   FORMULAIRES
====================================================== */
form { margin: 1.5rem auto; max-width: 40rem; }
.fieldset { width: 100%; margin-bottom: 2rem; }
form p, form .line { clear:both; margin:1rem auto; text-align: left; }
form .form-blktxt .line { max-width: inherit; }
label { display:block; font-family: 'LibreFranklin', Arial, Helvetica, sans-serif; font-size: 1rem; color: var(--black); text-align: left; cursor:pointer; }
label span { white-space: inherit; }
input[type="text"], input[type="password"], input[type="email"], input[type="tel"], input[type="number"], input[type="time"], textarea, select { padding:.5rem .75rem; width: 100%; font-size: 1rem; line-height: 1.5; font-family: 'LibreFranklin', Arial, Helvetica, sans-serif; font-weight:400; color:var(--black); background-color: var(--sable); border:2px solid var(--brun); border-radius:.5rem }
input[type="text"]:focus, input[type="password"]:focus, input[type="email"]:focus, input[type="tel"]:focus, input[type="number"]:focus, input[type="time"]:focus, textarea:focus { border-color:var(--mainColor); }
select { -webkit-appearance: none; -moz-appearance: none; appearance: none; padding-right: 1.2rem; background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI0OCIgaGVpZ2h0PSI0OCIgdmlld0JveD0iMCAwIDQ4IDQ4Ij48cGF0aCBkPSJNMTQuODMgMTYuNDJsOS4xNyA5LjE3IDkuMTctOS4xNyAyLjgzIDIuODMtMTIgMTItMTItMTJ6Ii8+PHBhdGggZD0iTTAtLjc1aDQ4djQ4aC00OHoiIGZpbGw9Im5vbmUiLz48L3N2Zz4='); background-size: 1.2rem; background-repeat: no-repeat; background-position: calc(100% - .1rem) center; width:240px; margin:.25rem 0; }
input[type="radio"], input[type="checkbox"] { position: relative; display: inline-block; /* Add if not using autoprefixer */ -webkit-appearance: none; /* Remove most all native input styles */ appearance: none; /* For iOS < 15 */ background-color: var(--white); /* Not removed via appearance */ margin: 0 .5em 0 0; font: inherit; color: var(--black); width: 22px; height: 22px; border: 1px solid var(--brun); border-radius: 50%; cursor: pointer; }
input[type="radio"]:checked, input[type="checkbox"]:checked { border-color: var(--black); }
input[type="checkbox"] { border-radius: 0.15em; }
input[type="radio"]::before, input[type="checkbox"]::before { position: absolute; top: calc(50% - 5px); left: calc(50% - 5px); display: block; content: ""; width: 10px; height: 10px; transform: scale(0); transition: 120ms transform ease-in-out; }
input[type="radio"]::before { border-radius: 50%; background-color: var(--black); }
input[type="checkbox"]::before { clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0%, 43% 62%); transform-origin: bottom left; box-shadow: inset 1em 1em var(--black); background-color: var(--black); }
input[type="radio"]:checked::before, input[type="checkbox"]:checked::before { transform: scale(1); }
input[type="radio"]:focus, input[type="checkbox"]:focus { outline: 1px solid var(--mainColor); outline-offset: 0; }

textarea { width: 100%; height:10rem; }
.checkbox label { display:inline; }
.code-image { clear:both; text-align: left; }
form .code-image img { border:medium none; float:left; margin:0 1em 0 0; width:160px; border-radius:inherit; }
.code-image input { height:50px; width:160px; text-align:center; letter-spacing:0.3em; text-transform:uppercase; }
a.btn-reloadimgcode { display: inline-block; margin: 0 1em; padding: .1em .5em; font-size: .7em; line-height: 1.3; color: var(--black) !important; text-decoration: none; background-color: var(--white); border:1px solid var(--black); border-radius:.5em; text-align: center; }
a.btn-reloadimgcode:hover, a.btn-reloadimgcode:focus { color: var(--mainColor) !important; background-color: var(--white); border-color: var(--mainColor); }
input[type="submit"] { display: inline-block; margin: 1em 0; padding:.5em 1em; font-weight:700; color: var(--white); text-decoration:none; white-space:nowrap; background-color: var(--mainColor); border: 1px solid var(--red); cursor:pointer; }
input[type="submit"]:hover, input[type="submit"]:focus { color:var(--white); background-color: var(--mainColorBg); }
form button { font-family: 'LibreFranklin', Arial, Helvetica, sans-serif; font-size:1em; }


/* ======================================================
   HEADER
====================================================== */
#header { position: relative; width: 100%; height: auto; z-index: 10; }
#header .wrapper { padding:1rem 3%; background: var(--white); }
#header .inner { padding:0 1rem; height: 100%; max-width: 90rem; background-color:var(--mainColorBg); border-radius:.5em; }
#header .flex-grid { flex-flow: row nowrap; gap: 0; }
img.sigle { display:none; }
#header .flex-item { position: relative; margin: auto; padding:.75rem 0; width: auto; flex-grow: 0; z-index:2 }
#header div.flex-item:nth-child(1) { padding-left:36px; flex-grow:1; text-align: center }
#header div.flex-item:nth-child(2) { text-align:right; }
a#logo { position: relative; display:block; margin:0 auto; padding:0; max-width:150px; white-space:nowrap; transition:none; }
a#logo img { display:block; object-fit: contain; object-position: center; width:100%; height:100% }
.presentText { display: block; font-size:.8rem; text-transform:uppercase; letter-spacing:.2em; word-spacing:.2em }
/* Special HOME */
body.home a#logo { padding:.25rem 0; max-width: 580px; }
body.home #header div.flex-item:nth-child(1) { padding-left:0; }
/* Fixed */
#header.fixed { position: fixed; top: 0; left: 0; }
#header.fixed .flex-item { padding-top:.5rem; padding-bottom:.5rem }
body.home #header.fixed a#logo { padding:0; max-width:150px; }
#header.fixed .presentText { display:none; }


/* MENU */
button#toggle-menu { display:inline-block; position: relative; margin:0; padding:0; width: 36px; height: 36px; font-size: 1rem; font-weight:400; line-height: 1; color: var(--brun); background-color: inherit; border-radius: none; text-align:center; }
button#toggle-menu:hover, button#toggle-menu:focus { color: var(--mainColor); opacity:1 }
button#toggle-menu::before { display:block; font-family: 'pictos'; content: '\e800'; font-size: 1.2rem; line-height: 1; font-weight:normal; }
button#toggle-menu.active::before { content: '\e801'; }
button#toggle-menu span { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border-width: 0; }
#blk-menu { display:none; position:absolute; right:-1rem; top: 100%; padding:1rem 1.5rem; width:auto; background-color: #fff; border-radius:.5em; text-align:left; z-index:3 }
#blk-menu.active { display:block; box-shadow:0px 2px 5px rgba(0, 0, 0, 0.5); }
.menu { position: relative; margin:0; }
.menu a { position: relative; display: inline-block; padding:.5rem 0; width: 100%; font-size: 1rem; line-height:1; font-weight:400; color:var(--mainColor); text-decoration:none; white-space:nowrap; }
.menu > li { position: relative; display: block; margin: .5rem 0; padding: 0; list-style: none; }
.menu li > a:hover, .menu li > a:focus, .menu li:focus-within > a, li.active > a { color:var(--mainColor); }
a.link-menu::after { display:block; position:absolute; bottom:0; left:0; width:0; height:2px; background-color:var(--mainColor); content:'' }
a.link-menu:hover::after, a.link-menu:focus::after { width:100% }
li.active a.link-menu::after { width:100% }


/* ======================================================
   MAIN, CONTENT
====================================================== */
main { position: relative; background-color: var(--white); z-index:1; }
section { position: relative; }
.wrapper { position: relative; margin: 0; padding: 0 3%; }
.inner { position: relative; margin: 0 auto; max-width:32rem; text-align:center; }
.content { position: relative; padding: 2.5rem 0; z-index:5; }
.flex-grid { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; flex-flow: row wrap; -webkit-box-pack: start; justify-content: flex-start; align-items: flex-start; align-content:flex-start; gap:2rem; }
.flex-item { position: relative; width: 100%; flex-grow: 0; border-radius:1em; }
.mainImg { border:2px solid var(--brun); border-radius:1em; }
.text { margin:0 auto 3em 0; padding:0; text-align:left; }
.text video { max-width: 100%; }
.text p, .text ul { margin:1em 0; text-align: justify; text-justify: auto; word-break: break-word; -webkit-hyphens: auto; -moz-hyphens: auto; -ms-hyphens: auto; -o-hyphens: auto; hyphens: auto; }
.text p.center { text-align:center; }
.text p:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; }
.text > div { margin:1.5em auto }
.text ul.flex-grid li { margin: 0; padding: 1rem; list-style: none; }
.text .flex-item { text-align:center; }
.text blockquote { margin: 0 auto; max-width: 40rem; padding: 0 2rem; font-family:"jovial", Georgia, serif; font-size: 1.5rem; line-height: 1.2; font-weight:700; color: var(--mainColor); }
.text blockquote em { font-size:1rem }

/* HOMEPAGE */
.home main .inner { max-width:90rem; }
ul.blk-btns { gap:.5rem 3% }
ul.blk-btns li { display:block; margin:0 auto; padding:0; list-style:none; }
ul.blk-btns a.button { display:block; }
ul.blk-btns li:nth-child(1) a.button { color:var(--mauve); background-color:var(--brun); }
ul.blk-btns li:nth-child(2) a.button { color:var(--mainColor); background-color:var(--mainColorBg); }
.home h1 { margin:1rem auto; font-family:'Baker', serif; font-size:2.8rem; line-height:.85; font-weight:normal; }
.home h2 { margin:1em auto; max-width:50rem; font-family:'LibreFranklin', Arial, Helvetica, sans-serif; font-size:inherit; line-height:1.5; font-weight:500; color:var(--turquoiseDark); text-transform:uppercase; letter-spacing:.2em; word-spacing:.2em }
.flex-grid.projects { margin:2em auto; align-items:stretch; }
a.project { display:flex; flex-direction:column; background-color:var(--sable); border:2px solid var(--brun); border-radius:1em; text-decoration:none; }
.blk-img { position: relative; width: 100%; height: 47vw; border-radius:1em 1em 0 0; overflow: hidden; }
.blk-img img { object-fit: cover; object-position: center; width: 100%; height: 100%; transform: scale(1); transition: transform ease-out 0.2s; }
a.project .infos { position: relative; padding:1rem 1rem 0 1rem; font-size:.8rem; line-height:1.2; color:var(--black); text-align:left; flex-grow:1; }
a.project h3 { margin:.1em 0 .5em; font-size: 1.8rem; line-height:1; }
a.project:hover, a.project:focus { border-color:var(--mainColor); transition: transform ease-out 0.2s; }
a.project:hover img, a.project:focus img { transform: scale(1.1); transition: transform ease-out 0.2s; }
.blk-finance { padding:1rem; font-size:.8rem; color:var(--black) }
.flex-grid.financialInfo { gap:0 .5rem }
.flex-grid.financialInfo .flex-item { width:auto; text-align:left; flex-grow:1 }
.flex-grid.financialInfo div.flex-item:nth-child(4) { text-align:right; }
div.graph { position:relative; width:100%; height:16px }
div.graph div.total { width:100%; height:16px; background-color:var(--brun); border-radius:8px }
div.graph div.received { position: absolute; top:0; left:0; width:0px; height:16px; background-color:var(--turquoiseDark); border-radius:8px }
div.statut { position:absolute; display: inline-block; top:-.75rem; right:1rem; padding:.25rem 1.5rem; font-weight:500; text-transform:uppercase; letter-spacing:.2em; border-radius:1em }
div.statut.en-cours { color:var(--mainColorBg); background-color:var(--mainColor); }
div.statut.atteint { color:var(--mauve); background-color:var(--brun); }
div.statut.realise { color:var(--mainColor); background-color:var(--turquoiseDark); }
div.statut.en-cours::before { content:'En cours'; }
div.statut.atteint::before { content:'Atteint'; }
div.statut.realise::before { content:'Réalisé !'; }

/* SECTION FRONTPAGE */
#content.wrapper { margin-top: -3rem; }
.section-frontpage h1, .single-page h1 { margin: 0 auto; padding: 1rem; max-width: 42rem; font-size: 2rem; line-height: 1; background-color: var(--white); }
.section-frontpage h2, .single-page h2, .section-frontpage h3, .single-page h3, .section-frontpage h4, .single-page h4 { margin: 0 auto; padding: 1rem 0 0; max-width: 42rem; }

/* SPECIFIC */
.projets main .inner { max-width:90rem; text-align:left; }
.lnk-contreparties { display:block; margin:.5rem auto; color:var(--brun); text-align:center; }
.ctn-projet a.button { display:block; text-align:center; }
.ctn-projet h1 { font:700 2.5rem/1 'TrdGotBC20', Arial, Helvetica, sans-serif; }
.ctn-projet h2 { margin: 1.5rem 0 0; font:700 2rem/1 'TrdGotBC20', Arial, Helvetica, sans-serif; color:var(--mainColor); }
.ctn-projet .pretitle { margin:3em 0 0; padding:1em; font-size: 1.2rem; font-weight:500; color: var(--mainColor); text-transform: uppercase; letter-spacing:.2em; background-color:var(--mainColorBg); text-align:center; }
.ctn-projet .merci { margin:3em 0 0; font:700 2rem/1 'TrdGotBC20', Arial, Helvetica, sans-serif; color:var(--mainColor); }
.ctn-contreparties h2 { margin:5rem 0 0; font-size:1.8rem; color:var(--brun) }
.blk-contrepartie { margin: 1.5em auto; max-width: 35em; color:var(--black); background-color:var(--sable); border:2px solid var(--brun); border-radius:1em; }
.blk-contrepartie a { display: block; color: var(--black); text-decoration:none; }
.blk-contrepartie h3 { margin:0; padding:.75rem 1rem 0 1rem; font-size: 1.8rem; line-height:1; color:var(--brun); }
.blk-contrepartie div { margin:1em 0; padding:0 1rem; font-size:.8rem; line-height:1.2 }
.blk-contrepartie div.blk-img { margin:0; padding:0 }
.blk-contrepartie .montantDon { font:700 2rem/1 'TrdGotBC20', Arial, Helvetica, sans-serif; color:var(--brun); }
.blk-contrepartie a:hover img, .blk-contrepartie a:focus img { transform: scale(1.1); transition: transform ease-out 0.2s; }
.ctn-table { overflow-x:auto; }
table.tbl-budget { margin:1.5em 0; padding:0; width:100%; background-color:var(--sable); }
td, th { padding:.5rem 1rem; text-align:right; border:2px solid var(--brun); }
td:first-child { text-align:left; }
tr.row-total td { font-weight:700; background-color:var(--mauve); }
.text p.ctn-btnSubmit { margin:2em 0 }

/* ======================================================
   FOOTER
====================================================== */
footer.wrapper { padding-top:3em; }
footer .inner { padding-top:3em; padding-bottom:3em; max-width: 90rem; line-height:1.2; text-align:center; border-top:2px solid var(--mainColorBg); }
footer a { text-decoration:none; }
footer a:hover, footer a:focus { text-decoration:underline; }
.blk-dataprivacy { margin-bottom:1.5rem; }
.copyright { font-size:.8rem; }
.signature { font-size:.8rem }
#blk-cookies { position: fixed; clear: both; padding: 1rem; bottom: 0; width: 100%; color: #fff; text-align: center; background-color: var(--white); box-shadow: 0 -10px 15px 1px rgba(0,0,0,.2); z-index: 101; }
a.btn-cookies-accept { display: inline-block; margin-left: .5rem; font-weight:500; color: var(--mainColor); background-color: #fff; }
a.btn-cookies-accept:hover, a.btn-cookies-accept:focus { color:#fff; background-color:var(--mainColor); }

.debug { display: none; }

/**=====================================================
   ECRANS taille moyenne : tablettes, petits notebooks
====================================================== */
@media (min-width:768px) {
    .ctn-projet h1 { font-size:3.5rem; line-height:.9; }
    .ctn-projet h2 { font-size:2.5rem; line-height:.9; }
    .ctn-projet .merci { font-size: 2.5rem }
    .blk-contrepartie .montantDon { font-size:2rem }
    a#logo { max-width:180px; }
    body.home #header.fixed a#logo { max-width:150px; }
    .flex-grid { gap:1.5rem 3%; }
    .flex-item { width: 48.5%; }
    .text .flex-grid { gap:0 10%; }
    .text .flex-item { width: 45%; flex-grow:0; }
    .flex-item.ctn-projet { width:100% }
    .flex-item.ctn-contreparties { width:100% }
    a.project .blk-img { height: 24vw; }
    .debug { display: block; } 
}

/**=====================================================
   ECRANS + grands
====================================================== */
@media (min-width:1280px) {
  .ctn-projet h1 { font-size:4rem; line-height:.9; }
  .ctn-projet h2 { font-size:2.5rem; line-height:.9; }
  .ctn-projet .pretitle { font-size: 1.4rem }
  .ctn-projet .merci { font-size: 2.5rem }
  .ctn-contreparties h2 { margin:0; font-size: 1.8rem; line-height: 1.4; }
  .blk-contrepartie .montantDon { font-size:2.5rem }
  body.home img.sigle { display: block; position:absolute; top:0; right: 5%; width: 25%; height: 100%; object-fit:cover; object-position:right center; z-index:1 }
  body.home #header.fixed img.sigle { display:none; }
  .flex-item { width: calc(94% / 3); }
  .blk-img { height:16vw; }
  a.project .blk-img { height: 16vw; }
  .flex-grid.projet { flex-flow:nowrap; justify-content:center; gap:2rem 5% }
  .flex-item.ctn-projet { width:auto; max-width: 40rem; flex-grow:1 }
  .flex-item.ctn-contreparties { width:480px }
  .lnk-contreparties { display:none; }
}
@media (min-width:1400px) {
  html { font-size:120%; }
}
@media (min-width:1600px) {
  html { font-size:130%; }  
}
@media (min-width:2000px) {
  html { font-size:150%; }
}

/**=====================================================
   ORIENTATION PAYSAGE UNIQUEMENT
====================================================== */
@media (orientation: landscape) {

}