@font-face {
    font-family: 'Attentica';
    src: url('Attentica 4F UltraLight UNIT V5.otf') format('opentype');
}

@font-face {
    font-family: 'DIN pro';
    src: url('DIN Pro Condensed Medium.otf') format('opentype');
}

@font-face {
    font-family: 'LeMonde';
    src: url('LeMondeSans-Light.ttf') format('truetype');
}

:root {
  --custom-red: #9b3324;
}

html
body {
    font-family: 'LeMonde';
    text-align: justify;
}

h1,
h2,
h3,
h4,
h5 {
    font-family: 'Attentica';
    letter-spacing: 3%;
}

h1 {
    font-size: 4rem;
}

h2 {
    font-size: 3.2rem;
}

h3 {
    font-size: 2.5rem;
}

h5 {
    font-size: 1.8rem;
    font-weight: bold;
}

h6 {
    font-size: 1.1rem;
    font-weight: bold;
}

figcaption {
    font-style: italic;
    text-align: center;
}

/* -- QUARTO -- */
.border {
    border: 3px solid var(--custom-red) !important;
    padding: 10px;
}

.callout {
    border-radius: 0;
}

.callout-header {
    font-family: 'Courier New';
}

.callout.callout-style-simple {
    border: 1px solid var(--custom-red);
}

div.callout.callout {
    border-left-color: var(--custom-red);
}

.callout-title-container {
    position: relative;
    visibility: hidden;
}

.callout-title-container::after {
    color: var(--custom-red);
    font-size: 2.2em;
    font-weight: bold;
    visibility: visible;
    position: absolute;
    bottom: -5px;
    left: 0;
    content: "+";
}

.callout.callout-titled .callout-toggle::before {
  background-image: none;
  content: "˅";
  color: var(--custom-red);
  line-height: 1;
  font-style: normal;
  display: inline-block;
  font-size: 1.5rem;
  font-weight: normal;
  transition: transform 0.2s ease;
}

.sidebar {
    text-align: left;
}

.footnotes {
    color: var(--custom-red);
    text-align: left;
}

@media (width >= 640px) {
    .border {
        margin: 0 60px;
    }
  
    .callout.callout-style-simple {
        margin-left: 40px;
    }
}
/* -- END OF QUARTO -- */

.margin-left {
    margin-left: 80px;
    margin-top: 30px;
    margin-bottom: 30px;
    font-family: 'DIN pro';
}

.rouge {
    color: var(--custom-red);
}

#bibliographie {
    text-align: left;
}