:root {
    --marges: 0.4em;
    --font-size: 1em;
}

html {}

body {
    font-size: var(--font-size);
    overflow-x: hidden;

}

div.welcome {
    /* transform: rotate(-2deg); */
    width: 100% !important;


}


.swiper {
    margin-left: auto !important;
    margin-right: 0 !important;
}

.swiper-wrapper {
    align-items: center;
}

.splash p {
    text-align: center;
}

ul.sublist a,
.stack,
.photos,
.videos {}

nav {
    padding-left: var(--marges);
    padding-right: var(--marges);
    overflow: hidden;
    /* usage du padding plutôt que margin pour éviter le dépassement des images de .stack */

}

ul.sublist a {
    animation: none;
}

nav .sublist {}


.container {
    overflow-x: hidden
}

ul.menu {

    grid-column: 2/13;
}

ul.sublist {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    top: 0;
    /* background-color: firebrick; */
    max-height: 100%;
    overflow: none;

    /* scroll-snap-type: y mandatory; */
    /* scroll-snap-stop: always; */
    grid-column: 1/13;
    position: relative;
    z-index: 00;
    grid-gap: 0em !important;
    pointer-events: auto;
}

ul.sublist#livres {
    padding-top: 0em;
}

.description {
    padding-right: 1em;
    font-size: 80%;
    line-height: 0.9;

    grid-column: 1/13;
    padding-left: 0;
}

.description>* {}

ul.sublist a {

    margin-left: 0em;

}

.photos {
    margin-bottom: 0.5em;
}

.photos,
.videos {
    display: grid;
    grid-column: 1/13;
    grid-template-columns: repeat(12, 1fr);
    /* grid-gap: 0.4em; */


}

ul.sublist p.type {

    grid-column: 3/12;
}

ul.sublist .list-item {
    grid-column: 4 /12;
}

div.list-item {
    width: 100%;

}

ul.sublist .list-item:not(.type) {
    padding-left: 0;
}

.stack {
    grid-column: 1/13;
    position: relative;

    z-index: 2000;
    mix-blend-mode: difference;


    height: auto;
    margin: auto;
    margin-bottom: 0.5em;
    /* left: calc((-100vw)/12); */
    margin-left: -2em !important;
    width: calc(100vw - var(--marges) * 2);
}

.containervideo {
    grid-column: 1/13;
    position: relative;

    z-index: 2000;

    padding: var(--marges);
    box-sizing: border-box;
    outline-offset: calc(var(--marges) * -1);
    z-index: 500;

}

.informations {
    display: block;
    text-align: center;
    margin: 1em 0 1em 0;
}

.informations p {
    margin: 0;
}

.about {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    grid-gap: var(--marges);
    row-gap: 0;
    margin-left: var(--marges);
    margin-right: var(--marges);
    font-size: 1.5em;


}

.about>* {

    display: block;

    text-decoration: none;
    color: var(--text-color);
    z-index: 200;


}

.containervideo {
    display: table-caption;
    height: 100%;
    padding-bottom: 0;
}

.about>p {
    margin: 0;
    bottom: 0;
    position: absolute;
    text-align: center;
    width: calc(100% - var(--marges)*2);

}

.about>p>a {
    text-decoration: none;
    color: var(--text-color);
}

.about>a:nth-child(1) {
    grid-column: 2/13;
    grid-row: 1;
}

.about>a:nth-child(2) {
    grid-column: 1/13;
    grid-row: 2;
    overflow-wrap: break-word;
}

.about>a:nth-child(3) {
    grid-column: 2/13;
    grid-row: 3;
    overflow-wrap: break-word;
}

.about>a:nth-child(4) {
    grid-column: 2/13;
    grid-row: 4;

}

.carte {
    width: 94vw;
    top: 6vh;
    left: 3vw;
    display: none;
}

@keyframes carte {
    0% {
        transform: translate(0vw, -50vh) rotate(-180deg);

    }

    100% {
        transform: translate(0, 0) rotate(-5deg);

    }
}



