body {
    background: url("../images/fondpage.png");
    background-color: #000;
    font-family: Calibri, sans-serif;
    margin: 0;
    padding: 0;
    max-width: 1000px;
    margin: 0 auto;
    height: 100%;
}

html
{
	overflow-y:scroll; /* Force l'ascenceur en permanence */
    height: 100%;
}

.container {
    display: grid;
    grid-template-rows: 80px 80px 1fr 1fr 1fr 1fr 1fr 1fr;
    gap: 20px;
    height: 2800px;
}

.header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1px;
    border-radius: 10px;
    color: #CC6600;
    /*border: 1px solid red;*/
}

.logo-text {
    display: flex;
    align-items: center;
}

.logo {
    max-width: 50px;
    max-height: 50px;
}

.brand-name {
    font-family: 'CalligraffitiRegular', cursive;
    font-size: 2em;
    margin-left: 15px;
}

.menu ul {
    list-style: none;
    display: flex;
    margin: 0;
    padding: 0;
}

.menu li {
    margin-left: 10px;
}

.menu a {
    text-decoration: none;
    font-size: 1.1em;
    color: #CC6600;
}

.menu a:hover
{
    color: #91c0f0;
    border-bottom: 2px solid white;
}

.titre h1{
    color: #CC6600;
    /*border: 1px solid yellow;*/
}


/*Largeur de l'Aside contenant les images*/
.main-content {
    display: grid;
    grid-template-columns: 0.2fr 2.8fr;
    grid-template-rows: 350px 300px;
    gap: 10px
}

aside {
    display: grid;
    align-items:flex-start;
    margin : 0;
    padding: 0px;
    /*border: 1px solid green;*/
  }


/*Section contennant le texte descriptif*/
.content {
    margin-left: 20px;
    margin-top: 0;;
    color: white;
    /*padding: 10px;*/
    flex-grow: 200px;
    list-style: none;
    text-align: justify;
    /*border: 1px solid #316a8b;*/
}
/*Pied de page intégrant la date de dernière modification et la barre horizontale*/
.footer {
    text-align: left;
    font-family: Calibri, sans-serif;
    color:#c60;
 }


.footer-content {
    display: flex;
    justify-content: space-between;
    align-items: center;
    max-height: 30px;
    margin-top: 5px;
}

.last-modified {
    font-size: 11px;
    color: #fff;
    max-height: 0.5em;
}

hr {
    margin-bottom: 0px; /* Réduit la marge inférieure */
}

.icons img {
    max-width: 45px;
    margin: 0 5px;
}

.copyright, .author {
    color:#c60;
    font-size: 1.2empx;
}

@media (max-width: 1000px) {
    .container {
        padding: 10px;
    }

    .header, .banner, .main-content, .footer {
        padding: 10px;
    }

    .main-content {
        grid-template-columns: 1fr;
    }
}