/* Reset
-------------------------------------------------- */
a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:after,blockquote:before,q:after,q:before{content:'';content:none}table{border-collapse:collapse;border-spacing:0}
*, *:before, *:after{margin:0;padding:0;border:0;-webkit-box-sizing:border-box;box-sizing:border-box}
*{-webkit-tap-highlight-color: rgba(0,0,0,0);-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;-webkit-font-smoothing: antialiased;}
/* Hide scrollbar for Chrome, Safari and Opera */
html::-webkit-scrollbar {display: none;}
html {-ms-overflow-style: none;scrollbar-width: none;  /* Firefox */}


/* Réglages
-------------------------------------------------- */
img{display:block;width:100%;height:auto}
ul,li{list-style: none}
em{font-style:italic;}
strong{font-weight:bold}
u{color:black;text-decoration:underline;outline:0;text-decoration: underline;text-underline-offset: 3px;text-decoration-thickness: 1px;}


/* Liens
-------------------------------------------------- */
a{color:inherit;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:2px;transition:opacity .125s ease}
a:hover, a.active, h1 a:hover{opacity:.5}

/* Site
-------------------------------------------------- */
html{width:100%;min-height:100%}
body{width:100%;max-width:1920px;min-height:100%;background: transparent;color:white;overflow-x:hidden;font-family: georgia}
body, h1, h2, h3, h4{line-height:18px;font-size:16px}
body{align-items: flex-start;display: flex;flex-flow: column wrap }

/* Headings
-------------------------------------------------- */
h1, h2, h3, h4{line-height:18px;font-size:16px;display:inline-block;margin-bottom:0;text-transform: uppercase}
h1 a, h2 a, h3 a, h4 a{color:inherit;}
h1{width:100%;text-align:left;}

/* Main
-------------------------------------------------- */
ul{display:table;margin:18px 0}
ul:last-of-type{margin:0}
ul > li{display:table-row}
ul > li::before{content:"•";display:none;text-align:left;width:1em}
.draggable-article > p:not(:last-of-type){margin-bottom:1em}
.draggable-article > h2{margin-bottom:1em}
.draggable-article{opacity: 0;position:absolute;cursor:grab;background:#fbfaf7;padding:1.5em;z-index:1;border-radius:9px;max-width:400px;box-shadow:0 0 16px #00000080}
.draggable-article.fade-in {
   animation: fadeInArticle 0.5s ease forwards;
}

@keyframes fadeInArticle {
   from {
      opacity: 0;
      transform: translateY(20px);
   }
   to {
      opacity: 1;
      transform: translateY(0);
   }
}
.draggable-article.ui-draggable-dragging{z-index:9999!important}
.fullscreen-image{position:fixed;top:0;left:0;width:100vw;height:100vh;z-index:1;overflow:hidden}
.fullscreen-image img{position:relative;width:100%;height:100%;object-fit:cover;filter:grayscale(100%) contrast(1.2)}



.fullscreen-image {
   position: fixed;
   top: 0;
   left: 0;
   width: 100vw;
   height: 100vh;
   z-index: 1;
   background: #000;
}

/* Image */
.fullscreen-image img {
   width: 100%;
   height: 100%;
   object-fit: cover;
   opacity: 0;
   transition: opacity 0.6s ease;
}

.fullscreen-image img.lazyloaded {
   opacity: 1;
}

/* SVG Grain par-dessus */
.riso-grain {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   pointer-events: none;
   z-index: 999;
   mix-blend-mode: lighten;
   opacity: 1;
}




.video-background {
            position: fixed;
            top: 50%;
            left: 50%;
            min-width: 100%;
            min-height: 100%;
            width: auto;
            height: auto;
            transform: translate(-50%, -50%);
            z-index: -1;
            object-fit: cover;
        }

      

/* Lazyloading 
-------------------------------------------------- */
.lazyload, .lazyloading { opacity: 0;}
.lazyloaded { opacity: 1;transition: opacity .125s ease-in-out, filter .125s ease-in-out;}

/*--------------------------------------
-   MEDIA QUERIES
---------------------------------------*/
@media only screen and (max-width:680px){
   main{padding-top:18px}
   .draggable-article {
  opacity: 0;
      position: relative;
   color: white!important;padding:0 18px calc(18px*1) 18px;
background: none!important;box-shadow:none!important;border-radius:none!important
   }
   .draggable-article > h2 {
  margin-bottom: 18px;
}
   .draggable-article:last-of-type{padding-bottom:18px}
   
}