@font-face { font-family: "Zilla Slab"; src: url("https://fonts.gstatic.com/s/zillaslab/v11/dFa6ZfeM_74wlPZtksIFajo6_Q.woff2") format("woff2"); font-style: normal; font-weight: 400; font-display: swap; unicode-range: U+0-FF, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Roboto"; src: url("https://fonts.gstatic.com/s/roboto/v30/KFOmCnqEu92Fr1Mu4mxK.woff2") format("woff2"); font-style: normal; font-weight: 400; font-display: swap; unicode-range: U+0-FF, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Roboto Condensed"; src: url("https://fonts.gstatic.com/s/robotocondensed/v25/ieVi2ZhZI2eCN5jzbjEETS9weq8-32meGCQYbw.woff2") format("woff2"); font-style: normal; font-weight: 700; font-display: swap; unicode-range: U+0-FF, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "PT Serif"; src: url("https://fonts.gstatic.com/s/ptserif/v18/EJRVQgYoZZY2vCFuvAFWzr8.woff2") format("woff2"); font-style: normal; font-weight: 400; font-display: swap; unicode-range: U+0-FF, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

body {
    margin: 0;
    width: calc(100vw - 1rem);
    border: solid .5rem #E90606;
    overflow-x: hidden;
}
a {
    color: #E90606;
    text-decoration: none;
}
*::selection {
    color: white;
    background-color: #E90606;
}
*:focus {
    outline: 2px solid #E90606;
}
figure {
    margin: 0;
}

header svg {
    margin: 5em auto;
    display: block;
}
#scroller_auto {
    width: 100%;
    background-color: #E90606;
    height: .5rem;
    position: fixed;
    z-index: 2000;
    bottom: 0;
    left: 0;
    transform-origin: left center;
    transform: scaleX(0);
    transition: transform 0.5s ease-in-out;
}

#article {
    /*max-width: 1120px;*/
    margin: 0 auto;
}

#article-tag {
    margin: 0 0 1em 0;
    text-transform: uppercase;
    font-family: "Roboto Condensed", sans-serif;
    text-align: center;
    font-size: .8em;
}
#article-titre {
    margin: 0 auto 1em auto;
    max-width: 840px;
    font-family: "Zilla Slab", serif;
    text-align: center;
}

#article #article_imageXL {
    margin-bottom: 3.5em;
}
#article #article_imageXL img {
    width: 100%;
}
#article_imageXL figcaption, #mapFigure figcaption {
    font-family: "Roboto", sans-serif;
    color: #a9a3a3;
    font-size: .8rem;
    max-width: 752px;
    width: 90vw;
    margin: 0 auto;
}
#article_imageXL figcaption a, #mapFigure figcaption a {
    color: rgba(233, 6, 6, 0.65);
}

#article-infosAuteurs {
    text-transform: uppercase;
    font-family: "Zilla Slab", serif;
    text-align: center;
    font-size: .8em;
    color: #918b8b;
}
#article-infosAuteurs p {
    margin: 0 0 .7em 0;
}

.articlePart {
    font-size: 1.15rem;
    line-height: 1.6em;
    max-width: 752px;
    width: 90vw;
    margin: 0 auto;
    font-family: "PT Serif", serif;
    position: relative;
}


.articlePart > p:first-child::first-letter {
    font-family: "Zilla Slab", serif;
    font-size: 2.7em;
    float: left;
    margin: 2px 14px 2px 4px;
    padding: 8px 2px 8px 5px;
}
.articlePart > p:first-child:before, .articlePart > p:first-child:after {
    content: "";
    background-color: #E90606;
    position: absolute;
}
.articlePart > p:first-child:before {
    height: .15rem;
    width: 2.2em;
    left: 0;
}
.articlePart > p:first-child:after {
    height: 2.7em;
    width: .15rem;
    left: 0;
    top: 0;
}
.articlePart_forDataviz {
    background-color: #191919;
}








#map {
    height: 464.762px;
}

