@media screen {
  :root {
    --ddf-ink: #16302b;
    --ddf-muted: #5d6f68;
    --ddf-line: #dfe8df;
    --ddf-paper: #ffffff;
    --ddf-soft: #f4f7ee;
    --ddf-mint: #cfe5c0;
    --ddf-green: #4d7d46;
    --ddf-blue: #477f99;
    --ddf-shadow: 0 22px 60px rgba(30, 58, 48, 0.12);
  }

  * {
    box-sizing: border-box;
  }

  html {
    min-width: 0 !important;
    background: var(--ddf-soft);
    scroll-behavior: smooth;
  }

  body {
    min-width: 0 !important;
    margin: 0 !important;
    padding: 28px 0 56px !important;
    background:
      radial-gradient(circle at 8% 0%, rgba(207, 229, 192, 0.55), transparent 32rem),
      linear-gradient(180deg, #f9fbf5 0%, #eef5ed 48%, #f7faf4 100%) !important;
    color: var(--ddf-ink) !important;
    font-family: "Avenir Next", Avenir, "Segoe UI", Arial, sans-serif !important;
    font-size: 16px !important;
    line-height: 1.65 !important;
  }

  a {
    color: #2f6d5b !important;
    text-decoration-thickness: 1px;
    text-underline-offset: 0.18em;
  }

  a:hover,
  a:focus {
    color: var(--ddf-blue) !important;
  }

  img {
    max-width: 100% !important;
    height: auto !important;
    border: 0 !important;
  }

  body > table[align="center"],
  body > table[width="950"] {
    width: min(1120px, calc(100% - 36px)) !important;
    margin-right: auto !important;
    margin-left: auto !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
  }

  body > table:first-of-type {
    overflow: hidden;
    border: 1px solid rgba(77, 125, 70, 0.14);
    border-radius: 24px 24px 0 0;
    background: rgba(255, 255, 255, 0.94);
    box-shadow: var(--ddf-shadow);
  }

  body > table:first-of-type > tbody,
  body > table:first-of-type > tbody > tr {
    display: block;
  }

  body > table:first-of-type > tbody > tr {
    display: grid;
    grid-template-columns: minmax(220px, 352px) minmax(0, 1fr);
    align-items: center;
    gap: 24px;
    padding: 22px 26px;
  }

  body > table:first-of-type td {
    width: auto !important;
    height: auto !important;
    background: transparent !important;
  }

  body > table:first-of-type h1 {
    margin: 0 !important;
    color: var(--ddf-ink) !important;
    font-size: clamp(1.1rem, 2vw, 1.85rem) !important;
    line-height: 1.12 !important;
    letter-spacing: 0 !important;
    text-align: right;
    font-weight: 750 !important;
  }

  body > table:first-of-type img {
    display: block;
    width: min(352px, 100%) !important;
  }

  body > table:nth-of-type(2) {
    background: #244b42 !important;
    border-right: 1px solid rgba(77, 125, 70, 0.14);
    border-left: 1px solid rgba(77, 125, 70, 0.14);
  }

  body > table:nth-of-type(2) > tbody,
  body > table:nth-of-type(2) > tbody > tr {
    display: block;
  }

  body > table:nth-of-type(2) > tbody > tr {
    display: grid;
    grid-template-columns: 170px minmax(0, 1fr);
    align-items: stretch;
  }

  body > table:nth-of-type(2) td {
    width: auto !important;
    height: auto !important;
    background: transparent !important;
  }

  .accueil,
  #menuHorizontal .niveau1 {
    font-size: 0 !important;
  }

  .accueil a,
  #menuHorizontal .niveau1 a {
    display: inline-flex !important;
    min-height: 50px;
    align-items: center;
    padding: 0 16px !important;
    color: #f7fbf3 !important;
    font-size: 0.76rem !important;
    font-weight: 760 !important;
    letter-spacing: 0.08em !important;
    text-decoration: none !important;
    text-transform: uppercase;
    transition: background-color 180ms ease, color 180ms ease;
  }

  .accueil a {
    width: 100%;
    justify-content: flex-end;
    background: #4f8749;
  }

  #zoneMenuHorizontal,
  #menuHorizontal,
  #menuHorizontal tbody,
  #menuHorizontal tr {
    display: block;
    width: 100% !important;
  }

  #menuHorizontal tr {
    display: flex;
    flex-wrap: wrap;
  }

  #menuHorizontal .separateur {
    display: none !important;
  }

  #menuHorizontal .niveau1.select a,
  #menuHorizontal .niveau1 a:hover,
  .accueil a:hover {
    background: rgba(255, 255, 255, 0.12);
    color: #ffffff !important;
  }

  body > table:nth-of-type(3) {
    overflow: hidden;
    border-right: 1px solid rgba(77, 125, 70, 0.14);
    border-left: 1px solid rgba(77, 125, 70, 0.14);
  }

  body > table:nth-of-type(3) > tbody,
  body > table:nth-of-type(3) > tbody > tr {
    display: block;
  }

  body > table:nth-of-type(3) td:first-child {
    display: none !important;
  }

  body > table:nth-of-type(3) td:last-child {
    display: block;
    width: 100% !important;
  }

  #wg_flash_home {
    display: block !important;
    width: 100% !important;
    height: clamp(220px, 28vw, 330px) !important;
    background:
      linear-gradient(100deg, rgba(22, 48, 43, 0.78) 0%, rgba(22, 48, 43, 0.44) 46%, rgba(22, 48, 43, 0.08) 100%),
      url("/scripts/files/5f46af7a16afa2.35933703/visuel-club-developpement-durable-w.jpg") center / cover no-repeat,
      linear-gradient(135deg, #244b42, #7aa15c);
  }

  #wg_flash_home:before {
    content: "Dirigeants responsables de l'Ouest Finistere";
    display: block;
    width: min(520px, 70%);
    padding: clamp(32px, 5vw, 70px) 34px;
    color: #ffffff;
    font-size: clamp(1.8rem, 4vw, 3.4rem);
    font-weight: 760;
    line-height: 1.02;
    letter-spacing: 0;
  }

  body > table:nth-of-type(4) {
    display: none !important;
  }

  body > table:nth-of-type(5) {
    background: var(--ddf-paper);
    border-right: 1px solid rgba(77, 125, 70, 0.14);
    border-left: 1px solid rgba(77, 125, 70, 0.14);
  }

  body > table:nth-of-type(5) > tbody,
  body > table:nth-of-type(5) > tbody > tr {
    display: block;
  }

  body > table:nth-of-type(5) > tbody > tr {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto 250px;
    align-items: stretch;
    border-bottom: 1px solid var(--ddf-line);
  }

  body > table:nth-of-type(5) td {
    width: auto !important;
    height: auto !important;
    background: transparent !important;
  }

  #zoneImpression {
    display: none !important;
  }

  #zoneChemin,
  #zoneTitreActu {
    padding: 14px 24px !important;
  }

  #chemin,
  #zoneTitreActu .entete {
    color: var(--ddf-muted) !important;
    font-size: 0.78rem !important;
    font-weight: 760 !important;
    letter-spacing: 0.08em !important;
    text-transform: uppercase;
  }

  body > table:nth-of-type(6) {
    overflow: hidden;
    background: rgba(255, 255, 255, 0.96);
    border: 1px solid rgba(77, 125, 70, 0.14);
    border-top: 0;
    border-radius: 0 0 24px 24px;
    box-shadow: var(--ddf-shadow);
  }

  body > table:nth-of-type(6) > tbody,
  body > table:nth-of-type(6) > tbody > tr {
    display: block;
  }

  body > table:nth-of-type(6) > tbody > tr {
    display: grid;
    grid-template-columns: 220px minmax(0, 1fr) 260px;
    gap: 0;
  }

  body > table:nth-of-type(6) > tbody > tr > td {
    width: auto !important;
    background: transparent !important;
  }

  body > table:nth-of-type(6) > tbody > tr > td[width="2"] {
    display: none !important;
  }

  #zoneMenuVertical {
    padding: 22px 18px !important;
    background: linear-gradient(180deg, #eef6e8 0%, #ffffff 100%) !important;
    border-right: 1px solid var(--ddf-line);
  }

  #zoneMenuVertical table,
  #zoneMenuVertical tbody,
  #zoneMenuVertical tr,
  #zoneMenuVertical td,
  #zoneCopyright table,
  #zoneCopyright tbody,
  #zoneCopyright tr,
  #zoneCopyright td {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    background: transparent !important;
  }

  #menuVertical .separateur,
  #zoneMenuVertical img[src*="shim"],
  #zoneCopyright img {
    display: none !important;
  }

  #menuVertical .niveau2 a,
  #menuVertical .niveau3 a,
  .mentionsLegales a {
    display: block !important;
    margin-bottom: 8px;
    padding: 10px 12px !important;
    border: 1px solid rgba(77, 125, 70, 0.15);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.78);
    color: var(--ddf-ink) !important;
    font-size: 0.9rem !important;
    font-weight: 680 !important;
    line-height: 1.25 !important;
    text-decoration: none !important;
  }

  #menuVertical .niveau2.select a,
  #menuVertical .niveau3.select a,
  #menuVertical a:hover,
  .mentionsLegales a:hover {
    background: #244b42;
    color: #ffffff !important;
  }

  #zoneCopyright {
    margin-top: 28px;
    padding-top: 18px;
    border-top: 1px solid var(--ddf-line);
  }

  #miseAJour,
  #copyright {
    color: var(--ddf-muted) !important;
    font-size: 0.78rem !important;
    line-height: 1.35 !important;
  }

  #contenuBg {
    padding: clamp(22px, 4vw, 44px) !important;
  }

  #contenuBg > table,
  #contenuBg > table > tbody,
  #contenuBg > table > tbody > tr {
    display: block !important;
    width: 100% !important;
  }

  #contenuBg > table > tbody > tr > td:first-child,
  #contenuBg > table > tbody > tr > td:last-child {
    display: none !important;
  }

  #contenuBg > table > tbody > tr > td {
    display: block !important;
    width: 100% !important;
  }

  #titrePage {
    margin-bottom: 26px !important;
    padding-bottom: 14px !important;
    border-bottom: 1px solid var(--ddf-line);
    color: var(--ddf-green) !important;
    font-size: 0.8rem !important;
    font-weight: 780 !important;
    letter-spacing: 0.11em !important;
    text-transform: uppercase;
  }

  #contenu {
    color: #273c36 !important;
    font-size: 1rem !important;
  }

  #contenu p {
    margin: 0 0 1rem !important;
  }

  #contenu ul,
  #contenu ol {
    padding-left: 1.25rem !important;
  }

  #contenu li {
    margin: 0.45rem 0 !important;
  }

  .cms_zone,
  .cms_bloc,
  .cms_bloc_text,
  .cms_bloc_media,
  .cms_bloc_file {
    width: 100% !important;
  }

  .cms_bloc_title {
    margin-top: 2rem !important;
    background: transparent !important;
  }

  .cms_bloc_title:first-child {
    margin-top: 0 !important;
  }

  .cms_bloc_title table,
  .cms_bloc_title tbody,
  .cms_bloc_title tr,
  .cms_bloc_title td {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    background: transparent !important;
  }

  .cms_bloc_title img {
    display: none !important;
  }

  .cms_bloc_title .titre {
    padding: 0 !important;
    background: transparent !important;
  }

  .cms_bloc_title h2 {
    margin: 0 0 1rem !important;
    padding: 0 0 0.7rem !important;
    border-bottom: 2px solid var(--ddf-mint);
    color: var(--ddf-ink) !important;
    font-size: clamp(1.35rem, 2.2vw, 2.2rem) !important;
    line-height: 1.14 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
    font-weight: 760 !important;
    background: transparent !important;
  }

  .cms_bloc_text_media_gauche,
  .cms_bloc_text_media_droite,
  .cms_bloc_text_media_centre {
    display: flow-root;
  }

  .cms_bloc_text_media_gauche .cms_bloc_media,
  .cms_bloc_text_media_droite .cms_bloc_media {
    max-width: min(42%, 270px);
    margin-bottom: 12px;
  }

  .cms_bloc_text_media_gauche .cms_bloc_media {
    float: left;
    margin-right: 22px;
  }

  .cms_bloc_text_media_droite .cms_bloc_media {
    float: right;
    margin-left: 22px;
  }

  .cms_bloc_media img:not([src*="shim"]):not([src*="titre_bg"]) {
    display: block;
    max-height: 420px;
    object-fit: contain;
    border-radius: 8px;
    background: #f8faf6;
  }

  .cms_bloc_file a {
    display: inline-flex !important;
    align-items: center;
    max-width: 100%;
    margin: 6px 0 18px;
    padding: 10px 14px !important;
    border: 1px solid rgba(77, 125, 70, 0.2);
    border-radius: 8px;
    background: #f7fbf3;
    overflow-wrap: anywhere;
    color: var(--ddf-ink) !important;
    font-weight: 700;
    text-decoration: none !important;
  }

  body > table:nth-of-type(6) > tbody > tr > td:last-child {
    padding: 24px 18px !important;
    background: #eef7fb !important;
    border-left: 1px solid var(--ddf-line);
  }

  #zoneActualite {
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
  }

  #zoneActualite table,
  #zoneActualite tbody,
  #zoneActualite tr,
  #zoneActualite td {
    display: block !important;
    width: 100% !important;
    height: auto !important;
  }

  .a_une_actu {
    margin: 0 0 16px !important;
    padding: 14px !important;
    border: 1px solid rgba(71, 127, 153, 0.18);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.78);
  }

  .actuDate {
    color: var(--ddf-blue) !important;
    font-size: 0.76rem !important;
    font-weight: 800 !important;
    letter-spacing: 0.08em !important;
  }

  .actuTitre a {
    display: block;
    margin: 4px 0 8px;
    color: var(--ddf-ink) !important;
    font-weight: 760 !important;
    line-height: 1.25 !important;
    text-decoration: none !important;
  }

  .actuResume,
  .actuEnSavoirPlus {
    color: var(--ddf-muted) !important;
    font-size: 0.88rem !important;
    line-height: 1.45 !important;
  }

  .actuImage img {
    width: 100% !important;
    max-height: 150px;
    object-fit: cover;
    margin-bottom: 8px;
    border-radius: 8px;
  }

  .spacer {
    height: 10px !important;
  }
}

