/* =========================================================
   POLICES — conservées pour compatibilité avec le site
   ========================================================= */

@font-face {
    font-family: 'DejaVuSans';
    src: url('DejaVuSans.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'AA';
    src: url('Ace_Attorney.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'AA_eu';
    src: url('ace_attorney_eu.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'PW';
    src: url('Phoenix_Wright.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}


/* =========================================================
   THÈME
   ========================================================= */

:root {
    --bg: #F8F0A8;
    --accent: #4F5F62;
    --h2-color: #4F5F62;
}


/* =========================================================
   ÉLÉMENTS GÉNÉRAUX SPÉCIFIQUES AU SITE
   ========================================================= */

body {
    font-family: DejaVuSans, sans-serif;
}

a,
#ban a {
    color: #FFF45E;
    text-decoration: none;
}

a:hover,
#ban a:hover {
    color: rgb(244,255,241);
}


/* =========================================================
   MENU
   ========================================================= */

#menu a {
    background: var(--accent);
}

.sousmenu,
.sousmenu li {
    border-top: 1px solid black;
}

.menu,
.menu a,
.menu ul a {
    font-family: DejaVuSans, sans-serif;
}


/* =========================================================
   TITRES
   ========================================================= */

h1 {
    background-color: var(--accent);
    color: white;
}

h2 {
    text-transform: uppercase;
    color: var(--h2-color);
}

h3 {
    text-transform: uppercase;
}


/* =========================================================
   BANNIÈRES / STRUCTURE
   ========================================================= */

#ban,
#ban2 {
    background-color: var(--accent);
}

#bonus {
    background-color: rgba(235,267,169,0);
}

#linear {
    background-image: linear-gradient(
        var(--accent),
        rgba(235,267,169,0)
    );
}

#linear_bas {
    background-image: linear-gradient(
        rgba(235,267,169,0),
        var(--accent)
    );
}


/* =========================================================
   BLOCS SPÉCIFIQUES
   ========================================================= */

#bonus a {
    background-color: #E3BB80;
    color: var(--accent);
}

#bonus a:hover {
    color: white;
}

#retour a {
    background-color: #FFEDA9;
    color: var(--accent);
    font-family: DejaVuSans, sans-serif;
}

#retour a:hover {
    color: black;
}

#soon {
    color: black;
    font-family: DejaVuSans, sans-serif;
    font-weight: bold;
}

#causerie {
    color: black;
}


/* =========================================================
   BLOCS DE TEXTE / CODE
   ========================================================= */

.code {
    background-color: white;
    font-family: AA, AA_eu, PW, serif;
}

#texte {
    text-align: justify;
    background-color: rgba(255,255,255,0.6);
}