@media (min-width: 850px){
.project{
    display: grid;
    grid-template-columns: 33% auto;
    padding-left: 5vw;
    padding-right: 5vw;
    padding-top: 10vh;
    column-gap: 5vh;
}

.projectbox{
    display: flex;
    flex-direction: row;
    /* flex-wrap: nowrap; */
    justify-content: space-between;
    align-items: center;
}

.pimgsboxbox {
    display: grid;
    grid-template-columns: 1fr 1fr; /* zwei Spalten */
    column-gap: 5vh;
    overflow: hidden;
    width: 100%; /* sorgt dafür, dass das Grid sich an den Container anpasst */
}

.pimgsboxbox .pimgs {
    width: 100%; /* Bild nimmt ganze Spaltenbreite ein */
    height: auto;
    object-fit: cover; /* oder 'contain', je nach gewünschtem Zuschnitt */
    display: block; /* entfernt evtl. Zwischenräume durch Inline-Elemente */
}
}

@media (max-width:849px){
    .project{
        padding-left: 5vw;
        padding-right: 5vw;
        padding-top: 10vh;
    }
    
    .projectbox{
    display: flex;
    flex-direction: row;
    /* flex-wrap: nowrap; */
    justify-content: space-between;
    align-items: center;
    }

    .pimgsboxbox{
        display: flex;
        flex-direction: column;
        column-gap: 5vh;
    }
}




.pimgsbox {
    display: flex;
    flex-direction: column;
    gap: 5vw;
    padding: 5vw;
    overflow: hidden; /* Verhindert Überlauf */
}

.pimgs {
    max-width: 100%; /* verhindert Überlauf */
    height: auto;
    object-fit: contain;
    display: block;
}