.miniEventCardDemo > *:nth-child(odd) { background: #e1eefa; } .newsDemo { padding: 50px; background-color: var(--off-white); display: inline-block; } .newsTitle { font-style: normal; font-weight: bold; color: var(--purple-2); font-size: 24px; line-height: 36px; margin-bottom: 14px; } .newsDesc { font-style: normal; font-weight: normal; font-size: 14px; line-height: 21px; white-space: pre-line; color: var(--purple-2); vertical-align: baseline; } .news > hr { border: none; height: 1px; background-color: var(--purple-2); margin: 0 0 13px 0; } .eventDescriptionCardDemo { padding: 50px 0; background-color: var(--off-white); display: inline-block; } .eventDescriptionCardDemo > * { margin: 12px 50px; } .eventDescriptionCardDemo > *:first-child { margin-top: 0; } .eventDescriptionCardDemo > *:last-child { margin-bottom: 0; } .teamMemberDemo { padding: 10px 50px 30px 50px; max-width: 847px; } .committee { margin: 0; color: var(--purple-2); font-weight: 600; font-size: 24px; line-height: 36px; } .teamMemberDemo > hr { border: none; height: 1px; background-color: var(--blue-2); width: 100%; margin-top: 24px; margin-bottom: 46px; } .teamMembers { display: grid; grid-template-columns: repeat(auto-fill, minmax(100px, 1fr)); row-gap: 2.6875rem; column-gap: 3.3125rem; } @media only screen and (max-width: 768px) { .newsDemo, .eventDescriptionCardDemo { background-color: #e1eefa; } .eventDescriptionCardDemo > * { margin: 50px; } }