Grid align/justify problem

Can anyone tell me why Justify/ align in grid nor in flex
works in my .headline-grid at my @media premit?

My pen: https://codepen.io/nadav-himmelfarb/pen/pVpZRG

Thenk you all

What is it supposed to look like, given that the minute it looks like:

All that text-logo box with gray BG should be at the bottom and the BG should strach 100% wide…

In your class .headline-box change these: width: 100%;
top: 0; and
left: 0; point to top left corner i.e. element is 0px from left side of the document window and 0px from top side of document window. To change this try some other values in percentages or pixels.
Example:
top: 50%;
left: 20%;

Some on stack flow fixed it and this is his answer:

“body & html now has a height of 100% (always do this!)
header also has a height of 100%.
removed the image from your html and applied it as a background-image on your header.
your .headline-box now has bottom: 0, which now puts it at the bottom.”