HTML/CSS

Hey Richard. I can spot some was you can make this clean cleaner. Here's a list:

• Usage of modern screen breakpoints. https://getbootstrap.com/docs/5.0/layout/breakpoints/
• Do not use Id's. Usage of class names here is more ideal. This is a small widget, but when you get into larger scale projects, almost everything is shared or reused. Practicing this will help you down the road. https://css-tricks.com/the-difference-between-id-and-class/
• Do not append div to CSS selectors. This makes it too specific and harder to override. Simple is best.
• Using SASS/SCSS or CSS variables to set global variables on reused values like colors, font family, etc.

Looks like a solid solution that matches the design! Here's a few pointers to help you next time:

• Media queries can override styling while keeping other parts of the styles which means you only have to define things like display: flex once and change the flex-direction when you want to. Read more on the use of media queries here: https://css-tricks.com/a-complete-guide-to-css-media-queries/
• While it's perfectly valid according to the spec to use more than one <h1> it's considered bad practice. Ideally you would only use a single <h1> and your current ones would be <h2>. Remember that semantics are separated from styling in HTML and CSS!
• Like @shashilo mentioned: using div.cars makes your CSS more specific and that can hurt possible overrides you want to do later. Read more on CSS Specificity here: https://developer.mozilla.org/en-US/docs/Web/CSS/Specificity
• CSS Custom Properties (or variables) will allow you to easily set a color for each column. I do think, however, that it might be a little too much for a simple beginner project so perhaps that could be a nice improvement in the future :)