@Suleeyman
Posted
First of all, I would say that, don't use id attribute in common tag like <p> <h1>etc... Also, you are using sec value on your images (max-width: 45rem). Use width: 100% instead. Then the image will take 100% of his main parent.
Moreover, your are centering your icons with padding-left: 45%. Well you can simply add text-align: center on div.
And finally: why you use grid everywhere ? When the layout is from top to bottom (in this case in mobile design all items are from top to bottom) you don't have to. I think you have to review the basics, like
display: block; (div, header, main, nav, footer,... tags are all in display: blocks. Which means that they take 100% width of the parent element.),
display: inline-block,
display:inline ( "a" tags are inline, "span" also...)