#map_vue_options {
    display: flex;
    justify-content: center;
    padding: 1em 0 .5em 0;
    position: sticky;
    top: -.5em;
    background-color: white;
    z-index: 4000;
    height: 2em;
    overflow-x: visible;
}
#map_vue_options-select_region {
    border-radius: 0;
    border: none;
    padding: .4em;
    background-color: #E90606;
    color: white;
    font-family: "Roboto Condensed", sans-serif;
    width: 12rem;
}
#map_vue_options-select_region option {
    border-radius: 0;
    padding: .4em;
    margin: -4px;
    background-color: white;
    color: black;
    font-family: "Roboto Condensed", sans-serif;
}

#map_vue_options-select_region option:not(:first-child):hover {
    background-color: #F5B0AE !important;
    cursor: pointer !important;
}
#map_vue_options-select_region option:first-child {
    background-color: #E90606;
    color: white;
}
#map_vue_options-select_region-title {
    background-color: #E90606;
    cursor: default;
}
#map_vue_options-select_region {
    cursor: pointer;
}

.tooltip_region {
    border-radius: 0;
    border: solid 2px #E90606;
}
.tooltip_region p {
    margin: 0;
    font-family: "Roboto", sans-serif;
}
.leaflet-marker-icon {
    pointer-events: none !important;
}












.figure_dataviz {
    padding: 2em 0;
    color: white;
    width: 100%;
    position: relative;
}
#article .figure_dataviz figcaption {
    font-size: 1.2em;
    color: white;
    margin: 0;
    padding: 0 0 1em .6em;
    font-family: 'Zilla Slab';
    position: relative;
}
#article .figure_dataviz figcaption:before {
    content: "";
    background-color: #E90606;
    position: absolute;
    height: .8em;
    width: 2px;
    left: 0;
    top: .25em
}

#dataviz0_tooltip, #dataviz1_tooltip, #dataviz2_tooltip {
    font-size: 1rem;
    line-height: 1rem;
    background-color: #191919;
    border: solid 2px #E90606;
    position: absolute;
    opacity: 0;
    padding: .45em;
    font-family: 'Roboto';
    z-index: 12;
    pointer-events: none;
}
#dataviz0_year_input-label, #dataviz0_year_input-displayer {
    font-family: "Roboto", sans-serif;
}
#dataviz0_year_input-div {
    max-width: 520px;
    padding-right: .2em;
    margin: 0 auto .5em auto;
    display: flex;
    align-items: center;
}
#dataviz0_year_input {
    margin: 0 1em 0 1em;
    appearance: none;
    background: transparent;
    cursor: pointer;
    height: 1em;
    flex-grow: 4;
}
#dataviz0_year_input::-webkit-slider-thumb, #dataviz0_year_input::-moz-range-thumb {
    appearance: none;
    background-color: white;
    border: none;
    border-radius: 100%;
    height: 0.6rem;
    width: 0.6rem;
}
#dataviz0_year_input::-moz-range-track {
    appearance: none;
    background-color: rgba(255, 255, 255, 0.16);
    border-radius: 2em;
    cursor: pointer;
    height: .2em;
}
#dataviz0_tooltip {
    border-color: white;
}
#dataviz0 {
    max-height: 24em;
}
#dataviz1_titre {
    display: flex;
    justify-content: space-between;
}
#dataviz1_titre_lieu {
    margin-right: .3em;
    color: rgba(255, 255, 255, 0.6);
    font-style: italic;
}
#dataviz1_tooltip {
    max-width: 12em;
}
#dataviz2_tooltip {
    max-width: 70%;
    top: 40px;
    left: 50%;
    transform: translate(-50%, 0);
}
.dataviz_credits {
    font-family: "Roboto", sans-serif;
    color: #656161;
    font-size: .8em;
    text-align: right;
    line-height: 1em;
    margin: .8em 0 0 0;
}
.dataviz_notice {
    font-family: "Roboto", sans-serif;
    color: #656161;
    font-size: .8em;
    text-align: right;
    margin: .2em 0 0 0;
    line-height: 1em;
    display: block;
}










footer {
    max-width: 752px;
    width: 90vw;
    margin: 5em auto;
    font-family: "Roboto", sans-serif;
}
footer p {
    font-family: "Roboto Condensed", sans-serif;
    text-transform: uppercase;
    letter-spacing: .06em;
    font-size: 1.3em;
}
footer p:after {
    content: "";
    height: 2px;
    width: 100%;
    display: inline-block;
    background-color: #191919;
}