*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; } html { font-size: 16px; } body { display: flex; flex-direction: column; align-items: center; } main { margin: 2rem 0 2rem 0; display: flex; flex-direction: column; align-items: center; gap: 2rem; width: 50rem; height: auto; } .welcome-section { display: flex; flex-direction: column; align-items: center; gap: 2rem; } .baxter-info { display: grid; grid-template-rows: 1.5rem 1fr; grid-template-columns: 1fr 1fr; justify-items: center; gap: 2rem; } .baxter-info p { margin: 1rem; } .baxter-info ul { margin: 1rem; list-style-type: none; } .facts-header { grid-column: 1/4; grid-row: 1/2; } .baxter-is { grid-column: 1/3; grid-row: 2/3; padding-right: 20rem; } .baxter-loves { grid-column: 2/4; grid-row: 2/3; padding-left: 5rem; } .favorite-baxter-photos { display: grid; grid-template-rows: 25rem 25rem; grid-template-columns: 20rem 20rem; justify-items: center; } .favorite-baxter-photos figure { height: 20rem; width: 15rem; text-wrap: wrap; } .favorite-baxter-photos img { max-width: 100%; max-height: 100%; object-fit: fill; }