/* ------------------- */
/* ----- HEADERS ----- */
/* ------------------- */

.header-bg-img, .header-bg-img-session {
    background-size: 100% auto;
    background-repeat: no-repeat;
    min-height: 65vh;
    overflow: hidden;
}

.header-bg-img { background-position: top; }
.header-bg-img-session { background-position: top; }

@media (max-width: 1200px) { .header-bg-img { background-size: 150% auto; } }
@media (max-width: 992px) { .header-bg-img { background-size: 200% auto; } }
@media (max-width: 576px) { .header-bg-img { background-size: 250% auto; } }
@media (max-width: 480px) { .header-bg-img { background-size: 300% auto; } }

.header-bg-characters {
    background-image:
            linear-gradient(rgba(40,0,0,0.5),rgba(40,0,0,0.5)),
            url('../assets/img/rubriques/personnages.jpg');
    background-position: center;
}

.header-bg-empire {
    background-image:
            linear-gradient(rgb(40,0,0,0.5),rgb(40,0,0,0.5)),
            url('../assets/img/rubriques/empire.jpg');
    background-position: center;
}

.header-bg-rules {
    background-image:
            linear-gradient(rgb(40,0,0,0.5),rgb(40,0,0,0.5)),
            url('../assets/img/rubriques/regles.jpg');
    background-position: center;
}

.header-bg-no-chapter {
    background-image:
            linear-gradient(rgb(40,0,0,0.5),rgb(40,0,0,0.5)),
            url('../assets/img/placeholders/na-chapter.jpg');
    background-position: center;
}

.header {
    position: relative;
    color: var(--white);
    text-align: center;
    margin-bottom: 0;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    min-height: 60vh;
}

.header-session {
    min-height: unset;
    background-position: top;
}

.chapter-number {
    font-size: 2rem;
    color: var(--white);
    margin: 0;
}
@media (max-width: 1200px) { .chapter-number { font-size: 2rem; } }
@media (max-width: 992px) { .chapter-number { font-size: 1.5rem; } }
@media (max-width: 576px) { .chapter-number { font-size: 1.25rem; } }
@media (max-width: 480px) { .chapter-number { font-size: 1rem; } }

.header hr {
    background-color: var(--white);
    height: 1px;
    margin-top: 0.5rem;
    margin-bottom: 0.5rem;
}