article.layout {
    display: flow-root; 

    
}

article.layout header.pageHeader{
    grid-area: header;
    margin-bottom: 0px;
}

article.layout picture {
    grid-area: picture;
    width: unset;
    height: unset;
    float: unset;
    background-color: unset;
    margin: 0px;
        
}



article.layout img {
    width: 100%;
    height: unset;
    margin: 0px;
}

article.layout .headline {
    grid-area: headline;
    margin: 0px;
}

article.layout .text {
    grid-area: text;
}



article.layout picture.sizeL {
    width: unset;
    height: unset;
}

article.layout.imageBOTTOM {
    border: 0px solid blue;
    display: grid;
    grid-template-areas:
        'header'
        
        'headline'
        'text'
        'picture';
    gap: 1em;
}

article.layout.imageRIGHT  {
    border: 0px solid black;
    display: grid;
    grid-template-areas:
        'header'
        
        'headline'
        'content';
    gap: 1em;
}




article.layout.imageRIGHT  picture {
    width: 140px;
    /*width: max(50%, 100px);*/
    float: right;
    margin-left: 1em;
    /*border: 1px solid #000000;*/
}

@media (max-width: 650px) {
    article.layout.imageRIGHT picture {
        float: unset;
        margin: 0px;
        
    }

    article.layout.imageRIGHT picture img {
        margin-bottom: 1em;
    }
} 


article.layout.imageTOP {
    border: 0px solid red;
    display: grid;
    grid-template-areas:
        'header'
        'picture'
        
        'headline'
        'text';
    gap: 1em;
}

article.layout.imageONLY {
    border: 0px solid green;
    padding: 0px;
}