/* 

.stack img {
    transform: scale(0.6);
} */


.journal-img {

    pointer-events: all;
    max-width: 35vw;
    max-height: 35vw;
    width: auto;
    height: auto;
    position: absolute;
    animation-fill-mode: both;
    transition: transform 0.5s cubic-bezier(0.25, 1, 0.5, 1);
    outline: 1px dashed white;
}

.plyr--video {
    overflow: hidden;
    font-size: 40%;
}


.j-img:last-of-type {
    margin-bottom: calc(100vh - 95vh / 3 + (var(--marges))) !important;
    outline: none;

}



.plyr__controls {
    height: 0;
    margin-bottom: 0.2em;
}

.plyr--video .plyr__controls {
    background: none !important;
    mix-blend-mode: difference;
    font-size: 2.5em !important;
}

.plyr__volume {

    display: none;
}

.plyr__control svg {

    /* display: none !important; */
}

.plyr__menu {
    display: none !important;
}


.plyr__control--overlaid {
    background: none !important;
    border: 0;
    border-radius: 100%;
    color: #fff;
    color: var(--plyr-video-control-color, #fff);
    display: none;
    left: 50%;
    opacity: .9;
    padding: 15px;
    padding: calc(var(--plyr-control-spacing, 10px)*1.5);
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    transition: .3s;
    z-index: 2;

}

.plyr__control--overlaid svg {
    display: none !important;
}

.plyr--full-ui.plyr--video .plyr__control--overlaid {

    display: none !important;
}

.plyr--video .plyr__control:focus-visible,
.plyr--video .plyr__control:hover,
.plyr--video .plyr__control[aria-expanded=true] {
    background: none !important;
    color: #fff;
    color: var(--plyr-video-control-color-hover, #fff);
}

.plyr--full-ui.plyr--video .plyr__control--overlaid {}

.plyr__controls .plyr__controls__item:first-child::before {
    /* content: "JOUER"; */
}

.plyr__controls .plyr__controls__item:first-child>svg {
    display: none !important;
}

.plyr__controls .plyr__controls__item.plyr__time {

    font-size: 100%;
}

.plyr__control .plyr__control--overlaid {
    display: none !important;
}

[data-plyr="play"]::after {
    mix-blend-mode: difference;
    content: "Jouer";

}

[data-plyr="play"]::after,
[data-plyr=play].plyr__control--pressed:after {
    text-transform: uppercase;
}

[data-plyr=play].plyr__control--pressed:after {
    mix-blend-mode: difference;
    content: "Pause"
}

[data-plyr=mute].plyr__control {
    display: none !important;
}

.plyr__menu .plyr__control svg {
    display: none;
}

.plyr--video .plyr__progress__buffer {

    height: 1px;
    display: none;
}

.plyr__tooltip {
    /* display: none !important; */
}

.plyr--full-ui input[type="range"]::-moz-range-progress {

    height: 0px !important;
    outline: 0.5px solid white;
    mix-blend-mode: difference;

}

.plyr--full-ui input[type="range"]::-moz-range-thumb {
    background: #fff;
    background: var(--plyr-range-thumb-background, #fff);
    border: 0;
    border-radius: 0;
    box-shadow: 0 1px 1px #23282f26, 0 0 0 1px #23282f33;
    box-shadow: var(--plyr-range-thumb-shadow, 0 1px 1px #23282f26, 0 0 0 1px #23282f33);
    height: 13px;
    height: var(--plyr-range-thumb-height, 13px);
    position: relative;
    -moz-transition: all .2s ease;
    transition: all .2s ease;
    width: 1px !important;
    width: var(--plyr-range-thumb-height, 13px);

}

.plyr--full-ui.plyr--video input[type="range"]::-moz-range-track {


    height: 0px !important;
    outline: 0.5px dashed;
}

.vjs-looping .vjs-loading-spinner {
    display: none;
}