.home { display: flex; flex-direction: column; text-align: center; } .avatar { border-radius: 20%; } #title { font-size: 2.3em; } p { font-size: 1.1em; } .description { line-height: 0.4; } .social { display: flex; flex-direction: row; justify-content: center; font-size: 3.2em; gap: 1.4em; } .email-contact { font-weight: 300; font-size: 1.2em; } .information { display: grid; grid-template-columns: 1fr 0.7fr; grid-template-rows: auto auto; gap: 1em; padding: 30px; } .box { padding: 2px 10px 10px 25px; text-align: left; background: #3B513B; border-radius: 20px; } .box:nth-child(1), .box:nth-child(2) { grid-column: 1; } .latest-posts { grid-column: 2; grid-row: 1 / span 2; } /* Mobile view */ @media (max-width: 768px) { .social { font-size: 2.6em; gap: 1em; } .information { grid: auto auto auto / 1fr; } .box:nth-child(1), .box:nth-child(2), .latest-posts { grid-column: 1; } .latest-posts { grid-row: auto; } }