* {box-sizing: border-box;margin:0;padding:0;}

:root {
  --bleu-principal:rgba(194,212,234,1);
  --bleu-ecriture:rgba(42,70,104,1);
  --link-bleu:rgba(32,60,94,1);
  --vert-clair-alt:rgba(194,234,229,1);
  --bleu-fonce-alt:rgba(99,130,170,1);
}



body {
  font-family:Arial, sans-serif;
  color:var(--bleu-ecriture);
  font-weight:400;
  background: #fff;
  font-size:20px;
}

nav {margin:0px 0 10px 0;padding:5px 0;font-weight:bold;background:#200d9b;text-align:center;}
nav a {text-transform:uppercase;text-decoration: none;color:#fff;display:block;}
nav a:hover {text-decoration: underline;color:#fff;}
nav a:not(:first-child) {padding:3px 3px;}
nav a:first-child {padding:3px 3px 3px 0px;}

p {
  font-size:1.1rem;
  line-height:1.7rem;
  padding:1% 0;
}

a {color:var(--link-bleu);}
a:hover {color:var(--link-bleu);}

#gauche a {color:var(--link-bleu);}
#gauche a:hover {color:var(--link-bleu);}

p.red {color:#b71e4d;font-weight:bold;}

#gauche {
  color:var(--bleu-ecriture);
  padding:3%;
  text-align: center;
}

#gauche #filtres {display:none;}

#droite {
  padding:3%;
  width:100%;
}

div.une-carte {
  padding:4% 4%;
  margin:0.5%;
  border:2px solid var(--bleu-fonce-alt);
  background:#fff;
  border-radius:35px;
  
}

div.une-carte p {font-size:1.2rem;font-weight:bold;line-height:1.4rem;}

div.une-carte p.argument {
  border-radius:5px;
  font-size:0.9rem;
  margin:0px 0 0 0px;
  padding:0.75% 1.5%;
  display:inline-block;
}

#droite div.une-carte h3 {margin-top:5px;margin-bottom:10px;font-size:1.6rem;}
div.une-carte p.argument:nth-of-type(2) {margin-top:5px;}
div.une-carte span.date {font-weight:900;font-size:1rem;}
div.une-carte .detail {margin-top:5px;font-weight:400;font-size:1rem;}

p.style-one {background:#d8cce2;}
p.style-two {background:#c0e0c0;}
p.style-three {background:#DBEDDB;}
p.style-four {background:#ddc7c9;}
p.style-five {background:#dedede;}

p.bleu {color:var(--bleu-ecriture);}

#main-conteneur {padding:0%;}

#logo {padding:5% 12%;width:50%;display:block;margin:0 auto;}

@media only screen and (min-width: 1024px) {
  #conteneur-principal {
    display:flex;
    justify-content: space-between;
    align-items:flex-start;
  }

  #gauche {width:31%;padding:2% 2%;text-align:left;}
  #gauche #filtres {display:block;}
  #gauche img {width:100%;max-width:100%;}

  #conteneur-principal {padding:0 0.5% 0 0;}

  div#droite {
    margin-top:1%;
    width:69%;
    padding:0;
  }

  section.mois {
    margin-top:1%;
    display:block;
    padding:0;
  }

  div.une-carte {width:90%;}

}

#gauche h1 {
  font-family:Arial, sans-serif;
  font-weight:900;
  font-size:2rem;
  padding-bottom:3%;
}

@media only screen and (min-width: 1024px) {
  #gauche h1 {font-size:3.3rem;}
  #gauche p {padding-right:70px;}
}
#gauche h2 {
  font-size:1.8rem;
}

#droite h2 {
  font-size:2.4rem;
  font-weight:900;
 color:var(--bleu-ecriture);
}

#gauche h3, #droite h3 {margin-top:25px;margin-bottom:5px;font-size:1.4rem;}



footer {
  margin:2% auto 0 auto;
  padding:1% 0 2% 0;
  text-align:center;
  background:#fff;
  
}

footer p {line-height:2rem;font-size:0.9rem;width:90%;}

hr {margin:30px 0;background:var(--bleu-fonce-alt);height:2px;color:var(--bleu-fonce-alt);}

ul {margin-left:20px;}

ul li {line-height:1.4rem;font-size:0.9rem;}

.arrow {border:2px solid #ca3489;border-radius:50%;height:20px;width:20px;display:inline-block;text-align:center;line-height:17px;}


h2 {margin-top:30px;}
label {margin:13px;display:block;}

.detail_link {text-align:right;}

.ifs-bouton {
  background:#055686;
  color:#fff;
  display:block;
  width:300px;
  text-align: center;
  text-decoration: none;
  text-transform: uppercase;
  font-weight:bold;
  display:inline-block;
  width:auto;
  padding:14px 25px;
  transition:0.3s;
  font-size:1.1rem;
}

.ifs-bouton:hover {background:#f74a4a;color:#fff;}