.event-day { border-top: 7px solid var(--border); } .event-day[open] { padding-bottom: 4rem; } .event-day-heading { padding: 30px 20px; font-size: 2rem; font-weight: bold; } .event { border-top: 3px solid var(--border); margin-left: 20px; display: flex; flex-direction: column; } @media screen and (min-width: 1024px) { .event { display: grid; grid-template-columns: 345px 1fr; grid-template-rows: auto auto auto auto 1fr; } } .event-time { grid-column-start: 1; grid-column-end: 3; grid-row-start: 1; grid-row-end: 2; } .event-title { grid-column-start: 1; grid-column-end: 3; grid-row-start: 2; grid-row-end: 3; margin-top: 0; margin-bottom: 0; } .event-description { grid-column-start: 2; grid-column-end: 3; grid-row-start: 4; grid-row-end: 6; } .event-description > *:first-child { margin: 0; margin-bottom: 2rem; } @media screen and (min-width: 1024px) { .event-description { margin-bottom: 0; padding-left: 2rem; } } .event-location { grid-column-start: 1; grid-column-end: 2; grid-row-start: 4; grid-row-end: 5; } .event-people { grid-column-start: 1; grid-column-end: 2; grid-row-start: 5; grid-row-end: 6; margin-bottom: 2rem; } .event-people-list { list-style: none; margin: 0; padding: 0; } .event-details { grid-column-start: 1; grid-column-end: 3; grid-row-start: 3; grid-row-end: 4; margin-bottom: 2rem; } .event-location, .event-people, .event-details { font-size: 1rem; line-height: 1.4rem; }