* {
margin: 0;
padding: 0;
font-family: serif;
color: #000000;
image-rendering: pixelated;
}

table, td, th {
vertical-align: top;
border: 1px solid;
border-collapse: collapse;
padding: 0.1em;
}

a, a code {
text-decoration: none;
color: #3030aa;
}

a:hover, a:hover code {
text-decoration: underline;
color: #ffffff;
background-color: #3030aa;
}

.center {
display: grid;
justify-content: center;
align-items: center;
}

footer {
position: fixed;
bottom: 0;
width: 100%;
}

.grid {
display: grid;
grid-template-columns: repeat(auto-fit, 5em);
grid-gap: 2em;
padding: 1em;
min-height: 100vh;
}

.file {
display: flex;
flex-direction: column;
align-items: center;
}

code {
font-family: monospace;
font-size: 1.15em;
background-color:#f0f0f0;
}

.file a {
color: #ffffff;
}

.file a:hover {
background-color: #ffffff;
color: #000000;
}

.content {
padding: 1.5em;
max-width: 50em;
}

.content img {
width: 100%;
margin: auto;
vertical-align: middle;
}

.nav_top {
display: flex;
justify-content: space-around;
align-items: center;
height: 3ex;
font-size: 2em;
font-weight: bold;
background-color: #3030aa;
}

.nav_top a {
color: #ffffff;
}

.nav_top a:hover {
background-color: #ffffff;
color: #3030aa;
}

.nav_bot {
display: flex;
justify-content: space-around;
align-items: center;
height: 3ex;
font-size: 1.5em;
background-color: #dfdfdf;
}

.nav_links {
list-style: none;
display: flex;
width: 100%;
margin-left: 2em;
margin-right: 2em;
}

.nav_links ul {
display: inline-block;
}

.nav_links a {
color: #000000;
}

.nav_links a:hover {
background-color: #000000;
color: #dfdfdf;
}

.bg_cloud {
background-image: url('/img/nuage.webp');
background-size: cover;
}

.bg_white {
background: #ffffff;
}

p {
text-align: justify;
text-justify: inter-word;
}

.invisible {
display: none;
}