:root{
    --rowValue: 4;
}

body{
    background: #000019;
    color: #ffffff;
    text-align: left; 
}

.gridcontainer-top div:first-of-type{
    background: #004B9B;
}

.gridcontainer-middle{
    grid-template-rows: auto repeat(4,1fr);
    justify-items: start;
}

.gridcontainer-middle div:first-of-type{
    grid-row: 1 / span 5;
    background: #FFFFFF;
    padding: 10px;
}

.gridcontainer-middle *{
    color:#000000;
}

.item-headline{
    padding: 10px;
}

.item-middle-entry1{
    padding: 10px;
    margin-bottom: 20px;
}

.item-middle-entry2{
    padding: 10px;
}

.item-middle-entry3{
    padding: 10px;
}

.item-middle-entry4{
    padding: 10px;
}

@media screen and (min-width:481px)
{
    .gridcontainer-middle *{
        grid-column: 2 / span 4;
    }
}

@media screen and (min-width:768px)
{
    .gridcontainer-middle *{
        grid-column: 2 / span 7;
    }
}

@media screen and (min-width:1025px)
{
    .gridcontainer-middle *{
        grid-column: 3 / span 8;
    }
}