.home { display: flex; flex-direction: column; text-align: center; } .avatar { border-radius: 20%; } #title { font-size: 2.3em; } .description h2 { margin: 0.1em 0; } .social { display: flex; flex-direction: row; justify-content: center; font-size: 3.2em; gap: 1.4em; margin: 0.2em; } .email-contact { font-weight: 300; font-size: 1.2em; } .headline h3 { margin: 0.5em; } .information { display: grid; grid-template-columns: 1fr 0.7fr; grid-template-rows: auto auto; gap: 1em; margin: 2em 10em 2em 10em; } .box { padding: 20px 20px 20px 25px; text-align: left; background: #3B513B; border-radius: 20px; } .box h1 { margin-top: 0.2em; } .box:nth-child(1), .box:nth-child(2) { grid-column: 1; } .latest-posts { grid-column: 2; grid-row: 1 / span 3; } .blog-title { margin-bottom: 2px; } .link { font-size: 1.2em; } /* Mobile view */ @media (max-width: 992px) { .social { font-size: 3em; gap: 1em; } .information { margin: 2em; grid: auto auto auto / 1fr; } .box:nth-child(1), .box:nth-child(2), .latest-posts { grid-column: 1; } .latest-posts { grid-row: auto; } }