@media screen and (max-width: 900px) {
  body {
    padding: 16px 0 32px !important;
  }

  body > table[align="center"],
  body > table[width="950"] {
    display: block !important;
    width: calc(100% - 24px) !important;
    max-width: calc(100% - 24px) !important;
  }

  body > table:first-of-type > tbody > tr,
  body > table:nth-of-type(2) > tbody > tr,
  body > table:nth-of-type(5) > tbody > tr,
  body > table:nth-of-type(6) > tbody > tr {
    display: block;
  }

  body > table[align="center"] > tbody,
  body > table[align="center"] > tbody > tr,
  body > table[align="center"] > tbody > tr > td,
  body > table[width="950"] > tbody,
  body > table[width="950"] > tbody > tr,
  body > table[width="950"] > tbody > tr > td {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  body > table:first-of-type h1 {
    margin-top: 12px !important;
    text-align: left;
  }

  .accueil a {
    justify-content: flex-start;
  }

  #menuHorizontal tr {
    display: block !important;
    width: 100% !important;
  }

  #menuHorizontal .niveau1,
  #menuHorizontal tbody,
  #menuHorizontal td {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  #menuHorizontal .niveau1 a,
  .accueil a {
    width: 100%;
    min-height: 42px;
  }

  #wg_flash_home:before {
    width: 100%;
    padding: 30px 24px;
  }

  #zoneChemin,
  #zoneTitreActu,
  #contenuBg,
  body > table:nth-of-type(6) > tbody > tr > td:last-child,
  #zoneMenuVertical {
    padding: 20px !important;
  }

  #zoneMenuVertical,
  body > table:nth-of-type(6) > tbody > tr > td:last-child {
    border: 0;
    border-bottom: 1px solid var(--ddf-line);
  }

  #zoneMenuVertical {
    display: none !important;
  }

  body > table:nth-of-type(6) > tbody > tr > td[width="2"] {
    display: none !important;
  }

  .cms_bloc_text_media_gauche .cms_bloc_media,
  .cms_bloc_text_media_droite .cms_bloc_media {
    float: none;
    max-width: 100%;
    margin: 0 0 14px;
  }

  #contenu table,
  #contenu tbody,
  #contenu tr,
  #contenu td,
  #contenu form,
  #contenu input,
  #contenu textarea,
  #contenu select {
    max-width: 100% !important;
  }

  #contenu table,
  #contenu tbody,
  #contenu tr,
  #contenu td {
    display: block !important;
    width: 100% !important;
  }

  #contenu input[type="text"],
  #contenu input[type="email"],
  #contenu input[type="tel"],
  #contenu textarea,
  #contenu select {
    width: 100% !important;
  }

  .cms_bloc_title h2 {
    background: transparent !important;
  }
}

@media print {
  body {
    background: #ffffff !important;
  }

  #zoneMenuVertical,
  #zoneActualite,
  #zoneImpression,
  #wg_flash_home {
    display: none !important;
  }
}