html {
  font-size: 16px;
}

body {
  margin-top: 5px;
}

#page,
#page_main {
  max-width: 1200px;
  margin: 0 auto;
}

#page_main h1,
#page_main h2,
#page_main h3,
#page_main h4 {
  color: violet;
  font-weight: 700;
}

p,
ul,
main li,
footer,
header #date p,
header .headerpt3 span,
header .headerpt3 p,
footer .newsletter input {
  font-family: Garamond, serif;
}

h1,
h2,
h3,
h4,
h5,
header #date h4,
header .headerpt3 h1,
footer h3,
footer h4 {
  font-family: "Roboto", sans-serif;
  color: violet;
}

main h1 {
  font-size: 2rem;
}

main h2 {
  text-decoration: underline;
}

main h4,
.page_index .article_1 h4,
.page_index .article_4 h4,
.page_index .maind_haut h4 {
  font-size: 1.05rem;
  font-weight: 700;
  line-height: 1.2;
  margin-bottom: 0.3rem;
}

nav ul,
header li,
footer li,
footer ul {
  list-style: none;
  margin: 0;
  padding-left: 0;
}

header {
  border-bottom: 1px solid #bfbfbf;
  padding-top: 0.1rem;
  background: #fff;
}

header a,
.choix_pages a {
  text-decoration: none;
}

header a {
  color: inherit;
}

header .edition_nav li,
header .headerpt2 li,
header .choix_pages a {
  font-family: "Roboto Mono", monospace;
  font-size: 0.82rem;
  color: #111;
  letter-spacing: 0.02em;
}

header .sub button,
header .log button,
footer .newsletter button {
  border: none;
  font-weight: 700;
  border-radius: 0;
}

header .sub button,
header .log button {
  font:
    0.8rem "Roboto Mono",
    monospace;
  line-height: 1;
  background: #d783f2;
  border: 1px solid #d783f2;
  color: #111;
}

header #date h4 {
  margin: 0;
  font-size: 1rem;
  font-weight: 500;
  color: #111;
  line-height: 1.1;
}

header #date p {
  margin: 0.05rem 0 0;
  font-size: 0.9rem;
  color: #111;
  line-height: 1.1;
}

header .headerpt3 h1 {
  margin: 0.1rem 0;
  font-size: 3.8rem;
  font-weight: 400;
  color: #e08af5;
  line-height: 0.95;
  text-align: center;
}

header .headerpt2 li {
  font-size: 0.9rem;
  text-transform: none;
}

.chevron,
header .chevron {
  font-size: 0.7rem;
  color: #999;
}

header .double-line,
footer hr,
.footer-line {
  border: 0;
  opacity: 1;
}

header .double-line {
  border-top: 1px solid #a9a9a9;
  margin: 0.08rem 0;
}

.double-line {
  margin: 1px 0;
}

.choix_pages a {
  font-weight: 700;
  color: violet;
  font-size: 1.5rem;
}

header .choix_pages a {
  font-size: 1.05rem;
  font-weight: 700;
  text-transform: none;
  color: #e08af5;
}

.page_index #direct {
  color: red;
}

.page_index main p span,
.page_index .maind_haut .flexp p {
  font-size: 0.7rem;
}

.page_index .maind_haut h4 {
  font-size: 1.5rem;
}

.article_1 h4,
.article_2 h4,
.article_3 h4,
.article_4 h4,
.maing_bas_gauche h4,
.maing_bas_droite h4,
.maind_bas_gauche h4,
.maind_bas_droite h4 {
  margin-bottom: 0.1rem;
}

.article_1 p span,
.article_2 p span,
.article_3 p span,
.article_4 p span,
.maing_bas_gauche p span,
.maing_bas_droite p span,
.maind_bas_gauche p span,
.maind_bas_droite p span {
  display: inline-block;
  margin-top: 0.1rem;
}

.article_1 p,
.article_2 p,
.article_3 p,
.article_4 p,
.maind_haut p {
  margin-bottom: 0.35rem;
}

.les_3_articles hr,
.maing_haut hr,
.maind_haut hr {
  margin: 0.6rem 0;
}

.img_auteur #date_auteur p,
.page_custom select {
  color: violet;
}

main img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
}

.maing_bas_gauche img,
.maing_bas_droite img {
  width: 110px;
  height: 110px;
  object-fit: cover;
}

.maing_bas_gauche h4,
.maing_bas_droite h4 {
  margin: 0 0 0.2rem;
  line-height: 1.1;
}

.maing_bas_gauche p,
.maing_bas_droite p {
  margin: 0;
}

.maind_bas_gauche h4,
.maind_bas_droite h4 {
  font-size: 0.95rem;
  font-weight: 700;
  line-height: 1.25;
  max-width: 14rem;
}

.page_article #date_auteur {
  margin-top: 0.25rem;      
  line-height: 1.1;
}

.page_article #date_auteur p {
  margin: 0;      
  font-size: 0.9rem;
}

.page_article .articles > h2 {
  margin-top: 0.8rem;   
}

.page_custom .article_main {
  max-height: 330px;
  overflow-y: scroll;
}

.page_custom .widget_droit,
.page_custom .widget_gauche {
  border: 1px solid #e0c2f5;
  padding: 0.75rem 1rem;
  margin-top: 1rem;
  background: #faf5ff;
}

.page_custom .widget_droit label,
.page_custom .widget_gauche label {
  font-family: "Roboto Mono", monospace;
  font-size: 0.8rem;
  color: #555;
  margin-right: 0.4rem;
}

.page_custom .widget_droit input[type="color"],
.page_custom .widget_gauche input[type="color"],
.page_custom .widget_gauche select {
  border: 1px solid #d783f2;
  background: #fff;
  padding: 0.1rem 0.25rem;
  margin: 0.2rem 0.4rem 0.2rem 0;
}

.page_custom .widget_droit input[type="reset"],
.page_custom .widget_gauche input[type="reset"] {
  border: 1px solid #d783f2;
  background: #d783f2;
  color: #111;
  font-family: "Roboto Mono", monospace;
  font-size: 0.8rem;
  padding: 0.25rem 0.6rem;
  margin-top: 0.4rem;
}

.page_custom .widget_droit {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
}

.page_custom .widget_gauche {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.3rem 0.6rem;
}

footer {
  margin-top: 2.5rem;
  padding: 2rem 0 1.5rem;
  background: #fff;
  border-top: 1px solid #d3d3d3;
  color: #d9a2e8;
}

footer h3 {
  margin: 0 0 0.8rem;
  font-size: 1.1rem;
  font-weight: 700;
  color: #d88aed;
}

footer h4 {
  margin-bottom: 0.5rem;
  font-size: x-large;
}

.footer_bloc,
footer ul {
  display: block;
  text-align: left;
}

footer p,
footer li,
footer span {
  font-size: 1rem;
  color: #d9a2e8;
}

footer input,
footer button {
  border-radius: 0;
}

footer .newsletter input {
  border: 1px solid #8e8e8e;
  background: #fff;
  color: #666;
}

footer .newsletter button {
  border: 1px solid #db73e8;
  background: #db73e8;
  color: #111;
  font:
    700 1rem "Roboto",
    sans-serif;
}

footer .socials span,
.reseaux span {
  font-size: 1.25rem;
  color: #111;
}

footer hr,
.footer-line {
  border-top: 1px solid #d7d7d7;
}