#image { width: 60px; height: auto; display:block; }
.navigation { position:relative; margin-left:30px; z-index:3; }
.navigation-toggle { position:relative; width:30px; height:20px; padding:0; border:0; background:transparent; cursor:pointer; display:block; }
.navigation-toggle span { position:absolute; left:0; width:100%; height:4px; background:white; transition:transform .4s ease, top .4s ease, opacity .4s ease; }
.navigation-toggle span:nth-child(1) { top:0; }
.navigation-toggle span:nth-child(2) { top:8px; }
.navigation-toggle span:nth-child(3) { top:16px; }
.is-open .navigation-toggle span:nth-child(1) { top:8px; transform:rotate(45deg); }
.is-open .navigation-toggle span:nth-child(2) { opacity:0; }
.is-open .navigation-toggle span:nth-child(3) { top:8px; transform:rotate(-45deg); }
.navigation-panel { position:absolute; top:28px; right:0; display:grid; grid-template-rows:0fr; transition:grid-template-rows .4s ease, visibility .4s; visibility:hidden; }
.navigation.is-open .navigation-panel { grid-template-rows:1fr; visibility:visible; }
.navigation nav { min-height:0; overflow:hidden; background:black; min-width:160px; text-align:left; }
.navigation nav a { display:block; color:white; padding:6px 15px; }
.navigation nav a:first-child { padding-top:10px; }
.navigation nav a:last-child { padding-bottom:10px; }
button { font:inherit; }
.home-centre { padding-right:0; }
.project-list { display:flex; flex-direction:column; width:min(400px, 90%); }
.project-list .lien { display:block; color:cornflowerblue; }
.film-toggle { display:block; width:100%; background:none; border:0; cursor:pointer; color:inherit; }
.unfilm .descfilm { display:block; white-space:pre-wrap; }
#galerie .image { max-width:calc(100% - 40px); height:auto; }
@media(max-width:720px){#galerie{width:100%}.image{min-width:0}.navigation-panel{right:-15px}}
@media (prefers-reduced-motion: reduce) { .navigation-toggle span, .navigation-panel { transition:none; } }