/* Style interface scroll menu */
#projet {
    container-type: inline-size;
    container-name: images-wrapper;
}
@container images-wrapper (width < 1180px){

     .full-screen{
        grid-column: span 3;
        grid-row: auto;
    }
}

@media screen and (max-width: 920px) and (orientation: portrait){

    body{
        --font-size: 16px;
        --max-width: 100%;
    }
    
    #categories ul{
        border-bottom: none;
        gap: calc(var(--little-margin)/2);
    }
    #categories li{
        border: var(--border);
    }
    #projets{
        grid-template-columns: 1fr;
    }
    .projet:first-of-type{
        border-top: var(--border) ;
        padding-top: calc(var(--little-margin)/2);
    }
    .projet a{
        display: flex;
        flex-direction: column;
    }
    .projet > *{
        margin: 0;
        padding: 0;
    }
    #projets figure{
        margin-right: 0;
        margin-bottom: calc(var(--little-margin)/2);
    }
    .projet img, #otherprojects img{
        width: 100%;
    }
    .projet-carte, #otherprojects a{
        flex-direction: column;
        gap: 0;
    }

    .projet-tags{
        border-inline: 0;
        margin-block: calc(var(--little-margin)/2);
    }
    .projet-extrait{
        width: 100%;
    }

    #projet .images{
        gap: calc(var(--little-margin)/2)
    }
    #projet .image{
         grid-column: span 3;
    }
    #projet .images img{
        width: 100%;
        height: auto;
    }
}