/*  ---------  CSS generated for skin6-guppy-03 ----------- */
body { letter-spacing: 0.1em !important; }
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#feffff+0,ddf1f9+67,a0d8ef+100 */
background: linear-gradient(to bottom,  #feffff 0%,#ddf1f9 67%,#a0d8ef 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
.T0entrow0 { padding: 10px;background-color: #0F056B;}
.T0entrow3 { padding: 10px 25px;}
.T0entrow6 { display: none; }
div.quote span.labelcita { display: none; }
#MainContent { margin: 0 auto;padding: 10px 0 !important; }
.navbar.ddl .dropdown-menu > div, .navbar.ddl .dropdown-menu > div p { font-size: 1.8rem; }
.tbl.DDL69 { background-color: transparent; }
.navbar.ddl.DDL69 { max-width: 760px;margin: auto; }
.navbar.ddh.DDH74 { max-width: 640px;margin: auto; }
.tbl.DDH74 { background-color: transparent; }
.DDH74 ul.dropdown-menu { width: 262px; }
.nav-item.dropdown.DDH74 { margin: 0 !important; }
.tbl.DDV90 { background-color: transparent; }
.navbar.ddv { background-color: #A9EAFE !important;padding:1.5rem 0 !important; }
.dropdown-menu { color: #FFF !important; background-color: #CCFFFF !important;padding: 5px !important; }
.titrebox, .titre {font-variant: small-caps; }
.bord2 { border: 0; }
.lisubrubr { line-height: 3rem;background-color: #CCFFFF !important; }
.B0entrow1  { padding: 20px 40px !important; } 
@media screen and (min-width: 768px) and (max-width: 1080px){
.B0entrow2 .col-md-3 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 100%; }
/* Ajout MG */
*:not(.fa):not(.far):not(.fas):not(.soc-icon-last):not(.dispArrow) { font-family: Verdana, Arial, san-serif !important; }
#BottomBoxes .titre, #BottomBoxes .tbl, #BottomBoxes .titrebox, 
#BottomBoxes .tblbox { padding: 20px 40px !important; }
a { text-decoration:none !important; }
:root {
      --bg: #ffffff;
      --text: #1e2a38;
      --card-bg-a: #ffffff;
      --card-bg-b: #ffffff;
      --card-bg-jaune: #ffe0a0;
      --card-bg-gris: #bfbfbf;
      --card-bg-orange: #eead86;
      --border: #444000;
      --shadow: rgba(0,0,0,0.08);
      --hover-shadow: rgba(0,0,0,0.18);
      --gap: 0px;
      --padding: 0px;
    }

    @media (prefers-color-scheme: dark) {
      :root {
        --bg: #ffffff;
        --text: #e6e6e6;
        --card-bg-a: #ffffff;
        --card-bg-b: #ffffff;
        --card-bg-jaune: #ffe0a0;
        --card-bg-gris: #bfbfbf;
        --card-bg-orange: #eead86;
        --border: #333000;
        --shadow: rgba(0,0,0,0.4);
        --hover-shadow: rgba(0,0,0,0.7);
      }
    }

    body {
      margin: 0;
      padding: 0;
      font-family: "Segoe UI", Arial, sans-serif;
      background: var(--bg);
      color: var(--text);
    }

    h1 {
      text-align: center;
      padding: 40px 16px;
      margin: 4px;
      font-weight: 600;
    }

    .stack {
      display: flex;
      flex-wrap: wrap;
      gap: var(--gap);
      padding: var(--gap); /* padding Ã  gauche et droite */
      margin: 1px 0; /* modification pas de marge à droite et à gauche */
      width: 100%;
      box-sizing: border-box;
    }

    .card {
      flex: 1 1 calc(50% - var(--gap)/2);
      padding: var(--padding);
      border-radius: 0px;
      border: 1px solid var(--border);
      background: #ffffff;
      box-shadow: 4px 4px 4px var(--shadow);
      transition: transform 0.3s ease, box-shadow 0.3s ease;
      cursor: pointer;
      box-sizing: border-box;
    }

    .card.a { background: var(--card-bg-a); }
    .card.b { background: var(--card-bg-b); }
    .card.jaune { background: var(--card-bg-jaune); }
    .card.gris { background: var(--card-bg-gris); }
    .card.orange { background: var(--card-bg-orange); }

    .card:hover, .card:focus-within {
      transform: translateY(-5px) scale(1.02);
      box-shadow: 0 8px 5px var(--hover-shadow);
    }

    @media (max-width: 800px) {
      .card {
        flex: 1 1 100%;
        width: 100%;
      }
    }