.nav-bar-container{display:grid;grid-template-columns:repeat(24,1fr);grid-gap:2rem;gap:2rem;padding:1rem 2rem;background:var(--color-dark);border-bottom:.5px solid #fff;width:100%}.nav-bar-container>:first-child{grid-area:1/1/2/10}.nav-bar-container>:nth-child(2){grid-area:1/9/2/17}.nav-bar-container>:nth-child(3){grid-area:1/21/2/25}.nav-bar-container .nav-bar-logo{justify-content:start}.nav-bar-container .nav-bar-logo,.nav-bar-container .nav-bar-menu{display:flex;flex-direction:row;align-items:center;flex-wrap:nowrap;gap:var(--size-0_5-rem)}.nav-bar-container .nav-bar-menu{justify-content:center}.nav-bar-container .nav-bar-menu nav ul{width:400px;display:flex;flex-direction:row;justify-content:space-between;align-items:center;flex-wrap:nowrap;gap:var(--size-0_5-rem);list-style-type:none;background:var(--color-dark);border-radius:25px;border:2px solid #fff;padding:.2rem}.nav-bar-container .nav-bar-menu nav ul li button{background:var(--color-dark);border:3px solid var(--color-dark);border-radius:25px;padding:.5rem;color:#fff;cursor:pointer;min-width:80px;max-width:80px}.nav-bar-container .nav-bar-menu nav ul li button:focus{outline:none}.nav-bar-container .nav-bar-menu nav ul li button:focus,.nav-bar-container .nav-bar-menu nav ul li button:hover{border:3px solid rgba(0,0,0,0);background:linear-gradient(var(--color-dark),var(--color-dark)) padding-box,linear-gradient(90deg,var(--color-violet),var(--color-jaune)) border-box;background-clip:padding-box,border-box;border-radius:20px}.nav-bar-container .nav-bar-menu nav ul li button.selected{background:#fff;border:3px solid #fff;border-radius:25px;padding:.5rem;color:var(--color-dark)}.nav-bar-container .nav-bar-reseaux{display:flex;flex-direction:row;justify-content:end;align-items:center;flex-wrap:nowrap;gap:var(--size-0_5-rem)}@media(max-width:950px){.nav-bar-container{justify-items:center;align-items:center;gap:1rem;padding:1rem 2rem 1rem .7rem}.nav-bar-container>:first-child{width:-moz-fit-content;width:fit-content;height:30px;grid-area:1/1/2/25}.nav-bar-container>:nth-child(2){grid-area:2/1/3/25}.nav-bar-container>:nth-child(2) nav ul{width:360px}.nav-bar-container>:nth-child(2) nav ul li button{font-size:10px}.nav-bar-container>:nth-child(2) nav ul li button.selected{border-radius:20px}.nav-bar-container>:nth-child(3){display:none}}:root{--color-sable:#F4F1E9;--color-vert:#32D7A0;--color-jaune:#FFCC3A;--color-violet:#BB92F7;--color-dark:#333;--background:var(--color-sable);--foreground:var(--color-dark);--size-0_5-rem:0.5rem}body,html{max-width:100vw}body{background:var(--foreground);font-family:Arial,Helvetica,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;min-height:100vh}*{box-sizing:border-box;padding:0;margin:0}.app-container{display:flex;flex-direction:column}main{flex:1 1}footer{bottom:0;z-index:10;margin-top:1rem}header{position:-webkit-sticky;position:sticky;top:0;z-index:10}